/*this is the main css of the entire site, the rules are divided into sections. For example, to change the services section, changes only the rules of this section at line 190*/

body{
	margin:0px;
	padding:0px;
	color:#888888;
}

/*font face*/
@font-face {
    font-family: 'oswaldbold';
    src: url('../fonts/oswald/oswald-bold-webfont.eot');
    src: url('../fonts/oswald/oswald-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald/oswald-bold-webfont.woff') format('woff'),
         url('../fonts/oswald/oswald-bold-webfont.ttf') format('truetype'),
         url('../fonts/oswald/oswald-bold-webfont.svg#oswaldbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'oswaldlight';
    src: url('../fonts/oswald/oswald-light-webfont.eot');
    src: url('../fonts/oswald/oswald-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald/oswald-light-webfont.woff') format('woff'),
         url('../fonts/oswald/oswald-light-webfont.ttf') format('truetype'),
         url('../fonts/oswald/oswald-light-webfont.svg#oswaldlight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'oswaldbook';
    src: url('../fonts/oswald/oswald-regular-webfont.eot');
    src: url('../fonts/oswald/oswald-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald/oswald-regular-webfont.woff') format('woff'),
         url('../fonts/oswald/oswald-regular-webfont.ttf') format('truetype'),
         url('../fonts/oswald/oswald-regular-webfont.svg#oswaldbook') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lobster_1.3regular';
    src: url('../fonts/lobster/lobster_1.3-webfont.eot');
    src: url('../fonts/lobster/lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lobster/lobster_1.3-webfont.woff') format('woff'),
         url('../fonts/lobster/lobster_1.3-webfont.ttf') format('truetype'),
         url('../fonts/lobster/lobster_1.3-webfont.svg#lobster_1.3regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*end font face*/

/*start tag*/
h1{
	color:#white;
	font-size:50px;
	margin:0px;
	padding:0px;
	font-family: 'lobster_1.3regular';	
	font-weight:normal;
}
h2{
	color:#7d7d7d;
	font-size:20px;
	margin:0px;
	padding:0px;
	font-family: 'lobster_1.3regular';
	font-weight:normal;	
}
p{
	color:#a9a9a9;
	line-height:22px;
	font-size:17px;
	margin:0px;
	padding:0px;
	font-family: 'oswaldlight';
}
a{
	text-decoration:none;	
}
a img{
	border:0px;	
}
/*end tag*/

/*start navigationmenu*/
#navigationmenu{
	width:100%;
	float:left;
	background-image:url(../img/patterns/grey-bg.png);
	background-repeat:repeat;
	color:#7d7d7d;	
	font-family: 'lobster_1.3regular';	
	font-size:20px;
	text-shadow: 2px 2px 0 rgba(223, 223, 223, 0.9);
}
#navigationmenu .container{
	padding:10px 0px;	
}
.logo{
	height:180px;	
}
.logo img{
	position:absolute;
	margin-top:0px;
	z-index:30;
	
	-webkit-transition:all 700ms;
	-o-transition:all 700ms;
	transition:all 700ms;	
}
.logo img:hover{
	-webkit-transform:scale(1.02, 1.02);
	-o-transform:scale(1.02, 1.02);
	transform:scale(1.02, 1.02);	
}
nav{
	margin:55px 20px 20px 20px;	
}
nav ul{
	margin:0px;
	padding:0px;
	float:left;
	list-style:none;	
}
nav ul li{
	margin:0px 10px;
	padding:0px;
	float:left;
	border-top:1px dashed #d6d5d5;
	border-bottom:1px dashed #d6d5d5;	
}
nav a{
	padding:20px 10px;
	float:left;
	color:#7d7d7d;	
	
	-webkit-transition:color 250ms ease-in;  
   -moz-transition:color 250ms ease-in;  
   -o-transition:color 250ms ease-in;  
   transition:color 250ms ease-in;  
}
nav a:hover{
	color:#bbbbbb;	
	-webkit-transition:color 250ms ease-in;  
   -moz-transition:color 250ms ease-in;  
   -o-transition:color 250ms ease-in;  
   transition:color 250ms ease-in; 
}

.leftnavigation, .leftnavigation li{
	float:right;
}
.rightnavigation, .rightnavigation li{
	float:left;	
}
/*end navigationmenu*/


/*start sectionslide*/
#sectionslide{
	width:100%;
	float:left;
	
}
.caption{
	color:#FFF;
	font-size:17px;
	font-family: 'oswaldlight';	
}
#services .bottomwaves{
	margin-top:-15px;
	
}
#sectionslide ul{
    margin: 0;
	padding: 0; 
	border: 0; 
	outline: 0; 
	font-size: 100%; 
	vertical-align:baseline; 
	background: transparent;
	display:none;
}
/*end sectionslide*/


