/* 
-------------------------------------------------------------------
Cheshire Constabulary stylesheet: homepage styles
-------------------------------------------------------------------
*/

/* Homepage
--------------------------------------------------------------------------
*/

#home { position: relative; border-bottom: 1px solid #cfcfcf; }
.under-tabs-on { z-index: 2 !important; }


#home #ajaxPanel, #home #ajaxPanel .container { min-height: 430px; }
#home #ajaxPanel .slide { zoom: 1; position: static; }
#home #ajaxPanel .slide .top { background: url(../../../../images/template/bg-main2.png) repeat-x top left; }
#home #ajaxPanel .slide .wrap { width: 920px; margin: 0 auto; line-height: 1.2; text-align: left; min-height: 430px; position: relative; }
#home #ajaxPanel .slide .box { z-index: 5; width: 310px; padding: 10px 15px; position: absolute; bottom: 17.5em; left: 0; background: #f6f8fc; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#home #ajaxPanel .slide .box h2 { font-size: 3.6em; color: #dd1a22; font-weight: bold; } /*textTrasnform removed-DC*/
#home #ajaxPanel .slide .box h2 a { color: #dd1a22; }
#home #ajaxPanel .slide .box h2 a:hover, #home ul.rotator li .box h2 a:active, #home ul.rotator li .box h2 a:focus { text-decoration: underline; }
#home #ajaxPanel .slide .box h2 a:active, #home ul.rotator li .box h2 a:focus { color: #333; }
#home #ajaxPanel .slide .box p { font-size: 1.4em; }
#home #ajaxPanel .slide .box p.show { text-align: right; }

#home #slideLoading { width: 100%; position: absolute; top: 40%; left: 0; font-size: 1.6em; font-weight: bold; font-style: italic; color: #999; }

/*
#home ul.rotator { min-height: 430px; }
#home ul.rotator li { position: absolute; top: 0; left: -99999px; }
#home ul.rotator li#slide1 { position: static; top: auto; left: auto; }
.js #home ul.rotator li { position: static; top: auto; left: auto; }
#home ul.rotator li .top { background: url(../../../../images/template/bg-main2.png) repeat-x top left; }
#home ul.rotator li .wrap { width: 920px; margin: 0 auto; line-height: 1.2; text-align: left; min-height: 430px; position: relative; }
#home ul.rotator li .box { width: 310px; padding: 1em 15px; position: absolute; bottom: 17.5em; left: 0; background: #f6f8fc; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#home ul.rotator li .box h2 { font-size: 3.6em; color: #dd1a22; font-weight: bold; text-transform: uppercase; }
#home ul.rotator li .box h2 a { color: #dd1a22; }
#home ul.rotator li .box h2 a:hover, #home ul.rotator li .box h2 a:active, #home ul.rotator li .box h2 a:focus { text-decoration: underline; }
#home ul.rotator li .box h2 a:active, #home ul.rotator li .box h2 a:focus { color: #333; }
#home ul.rotator li .box p { font-size: 1.4em; }
#home ul.rotator li .box p.show { text-align: right; }
*/

#home div.nav { width: 920px; margin: 0 auto; text-align: left; }
#home div.nav ul { position: absolute; bottom: 15em; z-index: 5; overflow: hidden; }
#home div.nav ul li { margin: 0 .4em 0 0; float: left; }
#home div.nav ul li a { color: #666; text-align: center; min-width: 1.2em; padding: 1px; float: left; background: #dedede; border: 1px solid #aeaeae; font-size: 1.1em; font-weight: bold; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
#home div.nav ul li a:hover { background: #ececec; }
#home div.nav ul li.on a { background: #ad141b; color: #fff; border: 1px solid #ad141b; }

#home div.banners { width: 920px; margin: 0 auto; text-align: left; position: absolute; bottom: 0; left: 50%; margin-left: -460px; z-index: 3; }
#home div.banners ul { width: 920px; position: relative; line-height: 1.2; overflow: hidden; height: 400px; }
#home div.banners ul li { width: 428px; padding: 1em 15px; position: absolute; z-index: 100; bottom: 0; height: 50px; overflow: hidden; }
#home div.banners ul li.neighbourhood { background: url(../../../../images/template/home-banner-neighbourhood.png) no-repeat top left; }
#home div.banners ul li.crimemap { margin-left: 462px; background: url(../../../../images/template/home-banner-crimemap.png) no-repeat top left; }
#home div.banners ul li h2 { font-size: 1.8em; color: #fff; font-weight: bold; }
#home div.banners ul li h2 a { padding: 0 50px 0 0; display: block; }
#home div.banners ul li p { margin: .2em 0 1px; font-size: 11px; color: #fff; }
#home div.banners ul li a { color: #fff; }
#home div.banners ul li a:hover, #home div.banners ul li a:active, #home div.banners ul li a:focus { text-decoration: underline; }
#home div.banners ul li h2 a { background: url(../../../../images/template/home-banner-open.png) no-repeat right .2em; }
#home div.banners ul li h2 a.open { background: url(../../../../images/template/home-banner-close.png) no-repeat right .2em; }
#home div.banners ul li div.more { padding-top: 25px; }
.js #home div.banners ul li div.more { display: none; }
.js #home div.banners ul li.open div.more { display: block; }
#home div.banners ul li div.more p { margin: .8em 0 1px; color: #666; }

