/* homepage - gneeral styles */
a {text-decoration: none}
a:hover {text-decoration: underline}
ul,li {list-style: none}
* {margin:0; padding:0; outline: 0}
p {color: #fff}
#content {background: none; width: 920px; margin: 0 auto;}
.ctaLink a {padding: 4px 0 4px 22px; background: url(../images/bullet1.png) no-repeat left center; color: #fff}



/* homepage - primary carousel */
.carousel-nav-button {position: static; top: 28px; right: 0px; padding-bottom: 5px; width: 135px; padding-right: 15px;}
.hasJS .carousel-nav-button {position: absolute; border-bottom: 1px solid #2f2f2f;}
.promospot1 {background: url(../images/buttons/long-grey-tvicon.png) no-repeat left bottom; float: right;}
.promospot1 a {color: #fff; padding: 12px 5px 0 30px; height: 25px; background: url(../images/buttons/long-grey-tvicon.png) no-repeat right top; display: block; text-decoration: none}
#primary-carousel {background: #333; padding: 20px; margin-top: 30px; position: relative; width: 100%; overflow: hidden}
.hasJS #primary-carousel {visibility: hidden; background: url(../images/layout/bg-blue-tube.gif) no-repeat 0 63px; padding: 0;}
.hasJS #primary-carousel.on {visibility: visible;}
#carousel-nav {position: relative;}
#carousel-nav ul {display: none; background: url(../images/layout/bg-tabs.gif) no-repeat left bottom; width: 100%; padding-top: 0; overflow: hidden; padding-left: 5px}
.hasJS #carousel-nav ul {display: block;}
#carousel-nav li {float: left; width: 153px; margin:0;}
#carousel-nav li a {color: #999; display: block; padding: 29px 0 10px 0px;}
#carousel-nav li a:visited {text-decoration: none;}
#carousel-nav li a span {display: block; border-left: 1px solid #2f2f2f; border-bottom: 1px solid #2f2f2f; padding: 5px; height: 31px; overflow: hidden}
#carousel-nav li strong {display: block;}
#carousel-nav li a:hover, #carousel-nav li.on a {color: #fff; text-decoration: none; background: url(../images/tabs-bg-hover.jpg) no-repeat center bottom;}
#carousel-nav li a:hover span, #carousel-nav li.on a span {border-bottom: 0;}
#primary-carousel .paginate {position: absolute; z-index: 6; top: 110px; background: url(../images/buttons/round-paginate.png) no-repeat; width: 33px; height: 33px; cursor: pointer}
#primary-carousel .paginate-prev {left: 0;}
#primary-carousel .paginate-prev:hover {background-position: left bottom}
#primary-carousel .paginate-next {right: 20px; background-position: right top}
#primary-carousel .paginate-next:hover {background-position: right bottom}
#primary-carousel li .img {width: 547px; height: 252px; top:0;}
#carousel a {color: #fff}
#carousel li {margin:0; overflow: hidden; width: 100%; margin-bottom: 20px}
.hasJS #carousel li {overflow: visible; width: auto; margin-bottom: 0;}
#carousel h2 { position: relative; z-index: 1; color: #33ffff; font-size: 1.7em; margin-bottom: 6px;}
#carousel {height: auto; position: relative;}
.hasJS #carousel {height: 252px; z-index: 4;}
#carousel img {display: block;}
#carousel .img {position: static; float: right; width: 640px;}
.hasJS #carousel .img {position: absolute; float: none; width: auto;z-index:1}
#primary-carousel .mask {z-index: 4; width: 71px; height: 252px; background: url(../images/grad1.png) no-repeat; position: absolute; top:0; right:0}
#carousel .infoblock {background: #000; position: relative; float: left; height: 200px; width: 205px; padding: 30px 10px 10px;}
.hasJS #carousel .infoblock {position: absolute; top: 15px; left: 43px; float: none; z-index: 3; background: transparent;}
#primary-carousel .infoContainer {background: url(../images/layout/bg-grad-black-semitrans.png); position: absolute; top: 0px; left: 43px; width: 225px; height: 252px; z-index:2}
#carousel p.time {color: #33ffff; margin-bottom: 8px; font-size: 0.9em}
#carousel .info p {font-size: 0.9em}
#carousel .ctaLink {font-size: 0.9em; position: absolute; bottom: 10px;}
#carousel p.category {position: absolute; top:0; background: url(../images/icon-show.gif) no-repeat; line-height: 2em; padding-left: 27px; font-size: 0.9em}
#carousel p.category.cat-0-TV-Show {background: url(../images/tv_show.gif) no-repeat;}
#carousel p.category.cat-1-Competition {background: url(../images/competition.gif) no-repeat;}
#carousel p.category.cat-2-Whats-on {background: url(../images/whats_on.gif) no-repeat;}


/* homepage "Freeview options" panel */
#frOptions-panel {position: relative;padding-bottom: 20px; margin-bottom: 25px; background: #fff url(../images/layout/bg-grad-bw.gif) repeat-x 0 52px;}
#frOptions {height: auto; background: #000; position: relative; padding: 24px 28px 28px;}
.hasJS #frOptions {height: 313px; background: url(../images/layout/bg-grad-b.gif) no-repeat;}
#frOptions h1 {color: #ee2e30; font-size: 1.9em; width: 224px; line-height: 0.9em}
#frOptions ul {width: 100%; margin-top: 23px;}
.hasJS #frOptions ul {width: 223px;}
#frOptions li {width: 100%; overflow: hidden; margin-bottom: 20px}
.hasJS #frOptions li {overflow: visible; margin-bottom: 0}
#frOptions li a.tab {display: block; padding: 0 0 0 10px; height: 75px;}
#frOptions li a.tab:hover, #frOptions li.on a.tab {background: url(../images/layout/bg-options-tab.gif) no-repeat left top}
#frOptions li a.tab span {border-top: 1px solid #1a1a1a; padding-top: 12px; display: block; height: 49px; background: url(../images/logo-freeview.gif) no-repeat 10px 11px; text-indent: -9999px}
#frOptions li a.tab:hover span, #frOptions li.on a.tab span {border-top: 0; padding-top: 13px; background-position: 10px bottom}
#frOptions li.fv-plus a.tab span {background-image: url(../images/logo-freeview-plus.gif)}
#frOptions li.fv-hd a.tab span {background-image: url(../images/logo-freeview-hd.gif)}
#frOptions .promo {position: static; float: right;}
.hasJS #frOptions .promo {display: none; position: absolute; left: 290px; top: 33px; z-index: 3; float: none}
#frOptions .promo img {display: block}
#frOptions h2 {float: left; width: 245px}
.hasJS #frOptions h2 {margin-bottom: 0; float: none; width: auto}
#frOptions .imgCont {position: absolute; top: 32px; left: 289px; width: 615px; height: 320px; background: #000 url(../images/promoImg-border.gif) no-repeat}





/* homepage twitter panel */
#twitter {background: url(../images/layout/bg-homepage-twitter.png) no-repeat; height: 37px; margin-left: 27px; margin-bottom: 20px; position: relative;}
#twitter h2 {color: #ee2e30; font-size: 1.5em; position: absolute; top: 5px; left: 8px;}
#twitter p.ctaLink {position: absolute; left: 7px; top: 30px; width: 130px;}
#twitter p.ctaLink a {display: block;}
#twitter p.tweet {position: absolute; left: 210px; top: 23px; width: 650px; color: #333; overflow: auto; overflow-style: marquee-line; marquee-style:alternate; white-space: nowrap}
#twitter p.date {position: absolute; right: 27px; top: 49px; color: #aaa; font-size: 0.9em;}
/*for the scroller script*/
#ticker-container-wrap { position:absolute; left: 210px; top: 23px; }
.ticker-container 	{ width:650px; height:18px; float:left; display:inline; overflow:hidden; position:relative; }
#ticker 			{ width:9999px; position:absolute; top:0; left:0; visibility:hidden; }
#ticker li 			{ float:left; margin:0; padding-right:5px;}



/* homepage forms */
.coverage-and-email {background: url(../images/layout/bg-forms.gif) no-repeat left top; width: 876px; margin-left: 27px}
.coverage-and-email .inner {background: url(../images/layout/bg-forms.gif) no-repeat right bottom; width: 100%; overflow: hidden; padding: 13px 0 0; }
.coverage-and-email .box1 {float: left; padding-left: 15px; position: relative; min-height: 160px}
.coverage-and-email input.text {background: url(../images/layout/bg-grad-bluewhite.gif) repeat-x left bottom; border-bottom: 1px solid #bbd9d9; border-right: 1px solid #bbd9d9; border-left: 1px solid #757575; border-top: 1px solid #757575}
.coverage {width: 417px; margin-right: 12px; background: url(../images/icon-can-i-get.gif) no-repeat 375px 0}
.coverage-and-email .email-signup { width: 415px; background: url(../images/icon-email.gif) no-repeat 370px 0}
.coverage-and-email h2 {color: red; font-size: 1.8em; font-weight: normal; margin-bottom: 45px}
.coverage-and-email p {color: #636363; font-size: 0.8em;}
.coverage-and-email p.success {color: #3d3d3d; font-size: 1.2em; margin-top: 56px}
.coverage-and-email p.privacy {position: absolute; top: 30px; left: 15px; font-size: 1.3em}
.coverage-and-email p.privacy a {color: #2fbebc}
.coverage-and-email p.privacy a:hover {text-decoration: none; border-bottom: 1px solid #2fbebc;}
.coverage-and-email p.disclaimer {position: absolute; left: 15px; bottom: 10px; width: 273px}
.coverage-and-email .houseWrap {float: left;}
.coverage-and-email .postcodeWrap {float: left; width: 208px}
.coverage-and-email .postcodeWrap input, .houseWrap input {width: 190px}
.coverage-and-email .emailWrap input {width: 396px;}
.coverage-and-email input.text {padding: 2px; color: #333}
.coverage-and-email label {color: #333; display: block; margin-bottom: 5px; font-size: 1.2em;}
.coverage-and-email .submit {position: absolute; bottom: 10px; right: 10px;}
.coverage-and-email .submit a {color: #ee2e30; display: block;}
.hasJS .coverage-and-email .submit input {display: none;}

