/* body{
    border: 5px solid yellowgreen;
    border-radius: 40px;
} */

/* LARGE SCREEN */
@media(max-width: 2560px){

    .body_wrapper{
        max-width: 1478px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 190px;
    }
    .hero{
        min-height: 1000px;
    }

    .nav{
        padding: 40px 0;
    }
    .nav_wrap{
    display: flex;
   }
    .hide{
     display:flex ;
   }
    h1{
    line-height: 1.75;
    }

    .about_wrapper{
        margin: 0;
        min-height: 1300px;
    }
    .about_heading_wrapper{
        max-width: 1000px;
    }
     .abt_descr{
       margin: -35px 0 0 -100px;
  }
    .abt_me_para, .abt_uppercase_cta{
        max-width: 410px;
        padding: 0;
    
  }
   .abt_uppercase_cta{
    
        padding: 0;
        max-width: 100%;
    
  }
    .about_para_handshake_wrapper{
    height: 675px;
    padding: 0;
    gap:50px;

  }
   .abt_cta_btn div{
    /* background-color: red; */
    width: 237px !important;
    height: 237px !important;

  }
    .yellow{
        top: -125px;
        left: -710px;
    }
    .yellow_elipse{
        left: -833px;
    }

    .selected_works_wrapper{
        min-height: 1500px;
    }

     .selected_works_wrapper p{
      font: normal 14px mulish;
    }
     .place_holder{
    /* width: 100%; */
    height: 169px;
    width: 246px;
    background-size: cover;
    padding: 0 0 0 0;
    margin: 0;

  }
    .works_heading_wrap{
        padding: 0;
        display: flex;
        flex-direction: row;
        align-items: end;
        justify-content: start;
        padding: 0 0 0 55px;
    }
   
    .works_heading_wrap div{
        margin: 0 0 -22px 0;
    }
    .working_with_me_wrapper{
        min-height: 1200px;
    }
    .working_with_me_wrapper .about_wrapper{
        min-height: 1200px;
    }
    .works_accents{
       position: absolute;
       display: flex;
       justify-content: space-between;
       overflow: hidden;
   }
    .social_media_wrapper{
        min-height: 800px;
        padding: 0;
    }
     .social_media_wrapper .selected_works_individual{
    display: flex;
    align-items: center;
    padding-top: 20px;
  }
     .email{
    font: normal 114px 'TAN - PEARL';
    min-height: 172px;
  
  }

   .quick_links a{
    text-decoration: none;
    font: normal 35px "Apoc Sans Light";
    text-transform: uppercase;
    color:#F8F1EC;
    opacity: 1;
    word-wrap: normal;
    text-align: center;
  }

     .copyright_wrapper{

        font-size: 16px !important;
     } 

    .footer_wrapper{
        min-height: 500px;
    }
}




@media (max-width: 1536px){
    .body_wrapper{
        max-width: 1536px;
        /* gap: 285px; */
    }
    .nav{
        padding: 40px 90px;
    }
    .works_heading_wrap{
        padding: 0 0 0 55px;
    }
}




@media (max-width: 1440px){
    .body_wrapper{
        max-width: 1440px;
        gap: 285px;
    }
    .works_heading_wrap{
        padding: 0 0 0 90px;
    }
}




