
/*******************
----HTML5----------
*******************/
section, header, footer, aside, article, nav, form {
	display: block;
}

/*******************
----GENERAL---------
*******************/

* {
padding:0px;
margin:0px
}

html, body {
	background: #fefefe url('../images/bg.png') repeat;
	background-attachment:fixed;
	margin: 0;
	padding:0;
	height: 100%;
	color: #2D2D2D;
	font: 16px 'Open Sans', sans-serif;
	line-height: 150%;
}


a {
	color: #00989d;
	text-decoration: none;
	-webkit-transition: color .5s ease-out;
	-moz-transition: color .5s ease-out;
	-o-transition: color .5s ease-out;
	transition: color .5s ease-out;
	
}

a:hover {
	color: #5BB1CB;
	-webkit-transition: color .5s ease-in;
	-moz-transition: color .5s ease-in;
	-o-transition: color .5s ease-in;
	transition: color .5s ease-in;	
}

H1 {
	font: 37px 'Open Sans', sans-serif;
	color: #3D132C;
	font-weight: bold;
	text-transform:uppercase;
	margin-bottom: 15px;
}

p { margin: 12px 0;
color: #545353;}


.left {
	float: left;
	margin: 5px 14px 12px 0;
}

.right {
	float: right;
}

#container {
	width: 1060px;
	margin: 0 auto;

}

.logo {
	border: none;
}

section {
	width: 750px;
	float: right;
	margin: 0 auto;
	padding: 55px 12px 100px 12px;
	overflow: hidden;
	z-index: 0;
}

.thanks {
	font-size: 18px;
	color:#038084;
	font-weight:bold;
	margin-bottom: 15px;
}

 .error {
	font-size: 18px;
	color:#ED1F1C;
	font-weight:bold;
	margin-bottom: 15px;
}



/*******************
----ASIDE---------
*******************/

aside {
	background: #fff;
	float:left;
	width: 220px;
	height: 100%;
	margin-top: 0;
	padding: 15px;
	border-right: 1px solid #EBEDEF;
	border-left: 1px solid #EBEDEF;
	position: fixed;
	z-index: 4;

}

	
nav ul {
	list-style:none;
	margin: 10px;
}
	
nav ul li {
	margin-bottom: 4px;
	padding: 15px 5px 0 5px;
	font: 18px 'Open Sans', sans-serif;
	letter-spacing: 0;
	text-transform: uppercase;
	font-weight: 500;
}

nav ul li a {
	color: #727272;
	text-decoration: none;
	-webkit-transition: color .5s ease-out;
	-moz-transition: color .5s ease-out;
	-o-transition: color .5s ease-out;
	transition: color .5s ease-out;
	
}

nav ul li a:hover {
	color: #00aeb4;
	-webkit-transition: color .5s ease-in;
	-moz-transition: color .5s ease-in;
	-o-transition: color .5s ease-in;
	transition: color .5s ease-in;	
}

/*******************
----PORTFOLIO---------
*******************/



section ul {
	list-style: none;
	margin: 0 auto;
}

section ul li {
	margin: 0 65px 45px 0;
	float:left;
	background-color: #fff;
	border:  1px solid #EBEDEF;
	width: 160px;
	height: 160px;
}

section ul li img{
	 width: 150px;
	 margin: 5px;
	 border: none;

}

section ul li a img{
	opacity:0.7;
	-webkit-transition: opacity .5s ease-out;
	-moz-transition: opacity .5s ease-out;
	-o-transition: opacity .5s ease-out;
	transition: opacity .5s ease-out;
}

section ul li a:hover img{
	opacity:1.0;
	-webkit-transition: opacity .5s ease-in;
	-moz-transition: opacity .5s ease-in;
	-o-transition: opacity .5s ease-in;
	transition: opacity .5s ease-in;
}

section ul li:last-child {
 	margin-right: 0;
}


