body{
	margin: 0;
	padding: 0;
	line-height: 1;
	font-family: 'Raleway', 'Helvetica';
	font-weight: 100;
}


#home { 
	height: 900px;  
    width: 100%; 
    position: relative;
}
.empty {
	height: 500px;
	margin: 0 auto;
	width: 100%;
	position: relative;
	z-index: 0;
	background-image: url(../images/slideshow/img-gallery-3.jpg);
}
.empty-about {
    background: url(../images/slideshow/img-gallery-2.jpg) 50% 0 no-repeat fixed;
/*	background: url(../images/slideshow/img-gallery-2.jpg); */
}
.empty-work {
	background: url(../images/slideshow/img-gallery-1.jpg) 10% 0 no-repeat fixed;
}
.empty-service {
	background: url(../images/slideshow/img-gallery-3.jpg) 100% 0 no-repeat fixed;


}
.empty-gallery {
	background: url(../images/slideshow/img-gallery-4.jpg) 50% 0 no-repeat fixed;
}
.empty-contact {
	background: url(../images/slideshow/img-gallery-5.jpg) 50% 0 no-repeat fixed;
}
.empty-social {
	background: url(../images/slideshow/img-gallery-1.jpg) 50% 0 no-repeat fixed;
}
#about { 
	height: auto;
	margin: 0 auto; 
    width: 100%;  
    position: relative; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#work {
	height: auto;
	margin: 0 auto;
	width: 100%;
	position: relative;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#service {
	height: auto;
	margin: 0 auto; 
    width: 100%; 
    position: relative; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#gallery-container {
	margin: 0 auto;
	width: 94%;
	position: relative;
	box-shadow: 0 0 25px rgba(0,0,0,0.8);
	margin-bottom:30px;
	padding-top:12px;
	padding-bottom:9px;
	padding-left:2px;
	z-index:1;
}
#gallery-box {
	height: 100%;
	margin: 0 auto;
	width: 100%;
	position: relative;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#contact {
	height: 500px;
	margin: 0 auto;
	width: 100%;
	position: relative;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#footer {
	height: 1300px;
	margin: 0 auto;
	width: 100%;
	position: relative;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
}
#copyright {
	position:absolute;
	z-index:0;
	padding:20px 40px 20px 40px;
	text-transform:uppercase;
	width:1120px;
	margin-top:30px; 	
}
#copyright a {
	text-decoration:none;
}
.top {
	float:right;
}
.mask {
	background-image: url(../images/boxup.png); 
	background-repeat: no-repeat;
	margin-top: -109px;
	position: absolute;
	height: 109px;
	width: 100%;
	background-position: center center;
}
.mask-down {
    background-image: url(../images/boxdown.png);
	background-repeat: no-repeat;
	margin-bottom: -109px;
	position: relative;
	height: 109px;
	width: 100%;
	background-position: center center;
	z-index:1;
}

.section-container {
	margin-left:auto;
	margin-right:auto;
}

.pattern {
width:100%;
background:url(../images/pattern/pattern.png) repeat !important;
z-index:0;
margin: 0;
padding:0;
height:100%;
opacity:0.1;
position:fixed;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
filter: alpha(opacity=10);	
}
.pattern2 {
	width:100%;
	background:url(../images/pattern/pattern2.png) repeat !important;
	z-index:0;
	margin: 0;
	padding:0;
	height:100%;
	opacity:0.5;
	position:absolute;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	filter: alpha(opacity=10);	
}
.pattern3 {
width:100%;
background: url("../images/pattern/pattern-dark.png");
z-index:0;
margin: 0;
padding:0;
height:100%;
opacity:1;
position:absolute;
}
/* MENU */
nav {
	width:100%;
	height:70px;
	bottom:0;
	position:absolute;
	z-index:2;
    border-top:1px solid rgba(255,255,255,0.4);
	border-bottom:1px solid rgba(255,255,255,0.4);
}
nav ul {
	width:1200px;
	margin:0 auto;
}
nav #menu li {
	float:left;
	width:auto;
	padding:20px;
	font-size:30px;
}
nav #menu li a {
	text-decoration:none;
}
/* END MENU */
#logo {
	width:300px;
	float:left;
}
#logo img {
	padding:10px;
}
.nav-fixed {
	position: fixed;
	bottom: auto;
	margin-top:50px;
}
h1.title{
	font-size: 60px;
	text-align: center;
	padding-top: 150px;
	text-transform: uppercase;
	position: relative;
	z-index: 0;
}
h1.section {
    font-size: 30px;
	text-align:center;
	text-transform:uppercase;
	position:relative;
	z-index:0;
	line-height:140%;	
}
h2 {
	font-size: 30px;
	margin-top: 25px;
}
#filters {
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	z-index:0;
}
.clear {
	clear:both;
}
.port-img img  {
	border:1px solid rgba(255,255,255,0.3);
	padding:2px;
	width:98%;
	margin-bottom:20px;
}
.img-port img {
	width:280px;
	height:auto;
}
/* Gallery Photobox */
ul#gallery {
	margin-left: auto;
	margin-right: auto;
	width: 98%;
	text-align: center;
}