/*start services*/
#services{
	width:100%;
	float:left;
	background-image:url(../img/patterns/grey-bg.png);
	background-repeat:repeat;	
}
#services .titlesection{
	text-shadow: 3px 3px 0 rgba(223, 223, 223, 0.9);
	background-image:url(../img/divider/services.png);
}
#services p{
	margin:10px 20px;
}
#services h2{
	margin:20px 20px 0px 20px;
}
#services img{
	float:left;
	margin:20px;	
}
/*end services*/

/*start testimonials*/
#testimonials{
	width:100%;
	float:left;
	background-image:url(../img/patterns/pink-bg.png);
	background-repeat:repeat;
	background-attachment:fixed;
}
#darkfilter{
	width:100%;
	float:left;
	background-image:url(../img/section-testimonials/darkfilter.png);
	background-repeat:repeat-y;
	background-position:center;
}
#testimonials .container div{
	margin:0px 10px;
}
#testimonials .container{
	padding:30px 0px;
}
#testimonials h2{
	color:#FFF;
	margin:10px 20px;
	text-shadow: 2px 2px 0 rgba(190, 115, 135, 0.9);
}
#testimonials p{
	color:#FFF;
	margin:10px 20px;
}
.topquote img{
	width:52px;
	margin:10px 0px;
	padding:0px;
	float:left;
	-webkit-transition:all 300ms;
	-o-transition:all 300ms;
	transition:all 300ms;	
}
#testimonials:hover .topquote img, #testimonials:hover .bottomquote img
{
	-webkit-transform:scale(1.2, 1.2);
	-o-transform:scale(1.2, 1.2);
	transform:scale(1.2, 1.2);
}
.bottomquote img{
	width:52px;
	margin:10px 0px;
	padding:0px;
	float:right;
	-webkit-transition:all 300ms;
	-o-transition:all 300ms;
	transition:all 300ms;	
}
.lefttestimonials{
	text-align:right;	
}
.lefttestimonials h2, .lefttestimonials p{
	float:right;	
}
.righttestimonials{
	text-align:left;	
}
.righttestimonials h2, .righttestimonials p{
	float:left;	
}
/*end testimonials*/

/*start section portfolio*/
#sectionportfolio{
	width:100%;
	float:left;
	background-image:url(../img/patterns/grey-bg.png);
	background-repeat:repeat;		
}
#sectionportfolio .titlesection{
	text-shadow: 3px 3px 0 rgba(223, 223, 223, 0.9);
	background-image:url(../img/divider/portfolio.png);
}
#options{
	margin:10px 0px;
	padding:0px;
	float:left;
	width:100%;
}
#filters{
	margin:0px;
	padding:0px;
	list-style:none;
	width:100%;
	text-align:center;	
}
#filters li{
	margin:10px 10px;
	padding: 5px 0px;
	display:inline-block;
	font-size: 17px;
	font-family: 'oswaldlight';
    
}
#filters li a{
    padding: 5px 10px;
	color:#FFF;
	
	opacity: 1;
	-webkit-transition: opacity;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transition: opacity;
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
}
#filters li a:hover{
	opacity: 0.7;
	-webkit-transition: opacity;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transition: opacity;
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
}
.selected{
	background-color:#e0a6a5 !important;
	border-bottom:2px solid #bb7374 !important;
}
.worksarrow{
	float:left;
	width:100%;
	height:25px;
	margin-bottom:5px;
}
.worksbottom{
	float:left;
	width:100%;
	height:5px;
	background-image:url(../img/section-works/bgworksbottom.jpg);
	background-repeat:repeat;
	margin-top:5px;
}
.worksarrow img{
	position:absolute;
	width:52px !important;
	margin-top:-26px;
	margin-left:-26px;
	left:50%;
	
	-webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
	
}
.element:hover .worksarrow img{
	-webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);	
	
}
.imgwork{
	opacity: 1;
	-webkit-transition: opacity;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transition: opacity;
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
	-webkit-transition:all 1000ms;
	-o-transition:all 1000ms;
	transition:all 1000ms;		
}
.imgwork:hover	
{
	opacity:0.7;
	-webkit-transform:scale(1.1, 1.1);
	-o-transform:scale(1.1, 1.1);
	transform:scale(1.1, 1.1);
}
/*end section portfolio*/

