@media only screen and (max-width : 1200px) {

    /********** TIP PAGE **********/

    #content-tip .box-blog figure {
        width: 20%;
    }

    #content-tip .box-blog .box-text {
        width: 78%;
    }
}

@media only screen and (max-width : 992px) {    

    /********** PAGE INDEX **********/

    #main a figure img {
        display: inline-block;
        height: 35px;
        margin-top: 10px;
        width: 150px;
    }

    #presentation .overlay .bg-planet-1 {
        background-position: 80px 0;
    }

    #presentation .overlay .bg-planet-2 {
        background-position: 90px 0;
    }

    #presentation .overlay .bg-planet-3 {
        background-position: 80px 0;
    }

    #presentation .overlay .box-router {
        width: 230px;
    }

        #presentation .overlay .box-router .num {
            width: 30px;
        }

            #presentation .overlay .box-router .num p {
                font-size: 30px;
            }

    #presentation .overlay .destaq {
        width: 432px;
        height: 160px;
        margin-left: -216px;
    }

        #presentation .overlay .destaq h1 {
            font-size: 66px;
        }

        #presentation .overlay .destaq h1:nth-child(1) {
            top: 0;
        }

        #presentation .overlay .destaq h1:nth-child(2) {
            top: 40px;
        }

        #presentation .overlay .destaq h1:nth-child(3) {
            top: 80px;
        }

    #about .responsive-video {
        margin-top: 30px;
    }

    #about h2 {
        font-size: 40px;
    }

    #parallax h3 {
        font-size: 26px;
        line-height: 40px;
        padding: 80px;
    }

    #testimonials a.testimonials-carousel-prev {
        float: right;
        margin-top: 30px;
    }

    #testimonials a.testimonials-carousel-next {
        float: left;
        margin-top: 30px;
    }

    #partners a.partners-carousel-prev {
        float: right;
        margin-top: 30px;
    }

    #partners a.partners-carousel-next {
        float: left;
        margin-top: 30px;
    }

    #footer h4.title {
        margin-top: 40px;
        margin-bottom: 15px;
        text-align: center;
    }

    #footer select {
        text-align: center;
        height: 45px;
    }

    #footer form.newsletter .transparent {
        text-align: center;
        background-color: #ffffff;
        border: none;   
        height: 45px;     
        color: #444444;
    }

    #footer form.newsletter button {
        height: 45px;
    }

    /********** PAGE FAQ **********/

    #content-faq form.new-question {
        margin-top: 40px;
    }

    #content-faq h3 {
        margin-top: 40px;
    }

    #content-faq form.new-question button {
        margin-top: 10px;
    }
    
    /********** PAGE DECISION **********/

    #content-decision .accordion,
    #content-result .accordion {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        list-style-type: none;
        display: inline-block;
    }

        #content-decision .accordion li,
        #content-result .accordion li {
            width: 100%;
            float: none;
            margin-left: 0px;
            max-width: none;
            margin-top: 5px;            
        }

            #content-decision .accordion li a,
            #content-result .accordion li a {
                padding: 20px;
            }

                #content-decision .accordion li a i,
                #content-result .accordion li a i {
                    font-size: 22px;
                    margin: 0;
                    float: left;
                }

                #content-decision .accordion li a p,
                #content-result .accordion li a p {
                    margin: 0;
                }

    #content-decision .table-responsive,
    #content-result .table-responsive {
        margin-top: 20px;
    }

    #content-decision .box-nums,
    #content-result .box-nums {
        margin-top: 10px;
        padding: 20px;
    }

    #content-result .content-ranking input[type="text"] {
        margin-top: 10px;
    }

    /********** TRAINING PAGE **********/

    #content-training .box-blog {
        margin-top: 20px;
    }

    /********** TIP PAGE **********/

    #content-tip .box-blog {
        margin-top: 20px;
    }

    /********** MENU **********/

    #main ul.nav-mob li.login-mob > ul li a {
        font-size: 18px;
        padding: 6px;
    }

    #main ul.nav-mob li.login-mob > ul {
        width: 380px;
    }

    #main ul.nav-mob li.search-mob ul li form input {
        height: 40px;
    }

    #main ul.nav-mob li.search-mob ul li form button {
        top: 6px;
    }   

    #main ul.nav-mob li.search-mob ul {
        width: 418px;
    }

    #main ul.nav-mob li a.search i, #main ul.nav-mob li a.bars i {
        font-size: 30px;
        font-weight: normal;
        margin-top: 3px;
    }

    /********** LOGINS **********/
    #access .overlay button[type="submit"] {
        margin-top: 10px;
    }

    /********** CONTACT PAGE **********/

    #content-contact ul.others-contacts {
        margin-top: 40px;
    }

    #content-contact .form-contact {
        margin-top: 40px;
    }

    #content-contact .form-contact button {
        margin-top: 15px;
    }

}

