/*==========  Non-Mobile First  ==========*/

    .g-recaptcha {
        padding-left: 10px;
    }

    form textarea#comments {
        width: 380px !important;
        max-width: 90% !important;
    }

    .bad-wolf-images-holder img {
        width: 49%;
    }

    .black {
        color: black;
    }

    .red {
        color: #cb2127;
    }

    /* Large Devices, Wide Screens */
    /*@media only screen and (max-width : 1200px) {
    }*/

    body, body > div, #main-navigation, img, center, #footer .container {
        max-width: 100%;
    }

    center {
        display: block;
    }

    img {
        max-width: 100%;
        height: auto !important;
    }

    #slides img {
        width: 100%;
    }

    p {
        margin-top: 11px;
        margin-bottom: 11px;
    }

    div.footer-sub {
        margin-bottom: 20px;
    }

    table.producttable {
        width: 480px;
        max-width: 100%;
        overflow-x: auto;
        display: block;
        margin: 0 auto;
    }

    .directionsbox input[type="image"] {
        margin-top: 1px !important;
    }

    ol {
        margin-left: 5% !important;
    }

    #responsive-menu-button {
        position: absolute;
        margin: 48px 0 0 20px;
        display: block;
        -o-transition: -o-transform .75s;
        -moz-transition: -moz-transform .75s;
        -webkit-transition: -webkit-transform .75s;
        transition: transform .75s;
    }

    .icon-bar {
        display: block;
        width: 42px;
        height: 5px;
        border-radius: 1px;
        background-color: #fff;
        margin-left: 5px;
        margin-bottom: 10px;
        border: 1px black solid;
        border-radius: 2px;
        -webkit-box-shadow: 0px 0px 10px 5px rgba(51,51,51,0.64);
        -moz-box-shadow: 0px 0px 10px 5px rgba(51,51,51,0.64);
        box-shadow: 0px 0px 10px 5px rgba(51,51,51,0.64);
        -o-transition: background-color .5s, border .5s;
        -moz-transition: background-color .5s, border .5s;
        -webkit-transition: background-color .5s, border .5s;
        transition: background-color .5s, border .5s;
        z-index: 999;
    }

    #responsive-menu-button:hover .icon-bar {
        background-color: #67fd9a;
        border: 1px white solid;
    }

    .sidr-open #responsive-menu-button {
        -ms-transform: rotate(45deg); /* IE 9 */
        -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
        transform: rotate(45deg);
    }

    .sidr-open .icon-bar {
        border-radius: 2px;
    }

    #responsive-menu-button {
        display: none;
    }

    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0,0,0,0);
        border: 0;
    }

    .subnav {
        position: relative;
        z-index: 501 !important;
    }

    .versitexSplash {
        width: 100%;
        height: 630px;
        margin: 0 auto;
        background: url('../images/headerIMG_3.jpg') top center no-repeat;
    }

    .versitexSplash h1 {
        visibility: hidden;
    }

    /*#nav-tabs {
        position: fixed;
    }*/

    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {

        body {
            max-width: 100%;
            overflow-x: hidden;
        }

        #hp-banner #slides {
            max-width: 50%;
            height: auto;
            box-sizing: border-box;
        }

        #hp-banner .slidesjs-next {
            /*margin-left: 0;
            position: relative;*/
            float: right;
            margin-right: 10px;
        }

        #hp-banner p {
            max-width: 50%;
            box-sizing: border-box;
        }

        #header + .clearfix + .container {
            max-width: 100%;
        }

        ul#main-navigation {
            width: 100%;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;        
            display: flex;
            -moz-justify-content: space-between;
            -webkit-justify-content: space-between; /* Safari 6.1+ */
            justify-content: space-between;
        }

        ul#main-navigation li {
            text-align: center;
        }

        .col3 {
            width: 30%;
            box-sizing: border-box;
            height: auto;
        }

        .col3 p {
            max-width: 100%;
        }

        #tagline {
            margin-right: 240px;
            font-size: 18px;
        }

        #tagline span {
            margin-left: 0;
            text-align: right;
        }

        #social {
            width: 100%;
            display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
            display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
            display: -ms-flexbox;      /* TWEENER - IE 10 */
            display: -webkit-flex;     /* NEW - Chrome */
            display: flex;
            -moz-justify-content: space-around;
            -webkit-justify-content: space-around;
            justify-content: space-around;
            float: none;
            margin: 0 auto 10px;
        }

        #footer-navigation {
            width: 200px;
        }

        ul#footer-navigation li {
            float: none;
        }

        div.footer-sub, ul#footer-navigation {
            width: 250px;
        }

        .col-full {
            max-width: 100%;
        }
       
        .col-left {
            width: 60%;
            box-sizing: border-box;
            padding-left: 8px;
        }

        .col-right {
            width: 36%;
            box-sizing: border-box;
            padding-right: 8px;
        }

        .col-left h1, .col-left h2, .col-left p, .col-left img, .col-left ul, .col-left form,
        .col-right h3, .col-right div, .col-right ul, .col-right img, .col-right iframe {
            max-width: 100%;
        }

        .col-right > p {
            max-width: 95%;
        }

        .col-right > a {
            max-width: 90%;
            display: block;
            margin: 0 auto;
        }
        
        .col-right > a > img.left {
            margin-right: 8px !important;
        }

        .col-right img.right, .col-right img.left {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        #footer {
            box-sizing: border-box;
            padding-left: 8px;
            padding-right: 8px;
        }

        .directionsbox input[type="image"] {
            float: none !important;
            margin-top: 5px !important;
            margin-left: auto;
            margin-right: auto !important;
        }

        #diraddress {
            width: 100% !important;
            box-sizing: border-box;
        }

        form fieldset {
            min-width: 0;
        }

        /*fieldset {
            width: 470px;
            max-width: 100%;
        }*/

        #nav-tabs p, #nav-tabs h1, #nav-tabs h2 {
            max-width: 100%;
            padding-right: 5%;
            box-sizing: border-box;
        }

        .versitexSplash {
            width: 100%;
            height: 65vw;
            margin: 0 auto;
            background: url('../images/headerIMG_3.jpg') top center no-repeat;
            background-size: 100% auto;
        }
    
        .versitexSplash h1 {
            visibility: hidden;
        }

        .col-right ul.contentList > li {
            list-style-type: disc;
            margin-left: 22px;
            font-size: .875em;
        }

    }


    /* Medium-small border */
    @media only screen and (max-width: 792px) {

        #footer-address {
            border-right: none;
        }
        
    }


    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
        
        body > div {
            float: none !important;
            display: block;
            margin: 0 auto !important;
        }

        #responsive-menu-button {
            display: block;
        }

        #tagline {
            display: none;
        }

        #header {
            padding: 35px 0 35px;
            height: initial;
        }

        #header .container {
            max-width: 100%;
        }

        #logo {
            float: none;
            margin: 0 auto;
            max-width: 65%;
        }

        ul#main-navigation {
            display: none;
        }

        #hp-banner {
            max-width: 100%;
            float: none;

            height: auto;
        }

        #hp-banner p {
            float: none;
            display: block;
            width: 90% !important;
            max-width: 100%;
            margin-left: 5%;
            margin-right: 5%;
        }

        #hp-banner #slides {
            max-width: 90%;
            height: auto;
        }

        #hp-banner p {
            max-width: 90%;
        }

        ul.news li, div.news-a-t {
            margin-left: 5%;
            margin-right: 5%;
        }

        #slides {
            max-width: 100%;
            display: block;
            float: none;
            margin: 0 auto;
        }

        .content > p {
            display: block;
            margin: 11px auto;
        }

        .col3 {
            display: block;
            float: none;
            margin: 0 auto !important;
            width: 100%;
            height: auto;
        }

        .col3 p, .col3 h2 {
            width: 90% !important;
            margin-right: 10%;
            padding: 10px;
        }

        .col3 img {
            display: block;
            margin: 0 auto;
        }

        .col3 p:first-of-type {
            margin: 0;
            padding: 0 10;
        } 

        .right {
            float: none;
            display: block;
            margin: 0 auto !important;
        }

        .content p, .content h1, .content h2, .content h3 {
            width: 90%;
            margin-left: 5%;
            margin-right: 5%;
        }

        /* Implements a clearfix such that the <center> tag is left-aligned properly */
        center::before {
            content: " ";
            display: table;
            clear: both;
        }

        #footer {
            max-width: 100%;
        }

        #footer container {
            max-width: 90%;
            margin-left: 5%;
            margin-right: 5%;
        }

        #footer #footer-navigation, #footer #footer-address {
            float: none;
            margin: 0 auto;
        }

        #footer .footer-sub {
            float: none;
            margin: 0 auto 20px;
        }

        .col-right, .col-left {
            float: none;
            margin: 5% auto;
            width: auto;
            max-width: 95%;
        }

        .col-right .video {
            width: 90%;
            margin: 0 auto;
            float: none;
        }
        
        form {
            margin-left: auto;
            margin-right: auto;
        }

        .contactbox {
            float: none;
            margin-left: auto;
            margin-right: auto;
            box-sizing: border-box;
        }

        .producttable-wide::before {
            font-style: italic;
            font-weight: bold;
            color: #004d81;
            content: "Content may be scrollable. Swipe left or right on table to scroll.";
            position: relative;
            left: 7px;
            bottom: 5px;
        }

        .content p, .content .list {
            max-width: 90%;
        }

        #list1a h3:first-of-type {
            margin-left: 5%;
        }

        /*#nav-tabs {
            position: static;
        }*/

        #tagline {
            display: block;
            width: 90%;
            margin-right: 5%;
            margin-left: 0;
            margin-bottom: -40px;
            position: relative;
            bottom: 80px;
            text-align: center;
            font-size: 14px;
        }

        #tagline br {
            content: " ";
        }

        #tagline br::after {
            content: " ";
        }

        #logo {
            padding-bottom: 35px;
        }

        img, .col-right img.right {
            display: block;
            margin-right: auto !important;
            margin-left: auto !important;
            float: none;
        }

        .col-right img.left {
            padding-right: 10px;
        }

        /* SIDR FORMATTING */
        .sidr-class-mainnavli {
            list-style-type: none;
            margin-left: 15px;
            font-size: 22px;
            line-height:35px;
            border-bottom: 1px black dotted;
            padding-top: 5px;
            padding-bottom: 5px;
        }
        
        .sidr-class-mainnavli a {
            text-decoration: none;
        }

        .sidr-class-subnav {
            display: none;
        }

        .sidr-class-subnav li {
            display: none;
            font-size: 15px;
        }

        .sidr ul.sidr-class-materialssub, .sidr ul.sidr-class-industrysub {
            margin-bottom: -6px;
        }

        .sidr-class-materialssub li a {
            line-height: 22px;
        }

        .sidr-class-materialssub br {
            content: " ";
        }

        .sidr-class-materialssub br::after {
            content: " ";
        }

         .sidr-class-triangle {
            width: 0; 
            height: 0; 
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 10px solid black;
            position: relative;
            top: 23px;
            left: 10px;
            -webkit-animation: pulse 4s ease infinite;
            -moz-animation: pulse 4s ease infinite;
            animation: pulse 4s ease infinite;
        }

        @keyframes pulse {
            0% {border-top-color: black}
            50% {border-top-color: darkgrey}
            100% {border-top-color: black}
        }

        @keyframes pulse-glow {
            0% {box-shadow: inset 0px 0px 5px 0px black}
            50% {border-top-color: inset 0px 0px 5px 0px white}
            100% {border-top-color: inset 0px 0px 5px 0px black}
        }

        .sidr-class-strong {
            font-weight: bold;
        }

        .sidr-class-blue {
            color: #014286;
        }

        .sidr-class-green {
            color: #194720;
        }

        .sidr-class-orange {
            color: #c46628;
        }

        /* / SIDR FORMATTING */

        textarea {
            box-sizing: border-box;
        }

    }


    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {

        #header {
            min-height: 170px;
            padding: 0;
        }

        #logo {
            float: right;
            padding: 35px 15px 35px 0;
        }

        #logo::before, #logo::after {
            content: " ";
            clear: both;
            display: table;
        }

        .col-left, .col-right {
            padding-left: 0;
            padding-right: 0;
        }

        .list li {
            max-width: 90%;
        }

        form.cmxform fieldset fieldset label {
            margin-left: 0;
        }

        form.cmxform label {
            display: block;
        }

    }


    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
        
    }


    .hide {
        display: none;
    }