/* global.css: GLOBAL stylesheet ------------ Job: Chorley Council Template Version: 1.0 Produced by: Phil Gilligan Start date: 06/08/2012 ------------ TABLE OF CONTENTS 0. RESET 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css 1. HTML Tags 2. Page Structure 3. General Styles 4. Home Page Specific 5 List Pages Specific 6. Inside List Page Specific 7. Events List Page Specific 8. Content Page Specific 9. Info Page Specific 10. Twitter Widget 11. Print Styles */ /* 0. RESET ****************************************************************************************************/ article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{ display:block}audio,canvas,video{ display:inline-block; *display:inline; *zoom:1}audio:not([controls]){ display:none; height:0}[hidden]{ display:none}html{ font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%}html,button,input,select,textarea{ font-family:sans-serif}body{ margin:0}a:focus{ outline:thin dotted}a:active,a:hover{ outline:0}h1{ font-size:2em; margin:0.67em 0}h2{ font-size:1.5em; margin:0.83em 0}h3{ font-size:1.17em; margin:1em 0}h4{ font-size:1em; margin:1.33em 0}h5{ font-size:0.83em; margin:1.67em 0}h6{ font-size:0.75em; margin:2.33em 0}abbr[title]{ border-bottom:1px dotted}b,strong{ font-weight:bold}blockquote{ margin:1em 40px}dfn{ font-style:italic}mark{ background:#ff0; color:#000}p,pre{ margin:1em 0}code,kbd,pre,samp{ font-family:monospace,serif; _font-family:'courier new',monospace; font-size:1em}pre{ white-space:pre; white-space:pre-wrap; word-wrap:break-word}q{ quotes:none}q:before,q:after{ content:''; content:none}small{ font-size:75%}sub,sup{ font-size:75%; line-height:0; position:relative; vertical-align:baseline}sup{ top:-0.5em}sub{ bottom:-0.25em}dl,menu,ol,ul{ margin:1em 0}dd{ margin:0 0 0 40px}menu,ol,ul{ padding:0 0 0 40px}nav ul,nav ol{ list-style:none; list-style-image:none}img{ border:0; -ms-interpolation-mode:bicubic}svg:not(:root){ overflow:hidden}figure{ margin:0}form{ margin:0}fieldset{ border:1px solid #c0c0c0; margin:0 2px; padding:0.35em 0.625em 0.75em}legend{ border:0; padding:0; white-space:normal; *margin-left:-7px}button,input,select,textarea{ font-size:100%; margin:0; vertical-align:baseline; *vertical-align:middle}button,input{ line-height:normal}button,html input[type="button"],input[type="reset"],input[type="submit"]{ -webkit-appearance:button; cursor:pointer; *overflow:visible}button[disabled],input[disabled]{ cursor:default}input[type="checkbox"],input[type="radio"]{ box-sizing:border-box; padding:0; *height:13px; *width:13px}input[type="search"]{ -webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{ -webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{ border:0; padding:0}textarea{ overflow:auto; vertical-align:top}table{ border-collapse:collapse; border-spacing:0} /* 1. HTML Tags ****************************************************************************************************/ body { background-color:#fff;font-family:Arial, Helvetica, Sans-Serif; font-size:0.75em; } h1 { color:#7a7e7e; font-size:2em; } h2, h3 { margin-top: 0.75em; margin-right: 0em; margin-bottom: 0.3em; } h3 { margin-top: 0.75em; margin-right: 0em; margin-left: 1.2em; margin-bottom: 0.3em; } p {color:#000; line-height:1.5em; margin:0.5em 0; } ul, ol { margin:0; padding:0; } a, a:link, a:visited { color:#DA0B11; text-decoration:none;cursor:pointer; } a:hover, a:focus { text-decoration:underline; } blockquote { clear:both; color:#7A7E7E; display:inline; float:right; font-size:2.25em; font-weight:bold; margin:2% 0 2% 5%; width:35%; } blockquote:before { content:"\201C"; } blockquote:after { content:"\201D"; } /* 2. Page Structure ****************************************************************************************************/ ul.accessmenu { left:-9999px; position:absolute; } div[role=banner] { display:table; margin:0 auto; padding:1% 0; width:960px; } div[role=banner] h1 { left:-9999px; position:absolute; } div[role=banner] > a { display:block; float:left; height:52px; margin-top:4px; width:135px; } div[role=banner] div[role=search] { float:left; padding:1% 7%; width:50%; } div[role=banner] div[role=search] fieldset { border:0; } div[role=banner] div[role=search] fieldset legend { left:-9999px; position:absolute; } div[role=banner] div[role=search] fieldset ol { list-style:none; } div[role=banner] div[role=search] fieldset ol li { display:inline; list-style:none; } div[role=banner] div[role=search] fieldset ol li label { left:-9999px; position:absolute; } div[role=banner] div[role=search] fieldset ol li input[type=text] { border:4px solid #D5060E; border-radius:5px; font-size:1.25em; padding:1%; text-indent:3%; width:68%; } html.ie div[role=banner] div[role=search] fieldset ol li input[type=text] { text-indent:0; } div[role=banner] div[role=search] fieldset ol li input[type=submit] { background:#D5060E; border:3px solid #7A7E7D; border-radius:20px; color:#FFF; margin:0 0 0 4%; padding:1% 5%; } div[role=banner] div[role=search] fieldset ol li input[type=submit]:focus { outline:1px dotted #DA0B11; } div[role=banner] ul.login { float:left; list-style:none; width:20%; } div[role=banner] ul.login li { float:left; width:49.5%; } div[role=banner] ul.login li:first-child { width:100%; } div[role=banner] ul.login li h2 { color:#6f6f6f; display:block; margin:0; font-size:3em; font-weight:normal; } div[role=banner] ul.login li a { color:#D5060E; font-size:1.25em; } div[role=banner] ul.login li:nth-child(3) { border-left:1px solid #6f6f6f; } div[role=banner] ul.login li:nth-child(3) a { padding-left:5px; } div#navcontainer { background:url(nav.png) repeat-x 0 0 #D4070E; position:relative; width:100%; background-image: -webkit-gradient(linear, 0 0, 0 23, from(#DA0B11), color-stop(0.478, #DA0B11), color-stop(0.478, #D4070E)); background-image: -webkit-linear-gradient(#DA0B11, #DA0B11 47.8%, #D4070E 47.8%); background-image: -moz-linear-gradient(#DA0B11, #DA0B11 47.8%, #D4070E 47.8%); background-image: -o-linear-gradient(#DA0B11, #DA0B11 47.8%, #D4070E 47.8%); background-image: linear-gradient(#DA0B11, #DA0B11 47.8%, #D4070E 47.8%); } ul[role=navigation] { margin:0 auto; position:relative; text-align:center; width:960px; } ul[role=navigation] > li { border-left:1px solid #FFF; display:inline; text-align:left; margin-right:-4px; /*Inline white space fix*/ } ul[role=navigation] > li:first-child { border:0; } html.ie7 ul[role=navigation] > li { border:0; } ul[role=navigation] > li > a { color:#FFF; display:inline-block; font-size:1.3em; font-weight:bold; padding:1% 0; text-align:center; text-decoration:none; width:17%; } html.ie9 ul[role=navigation] > li > a { width:19.85%; } ul[role=navigation] > li > a.selected { } html.ie7 ul[role=navigation] > li a { background:url(nav-border.png) no-repeat left center; } html.ie7 ul[role=navigation] > li:first-child a { background:none; } html.ie7 ul[role=navigation] > li > a:hover, html.ie7 ul[role=navigation] > li.hover > a { background-color:#EF662F; } ul[role=navigation] > li > a:hover, ul[role=navigation] > li.hover > a, ul[role=navigation] > li > a:focus, ul[role=navigation] > li.focus a { background:#EF662F; background-image: -webkit-gradient(linear, left top, left bottom, from(#F06A27), to(#EF662F)); background-image: -webkit-linear-gradient(top, #F06A27, #EF662F); background-image: -moz-linear-gradient(top, #F06A27, #EF662F); background-image: -ms-linear-gradient(top, #F06A27, #EF662F); background-image: -o-linear-gradient(top, #F06A27, #EF662F); background-image: linear-gradient(top, #F06A27, #EF662F); } ul[role=navigation] > li > div.megamenu { background:url('megamenu.png') repeat-x left bottom #EF662F; border-radius:10px; border-top:1px solid #FFF; left:-9999px; padding:2%; position:absolute; width:96%; z-index:100; background: -webkit-gradient(linear, left top, left bottom, from(#EF662F), to(#DB0B12)); background: -webkit-linear-gradient(top, #EF662F, #DB0B12); background: -moz-linear-gradient(top, #EF662F, #EF662F 1%, #DB0B12); background: -ms-linear-gradient(top, #EF662F, #DB0B12); background: -o-linear-gradient(top, #EF662F, #DB0B12); background: linear-gradient(top, #EF662F, #DB0B12); } html.ie7 ul[role=navigation] > li > div.megamenu { text-align:left; top:37px; } ul[role=navigation] > li > a:hover + div.megamenu, ul[role=navigation] > li > a:focus + div.megamenu, ul[role=navigation] > li > div.megamenu:hover, ul[role=navigation] > li.focus > div.megamenu { left:0; } ul[role=navigation] > li > div.megamenu > ul { float:left; width:60%; } ul[role=navigation] > li > div.megamenu > ul li { border-bottom:1px dotted #EF7759; float:left; list-style:none; margin:0 2%; width:46%; } html.ie7 ul[role=navigation] > li > div.megamenu > ul li { width:44%; } ul[role=navigation] > li > div.megamenu > ul li a { background:url(sprite.png) no-repeat 245px 15px transparent; color:#FFF; display:block; font-size:1.25em; padding:4% 0; } html.ie7 ul[role=navigation] > li > div.megamenu > ul li a { background-position:230px 15px; } ul[role=navigation] > li > div.megamenu > a.cta { color:#FFF; cursor:pointer; float:right; min-height:179px; position:relative; text-decoration:none; width:331px; } ul[role=navigation] > li > div.megamenu > a.cta img { border-radius:10px; position:absolute; right:0; top:0; z-index:0; } ul[role=navigation] > li > div.megamenu > a.cta > div { background:rgba(0, 0, 0, 0.7); bottom:10px; color:#FFF; margin:0; padding:2% 2%; position:absolute; z-index:1; } html.oldie ul[role=navigation] > li > div.megamenu > a.cta > div { background:url(black-trans.png) repeat 0 0 transparent; } html.ie7 ul[role=navigation] > li > div.megamenu > a.cta > div { width:95.9%; } ul[role=navigation] > li > div.megamenu > a.cta h2 { margin:0.3em 0; } ul[role=navigation] > li > div.megamenu > a.cta:hover h2 { text-decoration:underline; } ul[role=navigation] > li > div.megamenu > a.cta h2:after { background:url(sprite.png) no-repeat 0 1px transparent; content:""; display:inline-block; height:10px; margin-left:2%; width:10px; } html.ie7 ul[role=navigation] > li > div.megamenu > a.cta h2 span { background:url(sprite.png) no-repeat 0 1px transparent; content:""; display:inline-block; height:15px; margin-left:2%; width:10px; } ul[role=navigation] li ul li a:hover, ul[role=navigation] li ul li a:focus { text-decoration:underline; } ul[role=navigation] li div.megamenu div.blurb p{color:#fff;} div#wrapper { margin:1% auto; display:table; width:960px; } div.bodyhome div#wrapper { margin:0 auto 1%; } ol.breadcrumb { } ol.breadcrumb li { background:url(sprite.png) no-repeat 4px -97px transparent; display:inline; list-style:none; padding:0 0 0 15px; } ol.breadcrumb li:first-child { background:none; padding:0; } ol.breadcrumb li a { color:#6F6F6F; } ol.breadcrumb li:last-child a { color:#DB0B12; } div[role=main] { float:left; padding:0 2% 2% 0; width:69%; } div[role=complementary] { float:right; width:29%; } div.footnav-container { background:url('foot-nav.jpg'); /*background-color: #d4070e; repeat-x left bottom #D5080F; display:table; overflow:hidden; width:100%; background: -webkit-gradient(linear, left top, left bottom, from(#DA0B13), to(#F06929)); background: -webkit-linear-gradient(top, #DA0B13, #F06929); background: -moz-linear-gradient(top, #DA0B13, #F06929); background: -ms-linear-gradient(top, #DA0B13, #F06929); background: -o-linear-gradient(top, #DA0B13, #F06929); background: linear-gradient(top, #DA0B13, #F06929); */ } div.footnav { display:table; margin:0 auto; position:relative; width:960px; } html.ie7 div.footnav { padding-bottom:15px; } div.footnav ul { float:left; margin:2% 0 2% 4%; overflow:hidden; width:21%; } div.footnav ul li { list-style:none; margin:2% 0;position:relative;} div.footnav ul li:first-child { margin:0; } div.footnav ul li strong { color:#FFF; display:inline-block; font-size:1.5em; padding:0 0 5%; } div.footnav ul li a { color:#FFF; display:inline-block;font-size:1.25em;margin-left:15px; } div.footnav ul li:before { color:#FFF; /*content:"\00BB";*/ position:absolute; } html.ie7 div.footnav ul li span { top:0; color:#FFF; position:absolute;} html.ie7 div.footnav ul li a {padding-left:15px;} div.footnav ul li:first-child:before { display:none; } /* div.footnav:before { bottom:-11px; content:url(silhouette-left.png); left:-310px; position:absolute; } div.footnav:after { bottom:-7px; content:url(silhouette-right.png); right:-265px; position:absolute; } html.ie7 span.left-silhouette { background:url(silhouette-left.png) no-repeat 0 0 transparent; bottom:0; display:block; height:175px; left:-310px; position:absolute; width:284px; } html.ie7 span.right-silhouette { background:url(silhouette-right.png) no-repeat 0 0 transparent; bottom:0; display:block; height:166px; right:-265px; position:absolute; width:249px; } */ div[role=contentinfo] { display:table; margin:0 auto; width:960px; } div[role=contentinfo] p { float:left; margin:1em 0; width:25%; } div[role=contentinfo] ul { float:right; margin:1em 0; text-align:right; width:75%; } div[role=contentinfo] ul li { border-left:1px solid #6F6F6F; display:inline; list-style:none; margin:0 1% 0 0; padding:0 0 0 2%; } div[role=contentinfo] ul li:first-child { border:0; } /* 3. General Styles ****************************************************************************************************/ div[role=complementary] div.cta { border-radius:10px; display:block; margin-bottom:5%; } div[role=complementary] div.cta img { display:block;} div[role=complementary] div.twitter { background:#C1DEEE; border-radius:10px; } div[role=complementary] div.twitter a.title { background:url(twitter.png) no-repeat 0 0 transparent; border-radius:10px; display:block; height:40px; margin:0; text-indent:-9999px; } html.js div[role=complementary] div.twitter a.title { border-radius:10px 10px 0 0; } div[role=complementary] div.twitter div.twtr-widget { padding:10px; } div[role=complementary] div.twitter div.twtr-widget div.twtr-ft div a img { display:none; } /* 4. Home Page Specific ****************************************************************************************************/ div.featured[role=main] { padding:0; width:100%; } div.featured[role=main] > a > img, div.featured[role=main] > img { display:block; width: 960px; height: 486px; } div.box50 { border:1px solid #C0C0C0; border-radius:10px; float:left; padding:10px 0; width:470px; } .box50:first-child { margin-right: 15px; } div.box50 h2 { color:#6D6D6D; font-size:2em; font-weight:normal; margin:0; padding:0 20px 10px; text-transform:lowercase; } div.box50 a:nth-child(2) { display:table; position:relative; width:100%; } div.box50 a div { background:rgba(0, 0, 0, 0.7); bottom:0; color:#FFF; left:0; margin:0; padding:10px 4%; position:absolute; width: 92%; min-height: 5.3em; } html.oldie div.box50 a div { background:url(black-trans.png) repeat 0 0 transparent; } html.ie7 div.box50 a div { width:430px; } div.box50 a img { display:block; min-height:100px; text-indent:4%; } div.box50 a div h3 { font-size:1.5em; margin:0 0 0.3em; } div.box50 a:hover div h3 { text-decoration:underline; } div.box50 a div h3:after { background:url(sprite.png) no-repeat 5px 0 transparent; content:""; display:inline-block; height:10px; width:10px; } html.ie7 div.box50 a div h3 span { background:url(sprite.png) no-repeat 5px 0 transparent; content:""; display:inline-block; height:13px; width:13px; } div.box50 a div p {color:#fff; margin:0 } div.box50 a:nth-child(3) { background:url(sprite.png) no-repeat 440px -87px transparent; color:#DB0B12; direction:rtl; display:inline-block; padding:2% 5% 0; text-align:right; text-indent:3%; width:90%; } div.box33 { border:1px solid #C0C0C0; border-radius:10px; float:left; margin:20px 16px 0 0; padding:0 0 10px; width:307px; height: 20.6em; } div.row33 div:last-child { float:right; margin:20px 0 0; } div.box33 img { border-radius:10px 10px 0 0; display:block; } div.box33 h2 { font-size:1.5em; margin:0.5em 0; padding:0 20px; } div.box33 h2 a { color:#DB0B12; } div.box33 h2 a:after { background:url(sprite.png) no-repeat 0 -99px transparent; content:""; display:inline-block; height:10px; margin-left:2%; width:10px; } html.ie7 div.box33 h2 span { background:url(sprite.png) no-repeat 0 -99px transparent; content:""; display:inline-block; height:15px; margin-left:2%; width:10px; } div.box33 p { margin:0; padding:0 20px; } /* 5. List Pages Specific ****************************************************************************************************/ ol.articles li { border-bottom:1px solid #B2B2B2; list-style:none; padding:2% 0; } ol.articles li > span { color:#707070; float:left; margin:0 0 1%; width:100%; } ol.articles li h2 { font-size:1.5em; margin:0; } ol.articles li h2 a { color:#DB0B12; } ol.articles li h2 a:after { background:url(sprite.png) no-repeat 0 -99px transparent; content:""; display:inline-block; height:10px; margin-left:2%; width:10px; } html.ie7 ol.articles li h2 span { background:url(sprite.png) no-repeat 0 -99px transparent; content:""; display:inline-block; height:15px; margin-left:2%; width:10px; } ol.articles.featured li:nth-child(1) { display:table; } html.ie7 ol.articles.featured li:nth-child(1) { float:left; } ol.articles.featured li:nth-child(1) > span { width:50%; } ol.articles.featured li:nth-child(1) h2 { float:left; font-size:2em; width:50%; } html.ie7 ol.articles.featured li:nth-child(1) h2 { width:51%; } ol.articles.featured li:nth-child(1) p { float:left; width:50%; } ol.articles.featured li:nth-child(1) img { border-radius:10px; float:right; } ol.articles.featured li:nth-child(2) { border:0; float:left; padding-right:1%; width:49% } html.ie7 ol.articles.featured li:nth-child(2) { clear:both; } ol.articles.featured li:nth-child(3) { border:0; float:right; padding-left:1%; width:49% } ol.articles.featured li:nth-child(4) { border-top:1px solid #B2B2B2; clear:both; } /* 6. Inside List Page Specific ****************************************************************************************************/ a.seemore { background:url(sprite.png) no-repeat 385px -79px transparent; float:left; font-size:1.5em; padding:2% 0; text-align:center; width:100%; } /* 7. Events List Page Specific ****************************************************************************************************/ ol.months { list-style:none; } ol.months li { display:inline; } ol.months li a { background:#090B0C; border-radius:5px; color:#FFF; display:inline-block; margin-bottom:0.5%; padding:1%; text-align:center; text-transform:uppercase; width:17.6%; } ol.months li.selected a { background:#DB0B12; } ol.months li:nth-child(-n+5) a { width:15.8%; } html.ie9 ol.months li:nth-child(-n+5) a { width:15.75%; } html.ie7 ol.months li:nth-child(-n+5) a { width:15.63%; } ol.months li:nth-child(1) a, html.ie9 ol.months li:nth-child(1) a, html.ie7 ol.months li:nth-child(1) a { width:25%; } ol.months li:nth-child(n+6) a { background:#5D5E5F; width:10.1%; } html.ie9 ol.months li:nth-child(n+6) a { width:10.05%; } html.ie7 ol.months li:nth-child(n+6) a { width:10%; } ol.events li > span { background:#D5D5D5; border-radius:10px; color:#090B0C; font-size:0.7em; line-height:2em; margin:0 10px 10px 0; padding:2px 5px; text-align:center; text-transform:uppercase; width:60px; } ol.events li > span > span { display:block; font-size:3.6em; margin:0.1em 0; } ol.events.featured li:nth-child(1) > span { width:60px; } ol.events.featured li:nth-child(1) > h2 { width:35%; } ol.events.featured li:nth-child(2) > p, ol.events.featured li:nth-child(3) > p { clear:left; } a.submit-event { background:#DB0B12; border-radius:5px; box-shadow:0 1px 2px 1px #BFBFBF; clear:both; color:#FFF; float:left; font-size:0.9em; font-weight:bold; margin:2% 0; padding:1% 4%; text-transform:uppercase; } em.note { float:left; clear:both; } div#ctl00_PlaceHolderMain_ctl01_noEventsPanel {color:#000; margin:1em 0;} /* 8. Content Page Specific ****************************************************************************************************/ div.bodycontent div[role=main] > h2 { color:#000;font-size:2.5em; line-height:1em; margin:0 0 0.5em; } div.bodycontent div[role=main] > span { color:#7A7E7E; display:inline-block; margin:0 0 0.5em; } div.bodycontent div[role=main] > p { max-width:75%; } div.bodycontent div[role=main] > ul, div.bodycontent div[role=main] > ol {margin-left:1.7em;} div.image-container { float:right; width:325px; margin:0 0 2% 2%; } div.image-container img { border-radius:10px; } div.image-container span { font-size:0.9em; font-style:italic; margin-left:10px; } div.share-this { float:left; margin:0 0 2.5%; width:100%; } .addthis_toolbox { float: right; width: auto; } .ms-rteTable-default table {clear:both;margin:1.5em 0;width:100%;} .ms-rteTable-default caption {color:#333;font-weight:bold;padding-bottom:.5em;text-align:left;} .ms-rteTable-default td {border:1px solid #B5B4B9;vertical-align:top;padding: .8em 1em;} .ms-rteTable-default tr.even {background:#eef0f0;} .ms-rteTable-default tr:hover {background:#ccc;} .ms-rteTable-default th {background:#eaeaea; border:1px solid #B5B4B9; color:#333; font-weight:bold; text-align:left; padding: .5em 1em;text-transform:uppercase;} .ms-rteStyle-Normal {font-style:normal;} .ms-rteStyle-Highlight {color:#312a26; background-color:rgb(250,224,50);} .ms-rteStyle-Byline {color:#b6b6b6} .ms-rteStyle-Tagline {color:#8b8b8b; font-size:1.3em} .ms-rteStyle-Comment {color:#36b000;} .ms-rteStyle-References {color:#828282} .ms-rteStyle-Caption {color:#00adee} .ms-rteElement-Hr {height:1px; background-color:rgb(182,182,182);} .ms-rteElement-H4B {color:#058036; font-style:italic; font-weight:normal;} .ms-rteElement-H3B {color:#0093ca;} .ms-rteElement-H2B {color:#ca0078; font-size:1.3em; font-weight:normal;} .ms-rteElement-H1B {color:#0072bc; font-size:2em; font-weight:normal;} .ms-rteElement-H4 {font-size:1em; font-style:italic; font-weight:normal;} .ms-rteElement-H3 {font-size:1em} .ms-rteElement-H2 {font-size:1.3em;font-weight:normal;} .ms-rteElement-H1 {font-size:2em; font-weight:normal;} .ms-rteElement-Callout1 {background-color:rgb(252,244,228); border:1px solid #fd9f08; float:left;padding:1em;width:25em;} .ms-rteElement-Callout2 {background-color:rgb(242,242,242); border:1px solid #36b000; color:#353738;float:right;padding:1em;width:25em;} .ms-rteElement-Callout3 {color:#ca0078;float:right;font-style:italic;padding:1em;width:25em} .ms-rteElement-Callout4 {background-color:rgb(216,244,255);border:1px solid #00adee;color:#005677;float:right;padding:1em;width:20em;} /* 9. Info Page Specific ****************************************************************************************************/ div.bodyinfo div.share-this { margin-top:4.5%; } div.bodyinfo div[role=main] > h1 { color:#000; font-size:2.75em; } div.bodyinfo div[role=main] > img { border-radius:10px; float:right; margin:0 0 2% 2%; width:324px; } ul.accordian { border-top:1px solid #E0E0E0; margin:2% 0 0!important; padding-top:2%; } ul.accordian li { list-style:none; } ul.accordian li > a { background:#DBDBDB; border-radius:5px; color:#000; display:block; font-size:1.5em; font-weight:bold; margin:1% 0; padding:1% 2%; text-decoration:none; } html.js ul.accordian li > a { background:url(sprite.png) no-repeat 635px -290px #DBDBDB; cursor:pointer; } html.js ul.accordian li > a.active { background-position:635px -385px; } ul.accordian li > div { background:#F6F6F6; border-radius:5px; margin:1% 0; padding:1% 2%; } html.js ul.accordian li > div { display:none; } ul.accordian li > div > h2 { font-size:1.25em; margin:0.5em 0; } ul.accordian li > div > p { margin:0.5em 0; } div.pop-tasks { border:1px solid #E0E0E0; border-radius:10px; margin:10% 0 0; } div.pop-tasks h2 { background:#DA0B11; border-radius:10px 10px 0 0; color:#FFF; font-size:2em; font-weight:normal; margin:0; padding:3%; } div.pop-tasks ul li { border-top:1px solid #E0E0E0; list-style:none; padding:3%; } div.pop-tasks ul li h3 { font-size:1.5em; margin:0; padding:4px 0 10px 40px; } div.pop-tasks ul li h3[title~=Pay] { background:url(sprite.png) no-repeat 0 -500px transparent; } div.pop-tasks ul li h3[title~=Download] { background:url(sprite.png) no-repeat 0 -594px transparent; } div.pop-tasks ul li h3[title~=Contact] { background:url(sprite.png) no-repeat 0 -700px transparent; } div.pop-tasks ul li h3[title~=Information] { background:url(sprite.png) no-repeat 0 -800px transparent; } div.pop-tasks ul li h3[title~=online] { background:url(sprite.png) no-repeat 0 -900px transparent; } div.pop-tasks ul li h3[title~=Map] { background:url(sprite.png) no-repeat 0 -1000px transparent; } div.pop-tasks ul li a { display:block; margin-top:0.5em; } div.pop-tasks ul li a:after { background:url(sprite.png) no-repeat 0 -100px transparent; content:""; display:inline-block; height:8px; margin-left:10px; width:8px; } a.live-chat { border-radius:10px; color:#FFF; display:block; font-size:2em; font-weight:bold; margin:5% 0; padding:10% 5% 10% 40%; background:url(sprite.png) no-repeat 45px -1085px, url(live-chat.png) repeat-x 0 0 #DA0B11; background:url(sprite.png) no-repeat 45px -1085px, -webkit-gradient(linear, 0 0, 0 23, from(#E1383D), color-stop(0.478, #E0373E), color-stop(0.478, #DA0B11)); background:url(sprite.png) no-repeat 45px -1085px, -webkit-linear-gradient(#E1383D, #E0373E 47.8%, #DA0B11 47.8%); background:url(sprite.png) no-repeat 45px -1085px, -moz-linear-gradient(#E1383D, #E0373E 47.8%, #DA0B11 47.8%); background:url(sprite.png) no-repeat 45px -1085px, -o-linear-gradient(#E1383D, #E0373E 47.8%, #DA0B11 47.8%); background:url(sprite.png) no-repeat 45px -1085px, linear-gradient(#E1383D, #E0373E 47.8%, #DA0B11 47.8%); } html.oldie a.live-chat { background:url(sprite.png) no-repeat 45px -1085px #DA0B11; } div.bodyinfo div[role=complementary] div.cta { background:#ECECEC; padding:2%; } div.bodyinfo div[role=complementary] div.cta > * { padding:0 4%; } div.bodyinfo div[role=complementary] div.cta h2 { margin:0.3em 0; } /* 10. Print Styles ****************************************************************************************************/ @media print { fieldset, nav, footer, aside { display:none; } section { float:left; width:100%; padding:0; } * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } a, a:visited { color: #444 !important; text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3{ page-break-after: avoid; } }