@media (max-width: 1024px){
    .background-grid {
        --grid-size: 50px;
    }
    body{
        width: 100% !important;
        overflow-x: hidden;
    }
    .body_wrapper{
        max-width: 1024px !important;
        width: 100%;
        margin: 0 auto;
        gap: 100px;
        padding: 0;
    }
    .hero{
        width: 100%;
    }
    .nav{
        width: 924px !important;
        min-width: 900px !important;
        padding: 40px 50px;
    }
    .hero_main{
        width: 100%;
    }
    h1{
        font-size: 6.5em;
    }
    .body_lg{
        width: 66%;
    }
    h2{
        font-size: 5em;
        min-width: 350px;
    }
    .about_wrapper{
        padding: 170px 0 0 0; 
    }
    .about_heading_wrapper{
        padding: 0 0 0 170px;
    }
    .about_img_descr{
        align-items: flex-start;
    }
    .about_para_handshake_wrapper{
        height: 650px;
        width: 650px;
        margin: 40px 0 0 0;
    }
    .mini_titles{
        gap:0;
    }
    .about_img{
        height:auto !important;
        width: 515px !important;
    }
    .yellow{
        left: -503px;
        top: -102px;
        width: 49px !important;
    }
        .yellow_elipse{
        left: -561px;
        width: 67px !important;
    }

    .box{
        width: 105px !important;
    }
    .elipse_dark{
        width: 56px !important;
    }

    .works_heading_wrap{
        padding: 0 0 0 50px;
    }
    .works_heading_wrap div{
        margin: 0 0 -22px 15px;
    }
    .selected_works_main{
        padding: 0 50px;
    }
    .title_wrap h3{
        font-size: 38px;
    }

    .place_holder{
        height: 80%;
        width: 180px;
  }
    .selected_works_wrapper{
        gap: 50px;
        min-height: 1190px;
  }
  .selected_works_individual{
    align-items: center !important;
    padding: 0 15px;
    height: 150px;
  }
  .working_with_me_wrapper{
    padding: 0 50px;
    min-height: 1100px;
  }
  .working_with_me_wrapper .about_wrapper{
        min-height: 1100px ;
        height: 1100px ;
        padding: 155px 0 0 0;
    }
    .social_media_wrapper{
        min-height: 680px;
    }

 .quick_links{
    height: 150px;
    padding: 0 50px;
  }
  .quick_links div{
    padding: 60px 0; 
  }
  .quick_links a{
   
    font: normal 25px "Apoc Sans Light";

  }
    .email{
    font: normal 78px 'TAN - PEARL';
    min-height: 123px;
  }
.copyright_wrapper{
    padding: 0 50px;
  }

.footer_wrapper{
    gap: 47px;
    min-height: 350px;
  }
}







/* TABLET SCREEN */
@media (max-width: 768px){

     /* .background-grid {
        --grid-size: 50px;
    } */

    body{
        width: 100% !important;
        overflow-x: hidden !important;
    }
    .body_wrapper{
        max-width: 768px !important;
        gap: 150px;
        padding: 0;
        width:auto;
    }
     .nav{
        max-width: 768px !important;
        min-width: 768px !important;
        /* padding: 40px 20px !important;
        padding-right: 50px !important; */
        justify-content: flex-start;
        gap: 60px !important;
    }
    .hero{
        min-height: 890px;
    }

    h1{
        font-size: 5em;
    }
    .body_lg{
        font-size: 27px;
        line-height: 42px;
    }
    .body_lg span{
        border-bottom: 2px solid #95A1A0;
        top: -8px;
        font-size: 18px;
    }

    .working_with_me_wrapper span{
        border-color: rgb(2, 40, 43);
    }
    .elipse_dark{
        top: 214px;
        right: 75px;
    }
    .star_dark{
        height: 62px;
        top: 569px;
        right: 24px;
    }
    h2{
        font-size: 4em;
        min-width: 280px;
    }
    .about_wrapper{
        padding: 80px 0 0 0;
        min-height: 1100px; 
    }
        .abt_descr{
       margin: -35px 0 0 -100px;
  }
    .about_heading_wrapper{
        padding: 0 0 0 55px;
    }
    .abt_cta_btn{
        position: absolute;
        bottom: -4px;
        left: -280px;
        align-items: flex-end;
    }

    .about_img{
        height: 400px;
        /* padding: 0 0 0 117px; */
        padding: 0;
    }
    .about_para_handshake_wrapper{
        height: 660px;
        width: 600px;
    }
    .abt_descr{
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 0;
    }
       .abt_me_para, .abt_uppercase_cta{
        max-width: 50%;
        padding: 47px 0 0 0;
    
  }
    .abt_uppercase_cta{
    
        padding: 0;
        max-width: 100%;
    
  }
 
    .abt_cta_btn{
        left: -62px;
        bottom: 10px;
        position: relative;
        align-items: start;
    }
    .yellow{
        left: -503px;
        top: -102px;
        width: 49px !important;
    }
        .yellow_elipse{
        left: -561px;
        width: 67px !important;
    }
    .box{
        top:-515px;
    }
    .elipse_dark{
        top:  -374px;
        right: 74px;
    }
    .selected_works_wrapper{
        gap: 35px;
        min-height: 847px;
    }
    .selected_works_individual{
        padding: 0 10px;
        height: 120px;
    }
    .selected_works_main{
        padding: 0 20px;
    }
    .works_heading_wrap{
        padding: 0 0 0 20px;
        gap: 50px;
    }
    .works_heading_wrap div{
        /* margin: 0 0 -43px -42px; */
        margin: 0;
        padding: 0;
        min-height: auto;
    }
    .works_heading_wrap a{
        min-height: 0;
        overflow: hidden;
    }
    .title_wrap h3{
        font-size: 2.2em;
    }
    .title_arrow_wrap{
        gap:40px;
    }
     .arrow_view{
        gap:10px;
     }
     .arrow_view img{
        width: 24px;
     }
    .place_holder{
        height: 70%;
  }
 
  
  .working_with_me_wrapper{
    padding: 0 20px;
    min-height: 900px;
  }
  .working_with_me_wrapper .about_wrapper{
        min-height: 870px ;
        height: 880px ;
        padding: 155px 0 0 0;
    }
  .social_media_wrapper{
        min-height: 564px;
    }
       .email{
    font: normal 60px 'TAN - PEARL';
    min-height: 95px;
  }
 
 .quick_links{
    height: 120px;
    padding: 0 20px;
  }
  .quick_links div{
    padding: 44px 0; 
  }
.copyright_wrapper{
    padding: 0 20px;
  }
  
   
  
}







