/* CSS Document */ * { position: relative; } body { padding: 0; margin: 0; font-family: Arial, Helvetica, sans-serif; background: #002458; } h1 { color: #7dc23e; font-size: 18px; padding-left: 40px; width: 400px; } h2 { /* color: #a30046; font-size: 1.0em; */ } h4 { /* color: #a30046; */ } em { color: #c1d82f; } span#usa_color { color: #78c046; font-weight: bold; } span#world_color { color: #4f90cb; font-weight: bold; } table#table_thickness tr td { border-bottom: 1px solid #78c046; } #frame { background: white; width: 960px; margin: auto auto; } #frame site_warning { display: none; } #frame #header { background: url('../images/header.jpg') no-repeat; height: 124px; } #frame #header:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #header #logo a { width: 394px; height: 79px; display: block; top: 31px; left: 15px; position: absolute; z-index: 1; } #frame #navigation { width: 100%; height: 27px; display: block; z-index: 6; padding-top: 13px; } #frame #navigation ul#main_navigation { margin: 0 0 0 14px; padding: 0; list-style: none; } #frame #navigation ul#main_navigation:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #navigation ul#main_navigation li { float: left; height: 27px; display: block; text-indent: -9000%; border: none; margin-right: 12px; } #frame #navigation ul#main_navigation li a { width: 100%; height: 27px; display: block; } #frame #navigation ul#main_navigation li a span { height: 27px; display: block; } #frame #navigation ul#main_navigation li#nav_about a span { width: 106px; background: url('../images/nav_about.jpg') no-repeat; } #frame #navigation ul#main_navigation li#nav_why a span { width: 143px; background: url('../images/nav_why.jpg') no-repeat; } #frame #navigation ul#main_navigation li#nav_testing a span { width: 210px; background: url('../images/nav_testing.jpg') no-repeat; } #frame #navigation ul#main_navigation li#nav_colors a span { width: 106px; background: url('../images/nav_colors.jpg') no-repeat; } #frame #navigation ul#main_navigation li#nav_thickness a span { width: 106px; background: url('../images/nav_thickness.jpg') no-repeat; } #frame #navigation ul#main_navigation li#nav_further_info a span { width: 169px; background: url('../images/nav_further.jpg') no-repeat; } #frame #navigation ul#main_navigation li a span:hover { background-position: 0 -27px!important; } #frame #navigation ul#main_navigation li#nav_about.current_5 > a span, #frame #navigation ul#main_navigation li#nav_contact.current_24 > a span, #frame #navigation ul#main_navigation li#nav_contact.current_25 > a span, #frame #navigation ul#main_navigation li#nav_colors.current_18 > a span, #frame #navigation ul#main_navigation li#nav_thickness.current_19 > a span, #frame #navigation ul#main_navigation li#nav_further_info.current_20 > a span { background-position: 0 -27px!important; } #frame #banner { display: block; margin-top: 6px; z-index: 5; position: relative; height: 300px; overflow: hidden; } #frame #content_holder { width: 100%; display: block; margin-bottom: 30px; border-top: 4px solid #621b4b; border-bottom: 4px solid #621b4b; } #frame #content_holder #content { display: block; background: white; height: auto; min-height: 612px; } #frame #content_holder #content #content_text { padding-top: 20px; } #frame #content_holder #content #key_pages { margin-top: 20px; display: none; } body.index #frame #content_holder #content #key_pages { display: block; border-bottom: 2px solid #c1d82f; margin-bottom: 2%; padding-bottom: 2%; } #frame #content_holder #content div:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #key_pages .key_pages_holder { width: 217px; height: 132px; display: block; float: left; } #frame #content_holder #content #key_pages .key_pages_holder img { display: block; left: 10px; top: 10px; } #frame #content_holder #content #content_left { } #frame #content_holder #content #content_left:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #search_box { width: 220px; height: 45px; margin-top: 10px; background: #242425 url('../images/search_box.jpg') no-repeat; display: none; } #frame #content_holder #content #content_left #case_studies_box { width: 220px; /*height: 160px;*/ margin-top: 10px; display: block; } #frame #content_holder #content #content_left #case_studies_right:hover { cursor: pointer; } #frame #content_holder #content #content_left #case_studies_box #case_studies { clear:both; display: none; } #frame #content_holder #content #content_left #case_studies_box #case_studies ul#case_studies_list { margin: 0; padding: 0; list-style: none; } #frame #content_holder #content #content_left #case_studies_box #case_studies ul#case_studies_list li { background: white; padding: 7px 5px 5px 5px; border-top: 1px solid grey; } #frame #content_holder #content #content_left #case_studies_box #case_studies ul#case_studies_list li a { color: black; } #frame #content_holder #content #content_left #case_studies_box #case_studies ul#case_studies_list li:hover { background: #c7c4c6; color: white; } #frame #content_holder #content #content_left #case_studies_box #case_studies ul#case_studies_list li#view_all a { color: #ec2229; } #frame #content_holder #content #content_left #news_right:hover { cursor: pointer; } #frame #content_holder #content #content_left #news_box #news { clear:both; display: none; } #frame #content_holder #content #content_left #news_box #news ul#news_list { margin: 0; padding: 0; list-style: none; } #frame #content_holder #content #content_left #news_box #news ul#news_list li { background: white; padding: 7px 5px 5px 5px; border-top: 1px solid grey; } #frame #content_holder #content #content_left #news_box #news ul#news_list li a { color: black; } #frame #content_holder #content #content_left #news_box #news ul#news_list li:hover { background: #c7c4c6; color: white; } #frame #content_holder #content #content_left #news_box #news ul#news_list li#view_all a { color: #ec2229; } #frame #content_holder #content #content_left #careers_right:hover { cursor: pointer; } #frame #content_holder #content #content_left #careers_box #careers { clear:both; display: none; } #frame #content_holder #content #content_left #careers_box #careers ul#careers_list { margin: 0; padding: 0; list-style: none; } #frame #content_holder #content #content_left #careers_box #careers ul#careers_list li { background: white; padding: 7px 5px 5px 5px; border-top: 1px solid grey; } #frame #content_holder #content #content_left #careers_box #careers ul#careers_list li a { color: black; } #frame #content_holder #content #content_left #careers_box #careers ul#careers_list li:hover { background: #c7c4c6; color: white; } #frame #content_holder #content #content_left #careers_box #careers ul#careers_list li#view_all a { color: #ec2229; } #frame #content_holder #content #content_left #news_box { width: 220px; /*height: 30px;*/ margin-top: 10px; display: block; } #frame #content_holder #content #content_left #careers_box { width: 220px; /*height: 30px;*/ margin-top: 10px; display: block; } #frame #content_holder #content #content_middle { } #frame #content_holder #content #content_middle:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_middle #content_middle_block_1 { margin-top: 10px; } #frame #content_holder #content #content_middle .content_image_holder { width: 40%; height: 172px; display: block; float: left; } #frame #content_holder #content #content_middle .content_image_holder img { display: block; left: 10px; top: 10px; } #frame #content_holder #content #content_middle #content_middle_block_2 { display: none; } #frame #content_holder #content #content_middle #content_middle_block_2 p, #frame #content_holder #content #content_middle #content_middle_block_1 p { margin-top: 0; line-height: 1.4em; } #frame #content_holder #content #content_right { } #frame #content_holder #content #content_right #company_news { width: 225px; margin-top: 10px; display: block; } #frame #content_holder #content #content_right #company_news #company_news_header {} #frame #content_holder #content #content_right #company_news #company_news_content { background: white; border-left: 2px solid #dfe0e2; border-right: 2px solid #dfe0e2; border-bottom: 2px solid #dfe0e2;} #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list { list-style: none; padding: 0; margin: 0; padding-top: 10px; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li { height: 100px; margin-bottom: 10px; padding-right: 13px; overflow: hidden; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li a { color: grey; text-decoration: none; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li a span p strong { color: grey; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li p { margin: 0; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li .news_list_image { width: 100px; height: 100px; margin-left: 11px; margin-right: 10px; display: block; background: purple; float: left; } #frame #footer { margin-bottom: 20px; } #frame #footer #footer_left { float: left; margin-left: 20px; } #frame #footer #footer_left ul#footer_nav { list-style: none; padding: 0; margin: 0; border: 1px solid #95989c; height: 25px; } #frame #footer #footer_left ul#footer_nav li { float: left; font-size: 0.6em; margin: 0 15px 0 15px; padding-top: 5px; color: #95989c; } #frame #footer #footer_left ul#footer_nav li a { text-decoration: none; color: #95989c; } #frame #footer #footer_right { float: right; margin-right: 10px; } #frame #footer #footer_right ul#oyster { list-style: none; padding: 0; margin: 0; border: 1px solid #95989c; } #frame #footer #footer_right ul#oyster li { height: 20px; font-size: 0.6em; margin: 0 15px 0 15px; color: #95989c; padding-top: 5px; padding-left: 30px; display: block; background: url('../images/oyster.png') no-repeat; } #frame #footer #footer_right ul#oyster li a { text-decoration: none; color: #95989c; } #frame #footer #footer_right ul#webspring { list-style: none; padding: 0; margin: 0; } #frame #footer #footer_right ul#webspring li a { width: 167px; height: 24px; display: block; background: url('../images/webspring.png') no-repeat; } ul#sitemap_list { list-style: none; margin: 0; padding: 0; } ul#sitemap_list li ul.sub_navigation ul { list-style: none; margin: 0; padding: 0; } ul#sitemap_list li a { color: grey; } /* Contact Form */ #contactForm { margin: 0; padding: 0;position: relative;width: 400px;height: auto;} #contactForm h4 { padding-top: 10px; } #contactForm fieldset {margin: 0px;padding: 0px;position: relative;width: auto;height: auto;border: dashed 1px #CCCCCC;} #contactForm legend {margin: 0px 10px;padding: 0px 10px;position: relative;text-align: center;font-size: 14px;color: #999999;font-weight: bold;background: #FFFFFF;} #contactForm p {clear:both;} #contactForm p#required { text-indent: 115px; display: inline-table; margin-top: 0; margin-bottom: 0; } #contactForm label {margin: 3px 0px 0px;padding: 0px;position: relative;width: 150px;height: auto;font-size: 12px;color: black;text-align: right;float: left;} #contactForm input {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: auto;color: #777777;float: left;} #contactForm select {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: auto;color: #777777;float: left;} #contactForm textarea {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: 200px;float: left;} #contactForm .submitButton {margin: 0 0px 0px;padding: 0px;position: relative;left: 156px;width: auto;height: auto;color: #000000;float: none;} #contactForm .submitButton {left: 156px;} /* IE7 Fix */ #contactForm .error {font-size: 12px;font-weight: bold;color: #FF0000;left:15px; text-indent: 140px; display: inline-table; } #contactForm .smallText {font-size: 11px;color: #666666;text-align: right;font-weight: normal;} #contactForm .form_field_radio:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #contactForm .form_field_radio label { width: auto; } #contactForm .form_field_radio label.form_label { width: 150px; } #contactForm .form_field_radio label input { width: 20px; } #contactForm .form_field_checkbox label { width: auto; } #contactForm .form_field_checkbox label.form_label { width: 150px; } #contactForm .form_field_checkbox label input { width: 20px; } #addresses > div { width: 50%; float: left; } #addresses > div:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #map1 { width: 240px; height: 220px; display: block; background: url('../images/map1.jpg') no-repeat left top; background-size: 240px 220px; } #map2 { width: 240px; height: 220px; display: block; background: url('../images/map2.jpg') no-repeat left top; background-size: 240px 220px; } #map1 a { width: 240px; height: 220px; display: block; } #map2 a { width: 240px; height: 220px; display: block; } #addresses > div p { color: #000000; font-weight: bold; font-size: 0.8em; width: 240px; text-align: left; } #map1 > span, #map2 > span { color: #000000; font-size: 0.7em; width: 240px; text-align: left; } #addresses > div p span { color: #a30046; font-weight: bold; } #careersForm {margin: 0px auto;padding: 0px;position: relative;width: 100%;height: auto;} #careersForm fieldset {margin: 0px;padding: 0px;position: relative;width: auto;height: auto;border: dashed 1px #CCCCCC;} #careersForm legend {margin: 0px 10px;padding: 0px 10px;position: relative;text-align: center;font-size: 14px;color: #999999;font-weight: bold;background: #FFFFFF;} #careersForm p {clear:both;} #careersForm p#required { text-indent: 140px; display: inline-table; } #careersForm label {margin: 3px 0px 0px;padding: 0px;position: relative;width: 150px;height: auto;font-size: 12px;color: black;text-align: right;float: left;} #careersForm input {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: auto;color: #777777;float: left;} #careersForm select {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: auto;color: #777777;float: left;} #careersForm textarea {margin: 0px 0px 10px 5px;padding: 0px;position: relative;width: 235px;height: 200px;float: left;} #careersForm .submitButton {margin: 20px 0px 0px;padding: 0px;position: relative;left: 190px;width: auto;height: auto;color: #000000;float: none;} #careersForm .submitButton {*left: 180px;} /* IE7 Fix */ #careersForm .error {font-size: 12px;font-weight: bold;color: #FF0000;left:15px; text-indent: 140px; display: inline-table; } #careersForm .smallText {font-size: 11px;color: #666666;text-align: right;font-weight: normal;} #careersForm .form_field_radio:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #careersForm .form_field_radio label { width: auto; } #careersForm .form_field_radio label.form_label { width: 150px; } #careersForm .form_field_radio label input { width: 20px; } #careersForm .form_field_checkbox label { width: auto; } #careersForm .form_field_checkbox label.form_label { width: 150px; } #careersForm .form_field_checkbox label input { width: 20px; } /* News */ body.news ul.content_list { clear: both; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; width: 100%; list-style: none; } body.news ul.content_list li { position: relative; } body.news ul.content_list a { display: block; color: #727272; overflow-x: auto; overflow-y: auto; padding-bottom: 0; padding-left: 55px; padding-right: 0; padding-top: 0; text-decoration: none; } body.news ul.content_list li a br { display: none; } body.news ul.content_list a strong.title { display: block; font-weight: bold; line-height: 1.5em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; } body.news ul.content_list a span.date { display: block; font-weight: bold; left: 0; line-height: 1.5em; position: absolute; top: 1px; } body.news ul.content_list a span.content { display: block; font-size: 0.8em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; color: black; } /* Careers */ body.careers ul.content_list { clear: both; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; width: 100%; list-style: none; } body.careers ul.content_list li { position: relative; border: 1px solid #d3d5d8; padding: 5px; margin-bottom: 15px; } body.careers ul.content_list a { display: block; color: #727272; overflow-x: auto; overflow-y: auto; padding-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; text-decoration: none; } body.careers ul.content_list li a br { display: none; } body.careers ul.content_list a strong.title { display: block; font-weight: bold; line-height: 1.5em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: #ec2229; } body.careers ul.content_list a span.date { display: block; font-weight: bold; left: 0; line-height: 1.5em; position: absolute; top: 1px; } body.careers ul.content_list a span.content { display: block; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: black; } /* Case Studies */ body.study ul.content_list { clear: both; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; width: 100%; list-style: none; } body.study ul.content_list li { position: relative; border: 1px solid #d3d5d8; padding: 5px; margin-bottom: 15px; } body.study ul.content_list a { display: block; color: #727272; overflow-x: auto; overflow-y: auto; padding-bottom: 0; padding-left: 0; padding-right: 0; padding-top: 0; text-decoration: none; } body.study ul.content_list li a br { display: block; } body.study ul.content_list a strong.title { display: block; font-weight: bold; line-height: 1.5em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: #ec2229; } body.study ul.content_list a strong.black { font-weight: normal; line-height: 1.5em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: black; } body.study ul.content_list a span.red { font-weight: normal; line-height: 1.5em; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: #ec2229; } body.study ul.content_list a span.date { display: block; font-weight: bold; left: 0; line-height: 1.5em; position: absolute; top: 1px; } body.study ul.content_list a span.content { display: block; margin-bottom: 5px; margin-left: 0; margin-right: 0; margin-top: 0; font-size: 0.8em; color: black; } body.news p strong { color: grey; } p strong { font-weight: bold; } a { outline: none; text-decoration: none; border: none; } a img { border: none; } .grey_text { color: grey; font-size: 1.0em; font-weight: 100; } .red_text { color: #a30046; font-size: 1.3em; font-weight: bold; } .black_text { color: black; font-size: 1.0em; font-weight: bold; } body.index .grey_text { font-size: 1.0em; } body.index .red_text { font-size: 1.0em; } .uc { text-transform: uppercase; } .uc.red_text { font-size: 1.2em; } .standard_text { color: #545659; font-size: 14px; padding-left: 40px; width: 400px; } .standard_text p a { color: #00aeef; font-weight: bold; } .more_grey { width: 16px; height: 16px; display: inline-block; background: url('../images/more_grey.png'); top: 4px; left: 8px; } .red_arrow_right { padding-left: 30px; display: block; background: url('../images/red_arrow_right.png') no-repeat; } .red_arrow_left { padding-left: 30px; display: block; background: url('../images/red_arrow_left.png') no-repeat; } #read_more_block_2 .red_text { font-size: 0.8em; } #back_arrow { height: 21px; padding-bottom: 4px; text-decoration: none; } div.pagination { font-size: 0.8em; } div.pagination span.page_disabled { color: #eaebed; } div.pagination span.prev { margin-right: 5px; } div.pagination span.page_current { margin-right: 5px; color: red; } div.pagination a { color: grey; margin-right: 5px; } div.pagination a.next { color: grey; } /* pure-drawer overrides */ .pure-drawer { background: white; } .pure-toggle-label { display: none; background: white; } .pure-toggle-label[data-toggle-label="left"] { left: -10px; top: -10px; border: 0; } .pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon::before, .pure-toggle-label .pure-toggle-icon::after { background: grey; } .pure-toggle-label:hover .pure-toggle-icon, .pure-toggle-label:hover .pure-toggle-icon::before, .pure-toggle-label:hover .pure-toggle-icon::after { background: grey; } /* pager */ .cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .cycle-pager { text-align: right; width: 100%; z-index: 500; position: absolute; top: 0px; right: 0; overflow: hidden; padding: 10px 10px 0 0; } .cycle-pager span { font-family: arial; font-size: 50px; width: 16px; height: 16px; display: inline-block; color: white; cursor: pointer; line-height: 16px; display: none; } .cycle-pager span.cycle-pager-active { color: #df7a1c;} .cycle-pager > * { cursor: pointer;} ul#document_list { margin: 0 0 20px 0; padding: 0; list-style: none; } ul#document_list li { clear: both; } ul#document_list li a { text-decoration: none; color: #a0a0a3; } span.pdf { width: 24px; height: 24px; float: left; margin-right: 15px; background: url('../images/icons/doc_pdf.gif'); } span.txt { width: 24px; height: 24px; float: left; margin-right: 15px; background: url('../images/icons/doc_text.gif'); } span.doc, span.docx { width: 24px; height: 24px; float: left; margin-right: 15px; background: url('../images/icons/doc_word.gif'); } @media only screen and (min-width : 960px) { #frame #content_holder #content #key_pages:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #key_pages .key_pages_holder { margin-left: 17px; } #frame #content_holder #content #key_pages .key_pages_holder.first { margin-left: 0; } #frame #content_holder #content #key_pages .key_pages_holder img { top: 0; left: 0; } #frame #content_holder #content #content_left { float: left; width: 220px; } #frame #content_holder #content #content_left #page_quote { width: 160px; color: #a30046; padding: 20px; font-size: 20px; } #frame #content_holder #content #content_middle { float: left; width: 670px; padding: 0 15px 0 15px; } body.index #frame #content_holder #content #content_middle, body.about-us #frame #content_holder #content #content_middle { float: left; /* width: 450px; */ padding: 0 15px 0 15px; } body.index #frame #content_holder #content #content_middle div#content_text, body.about-us #frame #content_holder #content #content_middle div#content_text { width: 49%; float: left; } #frame #content_holder #content #content_middle div#content_text { float: left; width: 500px; } #frame #content_holder #content #content_middle div#content_images { float: right; width: 160px; } #frame #content_holder #content #content_middle div#content_documents { clear:both; } body.index #frame #content_holder #content #content_middle div#content_images, body.about-us #frame #content_holder #content #content_middle div#content_images { width: 334px; } #frame #content_holder #content #content_right { float: left; width: 220px; display: none; } body.index #frame #content_holder #content #content_right { display: block; } #frame #content_holder #content #content_right #company_news #company_news_header { background: url('../images/company_news_header_bg.jpg') repeat-x; height: 37px; } #frame #content_holder #content #content_right #company_news #company_news_header #company_news_header_left { float: left; width: 190px; height: 37px; display: block; background: url('../images/company_news_header_left.jpg') no-repeat; } #frame #content_holder #content #content_right #company_news #company_news_header #company_news_header_right { float: right; width: 15px; height: 37px; display: block; background: url('../images/company_news_header_right.jpg') no-repeat; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li { font-size: 12px; border-bottom: 1px dashed grey; padding-bottom: 10px; } #frame #content_holder #content #content_middle .content_image_holder { width: 100%; height: 100%; } #frame #content_holder #content #content_middle .content_image_holder img { width: 97%; /*height: 95%;*/ margin-bottom: 14px; } #frame #content_holder #content #content_middle .content_image_holder span.image_caption { margin-left: 10px; font-size: 12px; display: block; } #frame #content_holder #content #content_middle .content_image_holder.left { float: left; } #frame #content_holder #content #content_middle .content_image_holder.right { float: left; } #frame #content_holder #content #content_middle .content_image_holder.left img { } #frame #content_holder #content #content_left #case_studies_box { background: #95989c; } #frame #content_holder #content #content_left #case_studies_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #case_studies_box #case_studies_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #case_studies_box #case_studies_left { float: left; width: 190px; height: 30px; display: block; background: url('../images/case_studies_left.jpg'); } #frame #content_holder #content #content_left #case_studies_box #case_studies_right { float: right; width: 30px; height: 30px; display: block; background: url('../images/case_studies_right.jpg') -4px -1px; } #frame #content_holder #content #content_left #news_box { background: #95989c; } #frame #content_holder #content #content_left #news_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #news_box #news_image { display: none; } #frame #content_holder #content #content_left #news_box #news_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #news_box #news_left { float: left; width: 114px; height: 30px; display: block; background: url('../images/news_left.jpg'); } #frame #content_holder #content #content_left #news_box #news_right { float: right; width: 30px; height: 30px; display: block; background: url('../images/news_right.jpg') -4px -1px; } #frame #content_holder #content #content_left #careers_box { background: #95989c; } #frame #content_holder #content #content_left #careers_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #careers_box #careers_image { display: none; } #frame #content_holder #content #content_left #careers_box #careers_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #careers_box #careers_left { float: left; width: 114px; height: 30px; display: block; background: url('../images/careers_left.jpg'); } #frame #content_holder #content #content_left #careers_box #careers_right { float: right; width: 30px; height: 30px; display: block; background: url('../images/careers_right.jpg') -4px -1px; } #frame #content_holder #content #content_right #company_news #company_news_content ul#news_list li p { margin: 0; overflow: hidden; height: 89px; display: block; } a.red_arrow_right { text-decoration: none; padding-bottom: 4px; } .red_text { font-size: 0.8em; display: inherit; } #site_warning { display: none; } } /* Tablets - Overrides */ @media only screen and (min-width : 768px) and (max-width : 959px) { #frame #navigation { display: none; } #frame #content_holder #content #key_pages .key_pages_holder { width: 25%; height: 25%; } #frame #content_holder #content #key_pages .key_pages_holder img { width: 95%; /* height: 95%; */} #frame #content_holder #content #content_left #case_studies_box { width: 47.5%; float: left; } #frame #content_holder #content #content_left #news_box { width: 47.5%; float: right; } #frame #content_holder #content #content_left #careers_box { width: 47.5%; clear: both; float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.left { float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.right { float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.left img { } #frame #content_holder #content #content_middle .content_image_holder { width: 25%; height: 25%; } #frame #content_holder #content #content_middle .content_image_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #content_middle .content_image_holder.left { float: left; } #frame #content_holder #content #content_middle .content_image_holder.right { float: left; } #frame #content_holder #content #content_middle .content_image_holder.left img { } #frame #content_holder #content #content_right #company_news { width: 100%; } .cycle-pager { text-align: center; width: 100%; z-index: 500; position: absolute; top: 83%!important; right: 0; overflow: hidden; padding: 15px 0 0 0!important; height: 50px!important; } #frame #footer #footer_left ul#footer_nav li { margin: 0 5px 0 5px; } } /* Phones - Overrides */ @media only screen and (min-width : 560px) and (max-width : 767px) { #frame #navigation { display: none; } #frame #content_holder #content #key_pages .key_pages_holder { width: 33.33%; height: 33.33%; } #frame #content_holder #content #key_pages .key_pages_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #content_left #case_studies_box { width: 47.5%; float: left; } #frame #content_holder #content #content_left #news_box { width: 47.5%; float: right; } #frame #content_holder #content #content_left #careers_box { width: 47.5%; clear: both; float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.left { float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.right { float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.left img { } #frame #content_holder #content #content_middle .content_image_holder { width: 33.33%; height: 33.33%; } #frame #content_holder #content #content_middle .content_image_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #content_middle .content_image_holder.left { float: left; } #frame #content_holder #content #content_middle .content_image_holder.right { float: left; } #frame #content_holder #content #content_middle .content_image_holder.left img { } #frame #content_holder #content #content_right #company_news { width: 100%; } #frame #footer #footer_left ul#footer_nav li { margin: 0 5px 0 5px; } #frame #footer #footer_right { clear: both; float: left; margin: 5px 0 0 10px; } } @media only screen and (min-width : 320px) and (max-width : 560px){ #frame #navigation { display: none; } #frame #content_holder #content #key_pages .key_pages_holder { width: 50%; height: 50%; } #frame #content_holder #content #key_pages .key_pages_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #content_left #case_studies_box { width: 100%; } #frame #content_holder #content #content_left #news_box { width: 100%; } #frame #content_holder #content #content_left #news_box #news_image { display: none; } #frame #content_holder #content #content_left #careers_box { width: 100%; } #frame #content_holder #content #content_left #careers_box #careers_image { display: none; } #frame #content_holder #content #market_sectors .market_sector_holder.left { float: left; } #frame #content_holder #content #market_sectors .market_sector_holder.right { float: right; } #frame #content_holder #content #market_sectors .market_sector_holder.left img { left: 0; } #frame #content_holder #content #content_right #company_news { width: 100%; } #frame #content_holder #content #content_middle .content_image_holder { width: 50%; height: 50%; } #frame #content_holder #content #content_middle .content_image_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #content_middle .content_image_holder.left { float: left; } #frame #content_holder #content #content_middle .content_image_holder.right { float: right; } #frame #content_holder #content #content_middle .content_image_holder.left img { left: 0; } .red_arrow_right span.red_text { top: -3px; } #frame #footer { margin-bottom: 20px; } #frame #footer #footer_left { clear: both; float: left; width: 90%; } #frame #footer #footer_left ul#footer_nav { list-style: none; padding: 0; margin: 0; border: 1px solid #95989c; height: auto; } #frame #footer #footer_left ul#footer_nav li { float: none; font-size: 0.6em; margin: 0 15px 0 15px; padding-top: 5px; color: #95989c; } #frame #footer #footer_left ul#footer_nav li.spacer { display: none; } #frame #footer #footer_left ul#footer_nav li a { text-decoration: none; color: #95989c; } #frame #footer #footer_right { clear: both; float: right; margin-top: 10px; margin-right: 10px; } #frame #footer #footer_right ul#oyster { list-style: none; padding: 0; margin: 0; border: 1px solid #95989c; } #frame #footer #footer_right ul#oyster li { height: 20px; font-size: 0.6em; margin: 0 15px 0 15px; color: #95989c; padding-top: 5px; padding-left: 30px; display: block; background: url('../images/oyster.png') no-repeat; } #frame #footer #footer_right ul#oyster li a { text-decoration: none; color: #95989c; } } /* Phones - Portait Mode */ @media only screen and (min-width : 320px) and (max-width : 959px) { body { /*overflow: hidden;*/ } a { text-decoration: none; } .pure-toggle-label { display: block; } #site_warning { display: none; } #frame { width: 100%; } #frame #header { height: 165px; } #frame #header #logo { width: 95%; top: 40px; } #frame #header #logo img { width: 99%; } #frame #header #number { width: 95%; right: 0%; } #frame #header #number img { width: 80%; position: absolute; right: 0; } #frame #header #slogan { width: 95%; top: 105px; right: 0%; } #frame #header #slogan img { width: 80%; position: absolute; right: 0; } #frame #banner { margin: 0 2% 0 2%; height: 20%; } ul#mobile_navigaton { width: 100%; height: 100%; overflow: scroll; margin: 0; padding : 0; } ul#mobile_navigaton li { margin-bottom: 5px; } ul#mobile_navigaton li a { text-align: center; background: #7f8286; color: white; width: 100%; display: block; font-size: 1.5em; line-height: 2em; } ul#mobile_navigaton li ul { margin: 0; padding: 0; list-style: none; } ul#mobile_navigaton li ul.sub_navigation { display: none; } ul#mobile_navigaton li:hover ul.sub_navigation { display: block; } ul#mobile_navigaton li ul li a { background: #ebeaea; color: #7f8286; } ul#mobile_navigaton li ul li.current a, ul#mobile_navigaton li ul li:hover a { background: #ffffff; } /* ul#mobile_navigaton li#nav_home.current_5 a { background: #ffffff; } ul#mobile_navigaton li#nav_about_us.current_4 a { background: #ffffff; } ul#mobile_navigaton li#nav_services.current_6 a { background: #ffffff; } ul#mobile_navigaton li#nav_products.current_7 a { background: #ffffff; } ul#mobile_navigaton li#nav_market_sectors.current_9 a { background: #ffffff; } ul#mobile_navigaton li#nav_contact_us.current_10 a { background: #ffffff; } */ #frame #content_holder #content { background: none!important; } #frame #content_holder #content #key_pages .key_pages_holder { margin-bottom: 5%; } #frame #content_holder #content #key_pages .key_pages_holder img { width: 95%; /* height: 95%; */ } #frame #content_holder #content #key_pages .key_pages_holder.left { } #frame #content_holder #content #key_pages .key_pages_holder.left img { } #frame #content_holder #content #key_pages .key_pages_holder.right { } #frame #content_holder #content #content_left { clear: both; width: 100%; display: block; margin-top: 10px; } #frame #content_holder #content #content_left #page_quote { display: none; } #frame #content_holder #content #content_left #search_box { width: 100%; } #frame #content_holder #content #content_left #case_studies_box { background: #95989c; } #frame #content_holder #content #content_left #case_studies_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #case_studies_box #case_studies_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #case_studies_box #case_studies_left { float: left; width: 190px; height: 30px; display: block; background: url('../images/case_studies_left.jpg'); } #frame #content_holder #content #content_left #case_studies_box #case_studies_right { float: right; width: 36px; height: 30px; display: block; background: url('../images/case_studies_right.jpg'); } #frame #content_holder #content #content_left #news_box { background: #95989c; } #frame #content_holder #content #content_left #news_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #news_box #news_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #news_box #news_left { float: left; width: 114px; height: 30px; display: block; background: url('../images/news_left.jpg'); } #frame #content_holder #content #content_left #news_box #news_right { float: right; width: 36px; height: 30px; display: block; background: url('../images/news_right.jpg'); } #frame #content_holder #content #content_left #careers_box { background: #95989c; } #frame #content_holder #content #content_left #careers_box:after {content: ".";display: block;height: 0px;clear: both;visibility: hidden; margin: 0px; padding: 0px; } #frame #content_holder #content #content_left #careers_box #careers_image img { width: 100%; height: 130px; display: block; } #frame #content_holder #content #content_left #careers_box #careers_left { float: left; width: 114px; height: 30px; display: block; background: url('../images/careers_left.jpg'); } #frame #content_holder #content #content_left #careers_box #careers_right { float: right; width: 36px; height: 30px; display: block; background: url('../images/careers_right.jpg'); } #frame #content_holder #content #content_middle { width: 100%; display: block; margin-top: 10px; } #frame #content_holder #content #content_middle .content_image_holder { margin-bottom: 5%; } #frame #content_holder #content #content_middle .content_image_holder img { width: 95%; margin-bottom: 15px; /* height: 95%; */ } #frame #content_holder #content #content_middle .content_image_holder span.image_caption { font-size: 12px; display: block; } #frame #content_holder #content #content_middle .content_image_holder.left { } #frame #content_holder #content #content_middle .content_image_holder.left img { } #frame #content_holder #content #content_middle .content_image_holder.right { } #frame #content_holder #content #content_middle .content_image_holder.right span.image_caption { margin-left: 10px; } body.index #frame #content_holder #content #content_right { display: block; } #frame #content_holder #content #content_right { clear: both; width: 100%; display: none; margin-top: 10px; } #frame #content_holder #content #content_right #company_news #company_news_header { background: url('../images/company_news_header_bg.jpg') repeat-x; height: 37px; } #frame #content_holder #content #content_right #company_news #company_news_header #company_news_header_left { float: left; width: 190px; height: 37px; display: block; background: url('../images/company_news_header_left.jpg') no-repeat; } #frame #content_holder #content #content_right #company_news #company_news_header #company_news_header_right { float: right; width: 15px; height: 37px; display: block; background: url('../images/company_news_header_right.jpg') no-repeat; } h1 span { display: inherit; } h1 { color: #449637; font-size: 26px; padding-left: 5%; width: 90%; } .standard_text { color: #545659; font-size: 14px; padding-left: 5%; width: 90%; } .grey_text { font-size: 1.25em; } .red_text { color: #EC2229; font-weight: bold; font-size: 1.25em; } .black_text { font-size: 1.25em; } /*.standard_text { color: black; font-size: 0.8em; line-height: 1.6em; margin-top: 0; } */ .standard_text p a { font-size: 1.2em; line-height: 1.6em; } .cycle-slideshow { } #frame #banner img { /* padding-bottom: 35px; */ } .cycle-pager { text-align: center; width: 100%; z-index: 500; position: absolute; top: 80%; right: 0; overflow: hidden; padding: 0 0 0 0; height: 35px; } .cycle-pager span { font-family: arial; font-size: 100px; width: 32px; height: 32px; display: none; color: grey; cursor: pointer; line-height: 35px; } #frame #footer { margin-bottom: 20px; } #frame #footer #footer_left ul#footer_nav li a { font-size: 1.6em; } } /* devices or screens with a width less than 320 */ @media only screen and (min-width : 0px) and (max-width : 319px) { .pure-container { display: none; } #site_warning { display: block; width: 100%; } #frame { width: 100%; } } /* device widths */ /* -phones- Por Land iPhone 4/4s - 320 480 iPhone 5/5s - 320 568 iPhone 6 - 375 667 iPhone 6+ - 414 736 Galaxy S3 - 320 640 Galaxy S4 - 320 640 Galaxy S5 - 360 640 HTC One - 360 640 */ /* -tablets- Por Land iPad Mini - 768 1024 iPad 1/2 - 768 1024 iPad 3/4 - 768 1024 Galaxy Tab 10.1 - 800 1280 Asus Nexus 7 - 601 906 Kindle Fire HD 7" - 800 1280 Kindle Fire HD 8.9" - 1200 1600 */ /* -wearables- Por Land Apple Watch 38mm - 272 340 Apple Watch 42mm - 312 390 Moto 360 Watch - 218 281 */ /* Phones */ /* @media only screen and (min-width : 361px) { body { background: green; } .pure-toggle-label { display: block; } #frame { width: 100%; } #frame #header #logo {top: 20px; } #frame #header #logo img { width: 99%; } #frame #header #number { } #frame #header #number img { width: 80%; position: absolute; right: 0; } #frame #header #slogan { top: 105px; } #frame #header #slogan img { width: 80%; position: absolute; right: 0; } #frame #navigation { display: none; } #frame #banner { margin: 0 2% 0 2%; height: 113px; } #frame #content_holder #content #market_sectors_intro { width: 100%; } span.grey_text { font-size: 1.25em; } span.red_text { color: #EC2229; text-transform: uppercase; font-weight: bold; font-size: 1.25em; } span.black_text { font-size: 1.25em; } } */