/*** 960px - 1023px ***/  
@media only screen and (max-width: 1023px) {
    *{}
    .right-area{width:88%;}
    
    .featured-projects{width: 66%; margin-right:3%; max-width:640px;}
    .featured-sketches{width:31%; max-width: 300px;}
    .featured-news{width:49%; margin-right:3%; max-width: 480px;}
    .link-box{width:14%;}
    .link-box.profile, .link-box.contact{margin-right: 3%;}
    
    .right-area.news .listing li .photo{width: 20%; padding-bottom: 15%;}
    
    .right-area.projects .listing li{height:198px;}

}



/*** 768px - 959px ***/ 
@media only screen and (max-width: 959px) {
    *{}
     h2.sub-title{font-size:20px; line-height: 26px; margin: 0 0 6px 0;}
    .featured-projects .project-holder{padding-bottom:75%;}
    .featured-projects .project-holder img{height:100%; top: 0;}
    .link-box a{font-size:20px;}
    
    .right-area{width:84%; height:530px; overflow:hidden;}
    .right-area.profile .center {overflow-y: scroll; height: 490px; }
    
    .filter-bar li a{padding: 0 30px; font-size: 16px;}
    
    .right-area{height: auto; overflow: visible;}
    .right-area.sketches{height: auto; overflow-y: visible;}            
    
    .right-area.projects .listing li{height:216px;}
    .right-area.projects .listing li:nth-child(1n){width: 30%; margin-right:5%}
    .right-area.projects .listing li:nth-child(3n){margin-right:0;}
    .right-area.projects .listing .title{font-size: 13px; line-height: 16px;}
    
    .right-area.news .listing li .photo{width: 30%; padding-bottom: 22.5%;}  
        
    .right-area.sketches .listing li:nth-child(1n){width: 30%; margin-right:5%}   
    .right-area.sketches .listing li:nth-child(3n){margin-right:0;}   
    
    .sketche-details .details{margin-top: 20px;}
    .right-area.sketches .sketche-details{height: 100%;}
    .right-area.sketches .sketche-details .photo{width: 100%; clear: both; float: none; padding-bottom: 75%;}
    
    
}