/*******************
---PROJECT SINGLE---
*******************/
.project {
	overflow: hidden;
}

.project img {
	width: 690px;
	margin: 5px;
}

.project .around {
 	background-color: #fff;
	border:  1px solid #EBEDEF;
    width: 700px;
}

.project .description {
	width: 700px;
	margin-top: 25px;
	overflow: hidden;	
}

.project .description h1, h2 {
	font-size: 28px;
	font-weight: 400;
}

.project a.next {
	padding-top:20px;
    text-transform:uppercase;
	float: right;
	display:block;
	width: 700px;
	text-align: right;
	font-size: 14px;	
}

.project a.back {
	display:block;
	padding:10px 14px;
	background-color: #2D2D2D;
	color: #fff;
	text-decoration: none;
	text-transform:uppercase;
	float: right;
	-webkit-transition: color .5s ease-out;
	-moz-transition: color .5s ease-out;
	-o-transition: color .5s ease-out;
	transition: color .5s ease-out;
}

.project a:hover.back {
	color: #5BB1CB;
	-webkit-transition: color .5s ease-in;
	-moz-transition: color .5s ease-in;
	-o-transition: color .5s ease-in;
	transition: color .5s ease-in;	
}
	


/*******************
----ABOUT---------
*******************/

#about, #contact {
	margin-top: 100px;
}

#about h2 {
	margin-top: 35px;
}

#about p .norms {
	font-size: 28px;
	font-weight:bold;	
}

#about .bigcircle {
	background-color: #fff;
    height: 200px;
    width: 200px;
	margin-bottom: 25px;
}

#about .bigcircle img{
	margin: 5px;
}

#about .social {
	margin-top: 10px;
	overflow:hidden;
}

#about .social ul {
	list-style:none;
}

#about .social ul li {
	float:left;
	margin-right: 12px;
}

#about .social ul li a img{
	width: 48px;
	height: 48px;
	opacity:0.6;
	-webkit-transition: opacity .6s ease-out;
	-moz-transition: opacity .6s ease-out;
	-o-transition: opacity .6s ease-out;
	transition: opacity .6s ease-out;
}

#about ul li a:hover img{
	opacity:1.0;
	-webkit-transition: opacity .6s ease-in;
	-moz-transition: opacity .6s ease-in;
	-o-transition: opacity .6s ease-in;
	transition: opacity .6s ease-in;
}



/*/*******************
----CONTACT---------
******************

 #contact {
	overflow: hidden;
}


#contact p {
	font: 16px ;
	line-height: 150%;
	padding: 15px 10px 5px 5px;
}



#contact form {
	
}


    input, textarea {  
        padding: 3px;  
        border: solid 1px #212121;  
        outline: 0;  
        font: normal 13px/100% 'DroidSansRegular', Arial, sans-serif;  
        width: 200px;  
        background: #FFFFFF;   
        }  
      
    textarea {  
        width: 400px;  
        max-width: 400px;  
        height: 90px;  
        line-height: 150%;  
        }  
      
    input:hover, textarea:hover,  
    input:focus, textarea:focus {  
        border-color: #00AEB4;  
        }  
      
    .form label {  
        margin-left: 10px;  
        color: #212121;  
        }  
      
    .submit input {  
        width: auto;  
        padding: 6px 12px;  
        background: #00AEB4;  
        border: 0;  
        font-size: 14px;  
        color: #FFFFFF;  
        -moz-border-radius: 5px;  
        -webkit-border-radius: 5px;
		-webkit-transition: background .6s ease-out;
	-moz-transition: background .6s ease-out;
	-o-transition: background .6s ease-out;
	transition: background .6s ease-out;  
        }
		
.submit input:hover {
		background: #008E93;
		-webkit-transition: background .6s ease-out;
	    -moz-transition: background .6s ease-out;
	    -o-transition: background .6s ease-out;
	    transition: background .6s ease-out; 
		cursor: pointer; 
	
}

*/

		
	