/* 960.gs reset.css */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
section {display: block;}
/* 960.cs 960_col_24.css */
body{min-width:960px}.container_24{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16,.grid_17,.grid_18,.grid_19,.grid_20,.grid_21,.grid_22,.grid_23,.grid_24{display:inline;float:left;margin-left:5px;margin-right:5px}.push_1,.pull_1,.push_2,.pull_2,.push_3,.pull_3,.push_4,.pull_4,.push_5,.pull_5,.push_6,.pull_6,.push_7,.pull_7,.push_8,.pull_8,.push_9,.pull_9,.push_10,.pull_10,.push_11,.pull_11,.push_12,.pull_12,.push_13,.pull_13,.push_14,.pull_14,.push_15,.pull_15,.push_16,.pull_16,.push_17,.pull_17,.push_18,.pull_18,.push_19,.pull_19,.push_20,.pull_20,.push_21,.pull_21,.push_22,.pull_22,.push_23,.pull_23{position:relative}.alpha{margin-left:0}.omega{margin-right:0}.container_24 .grid_1{width:30px}.container_24 .grid_2{width:70px}.container_24 .grid_3{width:110px}.container_24 .grid_4{width:150px}.container_24 .grid_5{width:190px}.container_24 .grid_6{width:230px}.container_24 .grid_7{width:270px}.container_24 .grid_8{width:310px}.container_24 .grid_9{width:350px}.container_24 .grid_10{width:390px}.container_24 .grid_11{width:430px}.container_24 .grid_12{width:470px}.container_24 .grid_13{width:510px; display: block; clear:left;}.container_24 .grid_13 h1{margin-top:0;}.container_24 .grid_14{width:550px}.container_24 .grid_15{width:590px}.container_24 .grid_16{width:630px}.container_24 .grid_17{width:670px}.container_24 .grid_18{width:710px}.container_24 .grid_19{width:750px}.container_24 .grid_20{width:790px}.container_24 .grid_21{width:830px}.container_24 .grid_22{width:870px}.container_24 .grid_23{width:910px}.container_24 .grid_24{width:950px}.container_24 .prefix_1{padding-left:40px}.container_24 .prefix_2{padding-left:80px}.container_24 .prefix_3{padding-left:120px}.container_24 .prefix_4{padding-left:160px}.container_24 .prefix_5{padding-left:200px}.container_24 .prefix_6{padding-left:240px}.container_24 .prefix_7{padding-left:280px}.container_24 .prefix_8{padding-left:320px}.container_24 .prefix_9{padding-left:360px}.container_24 .prefix_10{padding-left:400px}.container_24 .prefix_11{padding-left:440px}.container_24 .prefix_12{padding-left:480px}.container_24 .prefix_13{padding-left:520px}.container_24 .prefix_14{padding-left:560px}.container_24 .prefix_15{padding-left:600px}.container_24 .prefix_16{padding-left:640px}.container_24 .prefix_17{padding-left:680px}.container_24 .prefix_18{padding-left:720px}.container_24 .prefix_19{padding-left:760px}.container_24 .prefix_20{padding-left:800px}.container_24 .prefix_21{padding-left:840px}.container_24 .prefix_22{padding-left:880px}.container_24 .prefix_23{padding-left:920px}.container_24 .suffix_1{padding-right:40px}.container_24 .suffix_2{padding-right:80px}.container_24 .suffix_3{padding-right:120px}.container_24 .suffix_4{padding-right:160px}.container_24 .suffix_5{padding-right:200px}.container_24 .suffix_6{padding-right:240px}.container_24 .suffix_7{padding-right:280px}.container_24 .suffix_8{padding-right:320px}.container_24 .suffix_9{padding-right:360px}.container_24 .suffix_10{padding-right:400px}.container_24 .suffix_11{padding-right:440px}.container_24 .suffix_12{padding-right:480px}.container_24 .suffix_13{padding-right:520px}.container_24 .suffix_14{padding-right:560px}.container_24 .suffix_15{padding-right:600px}.container_24 .suffix_16{padding-right:640px}.container_24 .suffix_17{padding-right:680px}.container_24 .suffix_18{padding-right:720px}.container_24 .suffix_19{padding-right:760px}.container_24 .suffix_20{padding-right:800px}.container_24 .suffix_21{padding-right:840px}.container_24 .suffix_22{padding-right:880px}.container_24 .suffix_23{padding-right:920px}.container_24 .push_1{left:40px}.container_24 .push_2{left:80px}.container_24 .push_3{left:120px}.container_24 .push_4{left:160px}.container_24 .push_5{left:200px}.container_24 .push_6{left:240px}.container_24 .push_7{left:280px}.container_24 .push_8{left:320px}.container_24 .push_9{left:360px}.container_24 .push_10{left:400px}.container_24 .push_11{left:440px}.container_24 .push_12{left:480px}.container_24 .push_13{left:520px}.container_24 .push_14{left:560px}.container_24 .push_15{left:600px}.container_24 .push_16{left:640px}.container_24 .push_17{left:680px}.container_24 .push_18{left:720px}.container_24 .push_19{left:760px}.container_24 .push_20{left:800px}.container_24 .push_21{left:840px}.container_24 .push_22{left:880px}.container_24 .push_23{left:920px}.container_24 .pull_1{left:-40px}.container_24 .pull_2{left:-80px}.container_24 .pull_3{left:-120px}.container_24 .pull_4{left:-160px}.container_24 .pull_5{left:-200px}.container_24 .pull_6{left:-240px}.container_24 .pull_7{left:-280px}.container_24 .pull_8{left:-320px}.container_24 .pull_9{left:-360px}.container_24 .pull_10{left:-400px}.container_24 .pull_11{left:-440px}.container_24 .pull_12{left:-480px}.container_24 .pull_13{left:-520px}.container_24 .pull_14{left:-560px}.container_24 .pull_15{left:-600px}.container_24 .pull_16{left:-640px}.container_24 .pull_17{left:-680px}.container_24 .pull_18{left:-720px}.container_24 .pull_19{left:-760px}.container_24 .pull_20{left:-800px}.container_24 .pull_21{left:-840px}.container_24 .pull_22{left:-880px}.container_24 .pull_23{left:-920px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:before,.clearfix:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both}.clearfix{zoom:1}
/* Borrowed from Blueprint's forms.css, used to style output from Django's messaging */
.notice,
.success{padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.hide {
display: none;
}
.error {
background: none;
border: none;
}
.notice{background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success{background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a{ color:#f05c2a; /* orange */ }
.notice a{color:#514721;}
.success a{color:#264409;}
/* imported fonts.comc9c9c9 */
.gothic-light { font-family:"Trade Gothic W01 Light"; }
.gothic-bold { font-family:"Trade Gothic W01 Bold 2"; }
.gothic-heavy { font-family:"SackersGothicW01-Heavy"; }
.container_24 {
position: relative; /* used for white band */
}
.right-column {
margin-top: 95px;
}
/*
/// Color Swatch ////////////////////////////////
orange #f05c2a h1, links
off white #f7f7f7 body background
grey #6d6e70 text, link title
#c1c2c3 border
darker grey #616161 intro text
near black #333 h2
#404041 h3, subnav
/////////////////////////////////////////////////
*/
/* test //
h1:before { content:" "; }
h2:before { content:" "; }
h3:before { content:" "; }
h4:before { content:" "; }
h5:before { content:" "; }
h6:before { content:" "; }
/* /test */
.orange { color: #f05c2a; }
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #6d6e70; /* grey */
background: #f7f7f7; /* off white */
}
strong { /* admin bold button */
font-weight: bold;
}
a {
line-height: 16px;
text-decoration: none;
color: #f05c2a; /* orange */
/* font-size: 13px; */ /* removed to allow styles applied by user through tinyMCE to take effect. I'm aware this could be a major change. --DRR110519 */
font-weight: bold;
}
.grid_19 .news .carrot-boxed {
margin-left: 2px;
line-height: 16px;
font-size: 13px;
padding-left: 125px;
padding-right: 25px;
}
.grid_19 .news a span { /* date */
display: inline-block;
width: 77px;
font-size: 11px;
border-right: 2px solid #ccc; /* light grey pipe */
margin: 0 9px 0 -98px;
padding-right: 6px;
}
hr, /* horizontal rule */
.hr { /* .hr class for IE 7 */
clear: both;
border: none;
height: 0;
padding: 0;
margin: 0;
}
p {
line-height: 20px;
margin-bottom: 14px;
}
p.news {
padding-bottom: 10px;
}
h1, h2, h3, h4, h5, h6 {
margin: 20px 0 10px;
}
h1 { /* page title */
margin-top: 37px;
font: normal 24px "Trade Gothic W01 Light";
color: #f05c2a; /* orange */
}
h1.large { /* landing pages */
font-size: 36px;
}
h2 { /* sub title */
margin-top: 30px;
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
color: #404041; /* near black */
line-height: 18px;
}
h3 {
text-transform: uppercase;
color: #404041; /* near black */
font: normal 10px "SackersGothicW01-Heavy";
font-weight: bold;
}
h3.underline { /* section */
margin-top: 50px;
}
.featured h3 {
margin-bottom: -5px;
padding-left: 18px;
}
footer h3 {
margin: 0 0 5px; /* top R+L bottom */
text-transform: none;
font: normal 16px "Trade Gothic W01 Bold 2";
letter-spacing: 0;
}
h3.event { /* region */
font: bold 15px Arial, Helvetica, sans-serif;
text-transform: uppercase;
margin-top: 60px;
}
h4 { /* orange links */
color: #f05c2a; /* orange */
font-size: 14px;
font-weight: normal;
margin: 0 0 10px;
}
h5 {
color: Black;
text-transform: uppercase;
font-size: 11px;
}
.featured h5 { /* home page featured content */
color: #6d6e70; /* grey */
font-weight: normal;
text-transform: uppercase;
font-size: 10px;
margin: 30px 25px 10px 0;
}
h6 {
margin-top: 10px;
}
.section-header { /* h3 */
background: url(static/images/sprites/headers.png) repeat-x; /* grey fade */
padding: 9px 0 3px 15px;
margin-bottom: 25px;
}
.underline { /* section title, news items */
padding-bottom: 4px;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom; /* grey dots */
}
.underline.solid { /* left column header */
background: none;
border-bottom: 1px solid #dcdcdc; /* light grey */
}
.carrot {
display: inline;
margin-top: 10px;
padding-right: 34px;
background: url(static/images/sprites/carrots.png) no-repeat right -100px ; /* orange carrot */
}
.carrot.locked {
padding-top: 1px;
background-position: right -299px;
}
.carrot-boxed {
display: inline-block;
color: #6d6e70; /* grey */
padding: 1px 0 0 23px;
background: url(static/images/sprites/carrots.png) no-repeat left -65px; /* white carrot inside orange box */
}
.carrot-boxed a {
color: inherit;
}
.carrot-boxed:hover {
color: #f05c2a; /* orange */
}
aside { /* right column */
display: block;
margin-top: 60px;
background: url(static/images/backgrounds/dotted-line-vertical.gif) repeat-y; /* grey vertical dots */
}
aside.landing { /* carousel page */
height: 220px;
margin-top: 30px;
padding-left: 10px;
width: 300px !important;
}
aside.landing a {
margin-left: 15px;
}
aside.landing h3 {
margin-bottom: 15px;
}
aside.landing ul {
margin-left: 12px;
font-size: 12px;
}
.landing {
margin-top: 0;
background: none;
}
ul li {
margin-bottom: 10px;
padding-left: 12px;
line-height: 16px;
background: url(static/images/sprites/carrots.png) no-repeat left -540px; /* orange dot */
}
nav h3 { /* left nav column header */
margin-top: 10px;
}
nav li {
background: none;
}
nav li.underline {
padding: 0 0 8px 0;
margin-bottom: 8px;
}
nav li a {
font-size: 12px;
color: #6d6e70; /* grey */
font-weight: normal;
}
nav li ul {
margin-top: 10px;
}
nav li ul li { /* underline */
padding: 6px 0 0;
margin: 0 0 4px 15px;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left top; /* grey dots */
}
nav li ul li a {
font-size: 11px;
}
nav li a:hover,
nav li .selected,
nav li .selected a { /* second level */
color: #f05c2a; /* orange */
}
.specifications {
clear: left;
position: relative;
background: White;
margin: 20px 0;
padding: 20px 20px 25px;
border-radius: 8px;
-moz-border-radius: 8px; /* FireFox */
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
}
.nav-top ul,
.specifications ul {
border-top: 1px solid #c1c2c3; /* grey */
font-size: 11px;
margin-top: 10px;
}
.nav-top li,
.specifications li {
padding: 4px 0;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom; /* grey dots */
}
.specifications li {
margin-bottom: 0;
}
.specifications li span {
display: inline-block;
width: 200px;
vertical-align: top;
}
.specifications li span:first-child {
padding-right: 20px;
}
.nav-top li a {
color: #6D6E70; /* grey */
}
.nav-top li.selected a {
color: #f05c2a; /* orange */
}
nav { /* left navigation column */
display: block;
}
header .nav { /* top nav */
float: right;
margin-right: 5px;
}
.nav li {
position: relative;
display: inline-block;
margin-right: -4px; /* remove empty gap between list items */
}
.nav > li {
background: url(static/images/backgrounds/dotted-line-vertical.gif) repeat-y right 1px; /* grey vertical dots */
}
.last { /* IE 7,8 do not support ":last-child" */
margin-right: 0 !important;
padding-right: 0 !important;
}
header .nav li,
th { /* events header */
color: #404041; /* dark grey */
font: normal 10px "SackersGothicW01-Heavy";
text-transform: uppercase;
}
header .nav > li {
min-width: 55px;
display: inline-block;
padding: 10px 22px;
font-weight: bold;
}
header .nav > li:first-child { text-align: right; } /* allows a flexible minimum width */
header .nav > li:first-child .subnav { text-align: left; }
header .nav > li:first-child .subnav2 { text-align: left; }
header .nav.sign-in {
clear: left;
margin: 8px 18px 0 0;
}
header .nav.sign-in li {
padding: 2px 12px 0 11px;
}
.sign-in li.last {
background: none;
}
.sign-in a {
font: normal 9px "SackersGothicW01-Heavy";
color: #6d6e70; /* grey */
}
header .nav li a:hover,
header .nav li:hover,
header .nav li.active {
color: #f05c2a; /* orange */
}
.subnav { /* top nav fly outs */
z-index: 1;
display: none;
position: absolute;
left: 0;
top: 33px;
padding: 6px 20px 4px; /* top R+L bottom */
margin-left: 2px;
background: #dcdcdc; /* grey */
border-radius: 0 0 8px 8px; /* rounded bottom corners */
-moz-border-radius: 0 0 8px 8px; /* FireFox */
-khtml-border-radius: 0 0 8px 8px;
-webkit-border-radius: 0 0 8px 8px;
}
header .subnav a { /* Products & Services sub nav */
display: block;
padding: 8px 0;
font-size: 13px;
letter-spacing: 0;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
color: #404041; /* near black */
background: url(static/images/backgrounds/dotted-line-white.gif) repeat-x; /* white horizontal dots */
text-transform: none;
}
.subnav2 { /* top nav fly outs */
z-index: 1;
display: none;
position: absolute;
left: 0;
top: 33px;
padding: 6px 20px 4px; /* top R+L bottom */
margin-left: 2px;
background: #dcdcdc; /* grey */
border-radius: 0 0 8px 8px; /* rounded bottom corners */
-moz-border-radius: 0 0 8px 8px; /* FireFox */
-khtml-border-radius: 0 0 8px 8px;
-webkit-border-radius: 0 0 8px 8px;
}
.secondary-nav .subnav2 a { /* Products & Services sub nav */
display: block;
padding: 8px 0;
font-size: 13px;
letter-spacing: 0;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
color: #404041; /* near black */
background: url(static/images/backgrounds/dotted-line-white.gif) repeat-x; /* white horizontal dots */
text-transform: none;
}
/*
header .subnav a:first-child {
background: none;
}
*/
.secondary-nav .subnav2 a:first-child {
background: none;
}
header {
position: relative;
height: 70px;
display: block;
padding: 15px 0 45px;
}
header .nav {
clear: both;
margin-top: 10px;
}
.nav.breadcrumbs {
float: none;
}
.nav.breadcrumbs li {
font-family: Arial, Helvetica, sans-serif;
text-transform: none;
background: none;
font-size: 10px;
color: #929497; /* grey */
padding: 0;
font-weight: normal;
}
.nav.breadcrumbs li span { /* arrow */
color: #929497 !important; /* overide hover */
margin: 0 6px 0 2px;
font-size: 11px;
vertical-align: -1px;
}
.logo { /* "CAPSUGEL" */
position: absolute;
bottom: 47px;
width: 186px;
height: 22px;
}
.search {
float: right;
}
.search input {
float: left;
}
textarea,
input[type="text"],
input[type="password"] {
color: #616161; /* dark grey */
border: 1px solid #ccc; /* light grey */
box-shadow: none;
font-size: 13px;
height: 17px;
width: 175px;
padding: 2px 2px 2px 8px;
margin: 2px 5px 10px 0;
border-radius: 4px; /* rounded corners */
-moz-border-radius: 4px; /* FireFox */
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
}
textarea { /* Color Development Request */
width: 300px;
height: 50px;
}
.search input[type="text"] { /* suggestive text is a lighter color */
color: #999; /* light grey */
}
.library input[type="text"] { /* left nav search */
width: 150px;
}
.filter_inputs {height: 28px; }
input.submit { /* search box carrot */
width: 23px;
height: 27px;
border: none;
cursor: pointer; /* hand */
background: url(static/images/sprites/carrots.png) no-repeat left 2px; /* white carrot in orange box */
padding: 7px; /* needs to match search input for proper alignment -DRR 040505 */
}
form li { /* Color Development Request */
list-style: none outside none;
}
footer {
display: block;
clear: both;
margin-top: 10px;
background: #e8e8e8; /* grey */
}
footer .container_24 {
background: none;
padding: 0;
margin-top: 0;
}
footer h6 {
font-size: 16px;
margin: 0 0 5px;
}
footer div div {
float: left;
margin: 20px 0 10px; /* top R+L bottom */
}
footer div div li {
margin-bottom: 2px;
}
.anchor { /* anchor footer to the fold when page has minimal content */
width: 100%;
position: absolute;
bottom: 0;
}
.h7,
.buttons, /* admin stylesheet "toolbars.css" uses the ".button" class */
.buttons input {
position: relative;
text-align: center;
display: inline-block;
width: auto;
height: 18px;
background: url(static/images/sprites/button.gif) repeat-x;
padding: 4px 12px 0 14px;
font-size: 10px;
font-family: "SackersGothicW01-Heavy";
text-transform: uppercase;
text-shadow: .5px .5px .5px #f1f1f1; /* off white - IE filter looks bad */
color: #f05c2a; /* orange */
cursor: pointer; /* hand */
font-weight: bold;
border: none;
}
.buttons input { /* "Register", "Login" */
background: none;
padding: 0;
margin: -2px 0 0 0;
}
.buttons span { /* end piece */
position: absolute;
top: 0;
right: -1px;
width: 3px;
height: 22px;
display: inline-block;
background: url(static/images/sprites/button.gif) left center;
}
.buttons span:first-child { /* beggining piece */
left: 0;
background-position: left bottom;
}
a.arrowbutton {
text-decoration:none;
background:url(static/images/btn-event-rt.png) no-repeat top right;
float:left; /* prevents the paragraph from stretching across the page */
margin-right:10px;
padding-right: 31px;
}
a.arrowbutton span{
display: block;
padding: 7px 5px 11px 9px;
font-size: 11px;
text-shadow: 0.5px 0.5px 0.5px #F1F1F1;
font-family: "SackersGothicW01-Heavy";
text-decoration:none;
color: #F05C2A;
background:url(static/images/btn-event-lft.png) no-repeat top left;
}
.find {
margin: 23px 0 0 8px;
padding: 25px 5px 0 5px;
width: 220px;
height: 60px;
background: url(static/images/backgrounds/find.png);
}
.find .h7 {
height: 30px;
text-align: left;
background: url(static/images/sprites/carrots.png) no-repeat right 5px;
}
.find .h7 span { /* link text */
display: inline-block;
padding-right: 15px;
width: 170px;
font-size: 12px;
padding-top: 8px;
}
.sign-up {
float: right;
width: 260px;
}
.legal {
clear: both;
display: block;
position: relative;
padding-top: 11px;
height: 18px;
background: #c9c9c9; /* grey */
color: #6d6e70; /* dark grey */
font-size: 11px;
}
.legal p { /* legal */
margin: 0;
line-height: 12px;
}
.legal .nav { /* nav */
margin: -18px 13px 0 0;
float: right;
}
.legal .nav li {
background-image: url("static/images/backgrounds/dotted-line-vertical-dark.gif");
background-position: left top; /* left border */
margin-bottom: 0;
vertical-align: middle;
}
.legal .nav li:first-child {
background: none;
}
.legal .nav a {
display: inline-block;
color: White;
padding: 3px 15px 0 3px;
font-size: 11px;
font-weight: normal;
line-height: 18px;
}
.legal .nav a:hover {
color: #6D6E70; /* dark grey */
}
.wide { /* 485px wide image */
margin-top: 20px;
}
.wide + p { /* first paragraph following the image */
margin-top: 30px;
}
/* --- articles ---------- */
article {
position: relative;
display: block;
margin: 25px 0;
overflow: auto; /* clears float */
}
article img {
float: left;
margin-right: 20px;
}
article p {
padding-left: 120px;
}
.intro {
font-size: 17px;
font-family: "Trade Gothic W01 Light";
line-height: 24px;
margin-top: 25px;
color: #616161; /* darker grey */
}
.intro p {
line-height: 24px;
}
.content-highlight p,
.video-callout p {
padding-left: 230px;
}
.callout {
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom; /* grey dots */
padding-bottom: 10px;
margin-bottom: 15px;
}
.callout h3 {
margin-top: 4px;
}
.callout img {
margin-bottom: 10px;
}
.callout h3 img {
margin-bottom: 0;
}
.callout p {
line-height: 16px;
font-size: 12px;
}
.play { /* video play button container */
position: absolute;
display: block;
top: 30%; /* vertically center */
left: 17%;
width: 60px;
height: 60px;
opacity: .8;
background: #333; /* dark grey */
border-radius: 8px; /* rounded corners */
-moz-border-radius: 8px;
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
}
.play:hover {
opacity: .8;
background-color: #f05c2a; /* orange */
}
a.play { /* carrot */
opacity: 1;
background: url(static/images/sprites/carrots.png) no-repeat 17px -115px; /* large orange carrot */
}
a.play:hover {
opacity: 1;
background-position: 17px -171px; /* large white carrot */
}
/* --- /modules ---------- */
.products-services { /* home page */
overflow: auto; /* clears inner floats */
margin: 62px 0 -30px; /* top R+L bottom */
}
.products-services li {
background: url(static/images/sprites/nav-home.jpg) no-repeat;
float: left;
width: 272px;
padding: 130px 15px 45px;
margin-left: 27.5px;
line-height: 18px;
}
.products-services li:first-child {
margin-left: 0;
}
.products-services li.center {
background-position: center top;
}
.products-services li.last { /* IE does not support ":last-child" */
background-position: right top;
width: 288px;
}
.products-services a { /* home page */
margin: -52px 0 15px -15px;
padding: 6px 0 3px 15px;
width: 287px;
height: 25px;
display: block;
background: url(static/images/backgrounds/header-transparent.png) repeat-x; /* black transparent fade */
}
.products-services h4 { /* home page */
color: White;
font: normal 17px "Trade Gothic W01 Bold 2";
height: 23px;
background: url(static/images/sprites/carrots.png) no-repeat 258px -35px; /* white carrot in orange box */
}
.products-services h4:hover {
color: #f05c2a; /* orange */
}
.tabs-products-services-apps li {
position: relative;
display: inline-block;
padding-left: 0;
margin: 0 0 0 22px;
font-family: 'Trade Gothic W01 Light';
/* background: url("media/plugins/subcontent-applications.png.jpeg") no-repeat top left; */
background: url("static/images/uploads/DFS-tab-unselected.png.html") no-repeat top left;
}
.tabs-products-services-apps li:first-child {
margin-left: 0;
}
.tabs-products-services-apps li a {
text-align: center;
display: inline-block;
padding-top: 6px;
width: 300px;
height: 28px;
/*
background: url(/static/images/sprites/headers.png) repeat-x left -21px;
*/ /* grey fade */
font: normal 17px "Trade Gothic W01 Bold 2";
border-radius: 8px 8px 0 0; /* round top corners */
-moz-border-radius: 8px 8px 0 0; /* FireFox */
-khtml-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
}
.tabs-products-services-apps li a {
color: #6D6E70; /* grey */
}
.tabs-products-services-apps li a:hover {
color: #F05C2A; /* orange */
}
.tabs-products-services-apps li a.active {
color: White; /* orange background */
background-position: left -55px;
}
.subset,
.subsection { /* "Capsules | Equipment" */
z-index: 1;
*z-index: 0;/* does not work in IE7.css style sheet */
float: left;
position: relative;
width: auto;
top: 14px;
left: 360px;
background: url(static/images/backgrounds/dotted-line-vertical.gif) repeat-y 95px top;
/* grey vertical dots */
font-size: 12px;
text-transform: uppercase;
}
.subset a,
.subsection a {
font: normal 14px "SackersGothicW01-Heavy";
text-transform: lowercase;
color: #6d6e70; /* grey */
padding: 0 15px;
}
.subset a:hover,
.subset a.active,
.subsection a:hover,
.subsection a.active {
color: #f05c2a; /* orange */
}
.tabs-products-services-apps li span {
white-space: nowrap;
}
.tabs-products-services-apps li span a {
padding-top: 2px;
height: 16px;
font-size: 10px;
margin: 0 6px 0 14px;
color: #6d6e70; /* grey */
width: auto;
background: none;
font-family: "SackersGothicW01-Heavy";
font-weight: normal;
}
.tabs-products-services-apps li span a:hover,
.tabs-products-services-apps li span a.active {
color: #f05c2a; /* orange */
}
.products-services-apps { /* UL nav */
display: none;
background: White;
position: relative;
white-space: nowrap; /* need for Safari */
padding: 25px 60px 0; /* make space for previous and next buttons */
height: 227px;
text-align: center;
}
.products-services-apps.active { /* do not include sub menu "Equipment" in carousel jQuery calculations */
display: block;
margin-left: 1000px; /* slide in on page load */
}
.products-services-apps li {
display: none; /* jQuery displays current set */
position: relative;
vertical-align: top;
background: none;
width: 129px;
height: 200px;
margin: 0 4px;
padding: 20px 0 0 0;
cursor: pointer;
}
.products-services-apps li:first-child {
margin-left: 0;
}
.flyout { /* fly out */
z-index: 1;
text-align: left;
display: none;
position: absolute;
bottom: 215px;
left: -60px;
padding: 10px 10px 10px 15px;
width: 225px;
min-height: 50px;
background: #dcdcdc; /* light grey */
line-height: 18px;
color: #404041;
font-weight: normal;
border-radius: 8px 8px 0 0; /* round top corners */
-moz-border-radius: 8px 8px 0 0; /* FireFox */
-khtml-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
white-space: normal;
}
.solutions .flyout { /* home page */
width: 465px;
padding-right: 25px;
height: 115px;
left: 5px;
top: -146px;
opacity: 1;
}
.solutions .flyout h2 { /* "Dosage Form Development" */
margin: -11px 0 10px -15px;
padding: 6px 0 6px 15px;
font: normal 17px "Trade Gothic W01 Bold 2";
width: 490px;
height: 22px;
color: White;
background: #c5496c url(static/images/sprites/headers.png) left -89px; /* red fade */
border-radius: 8px 8px 0 0; /* round top corners */
-moz-border-radius: 8px 8px 0 0; /* FireFox */
-khtml-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
}
.solutions .second .flyout h2 { background-color: #729423; background-position: left -123px; } /* green fade */
.solutions .third .flyout h2 { background-color: #dd8f0d; background-position: left -157px; } /* orange fade */
.solutions .fourth .flyout h2 { background-color: #991184; background-position: left -191px; } /* purple fade */
.solutions .last .flyout h2 { background-color: #0485b0; background-position: left -225px; } /* blue fade - ":last-child" is not suported by IE7,8 */
.pointer { /* grey down arrow */
border-color: #DCDCDC transparent; /* grey pointer on transparent background */
border-style: solid solid none; /* pointer direction */
border-width: 13px 8px; /* height, width */
bottom: -12px; /* height */
left: 115px;
position: absolute;
display: block;
}
.solutions .pointer { /* small grey down arrow */
border-color: #9C9DA0 transparent; /* grey */
border-width: 10px 6px;
bottom: -10px;
left: 36px;
}
.pointer-up { /* grey up arrow */
border-color: #DCDCDC transparent; /* grey */
border-style: none solid solid; /* pointer direction */
border-width: 9px 5px; /* height, width */
left: 35px;
position: absolute;
top: -9px;
}
.pointer-down { /* grey up arrow */
border-color: #DCDCDC transparent; /* grey */
border-style: solid solid none; /* pointer direction */
border-width: 13px 8px; /* height, width */
left: 35px;
position: absolute;
top: 0px;
}
.products-services-apps p {
margin-top: 4px;
line-height: 17px;
font-weight: normal;
}
.products-services-apps li a {
white-space: normal;
color: #666; /* grey */
font-size: 12px;
}
.products-services-apps li:hover a {
color: #f05c2a; /* orange */
}
.frame { /* transparent image boreder */
display: none;
position: absolute;
top: 20px;
left: 5px;
width: 118px;
height: 118px;
background: url(static/images/sprites/frame.png);
}
.frame.dark { /* used on services images */
background-position: left bottom;
}
.products-services-apps li:hover .frame { /* transparent border shadow */
display: block;
}
.products-services-apps li:hover .flyout {
/*display: block; /* use jQuery fade */
}
.white-band { /* spans entire width of screen */
display: none;
background: White;
height: 260px;
position: absolute;
top: 426px; /* align with carousel - also set onload with jQuery */
width: 100%;
z-index: -1; /* place under all other content */
background: White url(static/images/backgrounds/shadow-bottom.png) repeat-x left bottom;
}
.paginator { /* news */
float: right;
margin: -30px 0 20px;
font-size: 11px;
}
.paginator a { /* previous next arrows */
margin: 0 1px;
vertical-align: -1px;
}
.lib-paginator { /* library */
float: right;
margin: 0px 0 20px;
font-size: 11px;
}
.lib-paginator a { /* previous next arrows */
margin: 0 1px;
vertical-align: -1px;
}
.bottom.paginator {
clear: both;
margin: 30px 0 75px;
}
.pagination { /* used with carousel */
background: White;
position: absolute;
width: 60px;
height: 250px;
z-index: 1; /* place on top of items */
}
.pagination.previous {
left: -4px;
}
.pagination.next {
right: 0;
}
.pagination a { /* carousel arrows */
display: block;
position: relative;
top: 85px;
left: 10px;
width: 25px;
height: 52px;
background: url(static/images/sprites/pagination.gif); /* previous arrow */
}
.pagination.next a {
opacity: 0; /* fade in on initial page load */
}
.pagination.previous a { /* do not show previous button on page load */
display: none;
}
.pagination a:hover { background-position: right top; } /* previous */
.pagination.next a { background-position: left bottom; left: 25px; }
.pagination.next a:hover { background-position: right bottom; }
.endless_page_current {
vertical-align: -1px;
font-size: 14px;
}
.endless_separator { /* "..." */
color: #F05C2A; /* orange */
vertical-align: -1px;
margin: 0 -2px;
}
.resources { /* home page */
width: 300px;
float: left;
background: none;
margin: 0;
}
.resources .callout {
background: none;
padding-right: 15px;
}
.icon { /* resource & registration */
float: left;
width: 82px;
margin-right: 15px;
text-align: center;
}
.registration .callout {
clear: left;
margin: 35px 0 10px;
height: 80px;
background: none;
}
.registration .callout.first {
height: 45px;
}
.registration ul {
margin: 20px 0 15px;
}
.registration li {
background: none;
line-height: 5px;
margin-bottom: 0;
padding-left: 0;
}
.registration input[type="checkbox"] {
float: left;
margin-right: 8px;
}
.resources p {
margin: 0 15px;
}
.resources .callout p {
margin: 0 0 5px 95px;
}
.resources a {
margin-top: 0;
}
.home-background { /* extend home page background outside of content */
width: 100px;
height: 500px;
background: blue;
position: absolute;
right: -100px;
top: 0;
background: url(static/images/backgrounds/background.jpg) no-repeat -460px top; /* bottle of pills */
}
h1.home {
font-size: 37px;
width: 460px;
margin-bottom: 35px;
}
h1.home span {
display: block;
color: #57585b; /* dark grey */
}
.featured { /* home page */
width: 630px;
padding: 0 0 0 25px;
float: left;
}
.featured a {
margin-top: 0;
}
.featured .image {
display: block;
float: left;
height: 100px;
margin-right: 15px;
position: relative;
}
.featured .image img { /* set height and width for rounded corners */
width: 168px;
height: 100px;
margin: 0;
}
.featured p.image {
width: 360px;
padding: 0;
}
.featured article {
margin: 0 0 0 20px;
}
.featured article p {
margin: 0;
padding: 0 60px 0 0;
}
.solutions { /* home page nav */
margin-left: -7px;
position: relative;
}
.solutions li {
position: static; /* negates relative */
vertical-align: top;
text-align: center;
padding: 0;
background: url(static/images/sprites/solutions.png) no-repeat;
}
.solutions li.second { background-position: -92px top; }
.solutions li.third { background-position: -186px top; }
.solutions li.fourth { background-position: -280px top; }
.solutions li.last { background-position: -377px top; /* ":last-child" is not suported by IE7,8 */
margin-left: 1px;
}
.solutions li:hover { background-position: -473px top; } /* "Dosage Form Development" */
.solutions li.second:hover { background-position: -565px top; } /* "Formulation Support" */
.solutions li.third:hover { background-position: -659px top; } /* "Preclinical" */
.solutions li.fourth:hover { background-position: -754px top; } /* "Support Services" */
.solutions li.last:hover { background-position: -849px top; } /* "Building Your Brand" */
.solutions li a,
.solutions li p {
text-align: center;
width: 80px;
height: 60px;
padding: 0 10px;
font-size: 13px;
font-weight: normal;
line-height: 16px;
color: #616161; /* darker grey */
width: 84px;
padding: 83px 0 0;
display: inline-block;
}
.solutions li:first-child a { /* "Dosage Form" */
margin-left: -2px;
}
.solutions .second .pointer { left: 120px; }
.solutions .third .pointer { left: 210px; }
.solutions .fourth .pointer { left: 285px; }
.solutions .last .pointer { left: 394px; }
/* rounded corners for IE 7,8 */
.rounded-corner {
display: inline-block;
width: 8px;
height: 8px;
position: absolute;
background-image: url(static/images/sprites/rounded-corners.gif);
}
.subnav .rounded-corner { background-image: url(static/images/sprites/rounded-corners-transparent.gif); } /* transparent background */
.subnav2 .rounded-corner { background-image: url(static/images/sprites/rounded-corners-transparent.gif); } /* transparent background */
.top { top: 0; }
.left { left: 0; }
.bottom { bottom: 0; background-position: left bottom; }
.searchbottom {position: relative; margin-top: 50px}
.right { right: 0; background-position: right top; }
.right.bottom { right: 0; background-position: right bottom; }
.subnav .bottom { bottom:-8px; } /* used on top nav for IE */
.subnav2 .bottom { bottom:-8px; } /* used on language dropdown for IE */
.middle { left: 8px; background: #DCDCDC; width: 94%; margin-left: -3px; } /* grey */
.subnav2middle { left: 8px; background: #DCDCDD; width: 90%; margin-left: 0px; } /* grey */
.filter .top { top: 1px;} /* IE 7 */
.filter .left{ left: -1px;} /* IE 7 */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.events {
float: right;
}
.events_table td h4 {
line-height: 16px;
text-decoration: none;
color: #6D6E70; /* usual body dk gray */
font-size: 13px;
font-weight: bold;
}
table {
margin-top: 15px;
}
.column-4 table {
margin-top: 5px;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom;
}
.specifications.column-4 {
width: 445px;
padding: 20px;
}
.specifications.column-4 h3 {
margin: 0 0 10px 0;
}
th {
text-align: left;
width: 135px;
padding-bottom: 5px;
border-bottom: 1px solid #c1c2c3; /* grey */
}
.column-4 th {
padding-top: 4px;
border-top: 1px solid #C1C2C3;
border-bottom: none;
padding-left: 10px;
}
.column-4 tr {
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom;
}
.column-4 td {
width: 25%;
font-size: 11px;
background: none;
padding-left: 10px;
line-height: 13px;
}
th:first-child, /* incase there is no content */
td:first-child {
width: 475px;
padding-left: 5px;
text-align: left;
}
.column-4 th,
.column-4 td:first-child {
color: #404041; /* near black */
font: bold 11px Arial, Helvetica, sans-serif;
text-transform: none;
}
.column-4 tr.solid {
border: 1px solid #C1C2C3;
border-left : none;
border-right: none;
background : none;
}
.column-4 tr.no-border { /* row above solid bordered row */
background: none;
}
tr:first-child td {
padding-top: 4px;
}
td {
font-size: 12px;
padding: 10px 0;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom; /* grey dots */
}
tr.solid td {
background: none;
border-top: 1px solid #C1C2C3;
}
td h4 {
margin-bottom: 3px;
}
td p {
margin: 15px 15px 10px 0;
line-height: 16px;
}
.date { /* events table */
display: block;
margin-bottom: 3px;
}
.published { /* news item */
font-size: 11px;
color: #b8b8b8; /* light grey */
margin-bottom: 25px;
}
input,
select {
margin-bottom: 12px;
}
form .buttons { /* "Register" */
margin: 40px 0 0 150px;
}
.filter .buttons { /* library filter */
margin: 10px 15px 0 15px;
}
.filter input,
.filter select {
margin-bottom: 0;
}
#id_q { /* search box */
margin: 2px 5px 0 0;
width: 144px;
}
.list form,
.browse form {
margin-bottom: 50px; /* need when no results returned */
}
label { /* registration */
display: inline-block;
width: auto;
}
.registration form {
margin-top: 30px;
}
.registration label {
width: 375px;
}
label span span { /* required arrow */
display: inline-block;
border-color: transparent #f05c2a; /* orange pointer on transparent background */
border-style: solid solid solid none; /* pointer direction */
border-width: 5px; /* size */
margin: 0 2px;
}
.required { /* validation message */
visibility: hidden;
float: right;
}
.error .required {
visibility: visible;
}
label .valid {
background: url(static/images/check.png) no-repeat right top; /* green check mark */
}
.in-valid .required {
display: block;
}
.registration label input,
.registration label select {
float: right;
margin: -5px 5px 20px 0;
}
.events label,
.events select {
width: auto;
}
.events label {
margin-right: 2px;
vertical-align: middle;
}
.required,
label span { /* required asterisk */
color: #f05c2a; /* orange */
}
/* Library Knowledge Center */
article.resource {
margin: 0;
padding: 15px 0 10px 3px;
}
.resource .first {
margin: 0;
}
.resource .image_wrapper,
.resource img { /* list view */
display: none;
}
.resource h2 {
margin: 0;
font-size: 13px;
}
article.resource p {
padding-left: 0;
}
.resource .published {
margin: 0 0 -2px; /* top R+L bottom */
}
.list,
.browse { /* wraps library */
float: left;
}
nav .list,
nav .browse { /* wraps library filter */
float: none;
}
.filter { /* Library */
position: relative;
padding: 15px 20px 25px; /* top R+L bottom */
margin-bottom: 15px;
background: White;
border-radius: 8px; /* round corners */
-moz-border-radius: 8px; /* FireFox */
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
}
.filter ul { /* radio buttons and checkboxes */
margin: 0 0 -8px 4px; /* neutralize last list item and indent */
}
.filter li {
margin-bottom: 8px;
}
.mode {
margin-top: 43px; /* align with */
text-align: center;
}
.mode a {
background: url(static/images/sprites/display-mode.gif) no-repeat 4px top;
display: inline-block;
width: 75px;
padding-top: 70px;
font-size: 11px;
font-weight: normal;
color: #6d6e70; /* grey */
}
.mode a:hover {
color: #f05c2a; /* orange */
}
.list .list,
.browse .browse { /* active */
font-weight: bold;
color: #f05c2a; /* orange */
background-position: -75px top;
}
.mode .list {
margin-left: 0;
}
a.browse { background-position: -155px top; margin-right: -5px; } /* balance left margin to center */
.browse .browse { background-position: -233px top; } /* active */
.filter h4 {
float: left;
margin: 0 0 15px; /* top R+L bottom */
}
.filter label {
display: inline;
margin-left: -15px;
}
input[type='radio'],
input[type='checkbox'] {
margin: 0 5px 0 0;
padding: 0;
}
select {
width: 188px;
height: 22px;
padding-top: 1px;
}
.filter hr {
margin: 18px 0 12px; /* top R+L bottom */
}
.browse .resource {
float: left;
width: 428px;
}
.browse .resource.article-1 {
width: auto;
float: none;
}
.browse .resource.browse.article-4 {
margin-top: -150px; /* use jQuery to get article-2 height */
}
.browse .resource.article-4,
.browse .resource.article-6 {
float: right;
width: 200px;
padding: 0 0 0 20px;
background: url(static/images/backgrounds/dotted-line-vertical.gif) repeat-y; /* grey vertical dots */
}
.browse .resource.article-6 {
position: absolute;
right: 15px;
}
.browse .resource p {
padding: 0;
margin: 0;
}
.browse .resource .image_wrapper,
.browse .resource img { /* browse view */
display: block;
margin: 5px 25px 10px 0;
float: left;
width: 160px;
height: 115px;
}
.browse .article-1 .image_wrapper,
.browse .article-1 img { /* featured article */
width: 230px;
height: 165px;
}
.browse .article-3 .image_wrapper,
.browse .article-3 img {
float: right;
margin-right: 0;
margin-left: 20px;
}
.article-4 .image_wrapper,
.article-6 .image_wrapper,
.article-4 img,
.article-6 img {
float: none;
}
.article-4 .image_wrapper,
.article-4 img {
margin-top: 2px;
}
.article-6 .image_wrapper,
.article-6 img {
margin-top: 7px;
}
.browse .resource div.dotted-bottom {
padding-left: 180px;
line-height: 20px;
font-size: 13px;
}
.article-1 div.dotted-bottom {
padding-left: 0;
}
.browse .article-3 div.dotted-bottom {
padding-left: 0;
padding-right: 180px;
}
.browse .article-4 div.dotted-bottom,
.browse .article-6 div.dotted-bottom {
padding: 0 0 22px 0;
background: url(static/images/backgrounds/dotted-line.gif) repeat-x left bottom; /* grey dots */
}
.browse .article-6 div.dotted-bottom {
margin: 0;
padding: 0;
background: none;
}
select {
color: #404041; /* near black */
border: 1px solid #CCC; /* grey */
padding: 2px;
border-radius: 4px; /* round corners */
-moz-border-radius: 4px; /* FireFox */
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
}
.login {
position: relative;
float: right;
padding: 3px 8px 5px 11px;
background: #e3e3e3; /* grey */
border-radius: 8px; /* round corners */
-moz-border-radius: 8px; /* FireFox */
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
}
.login a {
font-weight: normal;
}
ul ul { /* nested list items */
margin: 10px 0 15px 2px;
}
.search-results { /* search results */
display: block;
clear: left; /* clears header */
}
.search-results .intro {
margin: -5px 0 30px;
}
.search-results hr {
clear: left;
}
.search-results .search {
float: left;
width: 217px;
margin-bottom: 30px;
}
.search-results .submit {
float: right;
}
.search-results p {
margin: 4px 0;
}
.search-results h2,
.search-results a{
display: block;
padding: 8px 0 10px 36px;
color: #6d6e70; /* grey */
background: url(static/images/sprites/carrots.png) no-repeat left -337px !important; /* over rule .carrot class */
}
.search-results .paginator a {
display: inline;
padding: 0;
background: none !important;
color: #f05c2a; /* orange */
}
.search-results a:hover {
color: #f05c2a; /* orange */
}
.search-results a.news {
background-position: left -378px !important; /* news icon */
}
.search-results a {
background-position: left -338px !important; /* caret icon */
}
.search-results .pdflink a {
background-position: left -429px !important; /* pdf icon */
}
.search-results h2,
.search-results a.locked {
background-position: left -491px !important; /* lock icon */
}
.search-results article {
padding-left: 0 !important;
margin-bottom: 4px;
}
.search-results article.resource { /* PDF */
padding-top: 2px;
}
.search-results article.resource p {
padding-left: 36px;
margin-top: -4px;
}
.pdflink a,
.knowledge_center .resource a{
display: block;
}
.knowledge_center .resource a {
padding: 8px 0 10px 0px;
}
.pdflink a,
.knowledge_center .resource.pdflink a{
padding: 8px 0 10px 36px;
background: url(static/images/sprites/carrots.png) no-repeat left -430px;
}
.browse .pdflink a,
.knowledge_center .browse .resource a{
display: block;
padding: 8px 0 10px 0px;
background: none;
}
section.login.popup {
left: 270px;
width: 340px;
}
section.login form {
margin-top: 25px;
}
section.login input[type="text"],
section.login input[type="password"] {
margin: 0 0 15px 5px;
}
section.login input[type="password"] {
margin-left: 8px;
}
section.login label span { /* do not show required asterisk */
display: none;
}
.login .buttons {
margin: 5px 0 45px 72px;
}
.lightbox {
z-index: 2;
display: none;
position: absolute;
top: 0;
left: 0;
height: 100%;
background: Black; /* dark grey */
opacity: 0.5;
}
.popup.login,
.popup.video {
z-index: 3;
display: none;
width: auto;
padding: 35px 50px;
background: #f7f7f7;
border: 3px solid #999; /* grey */
position: absolute;
top: 220px;
left: 180px;
border-radius: 8px;
-moz-border-radius: 8px; /* FireFox */
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
}
.popup.video {
background: Black;
padding: 10px;
}
.popup h4 {
margin-bottom: 25px;
}
.popup.login .top,
.popup.login .middle { /* IE7,8 rounded corners */
top: -6px;
}
.popup.login .bottom,
.popup.login .middle .bottom { /* IE7,8 rounded corners */
top: auto;
bottom: -6px;
}
.popup.login .middle { /* IE 7,8 */
background: #f7f7f7; /* body background */
width: 430px;
}
.popup .rounded-corner { background-image: url(static/images/sprites/rounded-corners-popup.gif); }
.close { /* "X" */
color: #ccc; /* grey */
font-size: 24px;
position: absolute;
right: 15px;
top: 10px;
text-shadow: 0 1px 0 #6D6E70; /* darker grey outline for fancy 3-D effect - IE uses a filter */
cursor: pointer;
}
.video .close {
font-weight: bold;
font-size: 16px;
background: Black;
right: -15px;
top: -16px;
padding: 2px 5px;
border: 3px solid #999; /* grey */
border-radius: 16px;
-moz-border-radius: 16px; /* FireFox */
-khtml-border-radius: 16px;
-webkit-border-radius: 16px;
}
.close:hover {
text-shadow: 0 1px 0 #f05c2a; /* orange */
/* color: #f05c2a; /* orange */
}
#color-selector-container { /* same size as flash object, wrapped around it to stop page appearing to jump if swfobject is too slow. Increased height 200px on 110525 as something seemed to have gone missing, leaving the container sitting above the flash file. */
width: 910px;
height: 625px;
}
#color-selector { /* flash object */
margin: 50px 0 20px;
}
.color-selector { /* legal text */
padding: 0 50px 0 0;
width: 910px;
height: 420px;
}
.content ul {
margin-bottom: 18px;
}
.capsules { /* stock color capsule container */
margin-top: 45px;
}
.capsule {
position: relative;
float: left;
padding-bottom: 10px;
margin: 0 1px 20px 0;
cursor: pointer; /* hand */
}
.capsule .flyout { /* capsule colors */
width: 100px;
left: -19px;
bottom: 107px;
font-size: 11px;
background: transparent; /* goes on top opaque flyout */
color: white;
opacity: 1;
line-height: 16px;
}
.capsule .flyout.opaque { /* flyout background layer */
opacity: 0.90;
height: 260px; /* rezise to content height with jQuery */
background: #9c9da0; /* light grey */
}
.capsule .flyout .pointer {
left: 54px;
opacity: 0.90; /* match opaque flyout div */
bottom: -13px;
}
.capsule .name {
font: normal 16px "Trade Gothic W01 Bold 2";
}
.capsule .number {
color: #404040;
font-size: 12px;
padding-top: 3px;
}
.capsule hr {
margin: 5px 0 9px;
}
.capsule .underline {
background-image: url(static/images/backgrounds/dotted-line-white.gif);
}
.specifications .flyout span {
display: block;
}
.more { /* learn more - color selector tool */
display: none;
}
p.resource {
margin-bottom: 5px;
}
.ie6 .container_24 { /* create space for the theie6countdown.com banner */
padding-top:50px;
}
/* MAP STYLES */
.map-layers {
height:285px;
margin: 14px 0px;
position: relative;
width: 485px;
}
.map-layers img.wide {
left:0px;
margin:0px;
position: absolute;
top:0px;
z-index: 0;
}
.map-location {
background: url(static/images/background-map-location.png) repeat;
z-index: 1;
}
.map-layers .flyout {
background: #e4e4e4;
bottom: 36px;
box-shadow: #777 0px 4px 10px;
color:#585959;
line-height: 18px;
left:-38px;
opacity: 100;
width:340px;
-moz-box-shadow: #777 0px 4px 10px;
-weblit-box-shadow: #777 0px 4px 10px;
}
.map-layers .map-right .flyout {
left: auto;
right:-35px;
}
.map-location .flyout .pointer {
background: url(static/images/trim-pointer.png) 34px 0px no-repeat;
border:none;
bottom: -14px;
height:15px;
left:0px;
width: 100%;
}
.map-layers .map-right .flyout .pointer {
background: url(static/images/trim-pointer.png) 340px 0px no-repeat;
}
.map-location:hover .flyout {
}
.map-location .flyout .left-col,
.map-location .flyout .right-col {
float:left;
width:230px;
}
.map-location .flyout .right-col {
margin-left:20px;
}
.map-location .flyout h3 {
color: #585959;
font-family: Arial,Helvetica,sans-serif;
font-size: 15px;
margin:0px 0px 6px 0px;
text-transform: none;
}
.map-location .flyout h2 {
background: #F05B29;
border-radius: 8px 8px 0 0;
color:#fff;
font-size:19px;
margin: -11px 0px 10px -15px;
padding:10px 10px 10px 15px;
width:100%;
-moz-border-radius: 8px 8px 0 0;
-khtml-border-radius: 8px 8px 0 0;
-webkit-border-radius: 8px 8px 0 0;
}
.map-location .flyout a {
color:#585959;
font-weight: normal;
text-decoration: underline;
}
.map-location .flyout p {
margin-bottom: 0px;
}
.map-location {
cursor: pointer;
height:26px;
position: absolute;
width:14px;
}
#puebla-mx {
height:26px;
left:29px;
position: absolute;
top:198px;
width: 44px;
}
#puebla-mx .flyout {
width: 480px;
}
#bend-or {
left:10px;
position: absolute;
top:31px;
width:36px;
}
#greenwood-sc {
height: 24px;
left:60px;
position: absolute;
top:175px;
width: 70px;
}
#greenwood-sc .flyout {
width: 310px;
}
#morristown-nj {
left:22px;
position: absolute;
top:5px;
width:56px;
}
#quakertown-pa {
left:15px;
position: absolute;
top:56px;
width:56px;
}
#Tampa-fl {
bottom:110px;
left:94px;
position: absolute;
width:56px;
}
#boston-ma {
left:90px;
position: absolute;
top:4px;
width:70px;
}
#strasbourg-fr {
left:234px;
position: absolute;
top:134px;
width: 62px;
height: 62px;
}
#strasbourg-fr .flyout {
width: 490px;
bottom: 72px;
left: -200px;
}
#strasbourg-fr .flyout .pointer {
background: url(static/images/trim-pointer.png) 200px 0px no-repeat;
}
#bornem-bel {
left:216px;
position: absolute;
top:6px;
width: 50px;
}
#livingston-sc {
left:126px;
position: absolute;
top:35px;
width: 60px;
}
/*#colmar-fr {
left:233px;
position: absolute;
top:168px;
width: 0px;
}
*/
#ploermel-fr {
bottom: 57px;
left:192px;
position: absolute;
width: 49px;
}
#sagamihara-jp {
position: absolute;
right:33px;
top:22px;
width:70px;
}
.map-layers #sagamihara-jp .flyout .pointer {
background: url(static/images/trim-pointer.png) 251px 0px no-repeat;
}
#bangkok-tl {
bottom:84px;
position: absolute;
right:116px;
width:50px;
}
.map-layers #bangkok-tl .flyout .pointer {
background: url(static/images/trim-pointer.png) 303px 0px no-repeat;
}
#bangkok-tl .flyout {
width: 372px;
}
#bangkok-tl p + p {
margin-top: 10px;
}
#delhi-in {
position: absolute;
right:138px;
top:62px;
width: 30px;
}
.map-layers #delhi-in .flyout .pointer {
background: url(static/images/trim-pointer.png) 291px 0px no-repeat;
}
#mumbai-in {
bottom: 59px;
left:261px;
position: absolute;
width: 49px;
}
.map-layers #mumbai-in .flyout .pointer {
background: url(static/images/trim-pointer.png) 275px 0px no-repeat;
}
#moscow-rs {
top: 5px;
left: 274px;
position: absolute;
width: 55px;
}
.map-layers #moscor-rs .flyout .pointer {
background: url(static/images/trim-pointer.png) 275px 0px no-repeat;
}
#beirut-lb {
top: 95px;
left: 287px;
position: absolute;
width: 49px;
}
.map-layers #beirut-lb .flyout .pointer {
background: url(static/images/trim-pointer.png) 275px 0px no-repeat;
}
#jakarta-id {
bottom:44px;
position: absolute;
right:115px;
width: 46px;
}
.map-layers #jakarta-id .flyout .pointer {
background: url(static/images/trim-pointer.png) 278px 0px no-repeat;
}
#suzhou-ch {
position: absolute;
right:71px;
top:62px;
width:44px;
}
.map-layers #suzhou-ch .flyout .pointer {
background: url(static/images/trim-pointer.png) 277px 0px no-repeat;
}
#rio-br {
bottom:139px;
left:106px;
position: absolute;
width:82px;
}
#rio-br .flyout {
width:230px;
}
#hongkong-ch {
right:75px;
position: absolute;
top:107px;
width: 62px;
}
.map-layers #hongkong-ch .flyout .pointer {
background: url(static/images/trim-pointer.png) 259px 0px no-repeat;
}
#westryde-au {
bottom:35px;
right:7px;
position: absolute;
width: 64px;
}
.map-layers #westryde-au .flyout .pointer {
background: url(static/images/trim-pointer.png) 273px 0px no-repeat;
}
/* FORM STYLES */
.form-notes {
margin-bottom: 30px;
}
form.contact-us-form > div {
margin-bottom: 6px;
position: relative;
background-position: 450px 5px !important;
}
form.contact-us-form .required {
position: absolute;
top: 3px;
right: -30px;
}
form.contact-us-form .required span {
display: inline-block;
border-color: transparent #F05C2A;
border-style: solid solid solid none;
border-width: 5px;
margin: 0 2px;
}
form.contact-us-form div label {
float: left;
width:240px;
}
form.contact-us-form div.file label {
width: 270px;
}
.form-notes em,
form.contact-us-form label em,
form.contact-us-form input[type="submit"] {
color:#F05C2A;
}
form.contact-us-form textarea {
width:418px;
height: 100px;
min-height: 100px;
}
/*form.contact-us-form input[type="submit"] {
background-image:-moz-linear-gradient(50% 0% -90deg,rgb(255,255,255) 0%,rgb(255,255,255) 14%,rgb(201,202,202) 100%);
background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(255,255,255)),color-stop(0.14, rgb(255,255,255)),color-stop(1, rgb(201,202,202)));
background-image:-webkit-linear-gradient(-90deg,rgb(255,255,255) 0%,rgb(255,255,255) 14%,rgb(201,202,202) 100%);
background-image:-o-linear-gradient(-90deg,rgb(255,255,255) 0%,rgb(255,255,255) 14%,rgb(201,202,202) 100%);
background-image:-ms-linear-gradient(-90deg,rgb(255,255,255) 0%,rgb(255,255,255) 14%,rgb(201,202,202) 100%);
background-image:linear-gradient(-90deg,rgb(255,255,255) 0%,rgb(255,255,255) 14%,rgb(201,202,202) 100%);
-moz-box-shadow:0px 0px 1px rgba(137,137,137, .76);
-webkit-box-shadow:0px 0px 1px rgba(137,137,137, .76);
box-shadow:0px 0px 1px rgba(137,137,137, .76);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffc9caca,GradientType=0)
progid:DXImageTransform.Microsoft.dropshadow(OffX=1,OffY=1,Color=#ff898989,Positive=true)";
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff,endColorstr=#ffc9caca,GradientType=0)
progid:DXImageTransform.Microsoft.dropshadow(OffX=1,OffY=1,Color=#ff898989,Positive=true);
border-radius: 4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: bold;
padding: 6px 14px;
cursor: pointer;
}*/
form.contact-us-form .button-set {
margin-top: 20px;
text-align: center;
}
form.contact-us-form .error_msg {
color: #F05C2A;
display: block;
margin: 10px 0px 0px 0px;
text-align: left;
}
form.contact-us-form div.form-field .error_msg {
margin: -10px 0px 10px 242px;
}
#recaptcha_widget_div {
color:#F05C2A;
margin-bottom: 10px;
}
form.contact-us-form #recaptcha_widget_div .error_msg {
margin: 0px;
}
.ht5ifv-show-valid{
background:url(static/images/icons_check.png) no-repeat 434px 3px;
}
.ht5ifv-show-invalid{
background:url(static/images/icons_x.png) no-repeat 434px 5px;
}
.solutions li {
position:relative;
}
.solutions li:hover {
background-position: -525px top;
}
.solutions li.second {
background-position: -84px 0px;
}
.solutions li.second:hover {
background-position: -612px 0px;
}
.solutions li.second .flyout {
left: -78px;
}
.solutions li.third {
background-position: -173px 0px;
}
.solutions li.third:hover {
background-position: -700px 0px;
}
.solutions li.third .flyout {
left: -165px;
}
.solutions li.fourth {
background-position: -261px 0px;
padding-left: 3px;
}
.solutions li.fourth:hover {
background-position: -788px 0px;
}
.solutions li.fourth .flyout {
left: -245px;
}
.solutions li.fifth {
background-position: -349px 0px;
padding-left: 3px;
}
.solutions li.fifth:hover {
background-position: -876px 0px;
}
.solutions li.fifth .flyout {
left:auto;
right:-85px;
}
.solutions li.fifth .flyout h2 {
background: #0485B0 url(static/images/sprites/headers.png) left -225px;
}
.solutions li.fifth .flyout .pointer {
left:auto;
right:122px;
}
.solutions li.last {
background-position: -436px 0px;
}
.solutions li.last:hover {
background-position: -964px 0px;
}
.solutions li.last .flyout {
left:auto;
right:0px;
}
.solutions li.last .flyout h2 {
background: #F05E2D url(static/images/sprites/headers.png) left -293px;
}
.solutions li.last .flyout .pointer {
left:auto;
right:32px;
}
.faq-image-under
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
.faq-image-over
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
.sub-content { /* products, services, and applications landing page */
background: url("media/plugins/subcontent-applications.png.jpeg") no-repeat;
padding: 20px 30px 0 500px;
min-height: 275px;
}
.addtocalendar {
margin-left: 5px;
}