/* @override http://www.centurylinkquote.com/css/centurylink-quote.css */

@import url(../css/global-grid/reset.css);

body {font:12px/1.33 Arial, Helvetica, Verdana, sans-serif; background: #fff;}
p.center {text-align: center; margin: 0px !important; padding: 0px !important;}
.error {border:1px dashed red !important;color:red !important;}

@font-face {  
	  font-family: "HelveticaNeueLight";  
	  src: url(../images/centurylink-quote/fonts/HelveticaNeueLTStd-Lt.eot ); /* IE */  
	  src: local("HelveticaNeueLt"), url(../images/centurylink-quote/fonts/HelveticaNeueLTStd-Lt.ttf ) format("truetype"); /* non-IE */  
	}  

/*Structure Styles*/
#container, #extFooter #text {width: 970px; margin: 0 auto;}
#intHeader {height: 140px; position: relative; background: url(../images/centurylink-quote/secure.gif) no-repeat 814px 24px;}
#extFooter {clear: both; background-color:#f9fafa; border-top: 1px solid #cbd2d2; padding-bottom: 15px;}

/*Header Styles*/
a#logo {position: absolute; top: 0px; left: 0px;}
div.headerPromo {text-align: right;}
#cta {position: absolute; top: 40px; right: 165px; text-align: right; font-size: 12px; color:#717171}
#cta p sup{
	font-size: 7px;
	vertical-align: 5px;
}
#cta h1 {font-size: 25px; color:#bb2207;}
#cta h1 span {font-size: 14px; font-weight: normal; color:#717171;}

ul#nav {position: absolute; bottom: 0px; left: 0px;}
ul#nav li {display: block; float: left;}
ul#nav li a {display: block; float: left; overflow: hidden; height: 26px; background: url(../images/centurylink-quote/nav-bg.gif) no-repeat; text-align: center; font-size: 10px; color:#414141; text-decoration: none; padding-top: 12px;}
ul#nav li a sup{
	font-size: 5px;
	vertical-align: 3px;
}

ul#nav li a#bundles {width: 180px; background-position: 0px 0px;}
ul#nav li a#bundles:hover, body.bundles ul#nav li a#bundles {background-position: 0px -38px;}

ul#nav li a#internet {width: 166px; background-position: -180px 0px;}
ul#nav li a#internet:hover, body.internet ul#nav li a#internet {background-position: -180px -38px;}

ul#nav li a#phone {width: 165px; background-position: -346px 0px;}
ul#nav li a#phone:hover, body.phone ul#nav li a#phone {background-position: -346px -38px;}

ul#nav li a#tv {width: 213px; background-position: -511px 0px;}
ul#nav li a#tv:hover, body.tv ul#nav li a#tv {background-position: -511px -38px;}

ul#nav li a#end {width: 246px; background-position: -724px 0px;}

/*Content Styles*/
body.home #focus {height: 315px; position: relative; background: url(../images/centurylink-quote/focus.jpg) no-repeat 0px 0px;}
body.geo #focus {height: 315px; position: relative; background: url(../images/centurylink-quote/geo-focus.jpg) no-repeat 0px 0px;}

#focus h1 {position: absolute; top: 240px; left: 275px; font-family: Helvetica, Arial, sans-serif; font-size: 25px; font-style: italic; color:#2c3b07;}
#focus h1 span.phone {font-style: normal; font-size: 30px; color:#bb2207; margin-left: 60px; position: relative; top: 3px;}

body.bundles #smFocus {height: 303px; position: relative; background: url(../images/centurylink-quote/bundles-focus.jpg) no-repeat 2px 0px;}
body.internet #smFocus {height: 303px; position: relative; background: url(../images/centurylink-quote/internet-focus.jpg) no-repeat 2px 0px;}
body.phone #smFocus {height: 303px; position: relative; background: url(../images/centurylink-quote/phone-focus.jpg) no-repeat 2px 0px;}
body.tv #smFocus {height: 303px; position: relative; background: url(../images/centurylink-quote/tv-focus.jpg) no-repeat 2px 0px;}

