/*   CSS3  stylesheet */

@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot');
	src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('fonts/icomoon.ttf') format('truetype'),
		url('fonts/icomoon.woff') format('woff'),
		url('fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-phone:before {
	content: "\e600";
}
.icon-phone-hang-up:before {
	content: "\e601";
}
.icon-envelop:before {
	content: "\e602";
}
.icon-search:before {
	content: "\e603";
}
.icon-menu:before {
	content: "\e604";
}
.icon-menu3:before {
	content: "\e605";
}
.icon-circle-up:before {
	content: "\e610";
}
.icon-mail:before {
	content: "\e606";
}
.icon-mail2:before {
	content: "\e607";
}
.icon-mail3:before {
	content: "\e608";
}
.icon-mail4:before {
	content: "\e609";
}
.icon-facebook:before {
	content: "\e60a";
}
.icon-facebook2:before {
	content: "\e60b";
}
.icon-facebook3:before {
	content: "\e60c";
}
.icon-twitter:before {
	content: "\e60d";
}
.icon-twitter2:before {
	content: "\e60e";
}
.icon-twitter3:before {
	content: "\e60f";
}
.icon-youtube3:before {
	content: "\e611";
}
.icon-linkedin:before {
	content: "\e612";
}
.icon-linkedin2:before {
	content: "\e613";
}
.icon-pinterest:before {
	content: "\e614";
}
.icon-pinterest2:before {
	content: "\e615";
}

body {
	margin: 0;
	padding: 0;
	height: 100%;
}
 
html {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: arial,sans-serif;
	font-size: 1em;
	color: #000;	
	background: #FFF url(images/body-bg.jpg) no-repeat top center fixed; 
}
@media screen and (min-width: 1281px) {
	html { 
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-ms-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

#container {
	position: relative;
	margin: 0 auto; 
	width: 95%; 
	min-height: 100%;
}

#banner-right {
	position: absolute;
	left: 23%; top: 0; right: 1%;
	text-align: right;
	font-weight: bold;
	font-size: 1.75em;	
	color: #FFF;
	padding: 1em 0 0 0;
}
#banner-right a {
	color: #FFF;
}
.redanlinkmenucols {
	position: absolute;
	left: 0; top: 0;
	visibility: hidden;
	z-index: 100; /* z-index should be greater than for shadow below */
	width: 10em;
	font-size: 0.9em;	
	background: rgba(255, 255, 255, 0.9);
	padding: 0 15px 0 0;	
	border: 1px solid #808080;
}
.redanlinkmenucols li {
	list-style-type: none;
	list-style-image: none;
}
.redanlinkmenucols a {
	display: block;	
	border-bottom: 1px solid #808080;
	padding: 2px 0;	
}
.redanlinkmenucols a:hover { 
	text-decoration: none;
	border-bottom: 1px solid #A9A9A9;
}
.redanlinkshadow{ /* CSS for shadow. Keep this as is */
	position: absolute;
	left: 0; top: 0;
	z-index: 99; /* z-index for shadow */
	background: #000;
	visibility: hidden;
}

#logo-text {
	font-weight: bold;
	font-size: 2.7em;	
	color: #FFF;
	padding: 0.5em 0 0.7em 0;
}
#logo-text .lower {
	font-size: 0.6em;
	margin-top: 0.625em;
}
#logo-text .smaller {
	font-size: 0.6em;
}
#logo-text a {	
	color: #FFF;
}
#logo-text a:hover {	
	color: #FFF;
	text-decoration: none;
}

#sidebar {
	float: left;
	text-align: center;	
	width: 19%;
	font-size: 0.9em;
	margin-bottom: 1.5em;
	overflow: hidden;
}

#side-nav {
	text-align: left;
}
#side-nav ul {
	list-style-type: none;
	list-style-image: none;
	max-width: 100%;
	margin: 0;
	line-height: 1.3em;
}
#side-nav li {
	margin-bottom: 0.3125em;
}
#side-nav a {
	display: block;
	width: 100%;
	font-weight: bold;
	color: #FFF;
	padding: 0.625em 0 0.625em 0;
	background: #3CB371;
	text-indent: 0.3125em;
}  
#side-nav a:hover {
	color: #FFF;
	background: #8B0000;	
}
#side-nav .current a {
	background: #8B0000;
} 
#social-media {
	max-width: 100%;
	font-size: 2em;
	background: #3CB371;
	color: #FFF;
	padding: 0.1875em 0 0 0;
	cursor: pointer;
}
#social-media a {
	color: #FFF;
}
#social-media a:hover {
	text-decoration: none;
}

#sub-text {
	font-weight: bold;
	font-size: 1.4em;
	color: #FFF;
	padding: 0.625em 0;
}
#sidebar-clear {
	position: relative;
	padding-top: 2em;
}