/* PHONE SCREEN large*/


@media (max-width: 640px)
{
        body{
        /* width: 100% !important;
        overflow-x: hidden !important; */
    }
    .body_wrapper{
        max-width: 640px;
        gap: 100px;
        
    }
     .nav{
        max-width: 640px !important;
        min-width: 640px !important;
        padding: 20px 10px !important;
        gap: 40px !important;
    }
    .hero{
        min-height: 760px;
    }

    h1{
        font-size: 4em;
    }

    h2{
        font-size: 2.5em;
        min-width: 280px;
    }
    .about_wrapper{
        padding: 80px 0 0 0;
        min-height: 1100px; 
    }
    .about_img_descr{
        display: flex;
        flex-direction: column;
        align-items:center;
        gap: 0;
    }
    .about_heading_wrapper{
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }


    .about_img{
        height: 400px;
        /* padding: 0 0 0 117px; */
        padding: 0;
    }
    .about_para_handshake_wrapper{
        height: 600px;
        width: 600px;
        margin: 0;
        gap: 0;
    }
    .abt_descr{
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 0;
        margin: 0;
        rotate: 0;
    }
    .abt_cta_btn{
        bottom: 39px;
        left: 26px;
        position: relative;
        align-items: start;
    }
    .selected_works_individual{
        padding: 0 10px;
        height: 150px;
    }
    
    .works_heading_wrap{
        padding: 0 0 0 20px;
        gap: 50px;
    }
    .works_heading_wrap div{
        /* margin: 0 0 -43px -42px; */
        margin: 0;
        padding: 0;
        min-height: auto;
    }

     .works_heading_wrap{
        padding: 0 0 0 20px;
        gap: 50px;
        
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: start;
        
    
    }
    .works_heading_wrap div{
        /* margin: 0 0 -43px -42px; */
        margin: 0;
        padding: 0;
        min-height: auto;
    }

    .works_heading_wrap a{
        min-height: 0;
        overflow: hidden;
    }
    .title_wrap h3{
        font-size: 1.25em;
    
    
     }
    .place_holder{
        height: 70%;
  }
 
  
  .working_with_me_wrapper .about_wrapper{
        min-height: 770px;
        height: 770px;
        /* padding: 123px 0 0 0; */
    }
    .works_accents{
       display: none;
    }
       .email{
    font: normal 33px 'TAN - PEARL';
    min-height: 76px;
  }
   .quick_links a{
    font: normal 16px "Apoc Sans Light";
  }
   .copyright_wrapper{

        font-size: 12px !important;
     } 

  

  }





/* PHONE SCREEN medium*/


@media (max-width: 425px)
{
        body{
        /* width: 100% !important;
        overflow-x: hidden !important; */
    }
    .body_wrapper{
        max-width: 425px;
        gap: 100px;
        
    }
     .nav{
        /* max-width: 425px !important;
        min-width: 425px !important; */
        padding: 10px !important;
        gap: 40px !important;
    }
    .hide{
     display:none ;
   }
    .hero{
        min-height: 760px;
    }

    h1{
        font-size: 4em;
    }

    h2{
        font-size: 3.5em;
        min-width: 280px;
    }
    .about_wrapper{
        padding: 80px 0 0 0;
        min-height: 1100px; 
    }
    .about_img_descr{
        display: flex;
        flex-direction: column;
        align-items:center;
        gap: 0;
    }
    .about_heading_wrapper{
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }


    .about_img{
        height: 400px;
        /* padding: 0 0 0 117px; */
        padding: 0;
    }
    .about_para_handshake_wrapper{
        height: 600px;
        width: 600px;
        margin: 0;
    }
    .abt_descr{
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 0;
        margin: 0;
        rotate: 0;
    }
    .abt_cta_btn{
        bottom: 39px;
        left: 26px;
        position: relative;
        align-items: start;
    }
    
    .works_heading_wrap{
        padding: 0 0 0 20px;
        gap: 50px;
        
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: start;
        
    
    }
    .works_heading_wrap div{
        /* margin: 0 0 -43px -42px; */
        margin: 0;
        padding: 0;
        min-height: auto;
    }
    .works_heading_wrap a{
        min-height: 0;
        overflow: hidden;
    }
    .title_wrap h3{
        font-size: 1.25em;
    
    
     }
    .place_holder{
        height: 100px;
        padding: 15px 0 0 0;
        margin: 0 0 0 -16px;

  }
 .selected_works_individual{
        padding: 0 10px;
        height: 180px;
    }
  .working_with_me_wrapper{
    padding: 0;
    min-height: 900px;
  }
  .working_with_me_wrapper .about_wrapper{
        min-height: 770px;
        height: 770px;
        /* padding: 123px 0 0 0; */
    }
     .social_media_wrapper .selected_works_individual{
    
    padding-top: 0;
  }
       .email{
    font: normal 29px 'TAN - PEARL';
    min-height: 50px;
  }
   .quick_links a{
    font: normal 16px "Apoc Sans Light";
  }
   .copyright_wrapper{

        font-size: 12px !important;
     } 

  

  }




