@media only screen 
and (min-width : 320px) 
and (max-width : 767px) {
    .header {
        padding-top: 70%;
    }

    .content {
        width: 95%;
    }

    .container-bottom {
        font-size: 15px;
    }

    .container-bottom .hint {
        margin-top: 5%;
    }

    .container-bottom .arrow-down {
        width: 30px;
        height: 30px;
    }

    .smart-header {
        height: auto;
        left: -2.5vw;
    }

    .brandWrapper
    {
        width: 100% !important; 
    }

    /********** Main Menu *************/
    .main-menu {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        padding: 0;
        left: -2.5vw;
    }

    .menu-logo-wrapper {
        width: 90%;
        margin: 30px auto;
    }

    .static-section .menu-close {
        width: 20px;
        height: 20px;
        margin-left: -10px;
    }

    .menu-list .submenu {
        position: relative;
        display: block;
        -webkit-transform: translate(0);
                transform: translate(0);
        white-space: normal;
        max-width: none;
        width: 100%;
        max-height: 0;
    }

    .menu-list .submenu > li {
        display: block;
        margin: 5px 0;
        width: 100%;
    }

    .menu-list > li:hover > a + .submenu {
        max-height: 400px;
    }

    .menu-list .submenu > li > a:before, .menu-list .submenu > li > a:after {
        display: none;
    }

    .menu-list .submenu > li:after {
        display: none;
    }

    .menu-list > li {
        text-align: center;
    }

    .menu-list .submenu > li > a {
        float: none;
    }

    .main-menu > li {
        margin: 0 0 15px;
        width: 33.333333%;
    }

    .main-menu > li > a {
        width: auto;
    }

    .main-menu > li > a h2 {
        font-size: 15px;
    }

    .main-menu > li > a svg {
        width: 35px;
        height: 35px;
    }

    /********** Center Logo Social ************/
    .menu, .social-media {
        width: 200px;
        height: 200px;
        top: -135px;
        margin-left: -100px;
    }

    .social-media .logo {
        width: 125px;
        height: 125px;
        margin-left: -62.5px;
        margin-top: -62.5px;
    }

    .social-media .buttons.social a {
        width: 25px;
        height: 25px;
        margin-top: -13px;
        margin-left: -13px;
        padding: 6px;
    }

    .social-media .buttons.social a:first-child {
        -webkit-transform: rotate(0deg) translate(-70px, -40px) rotate(0deg) scale(1);
                transform: rotate(0deg) translate(-70px, -40px) rotate(0deg) scale(1);
    }

    .social-media .buttons.social a:nth-child(2) {
        -webkit-transform: rotate(36deg) translate(-70px, -40px) rotate(-36deg) scale(1);
                transform: rotate(36deg) translate(-70px, -40px) rotate(-36deg) scale(1);
    }

    .social-media .buttons.social a:nth-child(3) {
        -webkit-transform: rotate(72deg) translate(-70px, -40px) rotate(-72deg) scale(1);
                transform: rotate(72deg) translate(-70px, -40px) rotate(-72deg) scale(1);
    }

    .social-media .buttons.social a:nth-child(4) {
        -webkit-transform: rotate(108deg) translate(-70px, -40px) rotate(-108deg) scale(1);
                transform: rotate(108deg) translate(-70px, -40px) rotate(-108deg) scale(1);
    }

    .social-media.ontop .buttons.social a:nth-child(2) {
        -webkit-transform: rotate(36deg) translate(-70px, -40px) rotate(-236deg) scale(1);
                transform: rotate(36deg) translate(-70px, -40px) rotate(-236deg) scale(1);
    }

    .social-media.ontop .buttons.social a:nth-child(3) {
        -webkit-transform: rotate(72deg) translate(-70px, -40px) rotate(-272deg) scale(1);
                transform: rotate(72deg) translate(-70px, -40px) rotate(-272deg) scale(1);
    }

  
    .social-media.ontop .buttons.social a:nth-child(3) {
        -webkit-transform: rotate(108deg) translate(-70px, -40px) rotate(-308deg) scale(1);
                transform: rotate(108deg) translate(-70px, -40px) rotate(-308deg) scale(1);
    }  .social-media.ontop .buttons.social a:first-child {
        -webkit-transform: rotate(0deg) translate(-70px, -40px) rotate(-200deg) scale(1);
                transform: rotate(0deg) translate(-70px, -40px) rotate(-200deg) scale(1);
    }

    /********* Smart Cards *********/
    .smart-cards ul {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        padding-bottom: 20px;
    }

    .smart-cards li {
        margin: 0;
        width: 100%;
    }

    .smart-cards li img {
        width: 100%;
        height: auto;
    }

    .smart-cards-details {
        padding: 40px 15px;
        left: -2.5vw;
    }

    .smart-cards-details p {
        width: 100%;
        text-align: justify;
    }

    .smart-cards .smart-navigation {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        width: 100%;
    }

    .smart-cards .prev-arrow, .smart-cards .next-arrow {
        -webkit-transform: rotate(90deg);
                transform: rotate(90deg);
    }

    .smart-cards .smart-navigation h2 {
        margin: 10px 0;
    }

    .smart-cards .smart-navigation h2 br {
        display: none;
    }

    /******** Ticker *********/
    #ticker {
        padding: 40px 0;
    }

    /********* Smart Offers **********/
    .smart-offers img {
        width: 100%;
    }

    /********* Footer **********/
    .footer {
        display: block;
        padding: 10px;
    }

    .footer-menu.main-menu {
        display: none;
    }

    .footer .address > address, .footer .terms {
        float: none;
        height: auto;
        width: 100%;
    }

    .footer .address {
        float: none;
        width: 100%;
    }

    .footer .terms {
        margin-top: 7px;
    }

    .footer .address > address p > br {
        /*display: none;*/
    }

    .footer .address > address *, .footer .terms > nav * {
        font-size: 12px;
        display: inline-block;
        line-height: 16px;
    }

    .footer .terms > nav > .send-a-cv {
        margin-top: 0;
        margin-left: 15px;
    }

    .footer .signature {
        font-size: 10px;
    }

    /******** Smart Form *********/
    .smart-form {
        width: 90%;
    }

    .smart-form-container {
        width: 95%;
        padding: 10px;
        margin: 30px auto;
    }

    .smart-form-container .input-row {
        width: 85%;
    }

    .smart-form .input-field {
        font-size: 12px;
    }

    .smart-form .input-row {
        padding-bottom: 18px;
    }

    .smart-form-container h1 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .smart-form .input-row.inline {
        width: calc(100% - 80px);
    }

    .smart-form .input-title {
        font-size: 12px;
    }

    [type="checkbox"]:not(:checked) + label, [type="radio"]:not(:checked) + label, [type="checkbox"]:checked + label, [type="radio"]:checked + label {
        font-size: 12px;
    }

    .btn.search, .btn.subscribe {
        width: 25px;
        height: 25px;
    }

    .smart-form .btn.check {
        width: 25px;
        height: 25px;
    }

    .main-container {
        padding-bottom: 190px;
    }

    .static-container {
        padding-bottom: 60px;
    }

    .menu-wrapper {
        margin-top: 30px;
    }

    /********** About Us ***********/
    .about-us {
        width: 100%;
        margin: 30px auto;
    }

    .smart-header > .smart-title {
        font-size: 20px;
    }

    .about-us > p {
        font-size: 12px;
        line-height: 18px;
    }

    /*************** Services *****************/
    .services {
        padding: 30px 0;
    }

    .services.even {
        left: -2.5vw;
    }

    .services.even:last-child {
        padding-bottom: 0;
    }

    .services.even .services.even {
        left: 0;
    }

    .services .service-title.even, .services .service-details.even {
        width: 80%;
    }

    .services .service-title {
        font-size: 20px;
    }

    .services .service-details.odd.right {
        width: 100%;
    }

    .services .service-details p {
        font-size: 12px;
        line-height: 20px;
    }

    .services .service-details.even {
        width: 95%;
    }

    .services .service-details.vertical p {
        width: 100%;
    }

    .services .service-subtitle + .separator, .smart-header .smart-subtitle + .separator {
        margin-top: 10px;
    }

    .services .separator.vertical {
        display: none;
    }

    .smart-header.has-many {
        padding: 30px 0;
    }

    .services .service-section.half-width {
        width: 100%;
        margin: 15px auto;
    }

    /******** Smart Error *********/
    .smart-form h6.smart-error {
        bottom: 3px;
        font-size: 10px;
    }

    /********* Contact Us ***********/
    .contact .smart-form-container {
        float: none;
        margin: 30px auto;
    }

    .contact {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    .contact .address {
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 30px;
    }

    .contact .address > address * {
        font-size: 14px;
        line-height: 20px;
    }

    .contact.map-container {
        padding: 30px 0
    }

    .contact.even {
        left: -2.5vw;
    }

    .contact  #map {
        height: 200px;
        width: 95%;
    }

    .contact .address > address p br {
        display: none;
    }
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 767px)
and (orientation : landscape) {
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 767px)
and (orientation : portrait) {
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1199px) {
    .bg {
        background-attachment: scroll;
    }

    [type="checkbox"]:not(:checked) + label, [type="radio"]:not(:checked) + label, [type="checkbox"]:checked + label, [type="radio"]:checked + label {
        font-size: 16px;
    }

    .header {
        padding-top: 50%;
    }

    .smart-cards .smart-navigation h2 {
        font-size: 20px;
    }

    .smart-cards ul {
        width: 100%;
    }

    .smart-cards-details p {
        width: 90%;
    }

    .smart-offers img {
        width: 100%;
    }

    .menu-logo-wrapper, .smart-form, .smart-form-container {
        width: 90%;
    }

    .smart-form-container {
        padding: 10px 30px;
    }

    .smart-form-container .input-row {
        width: 70%;
    }

    /********** Main Menu *************/
    .menu-list .submenu {
        position: relative;
        display: block;
        -webkit-transform: translate(0);
                transform: translate(0);
        white-space: normal;
        max-width: none;
        width: 100%;
        max-height: 0;
    }

    .menu-list .submenu > li {
        display: block;
        margin: 5px 0;
        width: 100%;
    }

    .menu-list > li:hover > a + .submenu {
        max-height: 400px;
    }

    .menu-list .submenu > li > a:before, .menu-list .submenu > li > a:after {
        display: none;
    }

    .menu-list .submenu > li:after {
        display: none;
    }

    .menu-list > li {
        text-align: center;
    }

    .menu-list > li a {
        font-size: 20px;
    }

    .menu-list .submenu > li > a {
        float: none;
    }

    .smart-header {
        height: 150px;
    }

    /********** About Us ***********/
    .about-us {
        width: 100%;
        margin: 40px auto 80px;
    }

    .about-us {
        margin-bottom: 20px
    }

    /********* Services **********/
    .services .service-details.odd.right {
        width: 60%;
    }

    .services .service-details p {
        font-size: 15px;
    }

    .services .service-title.even, .services .service-details.even {
        width: 80%;
    }

    .services .service-details.vertical p {
        width: 90%;
    }

    .smart-header.has-many {
        padding: 25px 0px;
    }

    .smart-header .smart-subtitle + .separator, .services .service-subtitle, .smart-header .smart-subtitle {
        margin-top: 0;
    }

    /************** Logo Center ***************/
    .social-media .buttons.social a:first-child {
        -webkit-transform: rotate(0deg) translate(-130px, -85px) rotate(0deg) scale(1);
                transform: rotate(0deg) translate(-130px, -85px) rotate(0deg) scale(1);
    }

    .social-media .buttons.social a:nth-child(2) {
        -webkit-transform: rotate(36deg) translate(-130px, -85px) rotate(-36deg) scale(1);
                transform: rotate(36deg) translate(-130px, -85px) rotate(-36deg) scale(1);
    }

    .social-media .buttons.social a:nth-child(3) {
        -webkit-transform: rotate(72deg) translate(-130px, -85px) rotate(-72deg) scale(1);
                transform: rotate(72deg) translate(-130px, -85px) rotate(-72deg) scale(1);
    }

    .social-media.ontop .buttons.social a:nth-child(2) {
        -webkit-transform: rotate(36deg) translate(-130px, -85px) rotate(-236deg) scale(1);
                transform: rotate(36deg) translate(-130px, -85px) rotate(-236deg) scale(1);
    }

    .social-media.ontop .buttons.social a:nth-child(3) {
        -webkit-transform: rotate(72deg) translate(-130px, -85px) rotate(-272deg) scale(1);
                transform: rotate(72deg) translate(-130px, -85px) rotate(-272deg) scale(1);
    }

    .social-media.ontop .buttons.social a:first-child {
        -webkit-transform: rotate(0deg) translate(-130px, -85px) rotate(-200deg) scale(1);
                transform: rotate(0deg) translate(-130px, -85px) rotate(-200deg) scale(1);
    }

    /********* Contact Us ***********/
    .contact .smart-form-container {
        float: none;
        margin: 20px auto 20px 0;
        padding: 10px 30px
    }

    .contact .address {
        float: none;
        margin-bottom: 20px;
    }

    .contact {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

    .contact  #map {
        height: 300px;
    }

    .contact.map-container {
        padding-bottom: 0;
    }
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1199px) 
and (orientation : landscape) {
}

/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1199px) 
and (orientation : portrait) {
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width: 1200px) 
and (max-width: 1600px)  {
    .menu-logo-wrapper, .register-container {
        margin: 30px auto
    }

    .register-container {
        padding: 10px 20px 20px
    }

    .register-container h1 {
        font-size: 18px
    }

    .smart-form-container .input-row {
        width: 65%;
        padding-bottom: 20px;
    }

    .smart-form-container {
        width: 60%;
    }

    .btn.search, .btn.subscribe, .container-bottom .arrow-down, .smart-form .btn.check, .static-section .menu-close {
        width: 30px;
        height: 30px;
    }

    .smart-form h6.smart-error {
        bottom: 0
    }

    .menu-list > li a, .smart-form .input-field {
        font-size: 14px;
    }

    .menu-list > li {
        margin: 10px 0;
    }

}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
}