@media screen and (max-width: 1023px) {
    
    body,html{
        width: 100%;
    }
    
    .grid_button {
        display: none;
    }
    
   .header_content {
        width: 100%;
    }
    
    .header_content2 {
         margin-left: 354px;
    }
    
    .header_content3 {
    margin-left: 354px;
    }
    
    .home_main {
        width:724px;
    }
    
    .rect {
        margin-left: 205px;
        top: 1157px;
       
    }
    
    #home_col2 {
        margin-left: 72px;
    }
    
    #Calque_1 {
        width: 724px;
        margin-left: 0px;
    }
    
    .home_col {
        width: 201px;
        margin-left: 20px;
    }
    
        
    .looking_content {
        width: 768px;
        margin: 0 0 0 0;
    }
    
    .looking_col1 {
        display: none;
    }
    
    #looking_col2 {
        margin-left: 174px;
    }
    
    .list_footer > li:first-child {
    margin-left: 0px;
    }
    
    /* WORK */ 
    
    .work_main {
        width: 724px;
    }
    
    .header_work {
        width: 100%;
    }
    
    #work_menu li {
        width: 241px;
        height: 241px;
    }
    
    #work_menu {
        width: 724px;
    }
    
   .work_main ul li:nth-child(1) { background-image: url("img/mosa3.png"); background-position: left top;}
    .work_main ul li:nth-child(2) { background-image: url("img/mosa3.png"); background-position: center top;}
    .work_main ul li:nth-child(3) { background-image: url("img/mosa3.png"); background-position: right top;}
    .work_main ul li:nth-child(4) { background-image: url("img/mosa3.png"); background-position: left bottom;}
    .work_main ul li:nth-child(5) { background-image: url("img/mosa3.png"); background-position: center bottom;}
    .work_main ul li:nth-child(6) { background-image: url("img/mosa3.png"); background-position: right bottom;}
    
    .work_main ul li:nth-child(1):hover { background-image: url("img/mosa3.png"); background-position: left top;}
    .work_main ul li:nth-child(2):hover { background-image: url("img/mosa3.png"); background-position: center top;}
    .work_main ul li:nth-child(3):hover { background-image: url("img/mosa3.png"); background-position: right top;}
    .work_main ul li:nth-child(4):hover { background-image: url("img/mosa3.png"); background-position: left bottom;}
    .work_main ul li:nth-child(5):hover { background-image: url("img/mosa3.png"); background-position: center bottom;}
    .work_main ul li:nth-child(6):hover { background-image: url("img/mosa3.png"); background-position: right bottom;}
    
    
    .work_main ul li h3, .work_main ul li h4 {
    opacity: 1;   
    margin-left: 0px;
    }
        
    .work_main ul li div {
    padding-top: 182px;
    width: 241px;
    height: 241px;
        
    }
    
    .work_main2 {
        width: 724px;
    }
    
    .work_header {
        width: 724px;
    }
    
    .p_work2 {
        margin-left: 100px;
        width: 524px;
    }
    
    .ul_end {
        margin-left: 172px;
    }
    
    .pairi {
        width: 524px;
    }
    
    /* CASE STUDIES */
    
    #team {
        width: 724px;
        margin-left: 0px;
    }
    
    .case_img {
        width: 724px;
        margin-left: 0px;
    }
    
    .case_main {
        width: 724px;
    }
    
    .p_work {
        width: 560px;
        margin-left: 82px;
    }
    
    /* 404 */
    
    .main_404 ul {
        margin-left: 72px;
    }
    
    /* CREDITS */ 
    
    .p_credits {
        width: 524px;
    }
    
    /* THANKS */
    
    .ul_thanks {
        margin-left: 75px;
    }
    
    .ul_thanks li:first-child {
        margin-left: 0px;
    }
    
    /* CONTACT */ 
    
    #container_form {
        width: 684px;
        padding: 10px 20px 20px 20px;
    }
    
    form {
        width: 500px;
    }
    
    #adress {
        width: 200px;
        padding-left: 10px;
        margin-top: -290px;
    }
    
    #timbre {
        display: none;
    }   
    
}