/* PHONE SCREEN small*/


@media (max-width: 375px)
{
       
    .body_wrapper{
        max-width: 375px;
        gap: 100px;
        
    }
     .nav{
        /* max-width: 375px !important;
        min-width: 375px !important; */
        padding: 0 !important;
        gap: 40px !important;
    }
    .hide{
     display:none ;
   }
    .hero{
        min-height: 760px;
    }

    h1{
        font-size: 4em;
    }
    .body_lg{
        width: 95%;

    }

    h2{
        font-size: 3em;
        min-width: 280px;
    }
    .title_arrow_wrap{
        gap:15px;
    }
    .about_wrapper{
        padding: 80px 0 0 0;
        min-height: 1100px; 
    }
    .about_img_descr{
        display: flex;
        flex-direction: column;
        align-items:center;
        gap: 0;
    }
    .about_heading_wrapper{
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }


    .about_img{
        height: 400px;
        /* padding: 0 0 0 117px; */
        padding: 0;
    }
    .about_para_handshake_wrapper{
        height: 640px;
        width: 600px;
        margin: 0;
    }
    .abt_descr{
        overflow: hidden;
        display: flex;
        flex-direction: column;
        gap: 0;
        margin: 0;
        rotate: 0;
    }
    .abt_cta_btn{
        bottom: 39px;
        left: 26px;
        position: relative;
        align-items: start;
    }
    
    .works_heading_wrap{
        padding: 0 0 0 20px;
        gap: 50px;
        
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: start;
        
    
    }
    .works_heading_wrap div{
        /* margin: 0 0 -43px -42px; */
        margin: 0;
        padding: 0;
        min-height: auto;
    }
    .works_heading_wrap a{
        min-height: 0;
        overflow: hidden;
    }
    .title_wrap h3{
        font-size: 1.25em;
    
    
     }
    .place_holder{
        height: 100px;
        padding: 15px 0 0 0;
        margin: 0 0 0 -16px;

  }
 .selected_works_individual{
        padding: 0 10px;
        height: 180px;
    }
     .selected_works_wrapper p{
      font: normal 12px mulish;
    }
  .working_with_me_wrapper{
    padding: 0;
    min-height: 900px;
  }
  .working_with_me_wrapper .about_wrapper{
        min-height: 770px;
        height: 770px;
        padding: 100px 0 0 0;
    }
     .social_media_wrapper .selected_works_individual{
    
    padding-top: 0;
  }
       .email{
    font: normal 28px 'TAN - PEARL';
    min-height: 50px;
  }
   .quick_links a{
    font: normal 16px "Apoc Sans Light";
    /* height: 95px; */
  }
   .copyright_wrapper{

        font-size: 12px !important;
     } 

  

  }

  /* PHONE SCREEN extra small*/


@media (max-width: 320px)
{

    .nav_wrap{
    display: none;
}
    
.about_para_handshake_wrapper{
        padding: 0 0 0 42px;
    }
 .abt_cta_btn div{
    /* background-color: red; */
    width: 200px !important;
    height: 200px !important;

  }
 .abt_cta_btn{
        left: 72px;
    }

 h2{
        font-size: 2.5em;
    }

      .email{
    font: normal 23px 'TAN - PEARL';
  }
   .quick_links a{
    font: normal 12px "Apoc Sans Light";
    /* height: 95px; */
  }
  .copyright_wrapper{

        font-size: 10px !important;
     } 

}