#small-nav {
	font-variant: small-caps;
	font-size: 1.1em;
	margin: 0 2.5%;
	padding: 1px 0.75% 0 0.75%;
	background: rgba(220, 220, 220, 0.7);
	border-top: 0.25em solid #8B0000;
	border-radius: 10px 10px 0 0;
}
#small-nav ul {
	list-style-type: none;
	margin: 0 1%;
	border: 1px solid #8B0000; border-bottom: 0;
	border-radius: 5px;
}
#small-nav li {
	text-indent: 5px;
	border-bottom: 1px solid #8B0000;
}
#small-nav a {
	color: #3CB371; 	
	display: block;
	text-decoration: none;
	padding: 5px 0;
	background: rgba(255, 255, 255, 0.8);
}
#small-nav a:hover {
	color: #3CB371; 
	background: #DCDCDC;
}
#small-nav .current a {
	color: #8B0000; 
	font-weight: bold;
}
#small-nav label {  
	cursor: pointer;
}
#small-nav #menu-toggle {
	display: none; /* hide the checkbox */
}
#small-nav #menu {
    opacity: 0; 
    height: 0;
    overflow: hidden;
	-webkit-transition: opacity 1.5s ease;
	-moz-transition: opacity 1.5s ease;
	-o-transition: opacity 1.5s ease;	
    transition: opacity 1.5s ease;	
}
#small-nav #menu-toggle:checked + #menu {
    opacity: 1;
    height: auto;
}

.content {
	width: 70%;
	margin: 80px 0 0 24%;
	padding: 0.625em 1.25em;
	background: rgba(220, 220, 220, 0.7);
	border-bottom: 0.25em solid #3CB371; border-top: 0.25em solid #8B0000;
	border-radius: 10px;
}
#footer-spacer {
	padding-top: 30px; /* space between content and footer */
}

#footer-wrapper {
	position: relative;
	float: left;
	min-width: 100%; 
	font-size: 0.9em;
	color: #FFF;
	background: url(images/footer-bg.jpg);
	padding: 0.75em 0;
	overflow: hidden;
}
#footer-wrapper a {
	color: #C0C0C0;
}
#footer-wrapper a:hover {
	color: #FFF;
	text-decoration: none;
	border-bottom: 1px solid #FFF;
	padding-bottom: 1px;	
}
#footer {
	margin: 0 auto;
	width: 95%;
	padding-bottom: 0.625em;
}
#footer-nav {
	font-variant: small-caps;
	padding-bottom: 0.75em;
}


a { 
	color: #8B0000;
	text-decoration: none;
}
a:hover { 
	color: #808080;
	text-decoration: underline;
}
ul { 
	list-style-type: square;
	padding: 0;
	margin-left: 0.9375em;
}
ol {
	list-style-type: lower-roman;	
	padding: 0;
	margin-left: 0.9375em;
}
blockquote {
	padding: 0;
	margin-left: 0.9375em;
}
hr {
	color: #8B0000; 	
	background: #8B0000; 
	border: 0;
	height: 0.0625em;
}
hr.wide {
	color: #8B0000; 	
	background: #8B0000; 
	border: 0;
	height: 0.1875em;
}
h1 {
	font-size: 1.6em;
	font-weight: normal;
	font-style: normal;
	color: #036;
}
h2 {
	font-size: 1.4em;
	font-weight: normal;
	font-style: normal;	
	color: #036;
	margin-top: 0.3125em;
}
h3 {
	font-size: 1.2em;
	font-weight: normal;
	font-style: normal;
	color: #036;
	margin-top: 0.3125em;
}
h4 {
	font-size: 1.1em;
	font-weight: normal;
	font-style: normal;
	color: #036;
	margin: 5px 0;
}
p {
	line-height: 1.3em;
}
img {
	border: 0;
	max-width: 100%;
	height: auto;
}

.smalltext {
	font-size: 0.8em;
	font-style: normal;
}
.border {
	padding: 0.3125em;
	border: 0.0625em solid #808080;
}

input[type="button"], input[type="submit"] {
	height: 30px;
}
form {
	margin: 0;
}
.form_box input[type="text"] {
	width: 280px;
	height: 30px;
}
.form_box textarea {
	width: 280px;
	resize: none;
}
.form_box input[type="text"], .form_box textarea {
	border: 1px solid #C0C0C0;
}
.form_box select {
	width: 284px;
	height: 30px;
	color: #808080;
}
.form_box input,select,textarea {
	margin-bottom: 5px;
}
.form_box input[type="button"], input[type="submit"] {
	margin: 10px 0 5px 0;
	height: 40px;
}
.form_box #captcha {
	margin: 0 1% -3px 0;
}