ul#gallery li {
	list-style:none;
	overflow:hidden;
	height:auto;
	display:inline-block;
	
	margin: 2px;
}
ul#gallery li a img {
	width: 270px;
	height:auto;
	border: 1px solid rgba(255,255,255,0.3);
	-webkit-transition: all 0.8s 0.1ms;
	-moz-transition: all 0.8s 0.1ms;
	-ms-transition: all 0.8s 0.1ms;
	-o-transition: all 0.8s 0.1ms;
	transition: all 0.8s 0.1ms;
}
ul#gallery li a img:hover {
/*	box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.2), 0 0 3px rgba(115, 114, 23, 0.8) inset;*/
/*	border-radius:5%;*/
	-moz-transform: scale(3);
   -webkit-transform: scale(3);
   -o-transform: scale(3);
   transform: scale(3);
   -ms-transform: scale(3);
filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
   M11=3, M12=-0, M21=0, M22=3);
}
.move {
width:68px;
height:200px;
position:absolute;
right:0;
margin-top:-150px;
margin-right:50px;	
}
a.up {
	background:url("../images/up.png");
	position:absolute;
	z-index:0;
	width:30px;
	height:30px;
	right:0;
	box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.2), 0 0 3px rgba(115, 114, 23, 0.8) inset;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	border-radius:5%;
}
a.up:hover {
	box-shadow:none;	
}
a.down {
	background:url("../images/down.png");
	position:absolute;
	z-index:0;
	width:30px;
	height:30px;
	right:0;
	margin-top:200px;
	box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.2), 0 0 3px rgba(115, 114, 23, 0.8) inset;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	border-radius:5%;
}
a.down:hover {
	box-shadow:none;	
}
#cycle-loader {
	height:22px;
	left:50%;
	margin:-11px 0 0 -63px;
	position:absolute;
	top:50%;
	width:126px;
	z-index:1;
}
/* CSS CONTACT FORM */
.form {
	margin:10px;
	width:95%;
}
.form-label {
	padding:10px 0;
	font-size:14px;
}
td.form-label {
	width:10%;
}
.form-type {
	padding:10px 0;
}
.error {
	color:red;	
}
label.error {
	width:95%;
}
.form-type input {
	width:95%;
	border-radius:5px;
	box-shadow:2px 2px 3px 0 rgba(0, 0, 0, 0.2) inset;
	opacity:0.7;
	-webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
}
.form-type textarea {
	width:95%;
	border-radius:5px;
	box-shadow:2px 2px 3px 0 rgba(0, 0, 0, 0.2) inset;
	opacity:0.7;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
}
.form-type textarea:focus {
	opacity:1;
	outline:none;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.form-type input:focus {
	opacity:1;
	outline:none;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.success {
	width:90%;	
    border-radius:5px;
	box-shadow:2px 2px 3px 0 rgba(0, 0, 0, 0.2) inset;
	opacity:0.7;
	margin-left:auto;
	margin-right:auto;
	background:#CCC;
	padding:20px;
	text-align:center;
	color:black;
	font-weight:bold;
	display:block;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
	margin-top:20px;
}
#contact-text ul li {
	width: 100%;
	margin-left: 30px;
	margin-top: 10px;
	display:block;
}
#contact-text ul li a {
	text-decoration:none;
}
.home-desc, .tel-desc, .mailcontact-desc {
	padding-left: 40px;
	font-size:14px;
	display:block;
	padding-top:6px
}
#contact-text ul {
	width: 100%;
}
#contact-text h1 {
	font-size:24px;
	margin-left:30px;
	margin-bottom:10px;
	margin-top:20px;
}
#contact-form h1 {
	font-size:24px;
	margin-bottom:10px;
	margin-top:20px;
}
.home-but, .tel-but, .mailcontact-but {
	float: left;
	height: 26px;
	width: 30px;
	background-repeat: no-repeat;
}
.home-but {
	background-image: url(../images/icons/home.png);
}
.tel-but {
	background-image: url(../images/icons/tel.png);
}
.mailcontact-but {
	background-image: url(../images/icons/contact.png);
}
.home-but:hover, .tel-but:hover, .mailcontact-but:hover {
    -webkit-transition: background-position 0.1s ease 0s;
	-moz-transition: background-position 0.1s ease 0s;
	-ms-transition: background-position 0.1s ease 0s;
	-o-transition: background-position 0.1s ease 0s;
	transition: background-position 0.1s ease 0s;
	background-position: 0px -23px;
}
#contact-text {
    width:30%;
	float:left;	
}
#contact-form {
	margin-left:30%;
	width:70%;
}
@media (max-width: 480px)
{
	.section-container {
	width:300px;
	}
	#gallery {
		height:auto;
}
#contact-text ul li {
	margin-left:0px
}
#contact-text ul li{
	margin-bottom: 15px;
	}
	#contact-text h1 {
		margin-bottom:2px;
		margin-left:7px;
}
#contact-form h1 {
	margin-left:8px;
	}
