/* <!--

    [[[[[[[[[[[[[[[     ]]]]]]]]]]]]]]]
    [::::::::::::::     ::::::::::::::]
    [::::::::::::::     ::::::::::::::]
    [::::::[[[[[[[:     :]]]]]]]::::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [:::::[    CODE THE WEB     ]:::::]
    [:::::[  http://sypseo.com  ]:::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [:::::[                     ]:::::]
    [::::::[[[[[[[:     :]]]]]]]::::::]
    [::::::::::::::     ::::::::::::::]
    [::::::::::::::     ::::::::::::::]
    [[[[[[[[[[[[[[[     ]]]]]]]]]]]]]]]
        
  -->
*/
/* Fonts 
	@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300italic,300,400,500,600,700);
    @import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,300,400,700);
   	@import url(http://fonts.googleapis.com/css?family=Oswald:300,400,700);
   */


/* ==========================================================================
    1. CSS RESET
============================================================================= */

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption,center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video, xmp { border: 0; margin: 0; padding: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
b, strong {font-weight: bold;}
img {color: transparent; font-size: 0; vertical-align: middle; -ms-interpolation-mode: bicubic; max-width: 100%;}
ol, ul {list-style: none;}
li {display: list-item;}
table {border-collapse: collapse; border-spacing: 0;}
th, td, caption {font-weight: normal; vertical-align: top; text-align: left;}
q {quotes: none;}
q:before, q:after {content: ''; content: none;}
sub, sup, small {font-size: 75%;}
sub,sup {line-height: 0; position: relative; vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
svg {overflow: hidden;}
a{list-style: none; text-decoration: none;}
a:active{outline: none;}
a:focus{ outline: none;}
:focus {outline: 0;}
.clearfix{clear: both;}

/* Main Page Style */
html, body {
        width:100%;
        height:100%;
		padding:0px;
		font-family: 'Lato', sans-serif;
        font-size: 14px;
		font-weight:500;
		-webkit-font-smoothing: antialiased;
		
}

::selection {
	background: #5c6062; /* Safari */
	color: #fff;
}

*,
	*:after,
	*:before {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding: 0;
		margin: 0;
	}

/* ==========================================================================
   TYPOGRAPHY
============================================================================= */

	a:hover,
	a:active,
	a:focus
	{
		color:#121313;
		text-decoration:none;
		outline:none;
       
	}

a { 
		padding: 0;
		margin: 0;
        
		text-decoration: none; 
		-webkit-transition: background-color .4s linear, color .4s linear;
		-moz-transition: background-color .4s linear, color .4s linear;
		-o-transition: background-color .4s linear, color .4s linear;
		-ms-transition: background-color .4s linear, color .4s linear;
		transition: background-color .4s linear, color .4s linear;
	}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
		font-family: Oswald, Open Sans,sans-serif;
		font-weight:400;
        text-align:center;
	}
h1{
    font-size:50px;
    line-height: 54px;
}

h2{
    font-size:45px;
    line-height: 55px;
    
}
h3{
    font-size:30px;
   /* margin:20px 0 30px 0px;*/
   margin-bottom: 20px;
}

h4{
     font-size:30px;
    line-height: 34px;
}

h5{
    font-size:20px;
    line-height:24px;
	padding-top:20px;
    padding-bottom:20px;
    text-align:left;

}

	p{
		/*margin:10px 5px 0px;*/
        font-size:15px;
		line-height:25px;
	}

    p .titles{
        color:white;
        font-size:25px;
    }

	.clear{
		clear:both;
	}

	ol, ul{
		list-style:none;
		padding:0;
	}

	b.caret{
		margin-top: -3px;
	}

    /*  MENU */
.affix {
	background:rgba(255,255,255,0.95);
	position: fixed;
	top: 0;
	width: 100%;
	height:80px;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 5px rgba(0, 0, 0, 0.1) inset;
	 -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 5px rgba(0, 0, 0, 0.1) inset;
	 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 5px rgba(0, 0, 0, 0.1) inset;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	z-index:999;
       
	}

    /* HOME SECTION */
	#home-slider {
	position: relative;
	overflow: hidden;
	height: 100%;
}


