/*helpers*/
.media-query-bar
{
    position: fixed;
    top: 0;
    left: 0;
    display: none;/*comment whilst testing*/

    width: 100%;
    height: 5px;
}

/*Bootstrap additions*/
.no-gutter > [class*='col-']
{
    padding-right: 0;
    padding-left: 0;
}

.left-yellow-box-gutter
{
    padding-left: 0;
}

/*Generic*/
.stuck
{
    position: fixed;
    top: 0;
}

.invisible
{
    visibility: hidden;
}

.cloak
{
    position: absolute;

    display: block;

    opacity: 1;
    background-color: #fff;

    filter: alpha(opacity=100);
}

a:focus
{
    outline: 0;
}

/*Place holder styling*/
::-webkit-input-placeholder
{
    color: #4c4945!important;
}

:-moz-placeholder
{
    /* Firefox 18- */
    color: #4c4945!important;
}

::-moz-placeholder
{
    /* Firefox 19+ */
    color: #4c4945!important;
}

:-ms-input-placeholder
{
    color: #4c4945!important;
}


/*IE9 Placeholders*/
.custom-placeholder
{
    color: #4c4945;
}


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

/*z-indexes*/
.media-query-bar
{
    z-index: 100000;
}

.main-container header
{
    z-index: 200000;
}

.main-container .main-content
{
    z-index: 100000;
}