/*start section prices*/
#sectionprices{
	width:100%;
	float:left;
	background-image:url(../img/patterns/green-bg.png);
	background-repeat:repeat;
	background-attachment:fixed;
	overflow:hidden;		
}
#sectionprices .titlesection{
	text-shadow: 3px 3px 0 rgba(111, 176, 167, 0.9);
	background-image:url(../img/divider/prices.png);
}
#sectionprices .titlesection h1{
	color:#FFF;
}
.price{
	width:270px;;
	float:left;
	background-image:url(../img/section-prices/bg.png);
	background-repeat:repeat;
	border-top:5px solid #fff;
	border-left:5px solid #fff;
	border-right:5px solid #fff;
	margin-top:108px;	
}
.price p{
	margin:176px 20px 10px;
	color:#b4b2b2;
	text-align:center;
}
.price ul{
	margin:0px 20px 10px 20px;
	padding:0px;
	list-style:none;
	float:left;
}
.price ul li p{
	padding:5px 0px 5px 20px;
	margin:0px;
	text-align:left;
	width:210px;
	border-bottom:1px solid #d4d7d3;
	color:#908f8f;
	background-image:url(../img/section-prices/star.png);
	background-repeat:no-repeat;
	background-position:0px 12px;
}
.logoprice{
	position:absolute;
	width:280px;
	text-align:center;
	height:176px;
	float:left;
	margin-top:20px;	
}
.ribbon{
	background-image:url(../img/section-prices/bgribbon.jpg);
	background-repeat:repeat;
	position:absolute;
	width:280px;
	margin-top:220px;
	text-align:center;	
}
.noborder{
	border:0px !important;	
}
.ribbon h2{
	font-size:30px;
	color:#FFF;	
	margin:5px 0px;
	text-shadow: 3px 3px 0 rgba(111, 176, 167, 0.9);
}
.ribbon h2 span{
	font-size:20px;
	color:#7d7d7d;
	text-shadow:none;
}
.triangle{
	width:100%;
	float:left;
	margin-bottom:20px;
	height:50px;
	background-image:url(../img/section-prices/triangle.png);
}
/*end section prices*/

/*start section team*/
#sectionteam{
	width:100%;
	float:left;
	background-image:url(../img/patterns/grey-bg.png);
	background-repeat:repeat;		
}
#sectionteam .titlesection{
	text-shadow: 3px 3px 0 rgba(223, 223, 223, 0.9);
	background-image:url(../img/divider/team.png);
}
.team{
	background-color:#f5f5f5;
	border-left:1px solid #e8e8e8;
	border-right:1px solid #e8e8e8;
	width:278px;
	margin:145px 0px 0px 0px;
	float:left;
}
.team h2{
	margin:150px 20px 10px 20px;
	text-align:center;
}
.team p{
	margin:10px 20px 20px 20px;
	text-align:center;
	float:left;
}
.avatar{
	width:280px;
	position:absolute;
	margin-top:20px;
	text-align:center;		
}
.bordertopteam{
	width:278px;
	height:5px;
	float:left;
	background-image:url(../img/section-team/bordertopteam.jpg);
	background-repeat:repeat-x;	
}
.socialteam{
	width:280px;
	height:81px;
	float:left;
	margin-bottom:20px;
	background-image:url(../img/section-team/imgbottomteam.png);
	text-align:center;	
}
.socialteam img{
	margin:0px 1px;	
}
/*end section team*/

