@charset "UTF-8";
/* CSS Document */


@media screen and (min-width: 1680px){
    
        main{
        
        height:8624px;
    }
    
        #tile{
        
        height:742px;
    }
    
    #tile_2{
        
        height:742px;
    }
    
    #tile_3{
        
        height:742px;
    }
    
    #tile_4{
        
        height:742px;
    }
    
    #tile_5{
        
        height:742px;
    }
    
    #tile_6{
        
        height:4200px;
    } 
    
    #bottom{
        
        top:350px;
    }
    
}

@media screen and (max-width: 1366px){
    
    main{
        
        height:8068px;
    }
    #tile{
        
        height:535px;
    }
    
    #tile_2{
        
        height:535px;
    }
    
    #tile_3{
        
        height:535px;
    }
    
    #tile_4{
        
        height:535px;
    }
    
    #tile_5{
        
        height:735px;
    }
    
    #tile_6{
        
        height:3687.9px;
        top:-200px;
    }
    
    #tile_7{
        
        height:887.9px;
    } 
    
    #tile_8{
        
        height:887.9px;
    } 
    
        #tile_9{
        
        height:887.9px;
    }
    
    #tile_10{
        
        height:887.9px;
    }
}

@media screen and (max-width: 1280px){
    
    main{
        
        height:7910px;
    }
    #tile{
        
        height:535px;
    }
    
    #tile_2{
        
        height:535px;
    }
    
    #tile_3{
        
        height:535px;
    }
    
    #tile_4{
        
        height:535px;
    }
    
    #tile_5{
        
        height:735px;
    }
    
    #tile_6{
        
        height:3200px;
        top:0px;
        background-size: contain;
    }
    
    #tile_7{
        
        height:832px;
    } 
    
    #tile_8{
        
       height:832px;
    }
    
    
    #tile_9{
        
        height:832px;
    }
    
    #tile_10{
        
        height:832px;
    }
    
}







@media screen and (max-width: 1024px){
    
main{
    
    width:100%;
    height:2500px;
    position:relative;
    margin:0px auto;
    background:#fcfcfc;
    overflow:auto;
    
}
    
    #logo{
        
        left:70px;
    }    
    
    #menu{
        
        right:70px;
    }
    
#title{
    
    width:300px;
    height:136px;
    top:150px;
    position:absolute;
    left:70px;


  
    
    
}  
    
    #design_problem{
        height: 700px;
    
    }
    
 
    
    #problem_copy{

    width:716px;
    height:200px;
    position:relative;
    top:40px;
    left:70px;
    
}
    

    
    
#tile{
        
        height:535px;
    }
    
#tile_2{
        
        height:535px;
    } 
    
#tile_3{
        
        height:535px;
    } 
    
#tile_4{
        
        height:535px;
    } 
    
#tile_5{
        
        height:435px;
    } 
    
#tile_6{
        
        height:3065.6px;
    }
    
#tile_7{
        
        height:665.6px;
    } 
    
#tile_8{
        
        height:665.6px;
    }
    
#tile_9{
        
        height:665.6px;
    }
    
#tile_10{
        
        height:665.6px;
    }    
    
    
    
    
    
 p1{
    
    font-family: 'Merriweather', serif;
    line-height:60px;
    font-weight:900;
    font-size:40px;
    letter-spacing:1px;
    color:#fcfcfc;
} 
    
    
p5{
    
    font-family: 'Montserrat', sans-serif;
    font-weight:300;
    color:#fcfcfc;
    font-size:16px;
    line-height:32px;
}
    
  
    
    
#design_solution{
    
    width:716px;
    height:900px;
    left:70px;
    position:relative;
    top:100px;
    
    
}    
    
p6{
    
    font-family: 'Merriweather', serif;
    line-height:80px;
    font-weight:900;
    font-size:40px;
    letter-spacing:1px;
    color:#16161d;
} 
    