#content #smFocus h1 {position: absolute; top: 240px; left: 47px; font-family: Helvetica, Arial, sans-serif; font-size: 25px; font-style: italic; color:#2c3b07; padding: 0px !important;}
body.phone #smFocus h1, body.geo #focus h1 {font-size: 22px; line-height: 23px;}
body.geo #focus h1 {top: 235px; left: 333px;}

#smFocus h1 span.phone {font-style: normal; font-size: 30px; color:#bb2207; margin-left: 60px; position: relative; top: 3px;}
body.phone #smFocus h1 span.phone {top: -13px; margin-left: 107px;}
body.geo #focus h1 span.phone {top: -8px; margin-left: 75px;}

#focus h2 {font-family: "HelveticaNeueLight", Tahoma, Arial, sans-serif; font-size: 31px; font-weight: normal; color:#3a8a34; padding: 15px 0px 0px 0px; line-height: 37px;}

#focus img#state {position: absolute; top: 140px; left: 310px;}

ul#boxes {margin: 20px 0px 10px;}
ul#boxes li {width: 236px; float: left; margin-right: 7px; text-align: center; background: #f9f9f9; height: 200px; -webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;}
ul#boxes li.last {margin-right: 0px;}

ul#boxes li h2 {height: 36px; background:#e3f8da; border-bottom: 2px solid #efefef; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; padding: 10px 0px 0px 10px; font-size: 10px; text-transform: uppercase; color:#2a8a34; text-align: left;}
ul#boxes li h2 span.orange {display: block; font-size: 12px; color:#f36c34;}

ul#boxes li p {font-size: 10px; color:#555; background: url(../images/centurylink-quote/plus.gif) no-repeat 0px 2px; padding-left: 25px; margin: 5px 10px; text-align: left;}
ul#boxes li p.disclaimer {background: none; margin-top: 15px;}
ul#boxes li p img {position: relative; top: 4px;}


ul#smBoxes {margin: 10px 0px; position: relative;}
ul#smBoxes li {width: 334px; float: left; margin: 0px 10px; border: 1px solid #eae9e9; -moz-border-radius: 10px; webkit-border-radius: 10px; border-radius: 10px; background:#dcfcc3;}

body.phone ul#smBoxes li {width: 720px; margin: 0px;}

ul#smBoxes li h2 {height: 45px; background: #fcfcfc; border-bottom: 2px solid #dde6d6; padding: 5px 0px 0px 10px; font-size: 10px; text-transform: uppercase; color:#2a8a34;}
ul#smBoxes li h2 span.orange {display: block; font-size: 12px; color:#f36c34;}
ul#smBoxes li h2 img {float: left; padding-right: 10px; border-right: 1px solid #dde6d6; margin-right: 10px; margin-left: 5px;}

ul#smBoxes li .insideBox {margin: 10px auto; width: 318px; background:#fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px;}
body.phone ul#smBoxes li .insideBox {width: 712px;}

ul#smBoxes li .insideBox img {margin: 5px auto; border-bottom: 1px solid #ede9e9;}

ul#smBoxes li .insideBox p {color:#555; padding: 10px 0px 10px 10px; border-bottom: 1px solid #ede9e9; margin: 0px;}
ul#smBoxes li .insideBox p.grey {background: #f6f6f6;}

body.phone ul#smBoxes li .insideBox div {width: 345px; float: left; padding-right: 5px; border: 1px solid #eae9e9; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin: 5px 2px;}

ul.table {width: 696px; margin: 10px 0px 10px 10px; background: url(../images/centurylink-quote/internet-table-bg.gif) no-repeat; height: 91px; padding-top: 43px;}