/*** 640px - 767px ***/ 
@media only screen and (max-width: 767px) {
    *{}
    .featured-projects{width:100%; float: none; clear: both; margin-right: 0; height: auto; }
    .featured-sketches{width:100%; float: none; clear: both; max-width: none; height: auto; }
    .featured-sketches .sketches-category{float: left; width:50%; clear:none;}
    
    .featured-sketches .sketche-holder .photo{max-height: none; max-width: none;}  
    .featured-sketches .sketche-details{height:auto; position:relative; left:0!important;}     
    .featured-sketches .sketche-details .photo{height: auto; width: 100%; padding-bottom: 75%; position:relative;} 
    .featured-sketches .sketche-details .photo img{position: absolute; left: 0; top: 0; height: 100%;}
    .featured-sketches .sketche-details .center{padding-bottom:30px;}
    
    .link-box{width: 100%; margin-right:0; margin-bottom:20px; height: auto; float: none; clear: both;}
    .link-box a{position: relative; height: 50px; line-height: 50px;}
    .featured-news{width: 100%; margin-right:0; margin-bottom:20px; max-width: none;  float: none; clear: both; height: auto;}
    .featured-news .summary{height: auto; overflow: visible; line-height: 18px;}
    .featured-news .title{margin-bottom: 2px;}
    .featured-news .flexslider{height: auto;}
    .featured-news .center{padding-bottom:40px;}
    .featured-news .flex-control-nav{bottom: -24px;}

    footer .social-media{position: relative; width: 180px; margin: 20px auto;}     

    .right-area{width: 80%;}
    
    .right-area.projects .listing li{height:248px;}
    .right-area.projects .listing li:nth-child(1n){width: 47%; margin-right:6%}
    .right-area.projects .listing li:nth-child(2n){margin-right:0;}
    
    .right-area.sketches .listing li:nth-child(1n){width: 47%; margin-right:6%}                
    .right-area.sketches .listing li:nth-child(2n){margin-right:0;}        
    
    .contact-info, .contact-form{float:none; width: 100%; margin: 0 0 20px 0; clear: both; }
    
    .filter-bar{padding-right:0; border-bottom: 0}    
    .filter-bar li a{padding: 0 20px; font-size: 14px;}
    .right-area.sketches .date-holder{float:right; position: relative; top: 0; right: 0; margin: 20px 20px 0 0;}
    .filter-bar ul{border-bottom: 1px solid #3c3c3c; }
    
    
}



/*** 480px - 639px ***/ 
@media only screen and (max-width: 639px) {
     *{}
     header .logo{width: 40%; }
     header .logo img{width: 100%;}
     header h2{font-size: 16px; line-height: 16px;}
              
     footer .footer-menu{height: auto; display: inline-block;}
     footer .footer-menu li{ margin-bottom: 6px;}

    .right-area{width:72%;}
    .right-area.projects .category-filter{position: relative; right: 0; top:0; float:right; margin-bottom: 20px;}
    .right-area.projects h2.sub-title{padding-right:0; clear: both;}
    .right-area.projects .listing li{height: auto;}   
    .right-area.projects .listing li:nth-child(1n){width: 100%; margin-right:0%; margin-bottom: 30px;}
    
    .right-area h2.sub-title{font-size:14px;}
    
    .right-area.news .listing li .photo{width: 40%; padding-bottom: 30%;}
    .right-area.news .listing .title{font-size:12px; line-height: 16px;}
    
    .right-area .photos-slider{float: none; width: 100%; clear: both; margin-bottom: 40px;}
    
    .right-area.sketches .listing li:nth-child(1n){width: 100%; margin-right:0%; margin-bottom: 30px;}           
         
}


/*** 320px - 479px ***/ 
@media only screen and (max-width: 479px) {    
    *{}    
    header{text-align: center;}
    header .logo{width: auto; max-width: 100%; float: none;} 
    header h2{position: relative; margin: 20px auto;}
    
    footer .footer-menu{text-align: center;}
    footer .footer-menu li{float: none; border: 0;}
    footer .footer-menu li a{display:inline;}
    footer .copyrights{text-align: center;}
    
    h2.sub-title{font-size:14px; line-height: 20px;}   
    
    .featured-projects h2.sub-title{top: 10px; left: 10px; margin-right: 0;}
    .featured-projects .project-holder .details{left:10px; bottom: 10px;}
    .featured-projects .project-holder .details .title{font-size:12px; line-height: 22px;}
    
    .featured-sketches .sketches-category{width: 100%; float: none;}
    .featured-sketches .sketche-holder .photo{width:100%; float:none; padding-bottom: 75%;}

    .left-navigation{float: none; width: 100%; margin: 0 0 20px 0;}
    .left-navigation ul{width: 100%; }
    .left-navigation li{width: 100%; height:30px; margin: 4px 0 0 0; }
    .left-navigation li a{line-height:30px;}
    .right-area{float: none; width: 100%; margin: 0 0 20px 0;}  
    
    .right-area.profile .center{overflow: visible; height: auto;}
    
    .profile-photo{float: none; clear: both; max-width: 100%; }
    
    .right-area.news .listing li{padding-top: 20px; margin-top:20px; border-top: 1px solid #ccc}
    .right-area.news .listing li:first-child{margin-top:0; padding-top:0; border-top:0}
    .right-area.news .listing li .photo{width: auto; height: auto; padding-bottom: 0; margin-right: 0; clear: both; float:none; display: block; max-width: 100%;}
    .right-area.news .listing li .photo img{position: relative; height: auto; max-width: 100%;}
    
    .filter-bar li a{padding: 0 10px; font-size: 12px;}  
     
}




/*** 0 - 319px ***/ 
@media only screen and (max-width: 319px) {
    *{}
      
      
}
 