@media screen and (max-width: 767px) {
    
    h1 {
        font-size: 48px;
    }
    
    h2 {
        font-size: 18px;
    }
    
    h3 {
        font-size: 18px;
    }
    
    blockquote {
        font-size: 18px;
        margin-left: -149px;
        top: 230px;
    }
    
    /* HEADERS */
    
    .header_content {
    height: 500px;
    }
    
    .header_home {
        height: 500px;
    }
    
    .header_work,.header_case,.header_contact,.header_404 {
        height: 400px;
    }
    
    .header_contact {
        background-position: -300px 0px;
    }    
    
    
    .header_content2 {
        margin-left: 0px;
        width: 300px;
        margin-top: 332px;
    }
    
    .header_content3 {
    margin-left: 0px;
    margin-top: 232px;
    }
    
    .boat {
        width: 150px;
        margin-left: 150px;
    }
    
     .home_main {
        width: 276px;
    }
    
    #home_col2 {
        margin-left: 0px;
        width: 276px;
    }
    
    #home_col2 p {
        width: 276px;
        text-align: left;

    }
    
    #home_col2 h3 {
        text-align: left;
        font-size: 24px;
    }
    
    #home_col2 ul li:first-child {
        margin-top: 40px;
        margin-bottom: 20px;     
    }
    
    #home_col2 ul li:last-child {
        margin-bottom: 40px;
    }
    
    #home_col2 ul {
        margin-left: 0px;
    }
    
    #Calque_1 {
        width: 276px;
        height : 180px;
        margin-top: 0px;
    }
    
    .home_main > h3 {
        text-align: center;
        margin-top: 30px;
        margin-bottom: 30px;
    }
    
    .home_col {
        display: none;
    }
    
    .rect {
        display: none;
   
    }
    
    .home_main h3:nth-child(5) {
        display: none;
    }
    
    .looking {
        margin-top: 0px;
    }
    
    .looking_content {
        width: 276px;
    }
    
    #looking_col2 {
        width: 276px;
        margin-left: 0px;
    }
    
    #looking_col2 p {
        width: 256px;
    }
        
    #plane {
        width: 80px;
        margin-left: 160px;
    }
    
    #plane:hover {
    margin-top: 10px;
    margin-left: 160px;
}
    
    #looking_col2 h3 {
        font-size: 24px;
        margin-bottom: 20px;
    }
    
    .footer_content {
        width: 276px;
        padding: 0px 22px 0px 22px;
        overflow: auto;
    }
    
    .list_footer > li:first-child {
    margin-left: 0px;
    margin-bottom: 30px; 
    }
    
    li.footer_p {
    width: 276px;
}
    
    /* WORK */ 
    
    .work_main {
        width: 276px;
    }
    
    .p_work {
        width: 276px;
        margin-left: 0px;
    }
    
    .work_main ul li:nth-child(1) { background-image: url("img/mosa4.png"); background-position: 2px 2px;}
    .work_main ul li:nth-child(2) { background-image: url("img/mosa4.png"); background-position: -274px top;}
    .work_main ul li:nth-child(3) { background-image: url("img/mosa4.png"); background-position: right top;}
    .work_main ul li:nth-child(4) { background-image: url("img/mosa4.png"); background-position: left bottom;}
    .work_main ul li:nth-child(5) { background-image: url("img/mosa4.png"); background-position: -277px bottom;}
    .work_main ul li:nth-child(6) { background-image: url("img/mosa4.png"); background-position: right bottom;}
    
    .work_main ul li:nth-child(1):hover { background-image: url("img/mosa4.png"); background-position: 2px 2px;}
    .work_main ul li:nth-child(2):hover { background-image: url("img/mosa4.png"); background-position: -274px top;}
    .work_main ul li:nth-child(3):hover { background-image: url("img/mosa4.png"); background-position: right top;}
    .work_main ul li:nth-child(4):hover { background-image: url("img/mosa4.png"); background-position: left bottom;}
    .work_main ul li:nth-child(5):hover { background-image: url("img/mosa4.png"); background-position: -277px bottom;}
    .work_main ul li:nth-child(6):hover { background-image: url("img/mosa4.png"); background-position: right bottom;}
    
    .work_main ul {
    width: 276px;
    }
    
    #work_menu li {
        float: none;
        width: 276px;
        height: 276px;
       margin-bottom : 40px;
        margin-top: 30px;
        border-bottom: 3px dashed #EA9228 ;
        background-repeat: no-repeat;
    }
    
    .work_main ul li div {
        width: 276px;
        padding-top : 250px;
    }
    
    #work_menu {
        width: 276px;
    }
    
    .work_main2 {
        width: 276px;
    }
    
    .work_header {
        width: 276px;
    }
    
    .h3_work {
        padding-left: 0px;
        font-size: 24px;
    }
    
    .h4_work {
        font-size: 18px;
        margin-left: 0px;
    }
    
    .p_work2 {
        margin-left: 0px;
        width: 276px;
    }
    
    .ul_end {
        margin-left: 48px;
    }
    
    .ul_end li a {
        margin-top: 30px;
        margin-bottom: 0px;
   }
    
    .ul_end li:last-child a {
        margin-bottom: 30px;
    }
    
    .pairi {
        width: 276px;
        margin-left: 0px;
    }
    
    /* CASE STUDIES */
    
    #team {
        width: 276px;
        margin-left: 0px;
    }
    
    .h5_case {
        font-size : 18px;
        margin-left: 0;
    }
    
    .case_img {
        width: 276px;
        margin-left: 0px;
    }
    
    .case_main {
        width: 276px;
    }
    
    /* CREDITS */
    
    .p_credits {
        margin-left: 0px;
        width: 276px;
    }
    
    .ul_credits {
        margin-left: 0px;
        line-height: 30px;
    }
    
    /* CONTACT */ 
    
    #adress {
        display: none;
    }
    
    #container_form {
        width: 236px;
    }
    
    form {
        width: 256px;
    }
    
    #zone_message {
        width: 236px;
    }
    
    #input_cadre {
        width: 150px;
        margin-left: 0px;
    }
    
    #input_nom {
        width: 150px;
    }
    
    #bouton {
        margin-left: 90px;
        filter: none;
        -webkit-filter: none;
        -moz-filter: none;
        -o-filter: none;
        -ms-filter: none;
    }
    
    /* THANKS */
    
    .p_thanks {
        margin-left: 0px;
        width: 276px;
    }
    
    .ul_thanks {
        margin-left: 48px;
    }
    
    .ul_thanks li a{
        margin-left: 0px;
        margin-bottom: 20px;
    }
    
    /* 404 */
    
    .header_404 {    
    height: 400px;
    }
    
    .main_404 {
        width: 276px;
    }
    
    .main_404 ul li {
        float: none;
        margin-right: 0px;
        margin-bottom: 20px;
        width: 180px;
    }
    
    .main_404 ul {
        margin-left: 48px;
    }
        
}