@media (max-width : 768px)
{
@import url(https://fonts.googleapis.com/css?family=Exo+2:400,500,600,700,400italic);
    /* CSS RESET */
    /* http://meyerweb.com/eric/tools/css/reset/
       v2.0 | 20110126
       License: none (public domain)
    */
    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, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video
    {
        margin         : 0;
        padding        : 0;
        border         : 0;
        font-size      : 100%;
        font           : inherit;
        vertical-align : baseline;
    }

    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section
    {
        display : block;
    }

    body
    {
        line-height : 1;
    }

    ol, ul
    {
        list-style : none;
    }

    blockquote, q
    {
        quotes : none;
    }

    blockquote:before, blockquote:after,
    q:before, q:after
    {
        content : '';
        content : none;
    }

    table
    {
        border-collapse : collapse;
        border-spacing  : 0;
    }

    /* WEB CSS */
    body
    {
        font-family : 'Exo 2', sans-serif;
        height      : 100%;
        width       : 100%;
        color       : #2E3945;
        background  : url("./../images/ecocrush_background_mazaks.jpg");
    }

    hr.hr
    {
        border        : 1px solid #EF7D00;
        width         : 100%;
        margin        : 0 auto;
        margin-top    : -29px;
        margin-bottom : 29px;
        margin-right  : 0px;
        display:none;
    }

    strong
    {
        font-weight : 600;
    }

    sup
    {
        font-size      : 15px;
        line-height    : 15px;
        vertical-align : super;
    }

    /* HEADER */
    div#header
    {
        width  : 100%;
        height : auto;
        margin : 0 auto;
    }

    div#header div#top
    {
        height   : 179px;
        width    : 100%;
        margin   : 0 auto;
        overflow : hidden;
    }

    div#header div#top div.logo-container
    {
        margin : 0 auto;
        width  : 300px;
        height : 99px;
    }

    div#header div#top div.logo
    {
        float      : left;
        width      : 225px;
        margin-top : 12px;
    }

    div#header img.logo-img
    {
        float  : left;
        height : 75px;
        width  : 75px;
    }

    div#header div.contacts
    {
        width           : 100%;
        height          : 80px;
        float           : none;
        margin          : 0 auto;
        background      : url("./../svg/mobile_top_bg.svg");
        background-size : cover;
        overflow        : hidden;
    }

    div#header div#top object.eco-text
    {
        float         : right;
        margin-top    : 12px;
        margin-left   : 10px;
        margin-bottom : 10px;
        height        : 28px;
        width         : 225px;
    }

    div#header div#top p.logo-text
    {
        font-size   : 17px;
        text-align  : right;
        font-weight : bold;
    }

    div#header div.contacts object.mobileYoutube
    {
        float        : right;
        height       : 28px;
        margin-top   : -56px;
        margin-right : 30px;
        display      : initial;
    }

    div#header div.contacts object.ico
    { display : none; }

    div#header div.contacts object.mobileIco
    {
        width   : 25px;
        height  : 25px;
        margin  : 5px;
        display : initial;
    }

    div#header div.contacts div.top
    {
        width      : 265px;
        margin     : 0 auto;
        margin-top : 10px;
    }

    div#header div.contacts p.text
    {
        font-weight : 600;
        font-size   : 30px;
        margin-top  : 2.5px;
        float       : right;
    }

    div#header div.contacts div.bottom
    {
        width  : 180px;
        margin : 0 auto;
    }

    div#header div.contacts div.bottom p.text
    {
        font-size  : 17px;
        text-align : left;
        width      : auto;
        margin-top : 9px;
    }

    /* NAV */
    div#nav
    {
        display : none;
    }

    /* Slider */
    div#slider
    {
        width      : 100%;
        margin-top : -1px;
        height     : auto;
        overflow   : hidden;
    }

    div#slider .slider
    {
        display : none;
    }

    
    div#slider div.overlay
    {
        width            : 100%;
        height           : 345px;
        background-color : black;
        opacity          : 0.2;
        margin-top       : -345px;
        position         : relative;
        z-index          : 99;
    }

    div#slider div#overlayText
    { overflow : hidden; width : 100%; height : auto }

    div#slider div#overlayText p#top
    {
        color       : white;
        font-weight : 600;
        font-size   : 25px !important;
        text-align  : center;
        margin-top  : -195px;
        position    : absolute;
        width       : 100%;
        z-index     : 999;
    }

    div.wut
    { display : none; }

    div.mobileWut
    {
        width      : 100%;
        margin-top : 0px;
        height     : auto;
        display    : initial;
    }

    div#slider div#overlayText p#middle
    {
        color      : white;
        font-size  : 18px;
        text-align : center;
        margin-top : -145px;
        width      : 100%;
        position   : absolute;
        z-index    : 999;
    }

    div#slider div#overlayText p#middle2
    {
        font-size   : 30px;
        text-align  : center;
        margin      : 0 auto;
        margin-top  : 30px;
        font-weight : 600;
        width       : 360px;
        line-height : 37px;
        height      : 37px;
        background  : url("./../svg/text_backgr_01.svg");
    }

    div#slider div#overlayText p#middle3
    {
        font-size   : 30px;
        text-align  : center;
        margin      : 0 auto;
        margin-top  : 10px;
        font-weight : 600;
        width       : 400px;
        line-height : 37px;
        height      : 37px;
        background  : url("./../svg/text_backgr_02.svg");
    }

    div#slider div#overlayText p#bottom
    {
        font-size       : 16px;
        text-align      : center;
        margin          : 0 auto;
        margin-top      : -10px;
        font-weight     : 600;
        width           : auto;
        line-height     : 26px;
        padding         : 35px 60px;
        height          : auto;
        color           : white;
        background      : url("./../svg/text_backgr_03.svg");
        background-size : cover;
        z-index         : 9999;
        position        : relative;
    }

    div.mobileSlider {
        width:100%;
        height:300px;
        display : block;
        background :url("./../images/mobile_hero.jpg");
        -webkit-background-size :cover; background-size :cover;
    }

    /* CONTENT */
    div#services
    {
        width : 100%;
        color : white;
    }

    div#services div.heading1
    {
        margin      : 0 auto;
        width       : 270px;
        height      : auto;
        font-size   : 18px;
        line-height :40px;
        padding:5px;
        font-weight : 600;
        color       : white;
        margin-top  : 60px;
        text-align  : center;
        position    : relative;
        background  : url("./../svg/title_backgr_01.svg");
        background-size:cover;
    }

    div#content
    {
        width       : 100%;
        margin      : 0 auto;
        font-weight : 600;
        font-size   : 16px;
    }

    div.content
    {
        margin-top : 60px;
    }

    div#services div.contentRow.mid
    { margin : 30px auto; }

    div#services div.contentRow
    {
        background : url("./../svg/info_backgr_01.svg");
        width      : 300px;
        height     : 447px;
        float      : none;
        margin     : 0 auto;
        overflow   : hidden;
    }

    div#services p.contentHeading
    {
        text-align  : center;
        line-height : 20px;
        margin      : 10px;
    }

    div#services p.contentText
    {
        text-align  : center;
        line-height : 120%;
        width       : 280px;
        margin-left : 10px;
        font-weight : 400;
    }

    div#services img.contentImg
    {
        width         : 280px;
        height        : 170px;
        margin-top    : 40px;
        margin-left   : 10px;
        margin-bottom : 20px;
    }

    div#why
    { clear : both }

    div#why div.heading2
    {
        margin: 0 auto;
        width: 90%;
        font-size: 18px;
        font-weight: 600;
        color: white;
        margin-top: 100px;
        text-align: center;
        position: relative;
        background: url("./../svg/title_backgr_02.svg");
        background-size: cover;
        display: block;
        height: auto;
        padding: 10px;
        line-height: 20px;
    }

    div#why div.contentRow
    {
        width  : 300px;
        margin : 0 auto;
        float  : none;
    }

    div#why div.contentRow.mid
    {
        margin : 30px auto;
    }

    div#why p.contentHeading
    {
        font-weight   : 600;
        font-size     : 18px;
        text-align    : center;
        line-height   : 120%;
        margin-bottom : 10px;
    }

    div#why object.contentObj
    {
        width         : 80px;
        height        : 80px;
        margin-left   : 110px;
        margin-bottom : 10px;
    }

    div#why p.contentText
    {
        line-height : 120%;
        text-align  : center;
        font-weight : 400;
    }

    div#form
    {
        clear    : both;
        overflow : hidden;
        width    : 100%;
    }

    div#form form
    { width : 100%; margin-left : 0px; }

    div#form div.heading3
    {
        margin      : 0 auto;
        max-width       : 380px;
        width:90%;
        height      : auto;
        line-height : 20px;
        font-size   : 18px;
        font-weight : 600;
        color       : white;
        margin-top  : 100px;
        text-align  : center;
        position    : relative;
        background  : url("./../svg/title_backgr_02.svg");
        background-size :cover;
        padding:10px;
    }

    div#form div.subHeading
    {
        text-align : center;
        margin-top : 55px;
    }

    div#form div.content
    { margin-top : 25px; }

    div#form div.row
    {
        width : 100%;
        float : left;
    }

    div#form label.label
    {
        width         : 100%;
        display       : block;
        margin-bottom : 5px;
        text-align    : center;
        margin-top    : 30px;
    }

    div#form label.label:first-child
    {
        margin-top : 0;
    }

    div#form input.input
    {
        border        : 1px solid #A4A4A4;
        border-radius : 4px;
        font-size     : 16px;
        font-style    : italic;
        font-family   : inherit;
        padding       : 0 10px;
        line-height   : 28px;
        width         : 80%;
        max-width :350px;
        margin        : 0 auto;
        display       : block;
        text-align:center;
    }

    div#form p.add
    {
        font-weight   : normal;
        margin-top    : 10px;
        margin-bottom : 20px;
        text-align    : center;
    }
    div#form div.upload {
        width:320px;
        margin:0 auto;
    }

    div#form textarea
    {
        width         : 90%;
        max-width:550px;
        height        : 110px;
        float         : none;
        display : block;
        margin: 0 auto;
        border        : 1px solid #A4A4A4;
        border-radius : 4px;
        font-size     : 16px;
        font-style    : italic;
        font-family   : inherit;
        padding       : 10px;
    }

    div#form div.smallrow
    {
        width      : 100%;
        float      : left;
        margin-top : 25px;
        margin-bottom:25px;
    }

    div#form div.smallrow div.contentRow
    {
        width : 90%;
        float : none;
        margin:0 auto;
        padding-bottom: 10px;

    }

    div#form div.smallrow div.contentRow input
    {
        width : 90%;
    }

    div#form div.smallrow div.contentRow.mid
    {
        margin : 0 auto;
    }

    div#form div.error
    {
        display          : none;
        width            : 90%;
        clear:both;
        float            : none;
        margin: 0 auto;
        margin-top       : 30px;
        text-align       : center;
        border-radius    : 4px;
        background-color : #FFBDC9;
        color            : #DC090F;
        height           : auto;
        line-height      : 24px;
        margin-bottom:25px;
    }

    div#form input[type=submit]:hover
    { background : #EC8E29; }

    div#form input[type=submit]
    {
        float              : none;
        height             : 35px;
        font-size          : inherit;
        font-weight        : 600;
        font-family        : inherit;
        padding            : 0;
        width              : 236px;
        border             : none;
        background         : #EF7D00;
        border-radius      : 4px;
        margin:0 auto;
        display : block;
        -webkit-appearance : none;
    }

    div#tech
    {
        clear    : both;
        overflow : hidden;
    }

    div#tech div.heading3
    {
        margin: 0 auto;
        width: 90%;
        max-width: 565px;
        height: auto;
        line-height: 20px;
        font-size: 18px;
        display: block;
        font-weight: 600;
        color: white;
        margin-top: 100px;
        text-align: center;
        position: relative;
        background: url("./../svg/title_backgr_02.svg");
        background-size: cover;
        word-wrap: break-word;
        padding: 10px;
    }

    div#tech div.content
    {
        width : 100%;
        float : left;
    }

    div#tech div.contentRow
    {
        width: 300px;
        float: none;
        display: block;
        margin: 0 auto;
    }

    div#tech div.contentRow.mid
    {
        margin : 30px auto;
    }

    div#tech div.contentHeading
    {
        background  : url("./../svg/title_backgr_01.svg");
        width       : 300px;
        height      : 50px;
        line-height : 50px;
        text-align  : center;
        color       : white;
        position    : relative;
    }

    div#tech img
    {
        width      : 300px;
        margin-top : -30px;
    }

    div#tech p
    {
        font-weight : normal;
    }

    div#gallery
    {
        clear    : both;
        overflow : hidden;
        width    : 100%;
    }

    div#gallery div.heading1
    {
        background  : url("./../svg/title_backgr_galery.svg");
        width       : 180px;
        height      : auto;
        line-height : 40px;
        font-size :18px;
        text-align  : center;
        color       : white;
        position    : relative;
        margin      : 0 auto;
        margin-top  : 100px;
        background-size: contain;
    }

    div#gallery div.content
    {
        width      : 100%;
        margin     : 0 auto;
        margin-top : 55px;
    }

    div#gallery div.firstRow,
    div#gallery div.secondRow {
        width: 90%;
        max-width: 616px;
        display: block;
        margin: 0 auto;
    }

    div#gallery div.firstRow img
    {
        max-width: 300px;
        float: right;
        margin-bottom: 16px;
        width: 49%;
    }

    div#gallery div.firstRow img:first-child
    { margin-right : 0; float:left}

    div#gallery div.secondRow img
    {     max-width: 195px;
        width: 100%;}

    div#gallery div.secondRow img
    {
        margin-right  : 2%;
        float         : left;
        margin-bottom : 45px;
        max-width :32%;
        overflow : hidden;
    }

    div#gallery div.secondRow div.lastImage {
        float: left;
        margin-bottom: 45px;
        max-width: 32%;
        overflow: hidden;
        margin-right: 0;
        height:auto;
    }

    div#gallery div.secondRow img.last
    {
        margin-right: 0px;
        float: right;
        width: 100%;
        position: relative;
        height: 100%;
        max-width: 100%;
    }

    div#gallery div.youtubevideo
    { margin-bottom : 45px; }
    div#gallery div.youtubevideo iframe {
        max-width: 616px;
        width: 90%;
        margin: 0 auto;
        display: block;
    }

    div#footer
    {
        width      : 100%;
        background : #EF7D01;
        min-height : 153px;
    }

    div#footer div.content
    {
        width    : 100%;
        margin   : 0 auto;
        overflow : hidden;
    }

    div#footer div.left
    {
        float: left;
        font-weight: 400;
        max-width: 600px;
        width: 90%;
        margin: 45px 35px;
        font-size: 14px;
        text-align: center;
        line-height: 21px;
    }

    div#footer div.right
    {
        float: left;
margin:0;
        width: 100%;
        height: 76px;
}

    div#footer object
    {
        width   : 25px;
        height  : 25px;
        float   : left;
        padding : 5px;
    }

    div#footer div.phone {
        margin: 0 auto;
        width: 187px;
        height: 30px;
        overflow: hidden;
    }
    div#footer div.phone p
    {
        float       : left;
        font-weight : 600;
        font-size   : 20px;
        line-height : 35px;
    }

    div#footer div.email {
        margin: 0 auto;
        width: 180px;
        height: 30px;
        overflow: hidden;
    }
    div#footer div.email p
    {
        float       : left;
        font-weight : 600;
        line-height : 35px;
    }

    .slick-list
    {
        width : 100%;
    }

    input[type=file]
    {
        width    : 0.1px;
        height   : 0.1px;
        opacity  : 0;
        overflow : hidden;
        position : absolute;
        z-index  : -1;
    }

    input[type=file] + label
    {
        font-weight: 700;
        cursor: pointer;
        float: none;
        overflow: hidden;
        background: #EC8E29;
        height: 30px;
        line-height: 30px;
        text-align: center;
        border-radius: 4px;
        width: 200px;
        margin: 0 auto;
        display: none;
        text-decoration: underline;
        margin-top: 15px;
        max-width :250px;
    }

    label.photoLabel:first-child
    { display : block; }

    div#form div.row .photoDelete
    {
        float      : right;
        margin     : 5px;
        padding    : 0;
        width      : 20px;
        height     : 20px;
        display    : none;
        color      : rgba(0, 0, 0, 0);
        background : url("./../svg/delete-01.svg");
        margin-top: -25px;
    }

    div#form input[type=submit].photoDeleteOne
    {
        display : none;
    }

    .required
    {
        border : 2px solid #DC090F !important;
    }

}
@media (max-width: 400px) {
    div#slider div#overlayText p#middle3 {
        width: 90%;
        font-size: 20px;
    }
    div#slider div#overlayText p#top {
        font-size :20px !important;
    }


    div#slider div#overlayText p#middle2 {
        width: 90%;
        font-size: 20px;
    }
}
@media (max-width: 470px) {
    object.mobileYoutube {
        display: none !important;
    }
}
@media (max-width: 670px) {
    div#gallery div.secondRow div.galleryOverlay {
        display: none !important;
    }
}
@media (max-width: 800px) {
    div#slider div#overlayText p#top {
        font-size:50px;
    }
}