#home {
	position: relative;
	overflow: hidden;
	
    width:100%;
	height: 100%;
    display:table;
    color:white;
    text-align:center;
}

#home .overlay1 { 
	position: relative;
	
	background: #26292E;
	opacity: 0.5;
	filter: alpha(opacity=50);
	z-index: 0;
	
}
.container{
	max-width:100%;
}
.home-wrap{
    display:table-cell;
    vertical-align:middle;
    margin:auto;
    
}


.home-slide-content{
    font-size: 60px;
    font-family:Oswald, 'Open Sans';
    text-transform:uppercase;
    position:relative;
    padding:15px 0px;
    text-align: center;
	line-height: 1;
    
}
.home-slide p{
	margin:0px;
}
   
/*  2. PAGE SECTIONS CONTENT BACKGROUNDS
============================================================================= */
.row {
    width:100%;
    margin-left:0px;
    margin-right:0px;
}
.content{
    width: 100%;
    margin: 0 auto;
  
   
}

.content.background-gray{
    background-color: #ededed;
}

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

.content.background-black{
    background-color:#121313;

    padding:35px 0;
}

.content.background-transparent{
    background-color:rgba(34,34,34,0.6);
    padding:0px 0;
}

.content.background-blue{
    
     padding:35px 0;
}

.content.background-parallax{
    background:url('../images/parallax.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

 
}
.bg-overlay{
background-color:rgba(34,34,34,0.41);
width:100%;
height:100%;
display:block;
content:'';
}
.content.background-gray h1,
.content.background-gray h2,
{
    color:#121313; 
                /*Dark Black Color*/
}

.content.background-white h3{
    color:#121313;
    font-size:35px;
}
.content.background-black h3,
.content.background-blue h3{
     font-size:35px;
   
     line-height: 40px;
     text-align:left;
}

.content.background-white h4,
.content.background-white h5,
.content.background-white h6{
     color:#121313;
     
}

.content.background-parallax .blue{
    /*font-size:45px;*/
    padding:20px 0;
    text-transform:uppercase;
}

.content.background-parallax .title{
    color:white;
    text-align:center;
    font-size:20px;
}
.content.background-gray .head,
.content.background-parallax .head{
    padding: 30px 0;
   
}

.subhead p{
    font-size:20px;
    font-style:italic;
  /* padding-top:10px;*/
 
}

/*About box*/

.about-box {
	float: left;
    margin:0px auto;
    padding:20px 0px;
	
}

.icon-box ,.icon-box i{
font-size: 30px;
	width: 40px;
	height: 40px;
	display: inline-block;
	line-height:40px;
	text-align:center;
	-webkit-transition: all 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
	-moz-transition: all 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
	-o-transition: all 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
	-ms-transition: all 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
	transition: all 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
	position: relative;
	overflow: hidden;
}
/*
.icon-box i {
	font-size: 30px;
	margin: 0 auto;
   
	z-index: 5;
	position: relative;
}
*/
.white{                 /*WHITE COLOR*/
    color:white;
    border-color:white;
    
}

.black{
color:#121313;
}

.description-box {
	float: left;
	margin: -55px 0 0 45px;
	padding: 10px 10px;
	border-width: thin;
	border-style: solid;
	border-color: #e1dfdf;	
    -webkit-transition: background 0.4s ease-in-out;
    -moz-transition: background 0.4s ease-in-out;
    -ms-transition: background 0.4s ease-in-out;
    -o-transition: background 0.4s ease-in-out;
    transition: background 0.4s ease-in-out;
}

.description-box h4 {
width:100%;
	font-size: 20px;
	margin-bottom: 4px;
    text-align:left;
}

.description-box h4:hover{
    color:#fff;
}
.description-box p{
	
}
.description-box:hover {
        
        color:#fff;
        -webkit-transition: background 0.4s ease-in-out;
        -moz-transition: background 0.4s ease-in-out;
        -ms-transition: background 0.4s ease-in-out;
        -o-transition: background 0.4s ease-in-out;
        transition: background 0.4s ease-in-out;
    }
	
.description-box.no-border {
    border:none;
}
.services-container{
padding:40px 0;
}
.services-row{
margin-top:20px;
}
.service-box{
    padding:20px 10px;
    margin:20px 0;
    background-color:rgba(18,19,19,0.5);
    -webkit-transition: background-color .4s linear, color .4s linear;
		-moz-transition: background-color .4s linear, color .4s linear;
		-o-transition: background-color .4s linear, color .4s linear;
		-ms-transition: background-color .4s linear, color .4s linear;
		transition: background-color .4s linear, color .4s linear;
}

.service-box:hover{
    background-color:#ededed;
    color:#121313;
    -webkit-transition: background-color .4s linear, color .4s linear;
		-moz-transition: background-color .4s linear, color .4s linear;
		-o-transition: background-color .4s linear, color .4s linear;
		-ms-transition: background-color .4s linear, color .4s linear;
		transition: background-color .4s linear, color .4s linear;
}

.service-box h4{
    font-size:22px;  
    width:100%;
    padding-top:0;
	padding-bottom: 20px 
}

.service-box p{
    width:100%;
    padding:20px 20px 0px 20px;
}

.center{
    position:absolute;
    left:0px;
    right:0px;
}
.clients{
    padding-top:40px;
}
.bx-wrapper{
margin:0;
}
.counter{
    margin:20px 0;
    font-size:50px;
}

.menu-gallery{
   float:none;
}

ul.center{
    margin: 0px auto;
}
. center li{
    display:inline;
    text-align:center;
}

/*BUTTONS*/
.btn.start{
    font-family:Oswald, 'Open Sans Condensed';
    background:none repeat scroll 0% 0% transparent;
    color:#fff;
	border-color:#fff;
	border-radius:0px;
	border-width:4px;
	/*color: #fff;*/
	margin-top:50px;
	padding: 8px 30px;
	font-size:30px;
	text-transform:uppercase;

}

.btn.start:hover{
	color:#121313;
    border-color:#fff;
	background-color:#fff;
}

.btn.middle {
	background:none repeat scroll 0% 0% transparent;
	border-color:#fff;
	border-radius:3px;
	padding: 8px 30px;
	font-size:15px;
	text-transform:uppercase;
	float:right;
	}

.btn.middle.white{
    border: 1px solid #fff;
}

.btn.middle.white:hover,
.btn.middle.white:active,
.btn.middle.white:focus{
    color:#121313;
    background-color:#fff;
    border-color:#fff; 
}

.btn.middle.blue{
    color:#343434;
    border:1px solid rgba(0, 0, 0, 0.3);
}

.btn.middle.blue:hover{
    color:#fff;
}

.btn-gallery {
		background:none repeat scroll 0% 0% transparent;
        padding:10px 10px;
        border-radius:0px;
		color: #333;
        text-transform:uppercase;
	}

.btn-gallery:hover,
.btn-gallery:active,
.btn-gallery:focus{
    color:#fff;
    }
	
li.active a.btn-gallery,li.active a.btn-gallery:active, ul li.active a{
    color:#fff;
}

.btn.table,.btn.table.other,.btn.contact {
	background:none repeat scroll 0% 0% transparent;
	border: 1px solid #272727;
	border-color:#fff;
	border-radius:3px;
	color: #fff;
	font-size:15px;
	text-transform:uppercase;
      	}

.btn.table:hover,
.btn.table:active,
.btn.table:focus{
    color:#333;
    background-color:#fff;
    border-color:#fff;
}

.btn.table.other {
color:#272727;
border-color:#272727;
}

.btn.social{
    border:1px solid #272727;
    border-radius:2px;
    color:#272727;
     transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.btn.social:hover{
    background-color:#272727;
    color:white;
     transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/* ========================================================================== 
    7.2. PORTFOLIO
============================================================================= */

.portfolio-menu{
   margin-bottom: 30px;
    float:none;
    display:inline-block;
}

.portfolio{
    width:99%;
    margin:0px auto;
}
.row.portfolio-items-holder{
   /* margin-top: 30px 0;*/  
}

/*  Portfolio filters
----------------------------------------------------------------------------- */
.row.portfolio-filters{
/*    margin-top: 30px 0;*/ 
}

.portfolio-filters.portfolio-full ul{
    display: table;
    margin: 0 auto;
}

#filters li{ 
float:left;
  /* padding-right: 20px;
    margin-right: 20px;
      border-right: 1px solid #ddd;*/
}


#filters li a{
    /*font-family: 'Open Sans Condensed', Arial, sans-serif;*/
    font-size: 14px;
  
}




/* PORTFOLIO ITEMS
----------------------------------------------------------------------------- */
.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}

