/* Uses double selectors for organization's sake. Produces extra code, but makes finding the applicable styles much easier. In some cases, also chose to duplicate styles (instead of combining styles for some selectors) to improve readability. */ /*** GLOBAL STYLES ***/ html{text-align:center;} body{ width:732px; min-width:732px; margin:auto; position:relative; /* contains floats */ text-align:left; } body *{margin:0;} /* Sizes for all major divs on all template pages*/ #navigation-and-search, #availability-and-offers, #identity-main-navigation, #content-container, #customer-container, #news-and-promos, #footer, #support-service, #support-solutions-content, #support-guides, #support-supplement, #offers-and-promos, #solutions-banner, #product-promos, #offers-and-hookups{clear:both; width:100%; position:relative; float:left;} img{border:0;} ul{list-style-type:square;} #navigation-and-search{padding-top:8px; min-height:32px;} #navigation-and-search ul{margin:5px 0 0 -30px; list-style-type:none; float:left;} #navigation-and-search li{line-height:1.0; float:left;} #navigation-and-search li a{margin:0 7px;} /* child of #navigation-and-search */ #search_form{float:right; margin-right:8px;} #search_form input{margin-left:3px;} #search_form label{margin:5px;} #search_form #sk{ width:73px; padding:1px 3px;} #search_form input[type="image"]{vertical-align:bottom;} #footer{text-align:center; padding:10px 0;} #footer ul{margin:0 0 0 -30px; list-style-type:none;} #footer ul, #footer li{list-style-type:none; display:inline;} #footer ul li a{margin:0 7px;} /* logo and masthead*/ #identity-main-navigation h1{display:inline; float:left; margin:10px 15px 5px 0; width:310px;} #identity-main-navigation ul{float:right; margin:10px 0 0 -60px;} #identity-main-navigation li{display:inline;} #identity-main-navigation a{display:block;float:left;padding-top:10px;} /* on homepage and residential service page */ #check-availability select{width:155px;} #check-availability select, #check-availability input, #support-search-form input{vertical-align:middle;} /* on residential service page*/ #support-service{margin-top:15px;} /***HOMEPAGE***/ #availability-and-offers{float:left; position:relative;} #availability-and-offers #availability{float:left; margin:6px; width:248px;} #availability-and-offers #availability #banner1{position:absolute; bottom:0; margin: 0 0 2px 3px;} #availability-and-offers #check-availability{margin:9px 0 16px 0; text-align:center;} /* check availability form */ #availability-and-offers #availability p, #offers-and-hookups #check-availability p{white-space:nowrap; font-size:9px; margin:10px 0 20px 0;} #availability-and-offers #offers{float:right; margin:6px 6px 6px 0; width:466px; z-index:2;} #availability-and-offers #offers-links{float:left; width:140px; margin:8px;} #availability-and-offers #offers-links ul{margin-bottom:8px;} #availability-and-offers #offers-links li{margin-left:-25px;} #availability-and-offers #hook-up-promo{float:left; width:305px; margin:8px 0;} /* bottom of homepage promos */ #news-and-promos{float:left; margin-top:6px; padding-bottom:5px;} #new-at-knology{min-height:166px; position:relative; width:247px;float:left; margin-right:7px;} #new-at-knology ul{list-style-type:none; margin:8px;} #new-at-knology li{margin:0 0 10px -40px;} #new-at-knology h3{margin:10px;} #more-promos{width:473px; float:right; min-height:135px; position:relative;} #more-promos div{ width:130px; float:left; height:148px; margin:8px 0; padding:5px 12px; } #more-promos div p,#more-promos h3{margin-bottom:5px;} /*** THIRD LEVEL PAGES ***/ #identity-main-navigation ul{float:right; margin:10px 0 0 -60px;} #identity-main-navigation li{display:inline;} #identity-main-navigation li a{display:block;float:left;padding-top:10px;} #content-container{padding-bottom:30px;} #main-content-container{width:470px; padding-top:0px; float:left;} #tertiary-navigation ul, #tertiary-navigation li{display:inline;} #tertiary-navigation ul{margin-left:-42px; line-height:1.0;} #tertiary-navigation li a{margin: 0 3px 0 3px; padding: 0 3px 0 0; text-decoration:none;} #main-content{padding-top:20px;} #main-content ul li{margin-left:-20px;} #main-content img{border:1px solid #fff;} #main-content img.img-right{margin:10px 0 10px 10px; float:right;} #main-content img.img-left{margin:10px 10px 10px 0px; float:left;} /* CUSTOMER SUPPORT MAIN-CONTENT AREA */ #customer-content{padding-bottom:30px;} #customer-content{width:730px; padding-top:0px; float:left;} #customer-navigation ul{margin-left:-42px; line-height:1.0;} #customer-navigation li a{margin: 0 3px 0 3px; padding: 0 3px 0 0; text-decoration:none;} #customer-content{padding-top:20px;} #customer-content img{border:0px solid #000;} #customer-content img.img-right{margin:10px 0 10px 10px; float:right;} #customer-content img.img-left{margin:10px 10px 10px 0px; float:left;} #customer-content ul#customer-nav{margin:0 0 20px -44px; } #customer-content ul#customer-nav li{display:inline; margin-left: 3px; } #customer-content ul#customer-nav li a{padding: 0 6px 0 0; text-decoration:none;} /* CUSTOMER SUPPORT MAIN-CONTENT AREA */ /* FOURTH LEVEL NAV */ #main-content ul#fourth-nav{margin:0 0 20px -44px; } #main-content ul#fourth-nav li{display:inline; margin-left: 3px; } #main-content ul#fourth-nav li a{padding: 0 6px 0 0; text-decoration:none;} #customer-content ul#fourth-nav{margin:0 0 20px -44px; } #customer-content ul#fourth-nav li{display:inline; margin-left: 3px; } #customer-content ul#fourth-nav li a{padding: 0 6px 0 0; text-decoration:none;} /* END FOURTH LEVEL NAV */ #supplemental-content{width:244px;float:right;} #supplemental-content div{margin: 2px 0 6px 0; position:relative;} #supplemental-content #alternative-service-provider p{margin:7px;} #supplemental-content .supplemental-box{padding:10px 0;} #supplemental-content .supplemental-box p{text-align:center; margin:7px 0;} #quick-view.supplemental-box p, #quick-view.supplemental-box h2{text-align:center;} #supplemental-content ul{margin-top:10px;} #supplemental-content ul li{margin-left:-25px;} /*** CUSTOMER SUPPORT AND RESIDENTIAL SERVICE TEMPLATES ***/ #support-solutions-header{margin-top:15px;} #support-solutions-content #troubleshooting{float:left; width:420px; margin:10px 5px;} #support-solutions-content #troubleshooting ul{float:left; margin: 0 15px 0 0;} #support-solutions-content #troubleshooting ul li{margin-left:-100px;} #support-search ul, #support-search li{display:inline; list-style-type:none;} #support-search ul{margin-left:-40px;} #support-search li{padding:0 8px 0 4px;} #support-search{width:270px; float:left; padding:10px 0 0 20px;} #support-search-form{margin:30px 0;} #support-guides{margin-bottom:10px;} #support-guides div{float:left; width:155px; min-height:100px; margin:10px 0; padding:10px 8px 0 15px;} #support-supplement{padding-bottom:10px;} #support-supplement #support-link-to-biz{float:left;} #support-supplement #other-support{float:right;} #support-supplement #other-support img{margin-top:10px;} #support-supplement #support-myknology{float:right;} #solutions-banner{margin:10px 0; padding:10px 0; text-align:center; width:730px;} #solutions-banner img{vertical-align:middle; margin-right:10px; margin-left:10px;} #offers-and-hookups{margin-top:10px; min-height:219px; padding:10px 0;} #offers-and-hookups #offers-promos{width:420px; float:left; margin:10px;} #offers-and-hookups #offers-promos p{margin-right:5px;} #offers-and-hookups #hookups{width:215px; float:left; padding:0 12px;} #offers-and-hookups #check-availability div{margin-top:10px;} #product-promos{padding:20px 0;} #product-promos div{ width:240px; min-height:235px; float:left;} #product-promos img{display:block; margin-bottom:10px;} #product-promos p{margin:0 20px 10px 20px;} #product-promos ul{list-style-type:none;} #product-promos li{margin-left:-20px;}