p7{
    
    font-family: 'Montserrat', sans-serif;
    font-weight:300;
    color:#16161d;
    font-size:20px;
    line-height:40px;

} 
    
    #bottom{
        
        top:0px;
    }
    
        #info{
        
        left:70px;
    }
    
}

@media screen and (max-width:800px){
    
    main{
        
        height:7550px;
        overflow: hidden;
    }
    
    #logo{
        
        left:20px;
    }
    
    #menu{
        
        right:20px;
    }
    
    #problem_copy{
        
        left:42px;
    }

    
    #tile{
        
        width:96%;
        height:600px;
    }
    
    #tile_2{
        
        width:96%;
        height:400px;
    }
    
    #tile_3{
  
        width:96%;
        height:600px;
    }
    

    
    #tile_4{
        
        width:96%;
        height:400px;
    }
    
    #tile_5{
        
        width:90%;
        height:700px;
    }
    
    #tile_6{
        
        width:96%;
        height:3000px;
    } 
    
    #tile_7{
        
        width:100%;
        height:800px;
    }
    
    #tile_8{
        
        width:100%;
        height:800px
    }
    
    #tile_9{
        
        width:100%;
        height:800px;
    }
    
    #tile_10{
        
        width:100%;
        height:800px;
    }
    
    
    #design_solution{
        
        left:42px;
    }
    
    #bottom{

        top:100px;
    
    }
    
    #info{
        
        left:20px;
    }
    
    
    
}



@media screen and (max-width: 768px){
    
    main{
        
        height:7455px;
        overflow:hidden;
    }
    
    #descript{
        
        background-attachment: scroll;
    }
    
    #title{
        
        left:42px;
    }
    

    
    #problem_copy{
        
        top:30px;
        left:42px;
        width:537px;
    }
    
    #design_copy{

    width:90%;
    height:200px;
    position:relative;
    margin: 0px auto;    


}
    
    #tile{
        
        width:96%;
        height:600px;
    }
    
    #tile_2{
        
        width:96%;
        height:400px;
    }
    
    #tile_3{
  
        width:96%;
        height:600px;
    }
    

    #tile_4{
        
        width:96%;
        height:400px;
    }
    
    #tile_5{
        
        width:90%;
        height:700px;
    }
    
    #tile_6{
        
        width:96%;
        height:3000px;
    }
    
    #tile_7{
        
        width:100%;
        height:768px;
    } 
    
    #tile_8{
        
        width:100%;
        height:768px;
    }  
    
    #tile_9{
        
        width:100%;
        height:768px;
    }
    
    #tile_10{
        
        width:100%;
        height:768px;
    }    
    
#design_solution{
    
    left:42px;
    width:537px;

    }
    
    #bottom{
        
        top:100px;
    }
    
    p5{
        
        font-size: 14px;
        line-height: 24px;
    }
    
    #design_problem{
        
        height:600px;
    }
    

    
    
}

@media screen and (max-width: 480px){
    
    main{
        
        height:6055px;
        overflow:hidden;
    }
    

    
    #title{
        
        left:30px;
        width:225px;
        height:102px;
    }  
    

    #descript{
        
        background-attachment:scroll;
    }
    


    #design_problem{
        
        height:680px;
    }    
    
    
#problem_copy{
        
        top:30px;
        left:30px;
        width:80%;
    } 
    
    
    p1{
        
        font-size:32px;
    }
    
        p6{
        
        font-size:32px;
    }  
    
#tile{
        
        height:320px;
    }
    
#tile_2{
        
        height:320px;
    }
    
#tile_3{
        
        height:320px;
    }
    
#tile_4{
        
        height:300px;
    }
    
#tile_5{
        
        height:1080px;
    }
    