@media only screen and (max-width : 768px) {

    /********** PAGE INDEX **********/

    #presentation .overlay .box-router {
        width: 90%;
        margin: 0 auto;
        margin-top: 10px;
        background-color: rgba(0,0,0,0.5);
        padding: 10px;
    }

    #presentation .overlay .box-router:last-child {
        margin-bottom: 20px;
    }

        #presentation .overlay .box-router .num {
            width: 10%;
        }

        #presentation .overlay .box-router .text {
            width: 75%;
        }

    #presentation .overlay .destaq {
        top: 110px;
    }

    #presentation .overlay .bg-planet-1 {
        background-image: none;
        background-position: none;
        min-height: 0px;
    }

        #presentation .overlay .bg-planet-1 .box-router {
            background-image: url(../img/bg-planet-1-small.png);
            background-position: 102% -18%;
            background-repeat: no-repeat;
        }

    #presentation .overlay .bg-planet-2 {
        background-image: none;
        background-position: none;
        min-height: 0px;
    }

        #presentation .overlay .bg-planet-2 .box-router {
            background-image: url(../img/bg-planet-2-small.png);
            background-position: 102% -18%;
            background-repeat: no-repeat;
        }

    #presentation .overlay .bg-planet-3 {
        background-image: none;
        background-position: none;
        min-height: 0px;
    }

        #presentation .overlay .bg-planet-3 .box-router {
            background-image: url(../img/bg-planet-3-small.png);
            background-position: 102% -18%;
            background-repeat: no-repeat;
        }

    #presentation .overlay .container {
        margin-top: 300px;
    }

    #presentation .overlay .box-router .text h3 {
        font-size: 20px;
        font-weight: 600;
    }

    #presentation .overlay .box-router .text p {
        margin-top: 5px;
    }

    #parallax h3 {
        font-size: 22px;
        line-height: 40px;
        padding: 80px 20px;
    }

    #about a.btn-blue {
        font-size: 16px;
    }

    /********** PAGE PRODUCTS **********/

    #content-products form {
        float: none;
    }

    /********** TRAINING PAGE **********/

    #content-training .box-blog figure {
        width: 20%;
    }

    #content-training .box-blog .box-text {
        width: 78%;
    }

    #content-training .box-blog figure .coments p {
        font-size: 16px;
    }

    /********** BLOG PAGE **********/

    #content-blog .box-blog figure {
        width: 20%;
    }

    #content-blog .box-blog .box-text {
        width: 78%;
    }

    #content-blog .box-blog figure .coments p {
        font-size: 16px;
    }

    /********** TIP PAGE **********/

    #content-tip .box-blog figure {
        width: 20%;
    }

    #content-tip .box-blog .box-text {
        width: 78%;
    }

    #content-tip .box-blog figure .coments p {
        font-size: 16px;
    }

    #content-tip .content-tip .highlight {
        font-size: 26px;
    }

}

@media only screen and (max-width : 480px) {

    /********** PAGE INDEX **********/

    #presentation .overlay .destaq {
        width: 280px;
        height: 100px;
        margin-left: -140px;
        top: 130px;
    }

    #presentation .overlay .container {
        margin-top: 0;
    }

    #presentation .overlay .destaq h1 {
        font-size: 44px;
    }

    #presentation .overlay .destaq h1:nth-child(1) {
        top: 0;
        left: 63px;
    }

    #presentation .overlay .destaq h1:nth-child(2) {
        top: 25px;
    }

    #presentation .overlay .destaq h1:nth-child(3) {
        top: 50px;
        left: 59px;
    }

    #parallax h3 {
        font-size: 20px;
        line-height: 40px;
        padding: 60px 20px;
    }

    #main ul li.search-mob ul {
        width: 258px;
    }

    #about a.btn-blue {
        font-size: 14px;
    }

    /********** TRAINING PAGE **********/

    #content-training .box-blog .box-text a h4 {
        font-size: 17px;
    }

    #content-tip .box-blog .box-text a h4 {
        font-size: 17px;
    }

    /*********** MENU **********/

    #main ul.nav-mob li.login-mob > ul {
        width: 290px;
    }

    #main ul.nav-mob li.search-mob ul {
        width: 328px;
    }

    /********** TIP PAGE **********/
    
    #content-tip .content-tip .highlight {
        font-size: 20px;
    }

}

@media only screen and (max-width : 390px) {

    /*********** MENU **********/

    #main ul.nav-mob li.login-mob > ul {
        width: 230px;
    }

    #main ul.nav-mob li.search-mob ul {
        width: 255px;
    }

}

@media only screen and (max-width : 320px) {

    /*********** MENU **********/

    #main ul.nav-mob li.login-mob > ul {
        width: 210px;
    }

}