.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property:    -moz-transform, opacity;
    -ms-transition-property:     -ms-transform, opacity;
    -o-transition-property:      -o-transform, opacity;
    transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
}

.isotope-item{
    float: left;
   /* margin-bottom: 30px;*/
   padding-right:2px;
   padding-left:2px;
    z-index: 2;
    
}

#portfolioitems.isotope{
    padding-left: 0px;
    padding-right:0px;

}

.portfolio-items-holder .isotope-item{
    margin-bottom: 3px;
    margin-right: 0px;
    margin-left: 0;
}


/*Price Table*/

  /*  #price-table {margin:60px 0 50px}*/
	#price-table .table1 {padding:60px 10px;display:block; text-align:center; background: #FFFFFF;border: 1px solid #f9f9f9;list-style: none !important; position: relative;}
	#price-table .table1 {-webkit-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;top:0;}
	#price-table .table1:hover {top:-25px}
	#price-table #active-table h3 {color:#ffffff}
	#price-table h3 span small {vertical-align: top;font-size:21px;color:#272727;}
	#price-table h3 {padding: 20px;margin: -30px -10px 0;}
	#price-table .table1:nth-child(1) h3 {}
	#price-table .table1:nth-child(4) h3 {}	
	#price-table #active-table h3 span small,
	#price-table #active-table h3 span {color:#ffffff;}
	#price-table h3 span {display: block;color: #272727;font-size:39px; font-weight:400; margin:25px 0 0;}
	#price-table ul {margin: 20px 0 0;padding: 0;}
	#price-table #active-table li {border-color:#000000;border-color:rgba(0,0,0,0.1);}
	#price-table li {font-size:15px; list-style:none;color:#7C7C7C;border-top: 1px solid #eaeaea;padding: 10px 0;}
	#price-table #active-table li {color:#fff;}