.home-desc, .tel-desc, .mailcontact-desc {
	font-size:13px;	
	}
.form-label{
	font-size:13px;
	}
	.top {
	display: block;
    float: none;
    text-align: center;
	margin-top:20px;
	}
	#copyright {
		width:auto;
	}
	#responsive-menu {
	  width:150px;
	  margin-left:auto;
	  margin-right:auto;	
	}
	nav {
		height:100px;
	}
	.mnav {
		background: #000;
		color:#FFF;
		border: 1px solid rgba(255, 255, 255, 0.3);
		text-transform:uppercase;
		font-family:'raleway';
	}
	body {
		overflow-x:hidden;
	}
	#home h1.title {
		font-size:60px;
		padding-top:100px;		
	}
}
@media (min-width: 481px) and (max-width: 1200px)
{
	.section-container {
	   width:768px;
	}
	nav, #logo img {
		height:35px;
		margin-top: 7px;
    	padding-left: 5px;
	}
	.mask-down {
	position: relative;
	}
	h1.section {
	font-size: 16px;
	}
	#footer {
	height: 200px;
	}
	#filters {
	width:80%;
	}
	#logo img {
	padding:0px;
	}
	#logo {
	width:200px;
	}
	nav {
	height:50px !important;
	}
	nav #menu li {
    font-size: 19px;
    padding: 15px;
	}
	#gallery {
		height:auto;
		margin-left:75px;
	}
	#contact-text ul li {
	width:80%;
	margin-left:20px;
	line-height: 20px;
    margin-bottom: 10px;
	}
	#contact-form h1 {
	margin-left:8px;
	}
	#copyright {
      width:688px;
	}
	td.form-label {
	width:auto;
	}
	#footer {
    height: 500px;
	}
}
@media (min-width: 1201px)
{
	.section-container {
	width:1200px;
	}
	.mask-down {
	position: relative;
	}
	h1.section {
	font-size: 20px;
	}
	#footer {
	height: 300px;
	}
	#filters {
	width:80%;
	}
}
