.relative {
    position: relative;
}

.full {
    width: 100%;
    height: 100%;
}

.right {
    float: right;
}

.hidden {
    display: none;
}


@media all and (min-width: 1600px) {
    /* WIDE SCREEN & PC */

    .wide-page {
        display: block;
    }

    .tablet-page {
        display: none;
    }

    .mobile-page {
        display: none;
    }

}

@media all and (min-width: 768px) and (max-width: 1599px) {
    /* TABLET DEVICES */

    .wide-page {
        display: none;
    }

    .tablet-page {
        display: block;
    }

    .mobile-page {
        display: none;
    }

}

@media all and (max-width: 767px) {
    /* MOBILE DEVICES */

    .wide-page {
        display: none;
    }

    .tablet-page {
        display: none;
    }

    .mobile-page {
        display: block;
    }

}

.wide-content {
    position: relative;
    width: 1600px;
    height: auto;
    margin: 0 auto 0 auto;
}

.wide-content2 {
    position: relative;
    width: 1009px;
    height: auto;
    margin: 0 auto 0 auto;
}

/* TABLET STYLES -------------------------------------------------------------------------------------- */

.tablet-content {
    position: relative;
    width: 768px;
    height: auto;
    margin: 0 auto 0 auto;
}

.tablet-content2 {
    position: relative;
    width: 688px;
    height: auto;
    margin: 0 auto 0 auto;
}

/* MOBILE STYLES -------------------------------------------------------------------------------------- */