.oportunity{
padding-top: 40px;
}
	
	
	/*Contact form*/

.contact-form {
   /* margin-top:70px;*/
}
.social-contacts{
margin-top:40px;
}
.form-control{
    font-size:15px;
    font-family:'Open Sans',Arial,Verdana;
    border-radius:0px;
}
.form-control:focus{
border-color: #ccc;
box-shadow:0px 1px 1px rgba(0,0,0,0.075) inset, 0px 0px 8px rgba(186,186,186,0.6);
}
.form-group{

padding-left:0;
}
/* Testimonials*/

.testimonial-box {
	float: left;
    color:rgba(0, 0, 0, 0.3);
	/*margin: -65px 0 0 82px;*/
	padding: 10px;
    border: 1px solid #e1dfdf;
    -webkit-transition: color 0.3s ease-in-out;
    -moz-transition: color 0.3s ease-in-out;
    -ms-transition: color 0.3s ease-in-out;
    -o-transition: color 0.3s ease-in-out;
    transition: border 0.3s ease-in-out;
}

.testimonial-box h4 {
	font-size: 20px;
	margin-bottom: 4px;
    text-align:left;
}

.testimonial-box h4:hover{
    color:#fff;
}

.testimonial-box:hover {
        color:#5c6062;
        -webkit-transition: color 0.4s ease-in-out;
        -moz-transition: color 0.4s ease-in-out;
        -ms-transition: color 0.4s ease-in-out;
        -o-transition: color 0.4s ease-in-out;
        transition: color 0.4s ease-in-out;
}
	
