/* ------------------------------------------------*/ /* alvapetroleum.com Screen /* Revision: 1.1 /* Date: 28-02-2013 /* Author: Clear Signal /* /* Hex: /* Light Blue #3493d0 /* Dark Blue #246289 /* Light Green #769a7c /* Dark Green #5f7d63 /* Light Orange #ed6939 /* Dark Orange #994723 /* /* Fonts for alvapetroleum.com: Benton /* Regular: font-family: 'BentonSans Regular'; /* Bold: font-family: 'BentonSans Regular'; font-weight: bold; /* Condensed: font-family: 'BentonSansCond Regular'; ---------------------------------------------------*/ /* site specific ---------------------------------------------------*/ body { margin: 0; line-height: 1.4; font-family: 'BentonSans Regular', Helvetica, Tahoma, Trebuchet MS, Arial, sans-serif; color: #000; background-color: #E5E5E5; -webkit-font-smoothing: antialiased; webkit-text-size-adjust : 100%; -ms-text-size-adjust : 100%; text-rendering: optimizeLegibility;} body, a { -webkit-transition: color .25s ease-out; -moz-transition: color .25s ease-out; -o-transition: color .25s ease-out; transition: color .25s ease-out; } #body-wrapper { } p { margin: 0 0 15px 0 !important; padding: 0; } a { text-decoration: underline; color: #246289; } a:hover { text-decoration: underline; color: #000; } a:focus { outline: 0; } a:active,a:focus { color: #000; position: relative; } a:hover, a:active { outline: 0; } .ie7 img, .iem7 img { -ms-interpolation-mode: bicubic; } .blue { color: #3493d0 !important; } .green { color: #769a7c !important; } .orange { color: #ed6939 !important; } /* fitted */ .linked { cursor: pointer; } /* generic ---------------------------------------------------*/ .clear { clear: both; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .hidden { display: none !important; visibility: hidden; } .off { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .off.focusable:active, .off.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } strong { font-family: 'BentonSans Regular', Helvetica, Tahoma, Trebuchet MS, Arial, Helvetica, sans-serif; font-weight: bold; } hr { display: block; background: none; height: 2px; border: 0; border-bottom: 1px solid #eee; } /* main-nav, dnn_topNavPane ---------------------------------------------------*/ #main-nav-wrapper { position: relative; width: 960px; height: 168px; margin: 0 auto; } #logo { position: relative; float: left; width: 176px; height: 128px; background: transparent url(images/alva-logo.png) 0 0 no-repeat; } #logo a { display: block; width: 176px; height: 128px; } #main-nav { position: relative; float: left; width: 960px; height: 33px; margin: 6px 0 0 0; } #main-nav dd { display: block; float: left; background: transparent url(images/icn-pipe-grey.gif) right 6px no-repeat; } #main-nav dd a { display: block; font-size: 18px; color: #fff; text-decoration: none; padding: 0 17px; text-transform: lowercase; } #main-nav dd a.selected, #main-nav dd a:hover { color: #939393; text-decoration: none; } #main-nav dd.first a { padding-left: 0; } #main-nav dd.last { background: none; } #dnn_topNavPane { position: absolute; right: 0; width: 300px; height: 40px; margin-top: 33px; } #dnn_topNavPane dd { display: block; float: right; } #dnn_topNavPane dd a { display: block; float: left; font-size: 16px; margin-left: 17px; text-decoration: none; } #dnn_topNavPane dd a:hover { color: #000 !important; text-decoration: underline; } /* ie7 */ .ie7 #dnn_topNavPane { width: 350px; top: 0; } .ie7 .caption #firstline { width: 350px; } .ie7 .caption #firstline em { font-style: normal !important; } .ie7 .caption #secondline em { font-style: normal !important; } /* banners ---------------------------------------------------*/ #header { height: 540px; } #header #bnr-imgs .bnr-img { position: absolute; height: 330px; top: 169px; background-position: center top; background-repeat: no-repeat; width: 100%; } #bnr-nav-wrapper { position: relative; margin: 20px auto 0 auto; width: 1px; } #bnr-nav-wrapper #bnr-nav { position: absolute; right: -470px; } #bnr-nav-wrapper #bnr-nav .bnr-nav-btn { float: left; width: 40px; height: 40px; cursor: pointer; } #bnr-nav-wrapper #bnr-nav #back { background: transparent url(images/btn-bnr-nav-l.png) 0 0 no-repeat; } #bnr-nav-wrapper #bnr-nav #next { background: transparent url(images/btn-bnr-nav-r.png) 0 0 no-repeat; margin-left: 3px; } #bnr-caption { position: relative; width: 1px; margin: 50px auto 0 auto; } #bnr-caption .caption { display: block; position: absolute; left: -478px; width: 360px; } #bnr-caption #firstline { display: block; float: left; color: #fff; font-size: 24px; text-transform: lowercase; } #bnr-caption #firstline em { color: #000; font-weight: bold; } #bnr-caption #secondline { display: block; float: left; color: #c8d6e6; text-decoration: none; font-size: 24px; line-height: 28px; } #bnr-caption #secondline em { color: #3c3d3e; } #bnr-caption #secondline:hover { color: #000; } /* home-content ---------------------------------------------------*/ #home-content { position: relative; width: 960px; margin: 0 auto; } #home-content h2 { display: block; width: 280px; height: 140px; font-size: 24px; text-align: center; text-transform: lowercase; margin: 0 0 20px 0; } #home-content h2 a { display: block; text-decoration: none; width: 280px; height: 45px; padding-top: 95px; } #home-content h2 a:hover { color: #000 !important; text-decoration: underline; } #home-content #dnn_LeftPane h2 { background: transparent url(images/icn-hdr-trading.png) center 0 no-repeat; } #home-content #dnn_ContentPane h2 { background: transparent url(images/icn-hdr-fuels.png) center 0 no-repeat; } #home-content #dnn_RightPane h2 { background: transparent url(images/icn-hdr-sustain.png) center 0 no-repeat; } #home-content #dnn_LeftPane, #home-content #dnn_ContentPane, #home-content #dnn_RightPane { position: relative; float: left; width: 280px; } #home-content #dnn_LeftPane, #home-content #dnn_ContentPane { margin-right: 40px; } #home-content #dnn_LeftPane p, #home-content #dnn_ContentPane p, #home-content #dnn_RightPane p { text-align: center; color: #535353; font-size: 14px; line-height: 24px; } #home-content #dnn_LeftPane p a, #home-content #dnn_ContentPane p a, #home-content #dnn_RightPane p a { color: #666; font-size: 14px; text-decoration: underline; } #home-content #dnn_LeftPane p a:hover, #home-content #dnn_ContentPane p a:hover, #home-content #dnn_RightPane p a:hover { color: #000; text-decoration: underline; } #home-content #dnn_LeftPane p.learn a, #home-content #dnn_ContentPane p.learn a, #home-content #dnn_RightPane p.learn a { text-decoration: none; font-weight: bold; } #home-content #dnn_LeftPane p.learn a:hover, #home-content #dnn_ContentPane p.learn a:hover, #home-content #dnn_RightPane p.learn a:hover { color: #000 !important; text-decoration: underline; } /* footer ---------------------------------------------------*/ #footer { position: relative; width: 960px; margin: 20px auto 50px auto; background: transparent url(images/icn-line-horiz.gif) 0 0 repeat-x; } #footer dt { display: block; float: left; color: #000; font-size: 14px; margin: 15px 10px 0 0; } #footer dd { display: block; float: left; color: #000; background: transparent url(images/icn-pipe-black.gif) right 4px no-repeat; margin: 15px 0 0 10px; } #footer dd.last { background: none; } #footer dd a { display: block; padding-right: 13px; font-size: 14px; color: #000; text-decoration: none; } #footer dd a:hover { text-decoration: underline; } /* sub pages ---------------------------------------------------*/ body#sub { background: #e5e5e5 url(images/bg-sub.png) 0 bottom repeat-x; } #banner { position: relative; width: 100%; height: 150px; margin-top: 1px; } #banner #bnr-caption { position: relative; width: 1px; margin: 0 auto; padding-top: 70px; color: #26303b; } #banner #bnr-caption p { display: block; position: absolute; left: -478px; width: 370px; font-size: 24px; line-height: 25px; color: #26303b; } #sub.blue #header { height: 333px; background: transparent url(images/bg-sub-hdr-blue.png) 0 0 repeat-x; } #sub.green #header { height: 333px; background: transparent url(images/bg-sub-hdr-green.png) 0 0 repeat-x; } #sub.orange #header { height: 333px; background: transparent url(images/bg-sub-hdr-orange.png) 0 0 repeat-x; } #sub.blue, #sub.green, #sub.orange { color: #000 !important; } #sub #content-wrapper { position: relative; width: 960px; margin: 20px auto 0 auto; } #sub #content-wrapper #dnn_LeftPane { position: relative; float: left; width: 174px; margin-right: 15px; } #sub #content-wrapper #dnn_ContentPane { position: relative; float: left; width: 570px; margin-right: 12px; } #sub #content-wrapper #dnn_RightPane { position: relative; float: left; width: 185px; } /* local nav */ .SubSideNav dt, .SubSideNav dd { display: block; width: 174px; height: 37px; background: transparent url(images/icn-line-horiz.gif) 0 bottom repeat-x; } .SubSideNav dt { font-size: 17px; color: #000; text-transform: lowercase; } .SubSideNav dd a { display: block; width: 174px; height: 37px; font-size: 16px; color: #626262; text-decoration: none; background: transparent url(images/icn-arrow-nav-off.png) 0 14px no-repeat; padding: 5px 7px 0 14px; text-transform: lowercase; } .SubSideNav dd a:hover { color: #000 !important; } #sub.blue .SubSideNav dd.selected a{ background: transparent url(images/icn-arrow-nav-blue.png) 0 14px no-repeat; color: #3493d0; } #sub.green .SubSideNav dd.selected a { background: transparent url(images/icn-arrow-nav-green.png) 0 14px no-repeat; color: #769a7c; } #sub.orange .SubSideNav dd.selected a{ background: transparent url(images/icn-arrow-nav-orange.png) 0 14px no-repeat; color: #ed6939; } /* main content and styles */ #sub .content-hdr { position: relative; width: 545px; height: 34px; font-size: 18px; padding: 11px 0 0 25px; } #sub.blue .content-hdr { background: transparent url(images/bg-sub-content-hdr-blue.png) 0 0 no-repeat; color: #fff; } #sub.green .content-hdr { background: transparent url(images/bg-sub-content-hdr-green.png) 0 0 no-repeat; color: #fff; } #sub.orange .content-hdr { background: transparent url(images/bg-sub-content-hdr-orange.png) 0 0 no-repeat; color: #fff; } #sub .content-hdr .Head { border: none;} #sub .content-bdy { position: relative; width: 525px; padding: 15px 15px 25px 20px; background: #fff; -moz-box-shadow: 0px 3px 5px 0px #7b7b7b; -webkit-box-shadow: 0px 3px 5px 0px #7b7b7b; -o-box-shadow: 0px 3px 5px 0px #7b7b7b; -ms-box-shadow: 0px 3px 5px 0px #7b7b7b; box-shadow: 0px 3px 5px 0px #7b7b7b; margin-left: 5px; } #sub.blue .content-bdy strong, #sub.blue .content-bdy h3, #sub.blue .content-bdy h4, #sub.blue .content-bdy h5, #sub.blue .content-bdy h6 { color: #3493d0; } #sub.green .content-bdy strong, #sub.green .content-bdy h3, #sub.green .content-bdy h4, #sub.green .content-bdy h5, #sub.green .content-bdy h6 { color: #769a7c; } #sub.orange .content-bdy strong, #sub.orange .content-bdy h3, #sub.orange .content-bdy h4, #sub.orange .content-bdy h5, #sub.orange .content-bdy h6 { color: #ed6939; } #sub .content-bdy h3 { font-size: 16px; font-weight: bold; } #sub .content-bdy h4 { font-size: 15px; font-weight: bold;} #sub .content-bdy h5 { font-size: 14px; font-weight: bold;} #sub .content-bdy h6 { font-size: 12px; font-weight: bold;} #sub .content-bdy table { margin: 0 0 15px 0; border-collapse: collapse; font-size: 14px; } #sub .content-bdy th { background-color: #c3c3c3; padding: 5px; } #sub .content-bdy td { padding: 5px; background-color: #fff; border-bottom: 1px solid #ccc; } #sub .content-bdy ol, #sub .content-bdy ul { font-size: 14px; margin: 0 0 15px 0; padding-left: 25px; } #sub .content-bdy ol ol, #sub .content-bdy ul ul { font-size: 14px; margin: 0; } #sub .content-bdy ol li, #sub .content-bdy ul li { margin: 0 0 0 18px; } #sub.blue .content-bdy a { color: #246289; } #sub.green .content-bdy a { color: #5f7d63; } #sub.orange .content-bdy a { color: #994723; } #sub .content-bdy a:hover { color: #000; } /* quicklinks */ #sub #dnn_RightPane { padding-top: 40px; } .quicklink-container { width: 185px; margin-bottom: 15px; } .quicklink-container .quicklink-bnr { position: relative; width: 185px; height: 100px; background: transparent url(images/sub-panel-top.png) 0 0 no-repeat; /*padding: 20px 0 0 5px;*/ } .quicklink-container .quicklink-bnr img { margin: 20px 0 0 5px; } .quicklink-container .quicklink-txt { position: relative; width: 156px; padding: 3px 15px 0 15px; color: #000 !important; } .quicklink-container .quicklink-txt h6 { color: #fff !important; font-size: 18px; text-transform: lowercase; } .quicklink-container .quicklink-txt p { color: #000 !important; font-size: 14px; margin: 0 !important; } .quicklink-container .quicklink-txt p a { color: #fff !important; text-decoration: none; font-weight: bold; } .quicklink-container .quicklink-txt p a:hover { color: #000; text-decoration: underline; } .quicklink-container.blue .quicklink-txt { background: transparent url(images/sub-panel-bg-blue.png) 0 bottom no-repeat; } .quicklink-container.green .quicklink-txt { background: transparent url(images/sub-panel-bg-green.png) 0 bottom no-repeat; } .quicklink-container.orange .quicklink-txt { background: transparent url(images/sub-panel-bg-orange.png) 0 bottom no-repeat; } .quicklink-container .quicklink-btm { width: 185px; height: 39px; } .quicklink-container.blue .quicklink-btm.fuel { background: transparent url(images/sub-panel-btm-blue-fuel.png) 0 0 no-repeat; } .quicklink-container.blue .quicklink-btm.team { background: transparent url(images/sub-panel-btm-blue-team.png) 0 0 no-repeat; } .quicklink-container.green .quicklink-btm.fuel { background: transparent url(images/sub-panel-btm-green-fuel.png) 0 0 no-repeat; } .quicklink-container.green .quicklink-btm.team { background: transparent url(images/sub-panel-btm-green-team.png) 0 0 no-repeat; } .quicklink-container.orange .quicklink-btm.fuel { background: transparent url(images/sub-panel-btm-orange-fuel.png) 0 0 no-repeat; } .quicklink-container.orange .quicklink-btm.team { background: transparent url(images/sub-panel-btm-orange-team.png) 0 0 no-repeat; } .Normal, .NormalDisabled, .NormalDeleted { color: #000; font-size: 16px; font-weight: normal; line-height: 22.4px; } .Head { border: none; margin: 0px; }