#home div.banners ul li .map { width: 320px; height: 250px; margin: 0 auto; background: url(../../../../images/maps/cheshire-home.png) no-repeat top left; }
#home div.banners ul li .map img { width: 320px; height: 250px; background: url(../../../../images/maps/cheshire-home-overlay.png) no-repeat 0 -99999px; }
/*#home div.banners ul li .video { width: 355px; margin: 0 auto; }*/
#home div.banners ul li .more object, #home div.banners ul li .more embed { width: 355px; height: 292px; margin: 0 auto; display: block; }

#homeSpotlightsWrap { background: #ededed url(../../../../images/template/bg-homespotlights.png) repeat-x top left; }
#homeSpotlights { width: 960px; margin: 0 auto; padding: 2em 0 1em 0; line-height: 1.4; overflow: hidden; text-align: left; }
#homeSpotlights ul.spotlights { margin: 0 0 0 10px; width: 960px; overflow: hidden; }
#homeSpotlights ul.spotlights li { margin: 0 20px 0 0; padding-bottom: 15px; overflow: hidden; float: left; }
#homeSpotlights ul.spotlights li.col1, #homeSpotlights ul.spotlights li.col4 { width: 460px; }
#homeSpotlights ul.spotlights li.col2, #homeSpotlights ul.spotlights li.col5 { width: 250px; }
#homeSpotlights ul.spotlights li.col3 { width: 190px; float: right; }

#homeSpotlights ul.spotlights li h2 { font-size: 1.2em; margin: 0 0 1.6em; padding: 7px 10px; font-weight: bold; background: #e3e3e3; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; position: relative; z-index: 1; }
#homeSpotlights ul.spotlights li p.more { margin: 1em 10px 1px; padding: .2em 0 0; border-top: 4px solid #e1e1e1; overflow: hidden; }
#homeSpotlights ul.spotlights li p.more a { font-weight: bold; padding: 0 0 0 14px; float: right; color: #dd1a22; font-size: 1.2em; background: url(../../../../images/template/morearrow.png) no-repeat center left; }
#homeSpotlights ul.spotlights li p.more a span { position: absolute; top: 0; left: -99999px; }
#homeSpotlights ul.spotlights li p.more a:hover, #homeSpotlights ul.spotlights li p.more a:active, #homeSpotlights ul.spotlights li p.more a:focus { text-decoration: underline; }
#homeSpotlights ul.spotlights li p.more a:active, #homeSpotlights ul.spotlights li p.more a:focus { color: #333; }

#homeSpotlights ul.spotlights .listing { margin: 0 10px; overflow: hidden; position: relative; }
#homeSpotlights ul.spotlights .listing ul { position: relative; width: 100%; overflow: hidden; }
#homeSpotlights ul.spotlights .listing ul li { padding: 0 0 1px; clear: left; width: 440px; overflow: visible; }
#homeSpotlights ul.spotlights .listing ul li a { color: #003e7e; display: block; font-size: 1.1em; z-index: 1; cursor: pointer; width: 440px; }
#homeSpotlights ul.spotlights .listing ul li.first a img { left: 0; }
#homeSpotlights ul.spotlights .listing ul li a img { width: 120px; height: 152px; position: absolute; z-index: 2; top: 0; left: -99999px; }
#homeSpotlights ul.spotlights .listing ul li a span { width: 295px; padding: .1em 8px; float: right; background: #fff; border: 1px solid #cfcfcf; font-weight: bold; min-height: 45px; }
#homeSpotlights ul.spotlights .listing ul li a span span { width: auto; padding: 2px 0 0 0; float: none; display: block; border: 0; color: #666; min-height: 0; }

