@media (max-width: 767px) {
    #MainLeftCol {
        max-width: 767px;
    }
    #MainLeftCol h1{
        width: 100%;
    }
    #AboutRow .prc ,
    #PhilosophyRow .prc {
        padding: 0;
        margin-left: 0;
    }
    #ContactFooter .nav li {
        position: relative;
        float: none;
    }
    #LangNavigation {
        top: 20px;
        right:18px;
    }
    #MainNavigation .container {
        height: 70px;
    }
    #MainNavigation #LogoRow {
        margin-top: 10px;
        margin-bottom: 0;
    }
    #MainNavigation #LogoRow img {
        width: 200px;
    } 
    main {
        margin-top: 120px; /*  start from body 's top */
        margin-bottom: 0px;
        padding-top: 0;
    } 
   .slide-wrapper {
       height: 360px;
    }  
    .ProjectSpecCol {
        height: auto;
    }
     .ProjectSpecCol h1{
         height: auto;
         margin-bottom: 20px !important;
     }  
    #ProjectSpecTable{
        margin-bottom: 80px;
    }    

    /* Mobile Navigation */
    #MobileNavigationBtn {
         position: fixed;
         top: 10px; 
         left:8px; 
         z-index: 9998;         
    }
    #MobileNavigationBtn .icon-bar {
        background-color: #898989;
    }
    #MobileNavigationBackCover {
        position:fixed;
        top:0;
        width: 100%;
        height:100%;
        display: none;
        background-color: #000000;
        opacity: 0.9;
    }
    #MobileNavigationList {
        position:fixed;
        top:0;
        left: -250px;
        width: 250px;
        height:100%;
        z-index: 9999;  
        overflow-x: auto;
        background-color: #ffffff; 
        box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.4);
        list-style: none;
    }
    #MobileNavigationList li {
        margin-top: 40px;
        margin-bottom: 40px;
    }
    #MobileNavigationList li a {
        text-decoration: none;
    }
    #MobileNavigationList ul.cust-dropdown-menu{
        width: 95%;
        margin: 0;
        padding: 0;
        padding-left: 10px;
        list-style: none;
        display: none;
    }
    #MobileNavigationList ul.cust-dropdown-menu li {
        margin-top: 20px;
        margin-bottom: 15px;       
    }
   
    /* Under ProjectBody */
    #PhilosophyBody #PhilosophyRow .prc .thumbnail h2, 
    #ProjectBody #PhilosophyRow .prc .thumbnail h2, 
    #PublicationBody #PhilosophyRow .prc .thumbnail h2 {
        position: relative;
        padding: 0;
        margin-top: 15px;
        width: auto;
        color:  #231815;
        display: block;
    }  
    #PhilosophyBody #PhilosophyRow .prc:hover .thumbnail .layer-cover, 
    #ProjectBody #PhilosophyRow .prc:hover .thumbnail .layer-cover, 
    #PublicationBody #PhilosophyRow .prc:hover .thumbnail .layer-cover {
        display: none;
    }
   
}

@media (min-width: 768px) {
    #MainNavigation .nav-pills li a,
    #MobileNavigationList li a{
/*        width: 170px;
        margin-right: 10px;*/
    }     
    #MainRightCol {
        max-width: 480px;
    }
}

@media (min-width: 992px) {
    #MainNavigation .nav-pills li a,
    #MobileNavigationList li a{
/*        width: 230px;
        margin-right: 30px;*/
    }      
    #MainRightCol {
        max-width: 698px;
    }
    #AboutRow .prc {
        max-width: 618px;
    } 
    #PhilosophyRow .prc {
        width: 269px;
    }      
}

@media (min-width: 1200px) {
    #MainNavigation .nav-pills li a,
    #MobileNavigationList li a{
       /*width: 230px;*/   /*same with the width of thumbnail */
       /*margin-right: 80px;*/
    }      
    .container {
      width: 1200px;
    }    
    #MainRightCol {
        max-width: 930px;
    }
    #AboutRow .prc {
        max-width: 850px;
    }    
    #PhilosophyRow .prc {
        width: 230px;
    }    
}