.mobile-page {
    position: relative;
    width: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.mobile-header {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100px;
    z-index: 100;
}

.mobile-header-content {
    position: relative;
    width: 320px;
    height: 100%;
    margin: 0 auto 0 auto;
}

.mobile-dumptools {
    position: absolute;
    top: 38px;
    left: 20px;
    width: 129px;
    height: 24px;
    background: url(/images/dump-tools.png) center center no-repeat;
}

.mobile-com {
    position: absolute;
    top: 41px;
    left: 153px;
    width: 27px;
    height: 18px;
    background: url(/images/com.png) center center no-repeat;
}

.mobile-menu {
    position: absolute;
    top: 38px;
    left: 278px;
    width: 72px;
    height: 24px;
    background: url(/images/menu.png) 0px center no-repeat;
    padding: 2px 0 0 30px;
    box-sizing: border-box;

    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
    color: #262626;

    cursor: pointer;
}

.mobile-header-buttons {
    position: absolute;
    top: 28px;
    left: 200px;
    width: auto;
    height: 42px;
}

.mobile-header-pad {
    position: relative;
    width: 100%;
    height: 100px;
}

.mobile-header-menu {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 366px;
    background: white;
    z-index: 100;
}

.mobile-context-menu-background {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 80;
    background: black;
    opacity: 0.10;
}

.mobile-header-menu-line {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 400px;
    background: white;
    z-index: 100;
}

.mobile-header-menu-line2 {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 400px;
    background: white;
    z-index: 81;
}

.mobile-header-menu .content {
    position: absolute;
    left: 20px;
    top: 50px;
    width: calc(100% - 40px);
    height: calc(400px - 50px);
}

.mobile-header-menu .menu {
    position: absolute;
    top: 24px;
    left: 20px;
    width: auto;
    height: auto;
    
    font-family: VerdanaBold;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
}

.mobile-header-menu .close {
    position: absolute;
    top: 23px;
    left: 276px;
    width: 24px;
    height: 24px;
    background: url(/images/close.png) center center no-repeat;
    cursor: pointer;
}

.mobile-header-menu table {
    width: 100%;

    border-spacing: 0px;
    border-collapse: separate;
    box-sizing: border-box;
    table-layout: fixed;
}

.mobile-header-menu td {
    padding: 14px 0 14px 0;
}

.mobile-header-menu .td-underline {
    border-bottom: 1px solid #E8ECF4;
}

.mobile-header-menu .discount-count {
    position: relative;
    display: inline-block;
    top: -7px;
    width: auto;
    height: auto;
    
    font-family: Verdana;
    font-style: normal;
    font-weight: 600;
    font-size: 8px;
    line-height: 10px;
    text-transform: uppercase;

    background: #F60A34;
    color: white;
    border-radius: 4px;
    padding: 4px 6px;
    box-sizing: border-box;
}

.mobile-header-menu a, .mobile-header-menu a:visited {
    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 18px;
    text-decoration: none;

    color: #262626;
}

.mobile-header-menu .online {
    position: relative;
    display: inline-block;
    top: -7px;
    width: auto;
    height: auto;
    
    font-family: Verdana;
    font-style: normal;
    font-weight: 600;
    font-size: 8px;
    line-height: 10px;
    text-transform: uppercase;

    background: #2F80ED;
    color: white;
    border-radius: 4px;
    padding: 4px 6px;
    box-sizing: border-box;
}

.mobile-content {
    position: relative;
    width: 320px;
    height: auto;
    margin: 0 auto 0 auto;
}

.mobile-content2 {
    position: relative;
    width: 280px;
    height: auto;
    margin: 0 auto 0 auto;
}



/* WIDE PAGE */

.wide-page {
    position: relative;
    width: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.wide-header {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100px;
    z-index: 100;
    background: white;
}

.wide-header-content {
    position: relative;
    width: 1600px;
    height: 100%;
    margin: 0 auto 0 auto;
}

.wide-content {
    position: relative;
    width: 1600px;
    height: auto;
    margin: 0 auto 0 auto;
}

.wide-dumptools {
    position: absolute;
    width: 129px;
    height: 24px;
    left: 192px;
    top: 38px;
    background: url(/images/dump-tools.png) center center no-repeat;
}

.wide-dumptools-com {
    position: absolute;
    width: 160px;
    height: 24px;
    left: 0px;
    top: 38px;
    background: url(/images/dump-tools2.png) center center no-repeat;
}

.wide-dumptools-by {
    position: absolute;
    width: 160px;
    height: 24px;
    left: 0px;
    top: 38px;
    background: url(/images/dump-tools3.png) center center no-repeat;
}

.wide-ecufix-icon {
    position: absolute;
    width: 48px;
    height: 48px;
    left: 0px;
    top: 28px;
    background: url(/images/icon_ecufix.PNG) center center no-repeat;
}

.wide-ecufix-info {
    position: absolute;
    width: 137px;
    height: 38px;
    left: 58px;
    top: 34px;
    background: url(/images/ecufix.png) center center no-repeat;
}

.wide-com {
    position: absolute;
    width: 27px;
    height: 18px;
    left: 325px;
    top: 41px;
    background: url(/images/com.png) center center no-repeat;
}

.auth-button {
    position: relative;
    top: -16px;
    width: auto;
    height: auto;
    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    padding: 12px 16px;
    margin: 0 10px 0 0;
    border: 0;
    background: #2F80ED;
    border-radius: 4px;
    color: white;
    outline: none;
}

    .auth-button:hover {
        background: #1e6acf;
    }

    .auth-button:active {
        background: #1959ae;
    }

.signin-button {
    position: relative;
    top: -8px;
    width: auto;
    height: 60px;
    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    padding: 12px 16px;
    margin: 0 10px 0 0;
    border: 0;
    background: #2F80ED;
    border-radius: 4px;
    color: white;
    outline: none;
}

    .signin-button:hover {
        background: #1e6acf;
    }

    .signin-button:active {
        background: #1959ae;
    }


.cart-button {
    position: relative;
    top: -8px;
    width: auto;
    height: 60px;
    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    padding: 12px 16px 12px 40px;
    margin: 0 10px 0 0;
    border: 0;
    border-radius: 4px;
    color: black;
    outline: none;
    background: url(/images/cart2.png) 16px center no-repeat #F1F6FD;
}

    .cart-button:hover {
        background: url(/images/cart2.png) 16px center no-repeat #c2cddc;
    }

    .cart-button:active {
        background: url(/images/cart2.png) 16px center no-repeat #899dba;
    }

.wide-header-pad {
    position: relative;
    width: 100%;
    height: 100px;
}

/* TABLET PAGE */

.tablet-page {
    position: relative;
    width: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.tablet-header {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100px;
    z-index: 100;
    background: white;
}

.tablet-header-content {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto 0 auto;
}

.tablet-dumptools {
    position: absolute;
    width: 129px;
    height: 24px;
    left: 21px;
    top: 38px;
    background: url(/images/dump-tools.png) center center no-repeat;
}

.tablet-dumptools-com {
    position: absolute;
    width: 160px;
    height: 24px;
    left: 21px;
    top: 38px;
    background: url(/images/dump-tools2.png) center center no-repeat;
}

.tablet-dumptools-by {
    position: absolute;
    width: 160px;
    height: 24px;
    left: 20px;
    top: 38px;
    background: url(/images/dump-tools3.png) center center no-repeat;
}

.tablet-ecufix-icon {
    position: absolute;
    width: 48px;
    height: 48px;
    left: 21px;
    top: 28px;
    background: url(/images/icon_ecufix.PNG) center center no-repeat;
}

.tablet-ecufix-info {
    position: absolute;
    width: 137px;
    height: 38px;
    left: 80px;
    top: 34px;
    background: url(/images/ecufix.png) center center no-repeat;
}

.tablet-com {
    position: absolute;
    width: 27px;
    height: 18px;
    left: 155px;
    top: 41px;
    background: url(/images/com.png) center center no-repeat;
}

.tablet-header-pad {
    position: relative;
    width: 100%;
    height: 100px;
}


.mobile-dumptools {
    position: absolute;
    top: 38px;
    left: 20px;
    width: 129px;
    height: 24px;
    background: url(/images/dump-tools.png) center center no-repeat;
}

.mobile-dumptools-com {
    position: absolute;
    top: 38px;
    left: 20px;
    width: 160px;
    height: 24px;
    background: url(/images/dump-tools2.png) center center no-repeat;
}

.mobile-dumptools-by {
    position: absolute;
    top: 38px;
    left: 20px;
    width: 160px;
    height: 24px;
    background: url(/images/dump-tools3.png) center center no-repeat;
}

.mobile-ecufix-info {
    position: absolute;
    width: 157px;
    height: 58px;
    top: 20px;
    left: 50px;
    background: url(/images/ecufix_mobile.png) center center no-repeat;
}

.mobile-com {
    position: absolute;
    top: 41px;
    left: 153px;
    width: 27px;
    height: 18px;
    background: url(/images/com.png) center center no-repeat;
}