/*start section skills*/
#sectionskills{
	width:100%;
	float:left;
	background-image:url(../img/patterns/pink-bg.png);
	background-repeat:repeat;
	background-attachment:fixed;		
}
#sectionskills .titlesection{
	text-shadow: 3px 3px 0 rgba(190, 115, 135, 0.9);
	background-image:url(../img/divider/skills.png);
}
#sectionskills .titlesection h1{
	color:#FFF;
}
#sectionskills .clip{
	text-align:center;		
}
#sectionskills .clip img{
	margin:42px 20px;	
}
#sectionskills .clip img:hover{
	opacity:0.5;	
}
.skilldescription{
	margin:20px;
	float:left;	
}
.skilldescription #operator{
	
    height: 150px;
    margin-left: 42px;
    margin-top: 116px;
    position: absolute;
    width: 15px;	
}
.skilldescription p{
	margin-top:10px;
	color:#FFF;	
}
.skilldescription img{
	float:left;
	margin-right:20px;	
}
#allprogresbar{
	float:left;
	margin:10px 20px;
	width:440px;	
}
.progresbar{
	float:left;
	width:100%;
	margin:10px 0px;
}
.progresbar p{
	color:#fff;	
	margin-bottom:10px;
}
.progresbar div{
	width:380px;
	float:left;
	background-image:url(../img/section-skills/bgprogresbar.jpg);
	background-repeat:repeat;	
}
.progresbar div span{
	height:20px;
	margin:5px;
	float:left;
	background-image:url(../img/section-skills/progresbar.jpg);
	background-repeat:repeat;
}
.onebar{
	width:60%;	
}
.secondbar{
	width:83%;	
}
.thirdbar{
	width:40%;	
}
.fourthbar{
	width:72%;	
}
.fivebar{
	width:93%;	
}
.numberbar{
	float:right;
	margin:0px !important;
	padding:4px 8px;
	color:#7d7d7d !important;
	font-size:13px;
	font-family: 'lobster_1.3regular';
	background-image:url(../img/section-skills/bgnumberbar.png);
	background-position:center;
	background-repeat:no-repeat;
}
/*end section skills*/

/*start oursocial*/
#oursocial{
	width:100%;
	float:left;	
	background-image:url(../img/patterns/grey-bg.png);
	background-repeat:repeat;
}
#oursocial img{
	margin:20px;
}
#oursocial .titlesection{
	text-shadow: 3px 3px 0 rgba(223, 223, 223, 0.9);
	background-image:url(../img/divider/oursocial.png);
}
/*end oursocial*/


/*start contacts*/
#contacts{
	width:100%;
	float:left;	
}
#contacts #map-canvas{
	width:100%;
	height:790px;
	float:left;
	margin:0px;
	padding:0px;	
}
#markers{
	width:380px;
	height:557px;
	position:absolute;
	z-index:1;
	left:50%;
	margin-left:-190px;
	margin-top:116px;	
}
#bigmarker{
	width:220px;
	height:320px;
	margin:auto;
	background-image:url(../img/section-contact/bigmarker.png);
	text-align:center;
	padding:80px;		
}

.hidebigmarker{
	filter: alpha(opacity=0); /* internet explorer */
    opacity: 0;           /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=1)"; /*IE8*/
	
	-webkit-transition: all 0.5s ease;	
	-moz-transition: all 0.5s ease;	
}
.showbigmarker{
	filter: alpha(opacity=1); /* internet explorer */
    opacity: 1;           /* fx, safari, opera, chrome */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /*IE8*/
	
	-webkit-transition: all 0.5s ease;	
	-moz-transition: all 0.5s ease;	
}

