/* CSS Document */

* {	margin:0; padding:0; font-size:100%;}

body{background:url(../images/body-tail.gif) top repeat-x #0d0e10; text-align:center;}
.top-tail2{ background:url(../images/body-tail2.gif) top repeat-x; position:absolute; width:50%; right:0; height:402px;}

img {vertical-align:top;}
a img { border:0;}
ul { list-style:none;}

.left { float:left; clear: left;}
.right {float:right; clear: left;}
.clear  { clear:both;}

html{ font-family:Arial, Helvetica, sans-serif; font-size:0.75em; line-height:1.583em; color:#5f6881;}
input, select { vertical-align:middle; font-weight:normal;}

a {color:#2d9bff; outline:none;}
a:hover{text-decoration:none;}
p {padding-top:19px;}
strong{ color:#fff; font-weight:normal;}
h3{ font-size:2.5em; line-height:1.333em; word-spacing:3px;}
h4{ font-size:1.667em; line-height:1.2em; color:#f9fafd; border-bottom:solid 1px #121a31; padding-bottom:5px; margin-bottom:24px;}

/* ============================= main layout ====================== */
.imgindent {margin:0 27px 0 0; float:left; clear: left;}
.phone{ float:right; padding-right:20px;}
.space1{ margin-left:43px;}
.padding1{ padding-top:26px;}
.padding2{ padding-top:18px;}
.padding3{ padding-top:5px; padding-bottom:17px;}
.padding4{ padding-top:20px;}

/* ============================= header - index ====================== */
#header{ background:url(../images/header-bg.png) no-repeat 0 0;}
#header div.left { width: 80%; float: left; clear: left; padding:10px 0 0 2px;}
#header div.right { width: 19%; float: right; clear: right; padding:10px 0 0 2px;}
#header .banner { padding:44px 0 0 2px;}
#header .facebook { padding:7px 0 0 2px;}
#header .wholesale { padding:14px 0 0 2px;}
#header .weather { padding:16px 23px 0 34px;}
#header .logo{ padding-top:14px;}
#header .canada{ margin-left:50px; margin-top:12px; margin-bottom:-2em; border:none;}
#header .livezilla{ float:right; padding:14px 0 0 0; border:none;}
#header .menu { width:100%; overflow:hidden; padding-top:20px;}
#header .menu li { padding: 0; margin: 0; height: 50px; list-style: none; text-indent: -1100px; background-repeat: no-repeat;}
#header .menu li a, .menu li a:visited { display: block; text-decoration: none; height: 50px; background-repeat: no-repeat;}
#header .m1 {background-image: url(../images/menu1-bg-act.png); width: 130px;}
#header .m1a {background-image: url(../images/menu1-bg-act.png); width: 130px;}
#header .m1 a {background-image: url(../images/menu1-bg.png);}
#header .m2 {background-image: url(../images/menu2-bg-act.png); width: 130px;}
#header .m2 a {background-image: url(../images/menu2-bg.png);}
#header .m3 {background-image: url(../images/menu3-bg-act.png); width: 150px;}
#header .m3 a {background-image: url(../images/menu3-bg.png);}
#header .m4 {background-image: url(../images/menu4-bg-act.png); width: 150px;}
#header .m4 a {background-image: url(../images/menu4-bg.png);}
#header .m5 {background-image: url(../images/menu5-bg-act.png); width: 150px;}
#header .m5 a {background-image: url(../images/menu5-bg.png);}
#header .m6 {background-image: url(../images/menu6-bg-act.png); width: 130px;}
#header .m6 a {background-image: url(../images/menu6-bg.png);}
#header .m7 {background-image: url(../images/menu7-bg-act.png); width: 130px;}
#header .m7 a {background-image: url(../images/menu7-bg.png);}
#header .m8 {background-image: url(../images/menu8-bg-act.png); width: 130px;}
#header .m8 a {background-image: url(../images/menu8-bg.png);}
#header ul.menu li a:hover {background: none;}
#header .menu li {float: left;}
#header .menu:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/* ============================= content ====================== */
#content{ padding:22px 0 38px 0;}
.box{ background:url(../images/box-tail.gif) top repeat-x #0b0e25; width:81%; line-height:1.167em;}
.box .left-bg{ background:url(../images/left-border.gif) left repeat-y;}
.box .right-bg{ background:url(../images/right-border.gif) right repeat-y;}
.box .top-bg{ background:url(../images/box-top-bg.png) no-repeat top left;}
.box .bot-bg{ background:url(../images/box-bot-bg.png) no-repeat bottom left; width:100%;}
.box .indent{ padding:1px 5px 1px 22px;}
.box .indent1{ padding:15px 0 20px 0;}
.box .line1{ background:url(../images/box-line.gif) repeat-y 283px 0;}
.box .line2{ background:url(../images/box-line.gif) repeat-y 585px 0;}
.indent{ padding:28px 20px 0 28px;}
.column-2{ margin-left:48px;}
.column-3{ margin-left:50px;}
.line1{ background:url(../images/line.gif) repeat-y 275px 0; width:81%;}
.line2{ background:url(../images/line.gif) repeat-y 578px 0;}

.link{ text-align:right; padding-top:9px;}
.link1{ display:block; font-size:1.5em; line-height:1.333em; color:#fff; text-decoration:none; float:right; background:url(../images/link1-left-bg.gif) left top no-repeat; margin-top:-8px;}
.link1 em{ display:block; font-style:normal; background:url(../images/link1-right-bg.gif) right top no-repeat; padding:0 9px;}
.link1 em em{ background:url(../images/link1-tail.gif) top repeat-x; padding:0 0 1px 0;}
.link1:hover{ color:#b1d1f6;}

.list{ margin:-6px 0;}
.list li{ line-height:2.583em; background:url(../images/line.gif) bottom repeat-x;}
.list .last{ background:none;}
.list a{ display:inline-block; background:url(../images/list-marker.gif) no-repeat 0 9px; padding-left:28px; color:#5f6881; text-decoration:none;}
.list a:hover{ color:#2d9bff;}

/* ============================= footer ====================== */
#footer{ border-top:solid 1px #121a31; color:#fff;}
#footer .spacing { padding:10px 0 0 23px;}
#footer .extremesurf{ color:#5f6881;}
#footer a.extremesurf-logo { display:block; width:215px; overflow:hidden; float:right; margin-bottom:15px;}
#footer a.extremesurf-logo:hover { display:block; text-indent:-215px;}
#footer a{ text-decoration:none; color:#5f6881;}
#footer a:hover{ color:#2d9bff;}

/* ============================= forms ============================= */
#ContactForm{ padding-top:5px;}
#ContactForm label{ display:block; height:30px;}
#ContactForm input{ border:solid 1px #4c5367; background:#191a1c; font-family:Arial, Helvetica, sans-serif; font-size:1em; color:#5f6881; padding:2px 2px 1px 3px; width:247px;}
#ContactForm textarea{ border:solid 1px #4c5367; background:#191a1c; font-family:Arial, Helvetica, sans-serif; font-size:1em; color:#5f6881; padding:2px 2px 1px 3px; width:247px; height:159px; overflow:auto;}
#ContactForm .link{ padding-top:14px;}
#ContactForm .link a{ margin:0 0 0 20px;}