@media only screen and (max-width: 1420px){
    .contentContainer, section{
        width: 90%;
    }
}

@media only screen and (max-width: 1300px){
    .jobdetailBanner{
        padding: 40px 2.5%;
    }
}

@media only screen and (max-width: 1250px){
    .menuNavigation{
        float: none;
        position: relative;
        right: auto;
        bottom: -1px;
    }
    .headerMenu{
        min-width: 200px;
        padding: 10px 0 0 0;
    }
    header{
        margin-bottom: 40px;
    }
    .projectPartners { padding: 40px 5%; }
    .homepagePartners{ padding: 20px 5%; }
    .jobs, .joblistControls, .aboutProject, .homepageSocial{ width: 90%; }
    .aboutProject{ padding: 40px 5%; }
    section{ display: block}
    section .left{ margin: 0 auto}
    section .left h1{ margin: 0 auto}
    section .right{ margin: 0 auto; width: 100%; padding: 0 0 20px 0}
    section .right h1{ margin: 20px auto}
}

@media only screen and (max-width: 1075px){
    .column-one-fourth p, .column-one-fourth a, .column-one-fourth div{
        font-size: 12px;
    }
}

@media only screen and (max-width: 1075px){
    .jobdetailBanner{ display: block; }
    .jobdetailBanner .left{ margin: 0 auto; text-align: center}
    .jobdetailBanner .left h1{ text-align: center; }
    .jobdetailBanner .left div ul{ width: 450px; margin: 0 auto; text-align: left}
    .jobdetailBanner .left .buttons{ padding: 20px auto; }
    .jobdetailBanner .right{ margin: 30px auto;}
}

@media only screen and (max-width: 1000px){
    .joblistBanner form, .detailContent{ width: 90%; }
    .articleBox, .projectBox{
        display: block;
        position: relative;
    }
    .articleBox img{
        width: 75vw;
        height: 25vw;
        margin: 0 auto;
    }
    .projectBox img{
        width: 75vw;
        height: auto;
        margin: 0 auto;
    }
    .articleBox div, .projectBox div{
        padding: 0;
        margin-top: 20px;
    }
    .projectBox{ width: 90%; text-align: center; margin: 30px auto }
    .projectBox .left, .projectBox .right{ padding: 0; margin: 60px 0; text-align: left; }
    .projectBox div h1{ margin-bottom: 40px; margin: 0 auto 30px auto; }
    .projectTop img{ position: absolute; top: 0; left: calc(50% - 37.5vw); }
    .projectTop .left{ padding-top: 76vw; }
    .articleControls{ display: block; text-align: center; padding-bottom: 60px; width: 100%; }
    .articleControls .up, .articleControls .more{
        display: inline-block;
        margin: 0 20px;
    }
    .articleControls .paginator{ margin-top: 20px; }
    .projectPartners .partnersLogos{ display: block; text-align: center; }
    .projectPartners .partnersLogos img{ display: block; margin: 50px auto; }
    .projectPartners h1{ margin: 0 auto; }
    .projectContact .contact{ display: block; }
    .projectContact .contact div{ margin: 60px 0; }
    .popupForm .editor{ width: 90%; }
}

@media only screen and (max-width: 1000px){
    .adminMenu{
        top: 30px;
        left: 75px;
        border: none;
        border-bottom: 1px solid #e8e8e8;
        display: none;
    }
    .hamburger{
        display: block;
        background-color: #EE7A00;
        color: white;
        text-align: center;
        padding: 10px 0;
        font-family: Roboto;
        margin-top: 20px;
        cursor: pointer;
    }
    .contentContainer{text-align: center}
    .profileContainer{text-align: left}
    .menuNavigation{
        float: none;
        position: relative;
        top: 121px;
        right: auto;
        bottom: auto;
    }
    .headerMenu{
        min-width: 200px;
        padding: 10px 0 120px 0;
        float: none;
        text-align: center;
    }
    .translate{
        text-align: left;
        left: calc(50% - 50px);
    }
    header{
        margin-bottom: 20px;
    }
    .headerRight {
        float: none;
        text-align: center;
        position: absolute;
        top: 110px;
        left: calc(50% - 200px);
    }
    article img{
        width: 75vw;
        height: 25vw;
    }
    article{
        width: 90%;
    }
    .article .back{
        top: -15px;
        left: calc(50% - 60px);
        margin-left: 0;
    }
    .joblist tr td{ display: block; border-bottom: none; padding: 5px 0 }
    .joblist tr td:not(:first-child){ padding: 5px 0; }
    .joblist tr td:last-child{
        border-bottom: 1px solid #e8e8e8;
        padding-bottom: 10px;
    }
    .column-one-fourth p, .column-one-fourth a, .column-one-fourth div{
        font-size: 12px;
    }
    .column-one-fourth{
        float: none;
        border-right: none;
        margin: 0 auto;
        text-align: center;
        width: 40%;
    }
    .column-one-fourth:nth-child(2), .column-one-fourth:nth-child(3){
        display: inline-table;
        margin-top: 20px;
    }
    .column-one-fourth:nth-child(2){
        text-align: left;
    }
    .column-one-fourth:nth-child(3){ text-align: right; padding: 0 8% 0 0}
    .column-one-fourth:last-child{
        width: 100%;
        min-height: auto;
        margin: 40px 0 0 0;
        padding: 0;
    }
    .column-one-fourth .footerAlign{
        display: inline-table;
        margin: 10px 20px;
    }
}

@media only screen and (max-width: 700px){
    .jobdetailBanner .left{
        padding: 0;
        margin: 0;
        width: 100%;
    }
    .jobdetailBanner .left .buttons button{
        display: block;
        margin: 10px auto;
    }
    .jobdetailBanner .left .buttons a{ text-decoration: none; }
    .jobdetailBanner .right{
        display: block;
        width: 97.5%;
        height: auto;
        padding: 20px 0;
    }
    .jobdetailBanner .right img{
        width: 150px;
        margin: 0 auto;
        left: calc(50% - 75px);
        top: 0;
        height: 150px;
    }
    .jobdetailBanner .right div{ width: 100% }
    .homepageBanner form .inputs label .example{ display: block; }
    .homepageBanner form .inputs label{ top: -40px }
    .homepageSocial div a{ display: block; width: 100px; text-align: center; margin: 10px auto; }
    .homepageSocial h1, .homepageSocial p{
        text-align: center;
        margin: 20px auto 0 auto;
    }
    .aboutProject h1, .aboutProject h2{ margin: 40px auto; text-align: center }
    .homepageSocial p{ margin-top: 40px; }
    .aboutProject .activities{ margin: 0 auto; text-align: center; width: 100%}
    .homepageSocial p{width: 100%}
    .aboutProject .partnersLogos{ display: block; text-align: center; }
    .aboutProject .partnersLogos img{ display: block; margin: 50px auto; }
    .twoDo{
        float: none;
        padding-top: 20px;
    }
}

@media only screen and (max-width: 500px) {
    .headerInformation{
        font-size: 9px;
    }
    .menuNavigation ul a:not(:last-child){
        margin-right: 40px;
    }
    .loginBanner h2{
        width: auto;
    }
}