ul.table li {padding: 5px 0px; display: block; float: left;}
ul.table li.left {clear: both; width: 524px; padding-left: 20px; font-size: 14px; color:#4a4a4a;}
ul.table li.mid {width: 80px; text-align: center;}
ul.table li.right {width: 66px; text-align: center;}

#featuresBox {width: 264px; height: 176px; background: url(../images/centurylink-quote/featuresBox.png) no-repeat; float: none; padding: 20px 10px 20px 30px !important; border: 0px !important; -moz-border-radius: none; -webkit-border-radius: none; border-radius: none; margin: 0px !important; position: absolute; bottom: -135px; right: -130px;}

#content #featuresBox h2 {font-size: 17px; color:#3a8a34; margin-bottom: 10px; font-weight: bold; padding: 0px !important}
#featuresBox ul li {width: 100px !important; float: left; padding: 0px 10px 0px 20px; font-size: 13px; color:#4a4a4a; background: url(../images/centurylink-quote/plus.gif) no-repeat 0px 3px; margin: 0px 0px 5px !important; border: 0px;}

#satBox {width: 711px; height: 233px; background: url(../images/centurylink-quote/sat-box-bg.jpg) no-repeat;}
#satBox h3 {font-size: 25px; color:#646567; padding: 10px 0px 10px 30px;}
#satBox h3 span.green {font-size: 22px; color:#398833; display: block;}
#content #satBox p {margin: 0px 0px 10px 85px; padding: 0px 400px 0px 20px; background: url(../images/centurylink-quote/plus.gif) no-repeat 0px 2px; font-size: 13px; color:#555;}

#sideRail {width: 240px; float: left;}
#sideRail form {height: 207px; background: url(../images/centurylink-quote/form-bg.jpg) no-repeat; padding: 20px;}
#sideRail form h2 {text-align: center; font-size: 12px; color:#729e3a; margin: 0px 0px 10px;}
#sideRail form input {width: 180px; padding: 3px 5px; border: 1px solid #c6c6c6; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; display: block; margin-bottom: 10px; color:#9a9a9a;}
#sideRail form input.zip {width: 70px;}
#sideRail form input.submit {width: auto; padding: 0px; border: 0px; -moz-border-radius: none; -webkit-border-radius: none; border-radius: none;}

#sideRail .box {width: 234px; border: 1px solid #ebeaea; -moz-border-radius: 10px; -webkit-border-radius: 10px; -border-radius: 10px; background: #fdfdfd; margin: 15px 0px;}
#sideRail .box h3 {font-size: 15px; color:#646567; padding: 5px 5px 10px;}
#sideRail .box h3 span.green {display: block; font-size: 14px; color:#398833;}

#sideRail .box p {font-size: 10px; color:#555; background: url(../images/centurylink-quote/plus.gif) no-repeat 0px 2px; padding-left: 25px; margin: 5px 10px; text-align: left;}
#sideRail .box p img {position: relative; top: 4px;}

#content {width: 730px; float: left; padding-bottom: 15px;}
#content h1 {font-size: 14px; color:#3a8a34; padding-left: 30px; margin-bottom: 10px;}
#content h2 {font-size: 12px; font-weight: normal; color:#3a8a34; padding-left: 30px;}
#content p {color:#525252; margin: 5px 0px 15px; padding-left: 30px;}

/*Footer Styles*/
#extFooter p.links {text-align: center; margin: 15px 0px;}
#extFooter p.links a {color:#616e6e; text-decoration: none; margin: 0px 20px;}
#extFooter p.links a sup{
	font-size: 6px;
	vertical-align: 5px;
}
#extFooter p.links a:hover {text-decoration: underline;}

#extFooter #left {width: 210px; float: left; padding-right: 30px;}
#extFooter #right {width: 730px; float: right;}

#extFooter #left p, #extFooter #right p {font-size: 10px; color:#616e6e; margin: 10px 0px;}
#extFooter #left a.m1{font-size: 10px; color:#616e6e; margin: 10px 0px; text-decoration: none;}
#extFooter #left em {font-style: normal; font-size: 10px; color:#616e6e; margin: 10px 0px; font-weight: bold; margin-bottom: 10px;}
#extFooter #left #locations a {font-size: 10px; color:#616e6e; text-decoration: none; margin-right: 5px;}
#extFooter #left #locations a:hover {text-decoration: underline;}
#extFooter #left .proximity {font-size: 10px; color:#616e6e;}

#extfooter #right p {padding-left: 20px;}