#homeSpotlights ul.spotlights .listing ul li a:hover, #homeSpotlights ul.spotlights .listing ul li a.on { color: #fff; z-index: 6; }
#homeSpotlights ul.spotlights .listing ul li a:hover img, #homeSpotlights ul.spotlights .listing ul li a.on img { left: 0; z-index: 5; }
#homeSpotlights ul.spotlights .listing ul li a:hover img.overlay, #homeSpotlights ul.spotlights .listing ul li a.on img.overlay { z-index: 6; }
#homeSpotlights ul.spotlights .listing ul li a:hover span, #homeSpotlights ul.spotlights .listing ul li a.on span { background: #003e7d url(../../../../images/template/home-news-hover.png) repeat-x bottom left; }
#homeSpotlights ul.spotlights .listing ul li a:hover span span, #homeSpotlights ul.spotlights .listing ul li a.on span span { background: none; color: #fff; }

/* news image fix for ie6 */
#homeSpotlights .news-images { position: absolute; width: 120px; height: 152px; left: 10px; }
#homeSpotlights ul.spotlights .listing ul li a img.overlay, #homeSpotlights .news-images img.overlay { position: absolute; z-index: 3; }

#homeSpotlights ul.spotlights .listing-narrow ul li a span { float: left; width: 212px; padding: 0.3em 8px; }
#homeSpotlights ul.spotlights .listing-help ul li a span span { font-weight: normal !important; }

#homeSpotlights ul.spotlights .spotlight { margin: 0 0 0 10px; overflow: hidden; }
#homeSpotlights ul.spotlights .spotlight .video { margin-top: 1px; width: 300px; float: left; }
#homeSpotlights ul.spotlights .spotlight .video object, #homeSpotlights ul.spotlights .spotlight .video embed { width: 300px!important; height: 247px!important; }
#homeSpotlights ul.spotlights .spotlight .image { display: inline; width: 85px; margin: 0 10px 0 0; position: relative; float: right; }
#homeSpotlights ul.spotlights .spotlight .image img { width: 85px; height: 168px; border-color: #fff; }
#homeSpotlights ul.spotlights .spotlight .image .overlay { position: absolute; }
#homeSpotlights ul.spotlights .spotlight .text { width: 120px; padding: 1px 8px .6em; border: 1px solid #cfcfcf; float: left; background: #fff; }
#homeSpotlights ul.spotlights .spotlight .text-video { display: inline; margin-right: 10px; width: 115px; height: 240px; float: right; }
#homeSpotlights ul.spotlights .spotlight .text h3 { margin: .3em 0 1px; font-size: 1.4em; color: #003e7e; font-weight: bold; }
#homeSpotlights ul.spotlights .spotlight .text p { margin: .5em 0 1px; font-size: 1.1em; }
#homeSpotlights ul.spotlights .spotlight .text a { color: #003e7e; }
#homeSpotlights ul.spotlights .spotlight .text a:hover, #homeSpotlights ul.spotlights .spotlight .text a:active, #homeSpotlights ul.spotlights .spotlight .text a:focus { text-decoration: underline; }
#homeSpotlights ul.spotlights .spotlight .text a:active, #homeSpotlights ul.spotlights .spotlight .text a:focus { color: #333; }

#homeSpotlights ul.spotlights ul.buttons li { margin: 0 0 8px; width: 190px; padding-bottom: 0; background: url(../../../../images/template/bg-home-buttons-btm.png) no-repeat bottom left; }
#homeSpotlights ul.spotlights ul.buttons li a { cursor: pointer; padding: 6px 10px; display: block; background: url(../../../../images/template/bg-home-buttons-top.png) no-repeat top left; font-size: 1.1em; font-weight: bold; color: #333; width: 168px; overflow: hidden; }
#homeSpotlights ul.spotlights ul.buttons li a span { float: right; width: 90px; padding: 10px 0; margin-right: 10px; }
#homeSpotlights ul.spotlights ul.buttons li a:hover { text-decoration: underline; }
#homeSpotlights ul.spotlights ul.buttons li.blue a { color: #003e7e; }
#homeSpotlights ul.spotlights ul.buttons li.red a { color: #ab4642; }
#homeSpotlights ul.spotlights ul.buttons li a img { float: left; }

#homeSpotlights ul.spotlights ul.buttons li.button a { padding: 7px 10px; text-align: center; }
#homeSpotlights ul.spotlights ul.buttons li.button a img { float: none; display: inline; }


.neighbourhood-form { font-size: 1.4em; color: #666; font-weight: bold; }
.neighbourhood-form label { position: absolute; left: -10000px; }
.neighbourhood-form span { padding: 0 7px; }
.neighbourhood-form input { vertical-align: middle; padding: 2px; color: #666; width: 127px; }
.neighbourhood-form select { vertical-align: middle; padding: 2px; color: #666; width: 229px; }
.neighbourhood-form input.submit { width: auto; padding: 0; }