#bigmarker h2{
	float:left;
	margin-bottom:10px;
	padding-bottom:20px;
	background-image:url(../img/section-contact/h2arrow.png);
	background-repeat:no-repeat;
	background-position:center bottom;
	width:100%;	
	text-shadow: 2px 2px 0 rgba(223, 223, 223, 0.9);
}
#bigmarker ul{
	float:left;
	margin:auto;
	padding:0px;
	list-style:none;
	width:100%;
}
#bigmarker ul li{
	margin:0px;
	padding:0px;
}
#bigmarker ul li p{
	margin:0px;
	padding:10px 20px 10px 50px;
	font-size:12px;
	color:#a9a9a9;
	border-bottom:1px solid #e5e5e5;
	text-align:left;
	background-repeat:no-repeat;
}
#bigmarker a{
	color:#a9a9a9;
}
.iconhome{
	background-image:url(../img/section-contact/icon1.png);
	background-position:20px 12px;	
}
.iconphone{
	background-image:url(../img/section-contact/icon2.png);
	background-position:20px 12px;
}
.iconfax{
	background-image:url(../img/section-contact/icon3.png);
	background-position:20px 12px;
}
.iconmail{
	background-image:url(../img/section-contact/icon4.png);
	background-position:20px 12px;
}
#littlemarker{
	width:57px;
	height:57px;
	margin:auto;
	margin-top:20px;
	cursor:pointer;
	display:block;	
}
#littlemarkerclose{
	width:57px;
	height:57px;
	margin:auto;
	margin-top:20px;
	cursor:pointer;	
	display:none;
}
.backtotop{
	left:50%;
	margin-left:-25px;
	position:absolute;
	margin-top:776px;
	z-index:25;
	width:50px;
	height:14px;
}
.backtotop img{
	float:left;
	margin:0px;
	padding:0px;
}
/*end contacts*/


/*start class*/
.container{
	width:1200px;
	margin:auto;
	padding:60px 0px 90px 0px;	
}
.titlesection h1{
	margin:50px 20px;
	text-align:center;	
}

#oursocial .titlesection, #services .titlesection, #sectionportfolio .titlesection, #sectionprices .titlesection, #sectionteam .titlesection, #sectionskills .titlesection{
	background-repeat:no-repeat;
	background-position:center bottom;
	margin-bottom:20px;
}
.topwaves{
	width:100%;
	float:left;
	height:15px;
	background-image:url(../img/patterns/topwaves.png);
	background-repeat:repeat-x;
	position:absolute;
	margin-top:0px;
	z-index:25;	
}
.bottomwaves{
	width:100%;
	height:15px;
	background-image:url(../img/patterns/bottomwaves.png);
	background-repeat:repeat-x;
	position:absolute;
	z-index:25;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.btn{
	margin:10px 0px !important;
	float:left;
	width:100%;
	
	opacity: 1;
	-webkit-transition: opacity;
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 250ms;
	-moz-transition: opacity;
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 250ms;
}
.btn:hover{
opacity: 0.7;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 250ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 250ms;
}
.btn a{
	font-size:17px;
	padding:5px 10px;
	color:#FFF;	
	font-family: 'lobster_1.3regular';
}
.orange a{
	background-color:#facba6;
	border-bottom:2px solid #c88926;		
}
.red a{
	background-color:#e0a6a5 !important;
	border-bottom:2px solid #bb7374 !important;	
}
.blue a{
	background-color:#a5dce1;
	border-bottom:2px solid #889a9e;	
}
.yellow a{
	background-color:#e0d9a3;
	border-bottom:2px solid #ba9873;	
}
.navi a{
	background-color:#94cdc6;
	border-bottom:2px solid #528e84;	
}
.green a{
	background-color:#bfe1a4;
	border-bottom:2px solid #9d9e74;	
}
/*end class*/


/*start anchors*/
.anchors{
	width:100%;
	float:left;
	height:26px;
	position:absolute;
	margin-top:-13px;
	text-align:center;	
}
.anchors img{
	margin:0px !important;
	padding:0px !important;
	border:0px !important;	
}
.contanchors{
	width:87px;
	margin:auto;
	height:26px;
}
.anchortop{
	float:left;		
}
.anchorbottom{
	float:right;		
}
/*end anchors*/


/*start hover effect*/
/*rotate*/
.rotate{
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
.rotate:hover {
  -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}
/*rotate*/

/*expand*/
.expand
{
	-webkit-transition:all 100ms;
	-o-transition:all 100ms;
	transition:all 100ms;
}

.expand:hover	
{
	-webkit-transform:scale(1.05, 1.05);
	-o-transform:scale(1.05, 1.05);
	transform:scale(1.05, 1.05);
}
/*expand*/

/*opacity*/
.opacity{
opacity: 1;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 250ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 250ms;
}
.opacity:hover{
opacity: 0.8;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 250ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 250ms;
}
/*opacity*/
/*end hover effect*/