@charset "UTF-8";


/* RESETS */
html {font-size: 62.5%; /*font-family: Arial, Helvetica, sans-serif;*/ font-family: 'Open Sans', sans-serif;}
body {
	background-color: rgba(149,177,189,1);
}
* {margin: 0; padding: 0; }
a {text-decoration: none; color: #000; }
a:hover {}
ul, ol {margin: 0; list-style-type: none;}
img {border: none;}

/**/

h1 {font-size: 2rem; line-height: 2.4rem; color: rgba(149,177,189,1); margin-bottom: 2rem;}
p {font-size: 1.4rem; line-height: 2.2rem; margin-bottom: 2rem;}

.wrapper {width: 960px; margin: 0 auto;}

/* HEADER */

header {background-color: rgba(149,177,189,1); padding: 10px 0;}
header:after {content: ""; display: table; clear: both;}
.logo {float: left; width: 15%; padding: 20px; box-sizing:border-box;}
.logo img {width: 100%; height: auto;}
.contacts {float: left; width: 30%; padding: 20px 20px 20px 20px ; box-sizing:border-box; font-size: 1.5rem; line-height: 1.8rem; color: #fff;}
.contacts a {color: #fff;}
.riba-logo {float: left; width: 15%; padding-top: 20px; box-sizing:border-box;}
.riba-logo img {width: 100%; height: auto;}
nav {float: left; text-align: left; width: 40%; padding: 20px; box-sizing:border-box;}
nav ul {font-size: 1.6rem; line-height: 2rem; position: relative;}
nav ul li {display: block; position: relative; float: left;}
nav ul li a {display: block; text-transform: uppercase; color: #fff; font-weight: 400; padding: 0 0 0 10px;}
nav ul li ul {display: none; background: rgb(149,177,189); padding: 20px 10px 20px 0px; font-size: 14px; line-height: 19px; width: 200px;}
nav ul li ul li.border-top {border-top: dashed 1px white; margin-top: 10px;}
nav ul ul {display:none; position:absolute;}
nav ul li:hover > ul {display: block;}
nav ul ul li {float: none;}


.view-mobile {display: none;}

/* HEADER */

.white-background {background-color: #fff; padding: 20px 0;}

/* HOME SECTIONS */
.projects {background-color: rgba(149,177,189,1);}
.projects:after {content: ""; display: table; clear: both;}
.projects ul {}
.projects ul li {width: 33.33333333%; float: left;}
.projects ul li:nth-child(3n+1) {clear: both;}
.projects ul li a {background-color: rgba(149,177,189,1); display: block; border-top: solid 2px rgba(149,177,189,1);}
.projects ul li a:hover {background-color: rgba(0,0,0,1);  border-top: solid 2px rgba(0,0,0,1);}
.projects ul li a img {display: block; width: 100%; height: auto;}
.projects ul li a span {display: block; padding: 10px 20px; box-sizing:border-box; font-size: 1.4rem; line-height: 1.8rem; text-transform: uppercase; color: #fff; font-weight: 400;}

.intro {padding: 20px; color: #717982;}

/* HOME SECTIONS */

/* PROJECT PAGE */
.project-sector {}
.project-sector h1 {padding: 30px 0; font-size: 2.6rem; line-height: 3rem; font-weight: 300;}
.project-sector h1 span {font-weight: 400; text-transform: uppercase;}

.project-sector-list {}
.project-sector-list:after {content: ""; display: table; clear: both;}
.project-sector-list li.project-panel {display: block; width: 49%; margin-left: 2%; float: left; margin-bottom: 20px; background-color: rgba(149,177,189,0.2);}
.project-sector-list li.project-panel:nth-of-type(2n+1) { margin-left: 0; clear: both;}
.project-sector-list li img {width: 100%; height: auto; display: block;}
.project-sector-list li div {padding: 20px 90px 20px 20px; position: relative;}
.project-sector-list li div h2 {font-size: 1.8rem; line-height: 2.2rem; color: rgba(149,177,189,1); font-weight: 600; margin-bottom: 10px;}
.project-sector-list li div ul {font-size: 1.4rem; line-height: 2rem; color: rgba(149,177,189,1); margin-left: 24px; list-style-type: disc;}
.project-sector-list li div ul li span {color: #000;}

.factsheet-download {width: 50px; background-image:url(../images/projects/pdf-icon.png); background-repeat: no-repeat; background-size: 50px; padding-top: 60px; text-align: center; display: block; position: absolute; bottom: 20px; right: 20px; }

/* PROJECT PAGE */
/* PROFILE PAGE */
.profile {padding: 20px; color: #717982; background-color: #f4f7f9;}

.team {margin-top: 20px;}

.team h1 {text-align: center; text-transform: uppercase;}

.team h1 div {height: 0; border-top: solid 1px #e6e8ea; width: 20%; margin: 10px auto 0 auto;}

.team ul {margin-bottom: 20px;}
.team ul:after {content: ""; display: table; clear: both;}
.team ul li {display: block; width: 30.3333%; float: left; margin: 0 0 20px 4.5%; text-align: center; }
.team ul li:nth-child(3n+1) {margin-left: 0; clear: both; }
.team ul li h2 {color: rgba(149,177,189,1); text-transform: uppercase; padding-bottom: 20px;}
.team ul li div {background-color: rgba(149,177,189,1); color: #fff; padding: 10px;}
.team ul li div h3 {font-size: 1.4rem; line-height: 2.2rem;}
.team ul li div h4 {font-size: 1.4rem; line-height: 2.2rem; margin-bottom: 10px;}
.team ul li div p {font-size: 1.4rem; line-height: 2.2rem;}

/* PROFILE PAGE */

/* CONTACT PAGE */
.contact-section-1 {padding: 10px; background-color: #f4f7f9; margin-bottom: 20px;}
.contact-section-1 ul {}
.contact-section-1 ul:after {content: ""; display: table; clear: both;}
.contact-section-1 ul li {width: 23.5%; display: block; float: left; margin-left: 2%; color: rgba(149,177,189,1);}
.contact-section-1 ul li:first-of-type {margin-left: 0;}
.contact-section-1 ul li img {display: block; width: 100%; height: auto;}

.contact-section-2 {margin-bottom: 20px;}
.contact-section-2 ul {}
.contact-section-2 ul:after {content: ""; display: table; clear: both;}
.contact-section-2 ul li {width: 32%; display: block; float: left; margin-left: 2%; box-sizing: border-box;  background-color: #f4f7f9;  min-height: 230px;}
.contact-section-2 ul li:first-of-type {margin-left: 0; background-color: transparent;}
.contact-section-2 ul li:first-of-type img {border: solid 1px rgba(149,177,189,1); }
.contact-section-2 ul li img {display: block; width: 100%; height: auto;}
.contact-section-2 ul li div {padding: 10px; color: rgba(149,177,189,1); }
.contact-section-2 ul li div h2 {color: rgba(149,177,189,1);  text-transform: uppercase; padding-bottom: 20px;}
.contact-section-2 ul li div label {position: absolute; top: -500em;}
.contact-section-2 ul li div input[type="text"], .contact-section-2 ul li div input[type="email"] {display: block; width: 100%; padding: 5px; border: none; box-sizing: border-box;   border-radius: 4px; font-size: 1.4rem; line-height: 2.2rem; }
.contact-section-2 ul li div textarea {display: block; width: 100%; padding: 5px; border: none; box-sizing: border-box; font-size: 1.4rem; line-height: 2.2rem; height: 30px;  border-radius: 4px;  font-family: 'Open Sans', sans-serif;}
.contact-section-2 ul li:nth-of-type(3) div p {margin: 0; padding: 0 0 10px 0;}
.contact-section-2 ul li:nth-of-type(3) div p.submit {text-align: right;}
.contact-section-2 ul li:nth-of-type(3) div p.submit input[type="submit"] { border-radius: 4px; font-size: 1.4rem; line-height: 2.2rem; padding: 5px; border: none; background-color: #fff; color: rgba(149,177,189,1); }
.contact-section-2 ul li:nth-of-type(3) div p.submit input[type="submit"]:hover {cursor: pointer; color: #fff; background-color: rgba(149,177,189,1);}

/* CONTACT PAGE */


/*CONTACT FORM */

#contacts-form {clear:right;
	            width:100%;
	            overflow:hidden;
	            font-size:14px;
               }
               
#contacts-form fieldset {border:none;
	                     float:left;
	                     }
                        
                                              
#contacts-form .field {clear:both;
                      }
                      
#contacts-form label {float:left;
	                  width:126px;
	                  line-height:22px;
	                  padding-bottom:8px;
					  color: #717982;
	                  }
                     
#contacts-form .input {width:400px;
	                   padding:1px 0 1px 3px;
	                   border:1px solid #e2e2e2;
	                   color:#717982;
	                   background:#fff;
					   height: 20px;
                      }

#contacts-form textarea {width:400px;
	                     height:200px;
	                     padding:1px 0 1px 0px;
	                     border:1px solid #e2e2e2;
	                     color:black;
	                     background:#fff;
	                     margin-bottom:15px;
	                     overflow:auto;
                         }  
                     
.sendbutton {padding:10px 20px;
             color:black;
             background-color:white;
             border:solid;
             border-width:1px;
             border-color:grey;
             border-radius:10px;
             float:right;
             font-size:14px;
			}  
             
             
button:hover {background-color:rgb(149,177,189);
              color:white; 
              box-shadow: 0px 0px 15px #888888;
              border-color:rgb(149,177,189);
             } 

/* CONTACT FORM */

/* FOOTER */

footer {background-color: rgba(149,177,189,1); border-top: solid 3px #000; color: #fff;}
footer:after {content: ""; display: table; clear: both;}

footer .column {width: 33%; float: left;  padding: 20px; box-sizing:border-box; font-size: 1.3rem; line-height: 2rem;}

footer .column:nth-of-type(3) {padding: 20px 20px 20px 100px;}

.kinetics {display: block; width: 40%; height: auto; margin-top: 4px;}