/* Large Devices, Wide Screens */
@media only screen and (max-width : 8000px)
{
    .media-query-bar
    {
        background-color: red;
    }

    html
    {
        font-size: 100%;

        width: 100%;

        background-color: #fff;
    }

    body
    {
        font-family: 'avant-garde-gothic-regular';
        font-family: arial;

        position: relative;

        overflow-x: hidden;
        overflow-y: scroll;

        width: 100%;
        height: 100%;

        color: #000;
        background-color: #fff;
    }

    p
    {
        font-size: 12px;
    }

    ul li
    {
        font-size: 12px;
    }

    a
    {
        color: #f49200;
        text-decoration:none;
    }

    a:hover, a:active, a:focus
    {
        color: #000;
        text-decoration:none;
    }

    .main-container
    {
        position: relative;

        max-width: 970px;
    }

    /*Section Header*/
    header
    {
    }

    header .safety-xchange-logo
    {
        display: inline-block;

        width: 211px;
        height: 125px;
        margin-top: 15px;
        margin-left: 15px;

        background-image: url(/Content/images/header-logo.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    header .call-now
    {
        font-family: 'Dancing Script', cursive;
        font-size: 25px;
        font-weight: normal;
        line-height: 28px;

        display: inline-block;
        float: right;

        margin-top: 39px;

        text-align: right;
        vertical-align: top;

        color: black;
    }

    header .safety-number
    {
        font-family: 'Tahoma', Segoe UI, Arial, Verdana, sans-serif;
        font-size: 36px;
        font-weight: bold;
        line-height: 20px;

        display: inline-block;
        float: right;

        width: 315px;
        height: 70px;
        margin-top: 39px;
        margin-right: 15px;
        margin-left: 15px;

        text-align: right;
        vertical-align: top;
        text-transform: uppercase;

        color: black;
        background-image: url(/Content/images/header-phone.png);
        background-repeat: no-repeat;
    }

    header .safety-number  a
    {
        color: black;
    }

    header .safety-number  a:hover
    {
        text-decoration: none;
    }

    header .safety-number  a span
    {
        font-size: 22px;
        line-height: 45px;

        display: block;

        color: #f49200!important;
    }

    .mobile-menu
    {
        display: none;
    }

    /*Section Top Navigation*/
    .top-nav
    {
        height: 27px;
        margin-top: 20px;
        padding: 0;
    }

    .top-nav > ul:before
    {
        position: relative;
        z-index: 100000;
        top: 0;
        left: 10px;

        float: left;

        height: 27px;

        content: url('/Content/images/menu-angled-lines.png');
    }

    .top-nav > ul > li:before
    {
        position: relative;
        z-index: 100000;
        top: 0;
        left: 0;

        float: left;

        height: 27px;

        content: url('/Content/images/pre-menu-button.png');
    }

    .top-nav > ul > li:after
    {
        position: relative;
        z-index: 100000;
        top: 0;
        left: 0;

        float: left;

        height: 27px;

        content: url('/Content/images/post-menu-button.png');
    }

    .top-nav > ul > li.active:before
    {
        position: relative;
        z-index: 100000;
        top: 0;
        left: 0;

        float: left;

        height: 27px;

        content: url('/Content/images/pre-menu-button-active.png');
    }

    .top-nav > ul > li.active:after
    {
        position: relative;
        z-index: 100000;
        top: 0;
        left: 0;

        float: left;

        height: 27px;

        content: url('/Content/images/post-menu-button-active.png');
    }

    .top-nav > ul > li.last
    {
        margin-right: 0;
    }

    .top-nav > ul > li.last a
    {
        padding-right: 10px;
    }

    .top-nav > ul > li.last:after
    {
        content: none!important;
    }

    .top-nav > ul
    {
        float: right;

        height: 27px;
        margin: 10px 0 0 0;
        padding: 0;
    }

    .top-nav > ul > li
    {
        position: relative;

        float: left;

        min-width: 30px;
        min-height: 27px;
        margin-right: -10px;
        padding-left: 5px;

        list-style: none;

        cursor: pointer;
    }

    .top-nav > ul > li a
    {
        font-weight: bolder;
        line-height: 28px;

        float: left;

        height: 27px;
        padding: 0 10px;

        text-decoration: none;
        text-transform: uppercase;

        color: #000;
        background-color: #fece30;
    }

    .top-nav > ul > li:hover > a
    {
        text-decoration: none;

        color: #fff;
        background-color: #f49200;
    }

    /*second level nav*/
    .top-nav ul > li > ul.active
    {
        display: block;
    }

    .top-nav ul > li > ul
    {
        position: absolute;
        z-index: 50;
        top: 27px;
        left: 5px;

        display: none;

        width: 100%;
        height: auto;
        padding: 0;
    }

    .top-nav > ul > li > ul li
    {
        display: block;

        width: 100%;
        height: 27px;

        cursor: pointer;
    }

    .top-nav > ul > li > ul li a
    {
        font-size: 12px;
        font-weight: normal;

        width: 100%;

        text-transform: none;

        background-color: #f49200;
    }

    .top-nav > ul > li > ul li a:hover
    {
        text-decoration: none!important;

        color: #fff;
    }


    /*Mobile Menu*/
    .outer-wrap
    {
        position: relative;

        overflow: hidden;

        width: 100%;

        background-color: #f49200;
    }

    .inner-wrap
    {
        width: 100%;
        position: relative;
        background-color: #fff;
    }


    /*Section Slider*/
    .slider-container
    {
        width: 100%;
        height: 301px;
    }

    .slider-container .slider ul
    {
        padding: 0;

        list-style: none;
    }

    .slider .tp-caption
    {
        top: 70px;
        left: 80px;
    }

    .slider-text
    {
        font-size: 30px!important;
        font-weight: bold!important;

        width: 633px;
        margin: 0;

        color: #fff!important;
    }

    /*slider overrides*/
    .tparrows
    {
        position: absolute;
        z-index: 100;

        display: block;

        width: 35px;
        height: 55px;

        cursor: pointer;

        background: transparent;
    }

    .tparrows:hover
    {
        background: transparent;
    }

    .tparrows.tp-leftarrow:before
    {
        content: url(/Content/images/slider/arrow-left.png);
    }

    .tparrows.tp-rightarrow:before
    {
        content: url(/Content/images/slider/arrow-right.png);
    }

    /*Content*/
    .breadcrumb
    {
        margin-bottom: 0;
        padding-bottom: 0;

        background-color: #fff5e9;
    }

    .breadcrumb .active
    {
        font-size: 14px;
    }

    .breadcrumb a
    {
        font-size: 14px;

        color: #000;
    }

    .breadcrumb a:hover
    {
        text-decoration: underline;
    }

    .pink-row
    {
        background-color: #fff5e9;
    }

    .main-content h1
    {
        font-size: 28px;
        font-weight: bold;
        line-height: 28px;

        color: #000;
    }

    .main-content h2
    {
        font-size: 20px;
        font-weight: normal;

        color: #f49200;
    }

    .main-content h3
    {
        font-size: 16px;
        font-weight: bold;

        color: #000;
    }

    .main-content h4
    {
        font-size: 14px;
        font-weight: bold;

        color: #000;
    }

    .main-content img
    {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .spotlight
    {
        position: relative;

        height: 138px;
        margin: 10px 0;

        cursor: pointer;

        background-color: #f49200;
    }

    .spotlight:hover
    {
        background-color: #ffcd3f;
    }

    .spotlight .image
    {
        position: absolute;
        top: 8px;
        left: 11px;

        display: inline-block;

        width: 121px;
        height: 121px;

        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    .spotlight .copy
    {
        font-size: 22px;
        font-weight: bold;
        line-height: 24px;

        position: absolute;
        top: 45px;
        left: 145px;

        color: #000;
    }

    .sl-free-init-consult .image
    {
        background-image: url(/Content/images/spotlight-free-init-consultation.png);
    }

    .sl-service-packages .image
    {
        background-image: url(/Content/images/spotlight-our-services.png);
    }

    .sl-our-services .image
    {
        background-image: url(/Content/images/spotlight-service-packages.png);
    }

    .left-yellow-box-small
    {
        position: relative;

        min-height: 60px;
        margin-top: 15px;
        margin-bottom: 15px;
        padding-top: 15px;
        padding-left: 15px;

        background-color: #fece30;
    }

    .left-yellow-box-small .heading
    {
        font-size: 22px;
        font-weight: bold;

        text-transform: uppercase;

        color: #959595;
    }

    .left-yellow-box
    {
        position: relative;

        min-height: 175px;
        margin-top: 15px;
        margin-bottom: 15px;
        padding-top: 15px;
        padding-left: 15px;

        background-color: #fece30;
    }

    .left-yellow-box .heading
    {
        font-size: 22px;
        font-weight: bold;

        text-transform: uppercase;

        color: #959595;
    }

    .left-yellow-box ul
    {
        margin: 15px 0 0 0;
        padding: 0;

        list-style: none;
    }

    .left-yellow-box ul li
    {
        font-size: 16px;

        margin-bottom: 5px;
    }

    .left-yellow-box ul li a
    {
        font-size: 16px;

        text-decoration: none;

        color: #959595;
    }

    .left-yellow-box ul li a:hover
    {
        color: #000;
    }

    .left-yellow-box ul li.active a
    {
        color: #000;
    }

    /*Bootstrap Accordion Overrides*/
    .panel-group .panel
    {
        border-radius: 0;
    }

    .panel-default > .panel-heading
    {
        min-height: 50px;
        color: #333;
        border-color: transparent;
        background-color: #f49200!important;
        background-image: none;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        filter:none;
    }

    .panel-body
    {
        font-size: 12px;
    }

    /*accoridion icons*/
    .accordion-toggle .icon
    {
        display: inline-block;

        width: 50px;
        height: 50px;

        vertical-align: top;

        background-size: 100% 100%;
    }

    .icon-safety-plan
    {
        background-image: url(/Content/images/icons/icon-safety-plan.png);
    }

    .icon-policies-and-procedures
    {
        background-image: url(/Content/images/icons/icon-policies-and-procedures.png);
    }

    .icon-training-and-induction
    {
        background-image: url(/Content/images/icons/icon-training-and-induction.png);
    }

    .icon-monitoring
    {
        background-image: url(/Content/images/icons/icon-monitoring.png);
    }

    .icon-supervision
    {
        background-image: url(/Content/images/icons/icon-supervision.png);
    }

    .icon-reporting
    {
        background-image: url(/Content/images/icons/icon-reporting.png);
    }


    .accordion-toggle .title
    {
        display: inline-block;

        padding: 18px 0 0 10px;
    }

    .accordion-toggle .glyphicon
    {
        display: inline-block;
        float: right;

        padding-top: 18px;
    }

    /*variation for the non top padded accordion*/
    .accordion-2 .title,
    .accordion-2 .glyphicon
    {
        padding-top: 8px;
    }

    .panel-title
    {
        cursor: pointer;
    }

    .panel-title:hover a
    {
        text-decoration: none;

        color: #fff;
    }

    /*Complex rollover*/
    .complex-rollover-container
    {
        position: relative;

        width: 941px;
        height: 317px;

        background-image: url(/Content/Images/Content/Mock/interactive-image.jpg);
        background-size: 100% 100%;
    }

    .rollover-box
    {
        position: absolute;

        display: inline-block;

        width: 293px;
        height: 71px;

        cursor: pointer;

        background-color: #fdcc41;
    }

    .rollover-box:hover
    {
        background-color: #c0c0c0;
    }

    .hidden-content
    {
        display: none;
    }

    .c-box-1
    {
        top: 0;
        left: 0;
    }
    .c-box-2
    {
        top: 82px;
        left: 0;
    }
    .c-box-3
    {
        top: 164px;
        left: 0;
    }
    .c-box-4
    {
        top: 246px;
        left: 0;
    }
    .c-box-5
    {
        top: 246px;
        left: 324px;
    }
    .c-box-6
    {
        top: 0;
        right: 0;
    }
    .c-box-7
    {
        top: 82px;
        right: 0;
    }
    .c-box-8
    {
        top: 164px;
        right: 0;
    }
    .c-box-9
    {
        top: 246px;
        right: 0;
    }

    .box-content
    {
        position: absolute;
        top: 0;
        left: 324px;

        display: none;

        width: 293px;
        height: 235px;
        padding: 15px;

        background-color: transparent;
    }

    .box-content.active
    {
        display: block;

        background-color: #c0c0c0;
    }

    .animated
    {
        -webkit-animation-duration: .7s;
                animation-duration: .7s;

        -webkit-animation-fill-mode: both;
                animation-fill-mode: both;
    }

    @-webkit-keyframes pulse
    {
        0%
        {
            -webkit-transform: scale(1);

            opacity: 0;
        }
        50%
        {
            -webkit-transform: scale(1.025);
        }
        100%
        {
            -webkit-transform: scale(1);

            opacity: 1;
        }
    }

    @keyframes pulse
    {
        0%
        {
            transform: scale(1);

            opacity: 0;
        }
        50%
        {
            transform: scale(1.025);
        }
        100%
        {
            transform: scale(1);

            opacity: 1;
        }
    }

    .pulse
    {
        -webkit-animation-name: pulse;
                animation-name: pulse;
    }

    @-webkit-keyframes fadeIn { 
        0% {opacity: 0;} 
        100% {opacity: 1;} 
    } 

    @keyframes fadeIn { 
        0% {opacity: 0;} 
        100% {opacity: 1;} 
    } 

    .fadeIn { 
        -webkit-animation-name: fadeIn; 
        animation-name: fadeIn; 
    }
    

    .rollover-box span
    {
        font-size: 17px;

        display: inline-block;

        width: 100%;
        margin-top: 15px;

        text-align: center;

        color: #000;
    }

    .box-content span
    {
        display: inline-block;

        width: 100%;

        color: #000;
    }

    /*Section Footer*/
    footer
    {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    footer .content
    {
        min-height: 124px;

        background-color: #1d1d1b;
    }

    footer h4
    {
        font-size: 12px;
        font-weight: bold;

        margin-top: 15px;

        color: #fff;
    }

    footer ul
    {
        margin: 0;
        padding: 0;

        list-style: none;
    }

    footer ul li a
    {
        font-size: 11px;

        color: #fff;
    }

    footer ul li a:hover
    {
        text-decoration: none;

        color: #f49200;
    }

    footer .safety-xchange-logo
    {
        display: inline-block;

        width: 149px;
        height: 89px;
        margin-top: 18px;

        background-image: url(/Content/images/footer-logo.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    footer .call-now
    {
        font-family: 'Tahoma', Segoe UI, Arial, Verdana, sans-serif;
        font-size: 32px;
        font-weight: bold;
        line-height: 20px;

        display: inline-block;
        float: left;

        width: 315px;
        height: 35px;
        margin-top: 25px;

        text-align: left;
        vertical-align: top;
        text-decoration: none;
        text-transform: uppercase;

        color: #fecc40;
    }

    footer .copy-right
    {
        font-size: 12px;

        display: inline-block;

        margin-top: 35px;

        color: #fff;
    }

    footer .csr-logo
    {
        display: inline-block;
        float: right;

        width: 50px;
        height: 50px;

        background-image: url(/Content/images/footer-csr-logo.png);
        background-repeat: no-repeat;
    }


    footer nav
    {
        margin-top: 10px;
    }

    footer nav ul
    {
        margin: 0;
        padding: 0;

        list-style: none;
    }

    footer nav ul li
    {
        float: left;

        margin-right: 5px;
    }

    footer nav ul li:after
    {
        content: ' |';

        color: #6b6b6b;
    }

    footer nav ul li.last:after
    {
        content: none;
    }

    footer nav ul li a
    {
        font-size: 10px;

        text-transform: uppercase;

        color: #6b6b6b;
    }

    footer nav ul li a:hover
    {
        text-decoration: none;

        color: #f49200;
    }

    /*Contact Form*/
    .form .col-xs-6,
    .form .col-xs-12
    {
        margin-bottom: 15px;
    }

    .form .col-xs-6 input
    {
        font-size: 12px;
    }

    .form .col-xs-6 select
    {
        font-size: 12px;
    }

    .form .col-xs-12 input
    {
        font-size: 12px;
    }

    .form textarea.form-control
    {
        font-size: 12px;

        height: 120px;
    }

    .mandatory-fields
    {
        font-size: 10px;
    }

    .submit-button
    {
        font-weight: bold;

        display: block;

        width: 100%;
        padding: 10px;

        text-align: center;

        color: #000;
        background-color: #f49200;

        cursor: pointer;
    }

    .submit-button:hover
    {
        display: block;

        width: 100%;
        padding: 10px;

        text-align: center;

        color: #fff;
        
    }

    /*Form validation*/
    input.has-error,
    select.has-error,
    textarea.has-error
    {
        border: 1px solid #f49200!important;
        background-color: #fbd399!important;
    }

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px)
{
    .media-query-bar
    {
        z-index: 200000;

        background-color: blue;
    }

    /*Section Content*/
    .spotlight .image
    {
        top: 30px;
        left: 11px;

        width: 80px;
        height: 80px;
    }

    .spotlight .copy
    {
        font-size: 18px;
        line-height: 24px;

        top: 45px;
        left: 96px;
    }

    /*Section Footer*/
    footer .safety-xchange-logo
    {
        float: left;

        width: 120px;
        height: 72px;
    }

    footer .call-now
    {
        font-size: 25px;

        float: right;

        width: 180px;
        height: 20px;
        margin-bottom: 15px;

        text-align: right;
    }

    footer .copy-right
    {
        font-size: 10px;

        float: right;

        margin-bottom: 10px;
    }


    footer .csr-logo
    {
        display: inline-block;
        float: right;

        width: 50px;
        height: 50px;
        margin-left: 10px;

        background-image: url(/Content/images/footer-csr-logo.png);
        background-repeat: no-repeat;
    }

    /*Section Header*/
    header
    {
        min-height: 160px;
    }

    header .call-now
    {
        display: none;
    }

    .mobile-menu
    {
        display: block;
        float: right;

        margin-top: 30px;
        margin-left: 15px;
    }

    .mobile-menu i
    {
        font-size: 50px;

        cursor: pointer;

        color: #000;
    }

    .mobile-menu i:hover
    {
        color: #f49200!important;;
    }

   
    /*Mobile Menu*/
    .top-nav
    {
        position: absolute;
        display: none;
        
        height: 100%;

        background-color: #f49200;
    }

    .top-nav > ul
    {
        float: left;

        width: 200px;
        height: auto;
        margin: 20px 0 0 15px;
    }

    .top-nav > ul:before
    {
        content: none;
    }

    .top-nav > ul > li
    {
        font-size: 14px;

        display: block;
        float: left;
        float: none;
        clear: both;

        width: 100%;
        height: auto;
        min-height: 40px;

        border-bottom: solid 1px #b26a00;
    }

    .top-nav > ul > li.last
    {
        margin-right: -10px;
    }

    .top-nav > ul > li:before,
    .top-nav > ul > li:after,
    .top-nav > ul > li.active:before,
    .top-nav > ul > li.active:after
    {
        content: none;
    }

    .top-nav > ul > li a
    {
        margin-bottom: 5px;
        padding: 7px 0 0 10px;

        color: #000;
        background-color: transparent;
    }

    .top-nav > ul > li:hover > a
    {
        color: #fff;
        background-color: transparent;
    }

    .top-nav ul > li > ul
    {
        position: static!important;
        top: 0;
        left: 0;

        display: block;
        clear: both;

        width: 100%;
        margin: 5px 0;
    }

    .top-nav > ul > li > ul li
    {
        display: block;

        width: 100%;
        height: 30px;

        cursor: pointer;
    }

    .top-nav > ul > li > ul li a
    {
        padding: 0 0 0 20px;

        background-color: transparent;
    }

    .top-nav > ul > li > ul li:hover a
    {
        color: #fff;
    }

    /*#region Menu for older browsers with no css transitions*/
    
    /*#region initial state (.js-ready)*/

    /*
    .js-ready .top-nav .block
    {
        background: transparent;
    }
    
    .js-ready .top-nav .close-btn
    {
        display: block;

        opacity: .7;

        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    }

    .js-ready .top-nav .close-btn:focus,
    .js-ready .top-nav .close-btn:hover
    {
        opacity: 1;

        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    }

    */
    
    .js-ready .top-nav
    {
        right: -15px;
    }

    .js-ready .inner-wrap
    {
        right: 0;
    }

    /*#endregion*/

    /*#region menu active state (.js-nav)*/
    .js-nav .inner-wrap
    {
        right: 230px;
    }
    
    .js-nav .top-nav
    {
        top: 0;
        right: -295px;

        display: block;

        width: 280px;
        height: 110%;
        margin-top: 0;

        -webkit-box-shadow: inset 10px 0 13px 0 rgba(0,0,0,.45);
           -moz-box-shadow: inset 10px 0 13px 0 rgba(0,0,0,.45);
                box-shadow: inset 10px 0 13px 0 rgba(0,0,0,.45);
    }
    
    /*#endregion*/
    
    /*#endregion*/

    /*#region Menu recent browsers with css transitions*/
    
    /*#region initial state (.js-ready)*/

    .csstransforms3d.csstransitions.js-ready .top-nav
    {
        right: -15px;

        -webkit-transform: translate3d(100%, 0, 0);
           -moz-transform: translate3d(100%, 0, 0);
            -ms-transform: translate3d(100%, 0, 0);
             -o-transform: translate3d(100%, 0, 0);
                transform: translate3d(100%, 0, 0);

        -webkit-backface-visibility: hidden;
           -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
             -o-backface-visibility: hidden;
                backface-visibility: hidden;
    }

    .csstransforms3d.csstransitions.js-ready .inner-wrap
    {
        right: 0 !important;

        -webkit-transition: -webkit-transform 500ms ease;
           -moz-transition:    -moz-transform 500ms ease;
             -o-transition:      -o-transform 500ms ease;
                transition:         transform 500ms ease;
        -webkit-transform: translate3d(0, 0, 0);
           -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
             -o-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);

        -webkit-backface-visibility: hidden;
           -moz-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
             -o-backface-visibility: hidden;
                backface-visibility: hidden;
    }

    /*
    .csstransforms3d.csstransitions.js-ready .top-nav .block
    {
        -webkit-transition: opacity 300ms 100ms, -webkit-transform 500ms ease;
           -moz-transition: opacity 300ms 100ms ease, -moz-transform 500ms ease;
             -o-transition: opacity 300ms 100ms ease, -o-transform 500ms ease;
                transition: opacity 300ms 100ms ease, transform 500ms ease;
        -webkit-transition-delay: ease, 0s;
        -webkit-transform: translate3d(70%, 0, 0) scale3d(.9, .9, .9);
           -moz-transform: translate3d(70%, 0, 0) scale3d(.9, .9, .9);
            -ms-transform: translate3d(70%, 0, 0) scale3d(.9, .9, .9);
             -o-transform: translate3d(70%, 0, 0) scale3d(.9, .9, .9);
                transform: translate3d(70%, 0, 0) scale3d(.9, .9, .9);
        -webkit-transform-origin: 50% 0;
           -moz-transform-origin: 50% 0;
            -ms-transform-origin: 50% 0;
             -o-transform-origin: 50% 0;
                transform-origin: 50% 0;

        opacity: .7;

        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    }
    */

    /*#endregion*/

    /*#region menu active state (.js-nav)*/

    .csstransforms3d.csstransitions.js-nav .inner-wrap
    {
        -webkit-transform: translate3d(-230px, 0, 0) scale3d(1, 1, 1);
           -moz-transform: translate3d(-230px, 0, 0) scale3d(1, 1, 1);
            -ms-transform: translate3d(-230px, 0, 0) scale3d(1, 1, 1);
             -o-transform: translate3d(-230px, 0, 0) scale3d(1, 1, 1);
                transform: translate3d(-230px, 0, 0) scale3d(1, 1, 1);
    }
    
    /*
    .csstransforms3d.csstransitions.js-nav .top-nav .block
    {
        -webkit-transform: translate3d(0, 0, 0);
           -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
             -o-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);

        opacity: 1;

        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    }
    */

    /*#endregion*/

    /*#endregion*/
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px)
{
    .media-query-bar
    {
        z-index: 300000;

        background-color: purple;
    }

    /*Section Header*/
    header
    {
        min-height: 130px;
    }

    header .safety-xchange-logo
    {
        width: 160px;
        height: 95px;
    }

    header .safety-number
    {
        font-size: 20px;

        width: 150px;
        height: 50px;

        background-image: none;
    }

    header .safety-number a span
    {
        font-size: 15px;
        line-height: 20px;
    }

    /*Slider Text*/
    .slider .tp-caption
    {
        top: 75px;
        left: 60px;
    }

    .slider-text
    {
        font-size: 15px!important;
        line-height: 30px;

        width: 330px;
    }

    /*Section Content*/
    .spotlight .wrapper
    {
        position: relative;

        display: block;

        width: 220px;
        height: 120px;
        margin: 0 auto;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px)
{
    .media-query-bar
    {
        z-index: 400000;

        background-color: green;
    }

    /*Section Header*/
    header
    {
        min-height: 75px;
    }

    header .safety-xchange-logo
    {
        width: 80px;
        height: 47px;
    }

    .mobile-menu
    {
        margin-top: 25px;
    }

    .mobile-menu i
    {
        font-size: 30px;
    }

    header .safety-number
    {
        font-size: 15px;

        width: 110px;
        height: 24px;
        margin-top: 30px;
        margin-right: 0;
    }

    header .safety-number a span
    {
        display: none;
    }

    /*Slider Text*/
    .slider .tp-caption
    {
        display: none;
    }

    /*Section Footer*/
    footer .safety-xchange-logo
    {
        float: left;

        width: 100px;
        height: 60px;
    }

    footer .call-now
    {
        font-size: 18px;

        float: right;

        width: 130px;
        height: 20px;
        margin-bottom: 15px;

        text-align: right;
    }

    /*Accordion*/
    .accordion-toggle .icon
    {
        display: none;
    }

    .accordion-toggle .title
    {
        padding-top: 0;
        padding-left: 0;
    }

    .accordion-toggle .glyphicon
    {
        padding-top: 0;
        padding-left: 0;
    }

    .accordion-2 .title
    {
        width: 195px;
        padding-top: 0;
        padding-left: 0;
    }

    .accordion-2 .glyphicon
    {
        padding-top: 0;
        padding-left: 0;
    }
}



/* Custom, iPhone Retina */
@media only screen and (max-width : 320px)
{
    .media-query-bar
    {
        z-index: 500000;

        background-color: yellow;
    }

    /*Section Home*/
    /*Section Slider*/
    /*Section Map*/
    /*Section Registration*/
}

/*retina images*/
@media all and (-webkit-min-device-pixel-ratio: 1.5)
{
    header .safety-xchange-logo
    {
        /*background-image: url(/Content/images/parkavenue-logo-flat@2x.png);*/
    }
}