.testimonial.no-border {
    border:none;
}

.testimonial{
    float:none;
    padding:20px 0;
}


/*BLOG*/
#blog a{
		-webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	
.post{
   
		margin:20px 0;
		width:100%;
		position:relative;
	border:1px solid rgba(0, 0, 0, 1);

}

.img-post{
    width:100%;
 position:relative;
    background:#000;


}

.img-post img{
   width:100%;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.img-post:hover img{
    opacity:0.3;
}

.img-post:hover .zoom-post{
    opacity:1;
    top:50%;
}

.img-post:hover .zoom-post:hover{
    color:white;
}

.img-post .zoom-post{
    width:52px;
	height:52px;
	display:block;
	border-radius:100px;
	background:white;
	position:absolute;
	text-align:center;
	padding:16px 0 0;
	font-size:15px;
	opacity:0;
	top:60%;
	left:50%;
	cursor:pointer;
	z-index:6;
	color:black;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.info-post{
    margin-right:12px;
}

.text-post h2{
    font-size:25px;
    text-align:left;
    padding-top:10px;
    padding-bottom:20px;
    padding-left:20px;
}

.text-post p{
    margin:10px 0;
    text-align:justify;
    padding-left:20px;
    padding-right:20px;
    padding-bottom:20px;
}

.info-post{
	cursor:pointer;
	padding-left:20px;
}

.info{
	margin-right:15px;
}

.info i{
	margin-right:4px;
}

.date-post-container{
    display:block;
    font-family:'Oswald',Open Sans;
    margin:auto;
	width:63px;
	height:105px;
	background:rgba(256, 256, 256, 0.4);
	opacity:1;
	border:1px solid #262626;
	padding:20px 0;
	text-align:center;
	position:relative;
	top:-1px;
	border-radius:0px;
}


.date-post{
    
    display:block;
    position:absolute;
	left:10%;
	z-index:5;
	padding-top:10px;
	color:#262626;
	text-transform:uppercase;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	transform: translateX(-50%);
}

.date-post p.day{
    font-size:30px;
}

.date-post p.month{
    font-size:15px;
    
}

.date-post .category{
  font-size:15px;
  line-height:35px;
  margin-top:9px;
  opacity:1;
}

.date-post p{
    margin:0px;
    padding:0px;
}


/*Sidebar*/
.widgets{
    padding:20px 0;
}

.sidebar{
    margin:10px 0;
    text-align :left;
    padding:10px 0px 5px;
}

.sidebar h4{
    text-align:left;
    font-size:20px;
    padding-top:10px;
}

.sidebar.search{
    width:100%;
}

.sidebar .form-control{
     border-radius:0px;
    transition:none;
}

.sidebar .form-control:focus{
     border-color:rgba(0, 0, 0, 0.3);
     transition:none;
     box-shadow:none;
}


.sidebar .widgets{
    padding-top:20px;
}

.post-categories ul li{
    border-bottom:1px solid rgba(0, 0, 0, 0.1);
    padding:12px 0;
    cursor:pointer;
}

li i{
    margin-right:15px;
    color:rgba(0, 0, 0, 0.3);
}

.post-text p{
    text-align:justify;
}

a.tag{
	padding:5px 7px;
    margin:0px 5px 5px 0px;
    line-height:35px;
}

.post-tags{
    padding:20px 0;
}

.tags-group{
    padding:10px 0;
}


/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should have another color then white */
	z-index:99; /* makes sure it stays on top */
}

#status {
	width:200px;
	height:200px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally one the screen */
	top:50%; /* centers the loading animation vertically one the screen */
	background-image:url(../images/loader.gif); /* path to your loading animation */
	background-repeat:no-repeat;
	background-position:center;
	margin:-100px 0 0 -100px; /* is width and height divided by two */
}


.success {
  padding: 1em;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  color: #468847;
  background-color: #dff0d8;
  border: 1px solid #d6e9c6;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.error {
  padding: 1em;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  color: #b94a48;
  background-color: #f2dede;
  border: 3px solid rgba(185, 74, 72, 0.3);
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}