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

.container-project{
    width: 100%;
    float: left;
   padding:  5px 10px 5px 0;
    
    }

.container-inner{
    width: 100%;
    float: left;
    padding: 0px;
   
   
    }

.project-row{
    width: 100%;
    float: left;
    padding: 0;
   
    }

.project-row-image{
    width: 70%;
    float: left;
    line-height: 0;
    padding: 10px;
}

.project-row-image img{
    width: 100%;
    height: auto;
   }
.project-row-text-colour{
    width: 30%;
    float: left;
    padding: 15px 15px;
    margin-top: 10px;
    color: #222;
    }
.project-row-text{
    width: 30%;
    float: left;
    padding: 0 10px;
    margin-top: 10px;
    }

.project-row-text h2{
    font-size: 24px;
   }

.project-title-row{
    float: left;
    width: auto;
    padding: 0 10px;
   }

.project-title{
    width: 100%;
    float: left;
    color: #222;
    
    }
 .project-title h2{
        font-size: 22px;
        line-height: 38px;
        font-weight: 500;
     margin: 0px 16px 5px 16px;
     color: #222;
    }




@media only screen and (max-width: 730px) {
    
    .container-project{
    width: 100%;
    float: left;
   padding: 0px 5px;
        position: relative;
    }
    
  .project-row-image{
    width: 100%;
    float: left;
    line-height: 0;
    padding: 0 0 10px 0;
    
} 
    
    .project-row-text-colour{
    width: 100%;
    float: left;
    padding: 10px 10px;
    margin: 0 0 10px 0;
    color: #222;
        
    }
    
    .project-row-text{
    width: 100%;
    float: left;
    padding: 0px 5px 30px 0px;
        margin: 0 0 10px 0;
    }
    
    .project-row-text h2{
    font-size: 20px;
   }

   


.project-title-row{
    float: left;
    width: auto;
    padding: 0 0 0 0px;
    margin-bottom: 10px;
   }

.project-title{
    width: 100%;
    float: left;
    color: #222;
   
    }
    
     .project-title h2{
        font-size: 22px;
        line-height: 24px;
        font-weight: 500;
     margin: 6px 12px 11px 12px;
     color: #222;
    }
    
    }