#tile_6{
        
        height:1780px;
    }
    
    #tile_7{
        

        height:480px;
    } 
    
    #tile_8{
        
        height:480px;
    }
    
    #tile_9{
        
        height:480px;
    }
    
    #tile_10{
        
        height:480px;
    }    
    
    #design_solution{
        
        top:40px;
        left:30px;
        width:420px;
    
    
    } 
    
    p7{
        
        line-height:28px;
        font-size:20px;
    }
    
    #bottom{
        
        top:200px;
    } 
    
    #ankr{
        
        right:10px;
    }
}


@media screen and (max-width: 414px){
    
    main{
        
        height:5675px;
        
    }
    #design_problem{
        
        height:750px;
    }
    
    #problem_copy{
        
       
        top:50px;
    }
    
    #design_solution{
        
        width:350px;
    }
    
#tile{
        
        height:314px;
    }
    
#tile_2{
        
        height:214px;
    }
    
#tile_3{
        
        height:314px;
    }
    
#tile_4{
        
        height:200px;
    }
    
#tile_5{
        
        height:1214px;
    }
    
#tile_6{
        
        height:1514px;
    } 
    
    #tile_7{
        
        height:414px;
    }    
    
    #tile_8{
        
        height:414px;
    }
    
    #tile_9{
        
        height:414px;
    }
    
    #tile_10{
        
        height:414px;
    }     
    
    #bottom{
        
        top:100px;
    }
}

@media screen and (max-width:412px){
  
    main{
        
        height:5675px;
        
    }    
    
#tile{
        
        height:314px;
    }
    
#tile_2{
        
        height:214px;
    }
    
#tile_3{
        
        height:314px;
    }
    
#tile_4{
        
        height:200px;
    }
    
#tile_5{
        
        height:1214px;
    }
    
#tile_6{
        
        height:1514px;
    } 
    
    #tile_7{
        
        height:412px;
    }
    
    #tile_8{

    height:412px;
    
    
    }
    
    #tile_9{
        
    height:412px;
    }
    
    #tile_10{
        
    height:412px;
    } 
    
    
}

@media screen and (max-width: 375px){
    
    
    main{
        
        height:5625px;
        overflow:hidden;
    }
    

    
    #title{
        
        left:20px;
        width:190px;
        height:81.6px;
    }
    
    #design_problem{
        
        height:820px;
        width:375px;
    }
    
    #problem_copy{
        
        left:30px;
        top:40px;
        height:300px;
        
    }
    
    p5{
        
        line-height:24px;
    }
    
    #tile{
        
        height:300px;
    }
    
    #tile_2{
        
        height:200px;
    }
    
    #tile_3{
        
        height:300px;
    }
    
    #tile_4{
        
        height:200px;
    } 
    
    #tile_5{
        
        height:775px;
    } 
    
    #tile_6{
        
        height:2375px;
    } 
    
    #tile_7{
        
        height:375px;
    } 
    
    #tile_8{
        
        height:375px;
    } 
    
    #tile_9{
        
        height:375px;
    }
    
    #tile_10{
        
        height:375px;
    }     
    
    
    #design_solution{

        left:20px;
        width:90%;
    
    }
    
    p7{
        
        font-size:18px;
    }
    
    

    
    #bottom{
        
        top:-400px;
    }
    
    
}

@media screen and (max-width: 360px){
    
    main{

        height:5605px;
    }
    #title{
        
        left:25px;
    }
    
    
    #design_problem{
        
        height:800px;
    
    }
    
    #problem_copy{
        
        left:25px;
        top:30px;
    }
    
     #tile{
        
        height:300px;
    }
    
    #tile_2{
        
        height:200px;
    }
    
    #tile_3{
        
        height:300px;
    }
    
    #tile_4{
        
        height:200px;
    } 
    
    #tile_5{
        
        height:775px;
    } 
    
    #tile_6{
        
        height:2375px;
    }
    
    #tile_7{
        
        height:360px;
    } 
    
    #tile_8{
        
        height:360px;
    } 
    
    #tile_9{
        
        height:360px;
    }
    
    #tile_10{
        
        height:360px;
    }     
    
    
    
    #bottom{
        
        top:-400px;
    }
}