a.slideshow img {
	border: 0.25em solid transparent;
	padding: 0;
}
a.slideshow:hover img {
	border: 0.25em solid #3CB371;
	padding: 0;
}
.ss {
	font-size: 0.8em;
	font-style: normal;
	padding: 0.625em;
	border: 0.0625em solid #3CB371;
}
.ss-servicing {
	font-size: 0.8em;
	font-style: normal;
	padding: 1%;
	border: 0.0625em solid #3CB371;
}
.ss-servicing img {
	width: 29%;
}
.ss-testing {
	font-size: 0.8em;
	font-style: normal;
	padding: 1%;
	border: 0.0625em solid #3CB371;
}
.ss-testing img {
	width: 48%;
}

#map-canvas-container {
	height: 0;
	padding-bottom: 45%; /* 666:300 */
	position: relative;
	width: 100%;
	margin-bottom: 0.7em;
}
#map-canvas-container img {
	max-width: inherit;
}
#map_canvas {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

table.main {
	font-size: 0.9em;
	font-style: normal;
	width: 100%;
	background: #FFF;
}
table.main td {
	padding: 0;
	margin: 0;
}

td h3 {
	margin: 0;
}
td.basket {
	font-size: 0.8em;
	font-style: normal;
	text-align: center;
}
td.right {
	text-align: right;
}
td.center {
	text-align: center;
}

.blue-divider {
	color: #87CEFA;
}

.shop-wrapper {
	background: #FFF;
	padding: 0 1% 10px 1%;
}
.shop-header {
	font-size: 0.9em;
	text-align: center;
	padding: 0 0 10px 0;
}
.group:after {
	content: "";
	display: block;
	clear: both;
}
.shop-image {
	float: left;
	max-width: 28%;
	padding-right: 8%;
}
.shop-right {
	float: left;
	max-width: 60%;
	padding: 5px 0 0 0;
}
.shop-right select {
	font-size: 0.9em;
}
.shop-right input[type="submit"] {
	margin-bottom: 10px;
}

.top-link {
	position: fixed;
	display: none;
	bottom: 5px; right: 7%;
}
.top-link a {
	color: #3CB371;
}
.top-link a:hover {
	color: #696969;
	text-decoration: none;
}
.icon-circle-up {
	font-size: 2em;
	cursor: pointer;
}


@media screen and (max-width: 880px) {
	html {
		font-size: 0.9em;
	}
	table.main {
		font-size: 0.8em;
	}
	table.main input {
		font-size: 0.8em;
	}
	table.main select {
		font-size: 0.9em;
	}
	.shop-right select {
		font-size: 0.8em;
	}	
}

@media screen and (max-width: 700px) {
	#small-nav #nav-button { 
		float: left;
		margin: 10px 0 10px 1%;
		background: transparent; 
		border-bottom: 12px double #8B0000; 
		border-top: 4px solid #8B0000;
		height: 4px; 
		width: 19px;
	}
	#small-nav #nav-button:hover { 
		border-bottom: 12px double #3CB371; 
		border-top: 4px solid #3CB371;
	}
	#banner-right {
		display: none;
	}
	#sidebar {
		display: none;
	}
	#container {
		width: 100%;
	}
	#small-logo {	
		color: #FFF;
		padding: 5px 0 0 2.5%;
		font-weight: bold;
		font-size: 1.4em;
		overflow: hidden;
	}
	#small-logo img {
		float: left;
		max-width: 30%;
		margin: 0 2.5% 0 0;
	}
	#small-logo .text {
		float: right;
		max-width: 60%;	
		margin: 20px 2.5% 20px 0;
	}
	#small-logo .lower {
		font-size: 0.8em;
		margin-top: 10px;
	}
	#small-logo .smaller {
		font-size: 0.7em;
	}
	.strap {
		color: #FFF;
		font-size: 1.1em;
		font-weight: bold;
		float: right;
		text-align: right;
		max-width: 100%;
		margin-right: 2.5%;
	}
	.strap .small-social-media {
		text-align: right;
		font-size: 1.5em;
		padding: 15px 0 0 0;
		cursor: pointer;
	}
	.strap .small-social-media a {
		color: #FFF;
	}
	.strap .small-social-media a:hover {
		text-decoration: none;
	}	
	.content {
		width: auto;
		margin: 0 2.5%;
		padding: 0.625em 0.75%;
		border-bottom: 0.25em solid #3CB371; border-top: 0;
		border-radius: 0 0 10px 10px;
	}
	.form_box input[type="button"] {
		margin-top: 0;
	}
}
@media screen and (min-width: 701px) {
	#small-nav { 
		display: none;
	}
	#small-logo, .strap {
		display: none;
	}
}

@media screen and (max-width: 480px) {
	#small-logo .text {	
		margin: 5px 2.5% 20px 0;
	}
}

@media screen and (min-width: 1285px) {
	#container {
		width: 950px;
	}
}

@media print {
	#small-nav, #side-nav, #footer-nav, #small-logo, .strap {
    	display: none;
	}
}
