/* Site Developed by Terry Barth Design www.terrybarthdesign.com */ /* Site Developed by Terry Barth Design www.terrybarthdesign.com */ /* Site Developed by Terry Barth Design www.terrybarthdesign.com */ @media all{ /* CSS Document */ @charset "utf-8"; 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, 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; vertical-align: baseline; font-size: 16px; font: inherit normal 100% inherit; color: #6d6f70; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0;} caption, th, td { text-align: left; font-weight: normal; } sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;} sup {top: -0.5em;} sub {bottom: -0.25em;} /* blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } */ *, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} body {font-size: 14px; font-family: Arial, Helvetica, "Lucida Grande", sans-serif; margin:0; width:100%; color:#444444; } p, a, li {line-height: 1.5em; } a {color: #0971ce; text-decoration:underline; } a:hover { text-decoration:none;} section, header,footer,nav { display:block;} img {border:0; vertical-align:top; max-width: 100%; } h1, h2, h3, h4 {line-height: 1.1em; } #template7 h1 {font-size: 2em; margin:0 0 0.15em; color:#000;} #template7 h2 {font-size: 2.45em; margin:0 0 0.15em; color:#000;} #template7 h3 {font-size: 1em; margin:0 0 0.15em; color:#000;} h1 {font-size: 2.5em; margin:0 0 0.15em; color:#000;} h2 {font-size: 1.75em; margin:0 0 0.15em; color:#000;} h3 {font-size: 1.5em; margin:0 0 0.15em; color:#000;} h1 a, h2 a, h3 a {font-size: 1em; text-decoration: none; color: #000;} ol, ul {padding:0; margin: 0 0 1em; list-style:none; } ul ul {margin-left: 1em;} ul li {list-style-type: disc; } ol li {list-style-type: decimal; } li {padding:0 0 0 0; margin-left: 1em;} p {margin:0 0 1em;} hr {color:#c00; background-color:#c00; height:1px; border:none; clear: both;} td {border: 1px solid #aaa;} .more {float: right; display: inline-block;} .imageright {float: right; margin: 0px 0 5px 10px;} .imageleft {float: left; margin: 0px 10px 5px 0;} .readmore {text-align: right; text-decoration: underline;} .image50 {width: 50%;} .image33 {width: 33%; } .imageshadow { -moz-box-shadow: 3px 3px 5px #aaa; -webkit-box-shadow: 3px 3px 5px #aaa; box-shadow: 3px 3px 5px #aaa;} .justifyright {text-align: right;} .justifyleft {text-align: left;} .alignLeft {float:left; margin-right:1em; } .alignRight {float:right; margin-left:1em; } .no-scale {width: auto;} .box-main:after, .center:after {content:""; clear:both; display:block; } .fullWidth {width:100%;} .fullWidth img {width:100%;} .row {width:100%; } .content-rows:after, .row:after {content:""; display:block; clear:both; } .columns {width:100% } .columns:after {content:""; display:block; clear:both; } .columns > div {float:left; vertical-align:top; } .columns > div:first-child, .columns > article:first-child {margin-left:0;} .half {width: 48.0%; margin-right: 1%; float: left;} .oneThird {width:33%; margin: 0; } .twoThird {width:64%; margin:1%; } .oneThird +.oneThird +.oneThird, .threeForth + .oneForth, .oneForth + .half, .half + .oneForth + .oneForth, .last {float:right; margin-right:0; } .oneForth {width:23%; margin-right: 2%;} .threeForth{width:74.5%;} .docnotfound li {list-style-type: none;} li.last {float: none;} .mobile-only {display: none;} .blue-text {color: #eb7923;} #overlay {position: relative;} #overlay img {position: absolute; top: -10px; left: 0;} .grow, .read-more {transition: all 0.50s ease 0s;} .grow:hover {opacity: 1; transform: scale(1.025, 1.025) translate(0px, 0px);} table {margin: 1em 0;} table td, table tr {border: 1px solid #6d6f70;} table td {padding: 5px;} /*** main styles ***/ .pagewidth {width:100%; padding: 0;} .center {max-width:1150px; width: 100%; margin:0 auto; padding: 0;} section {padding: 0; margin: 0;} header {width:100%; padding: 0 0; border-top: 5px solid #000; } #header-logos { margin: 5px auto; padding-left: 35px; } #header-logos span {height: 50px; display: inline-block; border-right: 1px solid #000; line-height: 50px; padding: 4px 26px 0 0; margin: 0 15px 0 0; font-size: 1.2em;} #header-logos img {margin: 10px 10px 5px 10px; height: 40px; width: auto;} #alert-strip {background-color: #eb7923; z-index: 2000;} #alert-strip .center {color: #fff; text-align: center; padding: 26px 0; font-weight: bold; font-size: 1.55em;} #alert-strip .center a {color: #fff; font-weight: bold; font-size: 1em;} #template7 #alert-strip {display: none; position: fixed; top: 0; width: 100%; } #close {color: #ccc; float: right; margin: 5px; padding: 1px 4px; border: 1px solid #ccc; border-radius: 50%; font-size: .9em;} #close:hover {cursor: pointer;} #logo-request {background-color: #000;} #logo {float: left; max-width: 400px; width: 50%; padding: 0; margin: 22px 0 40px 3px;} #logo img { width: 100%;} .request-button, #request-phone {line-height: 50px; text-align: center; color: #fff; text-transform: uppercase; font-weight: bold; display: inline-block; width: 100%;} .request-consultation {float: right; width: 245px; text-align: right; margin-top: 65px; color: #fff;} .request-button {background-color: #fff; color: #eb7923; border: 0px solid #eb7923; text-decoration: none;} .request-button:hover {background-color: #eb7923; text-decoration: none; color: #fff;} #home-contact .request-button {background-color: #eb7923; text-decoration: none; color: #fff; border: 2px solid #eb7923; } #home-contact .request-button:hover {background-color: #fff; text-decoration: none; color: #eb7923; border: 2px solid #eb7923;} #request-phone {font-size:1.7em; line-height: 55px;} #breadcrumb {margin-bottom: 40px;} #breadcrumb li {display: inline-block; list-style-type: none; margin: 0; font-size: .9em;} #breadcrumb li a {font-size: 1em;} #breadcrumb li + li:before {content: '>'; margin: 0 .5em; } .caption-image {width: 300px; float: right; margin: 0 0 10px 30px; font-style: italic; font-size: .9em;} #template7 header {border-bottom: 35px solid #eb7923;} #template7 .half {width: 50%; margin: 0 0 40px; } #template7 .left {padding-right: 1%;} #template7 .right {padding-left: 1%;} #template7 .half h2 {font-weight: normal; text-transform: uppercase; line-height: 1.2em;} #template7 .half h2 + h2 {font-weight: 700; margin-bottom: 1em;} #template7 .half li, #template7 .half li a {text-transform: uppercase; font-size: 1em; color: #6d6f70; text-decoration: none;} #template7 .half li {font-size: 1.2em; line-height: 1em; padding-bottom: .75em;} #template7 #home-contact h2, #template7 #home-events h2 {font-weight: bold;} #home-contact .request-consultation {float: none; margin: 1em 0;} #home-contact #request-phone {color: #000; text-align: left; font-size: 2.5em; margin-top: .5em;} #template7 #home-events {background-color: #dfe0e1; } #template7 .half + .half ul {border-left: 1px solid #6d6f70; } #template7 #home-events {padding: 47px 30px 5px 40px;} #template7 #home-events > h2 { margin: 0 0 .25em;} #template7 .half + .half ul {padding: 0 0 0 40px;} #template7 #home-contact {padding: 0 0 0 20px;} #template7 #home-contact h2, #template7 #home-contact .request-consultation {padding: 0 0 0 40px; } #template7 #home-contact .request-consultation {width: 380px;} #template7 #home-contact .request-button {font-size: 1.25em;} #template7 #home-contact .request-consultation.employment a {line-height: 1.2em; padding: .65em 0;} #home-contact img {width: 100%!important; height: auto!important;} #template7 #home-events {margin-bottom: 45px;} #home-events h2 {margin: .75em 0 2.5em 0;} .event {margin-bottom: 2em;} .event a {text-transform: uppercase; font-style: italic; color: #eb7923; margin-bottom: .25em; font-size: 1.3em; display: inline-block; line-height: 1.3em;} .event-date {text-transform: uppercase; font-size: 1.3em; margin-bottom: 0; } .booth {font-weight: bold; font-size: 1em;} #home-video .video-headline {background-color: #eb7923; } #template7 .video-headline h2 {color: #fff; text-align: center; font-weight: bold; text-align: left; padding: 40px 0 ; margin: 0 auto 50px; } #template9 .video-item, #home-video .video-item {display: inline-block; width: 32%; height: auto; margin-bottom: 0px;} #template9 .video-item::nth-of-type(3n+2), #home-video .video-item:nth-of-type(3n+2) { margin: 0 1%; } .video-item a {margin-bottom: .25em;} .row {position: relative;} #blue-header {background-color: #eb7923; height: 135px; z-index: 1;} #template9 .video-item {} /*** Header Image Text ***/ #header-image {} #content-header-image {position: relative; background-color: #000; opacity: 1; z-index: 200; margin-top: -70px; margin-bottom: 20px;} #page7 #content-header-image {margin-bottom: 0px;}} #header-image {opacity: .35; z-index: 300; } #content-header-image .captions { position: absolute; top: 15%; left: 5%; z-index: 1700; width: 700px; color: #fff; text-transform: uppercase; font-size: 3em; line-height: 1.1em; width: 90%; font-weight: bold; } #content-header-image .captions span {font-weight: normal; color: #fff; font-size: 1em;} /*** Machine Summary ***/ .summaryitem {margin-bottom: 40px; clear: both; width: 100%;} .summaryitem a.thumb, .summaryitem p.thumb {width: 30%; display: inline-block; float: left; max-width: 300px; margin-right: 15px;} .summaryitem a.thumb img, .summaryitem p.thumb img {float: left; margin: 8px 20px 10px 0; border: 1px solid #000; width: 100%;} .summaryitem a.read-more {background-color: #eb7923; text-decoration: none; text-decoration: none; padding: 3px 15px; display: inline-block; color: #fff; border: 2px solid #eb7923; float: right;} .summaryitem a.read-more:hover {background-color: #fff; color: #eb7923; border: 2px solid #eb7923;} .summaryitem h2 {text-transform: uppercase;} .single-image {width: 50%; margin-left: 30px; float: right;} #contact-map {margin-top: 40px;} /*** Footer ***/ footer {width:100%; overflow:hidden; padding:40px 0 0; color:#fff; line-height:1.2em; background-color: #404041;} footer *, footer p a {color: #fff; text-decoration: none;} footer p {font-size: 1-em; margin-bottom: 0; line-height: 1.65em;} footer .request-button {width: auto; padding: 0 10px; font-size: .8em; margin-top: 1.95em;} .footer-logos {clear: both; padding: 40px 0; } .footer-logos img {width: 75px; margin: 0 15px 0 0;} .map {text-align: center;} #copyright-social {padding: 15px 0; background-color: #221f1f;} footer .social {float: right;} footer .social a {text-decoration: none;} #copyright {padding: 0; margin: 0; display: inline-block; font-size: .8em;} /*** Social ***/ .social {display: inline-block; float: right;} .social a { margin: 0 .5em; text-decoration: none;} a.social .icon-hover {display: none;} a.social:hover .icon {display: none;;} a.social:hover .icon-hover {display: inline-block;} .social img { margin: 3px 0 0 0; height: 24px;} /*** Video ***/ .video-wrapper {/* width: 33%; */ max-width: 100%; /* clear: both; */} .video-container {position: relative; padding-bottom: 61.15%; padding-top: 0px; height: 0; overflow: hidden;} .video-container iframe, .video-container object, .video-container embed {position: absolute; top: 0; left: 0; width: 100%!important; height: 100%!important;} /*** forms ***/ form, fieldset {border:0; padding:0; margin:0; } form, #form_container, form div {display: block; width: 100%; clear: both; padding:0; margin:0; border:0; } input:focus, textarea:focus, select:focus {border: 0; outline: none; } input, select, textarea, label { font:1em/1.214em Arial, Helvetica, sans-serif; color:#444; resize:none; float: left; display: block; } input, select, textarea {background:#e5e6e7; } input, select, textarea {border: 0; padding:0.75em 1.5em; margin-bottom: 1em; } textarea {overflow:auto; height:10.812em; } ::-webkit-input-placeholder { color: #444; } :-moz-placeholder {color: #444; } .error {color: #E41124; padding: 0; margin: .5em 0 -3em;} #workemail {position: absolute; left: -10000px;} .radio label, .checkboxes label {float: left;} #radio-container, #checkbox-container {float: left; clear: none; } .radio-button, .checkbox {width: 150px; float: left; display: inline-block; clear: none;} .checkbox span {margin-top: 3px; display: inline-block;} .form-buttons {width: 100px;} .form-buttons input {background-color: #000; margin-left: 10%; color: #fff;} input[type=submit]:hover {cursor: pointer; background-color: #404041; color: #fff;} /*** Comment this out for location fields to be on separate rows ***/ form label, form div label { width: 100%; text-align: left; } form div input, form div select, form #radio-container, form #checkbox-container, form div textarea {width: 100%; float: left; margin-bottom: 1em;} form .half {float: left; clear: none; width: 49%; margin-right: 2%;} form .half + .half {margin-right: 0;} #form_container h3 {margin-bottom: 1em;} #form_container.job-app-form h3 span {float: none;} #form_container select {width: 31%;} #form_container input, #form_container select {margin-bottom: .5em;} #form_container label{display:inline-block;width:19%;text-align:right;font-size:110%;padding:5px 1% 0;vertical-align:top;padding-top:5px;word-wrap:break-word; margin-right: 0;} #form_container input {width: 81%;} #form_container input.half{width:31%;float:left;} #form_container label.half{float:left;} #form_container label.start{width:11%;} #form_container input.start{width:12%;} #form_container input.third{width:21.75%;float:left;} #form_container label.third{float:left;margin-bottom:-5px;} #form_container input.third{float:left;margin-bottom:-5px;} #form_container label.third[for=phone], #form_container #last4{width:9%;margin-left:5%px;} #form_container label[for=address], #form_container label[for=desired-position], #form_container label[for=position-name1], #form_container label[for=position-name2], #form_container label[for=position-name3], #form_container label[for=company-name1], #form_container label[for=company-name2], #form_container label[for=company-name3], #form_container label[for=resp1], #form_container label[for=resp2], #form_container label[for=resp3], #form_container label[for=over18], #form_container label[for=before], #form_container label[for=text], #form_container label[for=school], #form_container label[for=college], #form_container label[for=years], #form_container label[for=college-years], #form_container label[for=referred-by], #form_container label[for=concentration], #form_container .form-buttons, #form_container label[for=work1-start]{clear:left;float:left;} #form_container textarea#resp1, #form_container textarea#resp2{margin-bottom:2em;} #form_container label[for=company-name1], #form_container input#company-name1{margin-top:-5px;} #form_container hr{display:inline-block;margin:3em auto 1em;width:100%;height:3px;} #apply-address{float:right;width:40%;text-align:left;} #form_container #apply-address p:first-child{font-weight:normal;text-transform:none;} #form_container input[type=file]{width:40%;} #form_container .position-type label {margin-top: 0; padding-top: 0;} #form_container .position-type { margin-top: 1em; } #form_container.job-app-form .position-type input[type=checkbox] {margin-left: 0; margin-right: 0; float: none;} #form_container.job-app-form .position-type input[type=checkbox] + span {margin-right: 15px;} #form_container .position-type span {width: 100px;} #form_container label[for=desired-position], #form_container #desired-position {margin-top: 1em;} #form_container.job-app-form{padding:10px;float:right;margin-right:0;} #form_container.job-app-form p:first-child span{font-weight:normal;text-transform:capitalize;float:none;padding-left:1em;} #form_container.job-app-form hr:first-of-type{margin-top:1em;} #form_container.job-app-form textarea{width:81%;float:left;margin-bottom:10px;margin-top:5px} #form_container.job-app-form input[type=radio]{width:15px;margin: .6em 0 .5em 10px;float:none;clear: none;} #form_container.job-app-form input[type=radio] + span{margin-top: .5em; margin-right: 15px;} #form_container.job-app-form span span.error{padding:5px;background-color:#0076BF;color:#fff;text-align:center;} #form_container .row{display:inline-block;width:100%;margin-bottom: 0px;} #form_container .row:nth-of-type(1){margin-bottom:0px;} #form_container.job-app-form input[type=checkbox]{width:25px;margin-left:19%;} #form_container label[for=hear-about]{} #form_container.job-app-form .form-buttons {margin-top: 2em; width: 200px;} #form_container.job-app-form .form-buttons input {width:auto;color:#fff;padding:10px;display:inline-block;font-size:15px;font-weight:normal;width: 100%;} #form_container hr {color:#ccc; background-color:#ccc; height:1px; border:none; clear: both;} /*** Custom Checkbox ***/ .form input[type="radio"], .form input[type="checkbox"] {width: 30px; display: inline-block; border: 0; padding: 0; } #form_container .radio-container label, #form_container .checkbox-container label {display: inline; margin: 5px 10px 0 0;} #form_container .checkbox {margin-bottom: 1em;} #form_container .radio-button input, #form_container .checkbox input {display: none;} #form_container .radio-button input + label, #form_container .checkbox input + label {padding: 5px; width: 24px; min-width: 0; border-radius: 0px; display: inline-block; position: relative; border: 1px solid #aaa; margin-right: 1em;} #form_container .radio-container .radio + label, #form_container .checkbox-container .checkbox + label {width: 24px!important;} /* style checkboxes */ #form_container .checkbox span {line-height: 20px;} #form_container .checkbox input + label {padding: 10px; } #form_container .checkbox input:checked + label:after {content: '\2714'; font-size: 18px; position: absolute; top: 3px; left: 5px; color: #aaa;} /* style radio buttons */ #form_container .radio-button span {line-height: 20px;} #form_container .radio-button input + label {padding: 10px; border-radius: 50%; width: 20px;} #form_container .radio-button input:checked + label:after {content: '\2B24'; font-size: 18px; position: absolute; top: 2px; left: 2px; color: #aaa;} /*** Shadow Radius ***/ /* -webkit-box-shadow:0 0 6px #666; -moz-box-shadow:0 0 5px #666; box-shadow:0 0 5px #666; */ /*-webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; */ /* background: #aaa url(../../assets/sitegraphics/file.png) repeat-x scroll 0px 0px; */ /************** Pagination Style **************/ .pageNav ul {padding: 0; margin: 0;} .pageNav li {list-style-type: none; display: inline-block; border: 1px solid #aaa; margin: 0 1em 0 0; padding: 0; } .pageNav li a {text-decoration: none; padding: 5px 10px; margin: 0; display: inline-block} .pageNav li a.active, .pageNav li a:hover {background-color: #bbb; color:#fff;} /************** Drop Down Menu Style **************/ .dropdownmenu li a {transition: all 0.750s ease 0s;} .dropdownmenu {padding-left: 0px; clear: both;} .dropdownmenu ul {padding:0; position: relative; z-index: 500; background-color: transparent: ; width: 100%;} .dropdownmenu ul li {background-color: #fff; padding: 0; margin: 0;} .dropdownmenu ul li.last {float:left; margin-right:0; } .dropdownmenu ul li a {color:#aaa; height: 4.5em; line-height:4.9em; border:0px solid #fff; text-transform: uppercase;} .dropdownmenu ul li a { padding: 0 20px;} .dropdownmenu ul li ul { color:#fff; } .dropdownmenu ul li.active a {color: #000; font-weight: 600;} .dropdownmenu ul li:hover a, .dropdownmenu ul li a:hover {color:#fff; background-color: #eb7923; } .dropdownmenu ul li.active {background-color: #fff;} .dropdownmenu ul li:hover ul, .dropdownmenu ul li a:hover ul { top:4.55em; left:0; width:300px; background-color: #aaa; } /* vertical align menu * .dropdownmenu ul li {width: 15%; display: table; } .dropdownmenu ul li a {line-height: 1em; display: table-cell; vertical-align: middle; text-align: center;} /* 2nd level */ .dropdownmenu ul li.active ul li, .dropdownmenu ul li:hover ul li, .dropdownmenu ul li:hover ul li a {background-color: transparent;} .dropdownmenu ul li:hover ul li a, .dropdownmenu ul li a:hover ul li a {color: #000; line-height: 1.2em; padding:15px 20px; width:300px ; font-weight: 400;} .dropdownmenu ul li:hover ul li a:hover, .dropdownmenu ul li a:hover ul li a:hover {color:#fff; background-color: #eb7923; } .dropdownmenu ul li ul li.active a {color: #fff;} #item47 a {font-weight: bold;} /* 3rd level */ .dropdownmenu ul li:hover ul li:hover ul, .dropdownmenu ul li a:hover ul li a:hover ul { left:210px; width:100px; } /************** Slick Nav Menu Style **************/ .slicknav_menu {display:none; } .slicknav_menu li.last {float: none;} .slicknav_menu {font-size:16px;} .slicknav_btn {background-color: #000; margin: 5px 5px 6px; text-decoration:none;} .slicknav_menu .slicknav_menutxt { color: #FFF; font-weight: bold;} .slicknav_menu .slicknav_icon-bar {background-color: #fff;} .slicknav_menu {background:#fff; padding: 10px;} .slicknav_nav { color:#fff; margin:0; padding:0; font-size:0.875em; background-color: #000;} .slicknav_nav .slicknav_item:hover {background:#ccc; color:#fff;} .slicknav_nav a:hover{background:#ccc; color:#222;} /*** Cycle2 Slideshow ***/ /*** set border-box so that percents can be used for width, padding, etc (personal preference) */ .cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .cycle-slideshow { width: 100%; min-width: 200px; /* max-width: 1200px; */ margin: 0 auto 10px; padding: 0; position: relative; border-bottom: 0px solid #606fab; background-color: #000;} .cycle-slideshow img {z-index: -100; position: absolute; top: 0; left: 0; width: 100%; padding: 0; display: none; opacity: .4;} .cycle-slideshow img:first-child { position: static; z-index: 100; display: block; height: auto; width: 100%;} .cycle-slide {position: relative; width: 100%;} /*** pager ***/ .cycle-pager { margin-top: 0px; margin-bottom: 10px; text-align: center; width: 100%; z-index: 101; position: relative; bottom: 10px; overflow: hidden; } .cycle-pager span { font-size: 0; width: 20px; height: 20px; margin:0 3px; display: inline-block; cursor: pointer; border: 0px solid #000; background-color: #ccc; /*-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px */} .cycle-pager span.cycle-pager-active { background-color: #eb7923; } .cycle-pager > * { cursor: pointer; } /*** caption ***/ .captions { position: absolute; top: 30%; right: 105px; z-index: 700; width: 800px; } .cycle-slide img {} .cycle-slide a { display: block; padding: 30px 0px 3px 10px; clear: right; text-decoration: none; text-align: right; color: #444; text-transform: uppercase; font-size: 90%; line-height: 1; font-weight: 300; z-index: 2000;} .cycle-slide .line1, .cycle-slide .line2, .cycle-slide .line3 {color: #fff; text-transform: uppercase; font-size: 3em; line-height: 1.1em; width: 100%; font-weight: normal; } .cycle-slide .line2 {font-weight: bold;} .cycle-slide span {font-weight: normal; color: #fff; font-size: 1em;} .full-responsive {width: 33%; float: right;} .three-forth-responsive {width: 25%; float: right; clear: right; margin-right: 8%;} .half-responsive {width: 50%; float: right; clear: right; padding-right: 15%; } /************** Pagination Style **************/ .pageNav ul {padding: 0; margin: 0;} .pageNav li {list-style-type: none; display: inline-block; border: 1px solid #aaa; margin: 0 1em 0 0; padding: 0; } .pageNav li a {text-decoration: none; padding: 5px 10px; margin: 0; display: inline-block} .pageNav li a.active, .pageNav li a:hover {background-color: #bbb; color:#fff;} #machine-slideshow, #machine-slideshow + .cycle-pager {width: 50%; float: right; margin-left: 2.5%; background-color: none;} #machine-slideshow + .cycle-pager {text-align: center;} #machine-slideshow + #slide-nav div {display: inline-block;} #machine-slideshow img {opacity: 1;} /*** vertical align content ***/ .vertical-align { width: 150px; height: 150px; background-color: #aaa; padding: 0px 10px; display: table; } p.vertical-align-inner {display: table-cell; vertical-align: middle; text-align: center; font-size: 13px; } /*** Accordion ***/ .accordionheading h2 {cursor: pointer;} .accordioncontent {padding-left: 15px; } .closed .down-triangle {display: none;} .closed .right-triangle {display: inline-block;} .open .down-triangle {display: inline-block;} .open .right-triangle {display: none;} .right-triangle {width: 0px; float: left; margin: 8px 4px 0 0; width: 0px; height: 0px; border-style: solid; border-width: 5px 0 5px 7px; border-color: transparent #000 transparent } .down-triangle {width: 0px; float: left; margin: 8px 4px 0 0; height: 0px; border-style: solid; border-width: 7px 5px 0 5px; border-color: #000 transparent transparent } /* http://apps.eky.hk/css-triangle-generator/ */ /*** Twitter ***/ #twitter li {list-style-type: none; border-bottom: 0px solid #ccc; padding: 1em;} #twitter li:nth-of-type(odd) {background-color: #efefef;} #twitter a {text-decoration: none; color: #aaa;} #twitter p {margin: 0; padding: 0} .timePosted, .interact {text-align: right; color: #444; } .interact a {padding-left: 2em;} #template12 .captions {position: relative; top: auto; left: auto; right: auto;} #template12 #content-header-image {background-color: transparent; margin-top: -90px; margin-bottom: 80px;} /* Isotope */ #isotope {width: 100%; display: block;} .filter-buttons h2 {float: left; display: block; margin-right: 1em;} .filter-buttons h2:hover, .filter-criteria li:hover {cursor: pointer;} .filter-criteria h2.open {text-decoration:none; border-bottom: 3px dotted #818284;} .filter-criteria {clear: left;} .filter-criteria ul {padding: 0;} .filter-criteria li {list-style-type: none; display: inline-block; padding: 0; margin: 1em 2em 0 0;} #container .item {margin-right: 1%; margin-bottom: 1em; border: 1px solid #ddd; text-decoration: none; padding: 1%; width: 45%;} #container .item:hover {text-decoration: none;} #container .item p {margin-bottom: 0; color: #000;} #isotope .video-item {width: 260px; height: 240px; margin: 0 15px 20px 0; float: left; } #isotope .video-item p {color: #222; margin-top: 3px; line-height: 1.2em;} #isotope .grid {margin-top: 2em;} #isotope ul { width: 30%; float: left; margin-right: 1%;} #isotope h3 {font-size: 1.25em; font-weight: normal; margin-bottom: .5em; color: #222;} #isotope li {list-style-type: none; display: inline-block; margin-left: 0; margin-right: 10px;} #isotope .filter a {color: #666; text-decoration: none; border-radius: 4px;} #isotope .filter a.selected {background-color: #aaa; color: #fff; padding: 4px 10px; } #isotope .filter b {font-weight: normal; color: #000;} #isotope .tags b {font-weight: normal; font-size: .9em; color: #444;} /* #isotope .tags {display: none;} #page112 .video-item { height: 200px;} */ /***** Machine Finder ******/ #machine-finder .video-item {width: 250px; height: 360px; padding: 10px; margin: 0 15px 3em 0; float: left; clear: none; position: relative; border: 1px solid #ddd;} #machine-finder .video-item h2 {font-size: 1.15em;} #machine-finder .video-item a {text-decoration: none; color: #444; line-height: 1em;} #machine-finder .video-item p {line-height: 1.2em; color: #444;} #machine-finder .tags span {font-size: .9em;} #machine-finder .video-item b {font-size: 1em;} #machine-finder .video-item b {line-height: 1em; } #machine-finder .video-item a.thumb, #machine-finder .video-item p.thumb {width: 100%;} #machine-finder .video-item img {width: 100%; margin-bottom: .5em; } #machine-finder .video-item .read-more {float: none; margin: 1em auto 0;} #machine-finder .video-item a.read-more {background-color: #eb7923; text-decoration: none; text-decoration: none; padding: 3px 15px; display: inline-block; color: #fff; border: 2px solid #eb7923; float: none; position: absolute; bottom: 10px; left: 10px; } #machine-finder .video-item a.read-more:hover {background-color: #fff; color: #eb7923; border: 2px solid #eb7923;} #machine-finder .video-item.item114 {display: none;} /***** Ajax Tabs ******/ #tab-content {width: 80%; margin: 100px auto 50px;} #tabs ul {display: block;} #tabs li {display: inline; background-color: #fff; float: left; margin: 0 0 -1px 0; padding: 0;} #tabs li a {border: 1px solid #ccc; color: #000; float: left; line-height: 30px; margin-right: 0; padding: 0 15px; text-decoration: none; text-transform: uppercase;} #tabs li a:hover {background-color: #ddd;} #tabs li a.current {border-bottom-color: #fff; background-color: #fff;} #ajax-content {border: 1px solid #ccc; margin-bottom: 15px; overflow: hidden; padding: 10px 0; width: 100%;} #ajax-content h2, #ajax-content {padding: 10px;} #ajax-content ul {line-height: 1.5em; list-style: outside none disc; margin: 0 0 0 20px;} /*** boxes ***/ .boxes > div {border:1px solid #505a68; position:relative; padding:10px; margin:0 0 30px; height:1%; } .boxes > div:after {content:""; display:block; clear:both; } .boxes h3 {font-size:1.714em; line-height:2.583em; text-align:center; margin:-10px -10px 10px -10px; border-top:0px solid #909eb2; border-bottom:0px solid #545b65; background:#666;} .boxes h3 a {display:block; text-decoration:none; color: #fff; } .boxes .content {width:83%; overflow:hidden; margin:0 auto; } .boxes .readMore {position:absolute; top:100%; margin:-2.143em 0 0; width:100%; text-align:center; } /*** Popups ***/ .popup-trigger {margin: 30px; font-size: 3em;} .popup-content {display: none; font-size: 2em;} /*** Quotes ***/ .quote-author, .quote {display: inline-block; font-size: 1.5em; line-height: 1.25em; padding: 3%; width: 80%; margin: 2em auto 0;} .quote .quote-left {margin-top: -5px;} .quote .quote-right {bottom: -17px; display: inline-block; vertical-align: bottom;} .quote-author {font-size: 1em; font-style: italic; text-align: right; margin-top: 0;} /******* make standard embedded google maps responsive ********/ #contact-map {position: relative; padding-bottom: 25.6%; /* This is the aspect ratio */ height: 0; overflow: hidden;} #contact-map iframe {position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;} /**** For responsive custom google map with API ****/ #map_container {position: relative; width: 80%; margin: 100px 0 0;} #map {height: 0; overflow: hidden; position: relative; width: 80%; margin: auto; padding-bottom: 42.25%; padding-top: 30px; } #map #content img {max-width: 40px;} #map #content h1 {font-size: 1.5em;} /*** clearing ***/ .stretch, .clear { clear: both; height: 1px; margin: 0; padding: 0; font-size: 15px; line-height: 1px; } .clearfix:after { clear: both; height: 0; display: block; visibility: hidden; content: "."; } .clearfix {display:inline-block;} /* Hide from IE Mac \*/ .clearfix {display:block;} /* End hide from IE Mac */ /* end clearing */ } /* End Media Query */ @media all and (max-width: 1300px){ } @media all and (max-width: 1275px){ .center, #content .center {width: 95%;} #template7 .video-headline h2 {padding-left:10%;} } @media all and (max-width: 960px){ .captions {right: auto; right: 5%; width: 500px;} .captions .line1, .captions .line2, .captions .line3 {font-size: 2.25em; } } @media all and (max-width: 780px){ form label, form input, form textarea, form select, form .checkbox, form #zip, form #state {text-align: left!important; width: 100%!important; margin-right: 0;} .form input[type="checkbox"] {width: 35px!important;} .form-buttons input {margin-left: 0;} } @media all and (max-width: 700px){ .columns > div, .video-item, .imageleft, .imageright, #template7 .half {float:none; margin:0; width:100%; height: auto;} .center, #content .center {width: 85%; margin: auto;} .js #menu, .dropdownmenu {display:none;} .js .slicknav_menu {display:block;} .mobile-only {display: block;} .desktop-only {display: none;} .content-row .box {width: 100%!important; float: none;} #mobile-phone-number { color: #000; font-size: 1.9em; position: absolute; top: 18px; right: 10px; font-weight: 700;} #template7 header, header {border: 0;} #alert-strip .center {padding: 12px 0 10px; font-size: 1.25em; line-height: 1.25em;} #logo {float: none; margin: auto; width: 80%;} #logo-request .center {width: 100%;} #template7 #home-contact .request-consultation {width: 100%;} .request-consultation {float: none; width: 100%; margin: 0 0 2em; padding: 20px 0 0; background-color: #fff; text-align: center;} header #request-phone {color: #000; font-size: 2.25em; margin-top: 10px;} .request-button {width: auto; padding: 0 20px; font-size: 1.3em;} #home-contact #request-phone, #template7 #home-contact h2, #template7 #home-contact .request-consultation {padding: 0; text-align: center;} #template7 #home-contact {padding: 0;} .captions .line1, .captions .line2, .captions .line3 {font-size: 2.0em;} #template7 h2 {font-size: 1.75em;} #template7 #home-events {padding: 25px;} .event a, .event-date {font-size: 1.25em;} #template7 .half {margin-bottom: 2em;} #template7 .half + .half ul, #template7 .half + .half h2 {padding: 0; border: 0;} .captions {right: 10px; width: 400px} .captions .line1, .captions .line2, .captions .line3 {font-size: 1.75em;} #template7 .video-headline h2 { padding: 15px 0; text-align: center;} video-item, #home-video .video-item, .summaryitem a.thumb {text-align: center; width: 100%; max-width: 100%;} .summaryitem h2 {clear: both;} .caption-image {width: 90%; margin: 0 5%; float: none;} footer .request-button {margin-top: 1em;} .columns .footer-box {margin-bottom: 2.5em;} /*** Force table to not be like tables anymore ***/ table.rwd-tables, .rwd-tables thead, .rwd-tables tbody, .rwd-tables th, .rwd-tables tbody, .rwd-tables td, .rwd-tables tr {display: block; } } @media all and (max-width: 504px){ } @media all and (max-width: 320px){ } @media all and (min-device-width: 768px) and (max-device-width: 1024px){ }