/* BASIC SETUP */ * { margin: 0; padding: 0; } body { font-size: 12px; font-family: Helvetica, Arial, sans-serif; background-position: center top; background-repeat: repeat-y; color: #202020; } /* useful styles */ .hr hr { display: none; } .hr { border-bottom: 1px solid #dadada; margin-bottom: 1em; } .error { color: #FF0000; } .small { font-size: 0.75em; } .align-left { text-align: left; } .align-center { text-align: center; } .align-right { text-align: right; } .valign-top { vertical-align: top; } .valign-middle { vertical-align: middle; } .valign-bottom { vertical-align: bottom; } .clear { clear: both; font-size: 0; line-height: 0; height: 0px; } .float-left { float: left; } .float-right { float: right; } /* common elements */ p { margin-bottom: 1em; } img { border: 0; } a { text-decoration: none; color: #555555; } a:hover { color: #777777; } /* HEADINGS */ h1, h2, h3, h4, h5, h6 { margin-bottom: 0.8em; font-weight: normal; } h1 { font-size: 18px; letter-spacing: 3px; font-family: "Times New Roman", Times, serif; color: #202020; text-transform: uppercase; padding: 0 0 12px 0; display: inline-block; margin-bottom: 15px; } h2, h3, h4, h5, h6 { font-size: 12px; line-height: 18px; font-weight: bold; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } /* FORMS */ form { } fieldset { border: 0; } input.text, textarea.text { color: #000000; } input.text-ghosted, textarea.text-ghosted { color: #808080; } input, select, textarea { vertical-align: middle; border: 1px solid #888888; font-family: Arial, Helvetica, sans-serif; font-size: 1em; } .form-button, .button { height: 21px; border: 0; background-color: #333333; color: #FFFFFF; cursor: pointer; width: auto; } .form-button:hover, .button:hover { background-color: #000000 !important; } .nolabels { } .nolabels input.text, .nolabels input.text-ghosted, .nolabels textarea.text, .nolabels textarea.text-ghosted { width: 100%; } .block-link { display: inline-block; background-color: #000000; color: #FFFFFF; height: 18px; line-height: 18px; font-size: 10px; padding: 0 10px; letter-spacing: 1px; text-transform: uppercase; } /* PAGE STRUCTURE */ #header-outer-box { width: 100%; background-color: #000000; } #header-outer { width: 980px; margin: 0px auto; height: 32px; line-height: 32px; color: #FFFFFF; font-size: 10px; text-transform: uppercase; } #header-outer a { color: #FFFFFF; } #root { width: 980px; margin: 0px auto; } #header { position: relative; height: 82px; border-bottom: 1px solid #DADADA; } #header .blog-link { display: block; position: absolute; top: 20px; left: 0; width: 138px; height: 43px; background: url(../images/editorial.png) center no-repeat #FFFFFF; } #logo { display: block; margin: 12px 347px 0; padding: 8px; } #main-image { position: relative; height: 314px; border: 1px solid #DADADA; margin-bottom: 50px; } #main-image .item { position: absolute; } #main-image img, #main-image a { display: block; } #main-image .title { margin-top: 265px; height: 49px; line-height: 49px; font-size: 18px; letter-spacing: 3px; font-family: "Times New Roman", Times, serif; color: #202020; text-transform: uppercase; text-align: center; } #montage-images { margin-bottom: 50px; } #montage-images .items { display: block; float: left; width: 314px; height: 173px; border: 1px solid #DADADA; margin: 0 16px 0 0; } #montage-images .items.last { margin: 0; } #main { position: relative; background-color: #FFFFFF; background-repeat: repeat-y; background-position: center top; padding: 0 50px; margin-bottom: 50px; line-height: 1.2em; height: 1%; } #center-column { float: left; width: 520px; position: relative; } #main-content { line-height: 18px; text-align: justify; } #main-content ul, #main-content ol { margin-left: 1.5em; margin-bottom: 1em; } #main-content li { margin-bottom: 0.3em; } #contact-form { float: right; margin: 0px 0 10px 20px; background-color: #bbbbbb; padding: 10px; width: 50%; } #right-column { float: right; width: 260px; line-height: 18px } #right-column h2, #right-column h3 { margin-bottom: 0.2em; } #right-footer { position: absolute; bottom: 0; right: 0; } /* MEGAMENU */ #megamenu-footer { border-top: 1px solid #000000; height: 135px; padding: 20px 0 20px 160px; font-size: 11px; letter-spacing: 1px; } /*.textpage_landingpage #megamenu-footer { height: 235px; } .awards-container img {margin-bottom: 10px;}*/ #megamenu-footer ul { float: left; margin: 0; width: 170px; padding: 0 20px 0 0; list-style-type: none; } #megamenu-footer ul li { margin: 0; padding: 0; } #megamenu-footer ul li.large { font-weight: bold; } #megamenu-footer ul li a { display: block; padding: 0; color: #000000; margin-bottom: 8px; } #megamenu-footer ul li a:hover { text-decoration: underline; } #ls_sociallinks { position: relative; } #ls_sociallinks a.icon { display: inline-block !important; width: 25px; height: 25px; margin: 0 4px 0 0; padding: 0; overflow: hidden; text-indent: -999em; background: url("../images/utilityicons.png") no-repeat; } .a_fb { background-position: 0 -224px !important } .a_fb:hover { background-position: 0 -249px !important } .a_twitter { background-position: -25px -224px !important } .a_twitter:hover { background-position: -25px -249px !important } .a_gplus { background-position: -50px -224px !important } .a_gplus:hover { background-position: -50px -249px !important } .a_pinterest { background-position: -75px -224px !important } .a_pinterest:hover { background-position: -75px -249px !important } .a_instagram { background-position: -100px -224px !important } .a_instagram:hover { background-position: -100px -249px !important } #ls_sociallinks .blog-link { display: block; position: absolute; top: 45px; left: 7px; width: 111px; height: 28px; background: url(../images/blog-link2.gif) center no-repeat #FFFFFF; } /* Copyright (c) Stu Nicholls. All rights reserved. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/final_drop.html */ .main-navigation { width: 980px; height: 22px; padding-top: 5px; display: block; padding-bottom: 8px; position: relative; z-index: 100; } /* hack to correct IE5.5 faulty box model */ * html .main-navigation { width: 981px; w\idth: 980px; } .main-navigation ul { text-align: center; list-style-type: none; margin: 0; padding: 0; } /* hide the sub levels and give them a positon absolute so that they take up no room */ .main-navigation ul ul { visibility: hidden; position: absolute; height: 0; top: 17px; left: 0; width: 198px; } /* another hack for IE5.5 */ * html .main-navigation ul ul { top: 16px; t\op: 17px; } /* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */ .main-navigation li { display: inline; position: relative; margin: 0; padding: 0; } /* style the first level links */ .main-navigation a, .main-navigation a:visited { display: inline-block; padding: 0 20px; height: 22px; line-height: 22px; text-transform: uppercase; font-size: 11px; color: #000000; } /* a hack so that IE5.5 faulty box model is corrected (use for widths, refer to website) */ * html .main-navigation a, * html .main-navigation a:visited { } .main-navigation a.active { color: #000000; } .main-navigation a.first { } .main-navigation a.last { border: 0; } /* style the first level hover */ /*.main-navigation a:hover, .main-navigation ul ul a:hover{ background-color: #000000; color: #FFFFFF; } .main-navigation :hover > a, .main-navigation ul ul :hover > a { background-color: #000000; color: #FFFFFF; }*/ /* yet another hack for IE5.5 */ * html .main-navigation ul ul a, * html .main-navigation ul ul a:visited { width: 198px; w\idth: 170px; } /* style the second level links */ .main-navigation ul ul a, .main-navigation ul ul a:visited { display: block; text-align: left; height: auto; text-transform: none; border: 0; color: #000000; line-height: 19px; padding: 0px 13px; width: 170px; text-transform: none; font-size: 12px; } .main-navigation ul ul li { display: block; background-color: #FFFFFF; border-left: 1px solid #cdcdcd; border-right: 1px solid #cdcdcd; } .main-navigation ul ul li.first2 { padding-top: 12px; border-top: 1px solid #cdcdcd; } .main-navigation ul ul li.last2 { padding-bottom: 12px; border-bottom: 1px solid #cdcdcd; } .main-navigation ul ul a.first2 { } .main-navigation ul ul a.active2 { } .main-navigation ul ul a.last2 { } /* style the second level hover */ .main-navigation ul ul a:hover { background-color: #ececec; color: #000000; } .main-navigation ul ul :hover > a { background-color: #ececec; color: #000000; } /* DON'T CHANGE */ /* style the table so that it takes no part in the layout - required for IE to work */ .main-navigation table { position: absolute; top: 0; left: 0; border-collapse: collapse; } /* make the second level visible when hover on first level list OR link */ .main-navigation ul li:hover ul, .main-navigation ul a:hover ul{ visibility: visible; } .block-link { display: inline-block; background-color: #000000; color: #FFFFFF; height: 18px; line-height: 18px; font-size: 10px; padding: 0 10px; letter-spacing: 1px; text-transform: uppercase; } .large-quote { font-family: "Times New Roman", Times, serif; color: #202020; font-style: italic; font-size: 20px; line-height: 26px; margin-bottom: 20px; } .quote-source { text-align: right; font-size: 11px; color: #202020; }