* *:before, *:after, *{
    box-sizing: border-box;
}


body{
	font-family		: 	'Open Sans', sans-serif;
	color		:	#333333;
	font-size	:	13px;
	text-align	:	center;
	overflowY	:	hidden;
}
/* ==================================================================
GENERAL
================================================================== */
h1,h2,h3,h4,h5 {
	font-family		: 	'Open Sans', sans-serif;
	font-weight	:	normal;
	margin		:	0;
}
.maxw{
	width	:	100%;
}
a{
	color	:	inherit;
}
a:hover{
	color	:	#eb9673;
}
ul {
	margin	:	10px 0;
	padding	:	0;
}
ul li {
	margin	:	0;
	padding	:	0;
}
/* ==================================================================
SHORT STYLES
================================================================== */
.aright {
	text-align	:	right!important;
}
.aleft {
	text-align	:	left!important;
}
.acenter{
	text-align	:	center;
}
.vmiddle{
	vertical-align	:	middle!important;
}
.inline:not(article){
	display	:	inline-block;
}
.right {
	float		:	right;
}
.left {
	float		:	left;
}
.animate-all{
	-webkit-transition	: 	all 0.5s;
  	-moz-transition		: 	all 0.5s;
  	-ms-transition		: 	all 0.5s;
  	-o-transition		: 	all 0.5s;
	transition			: 	all 0.5s;
}
.autow{
	width	:	auto;
}
.maxw{
	width	:	100%;
}
.maxh {
	height	:	100%;
}
.upper{
	text-transform	:	uppercase;
}

/* ==================================================================
STRUCTURE
================================================================== */
body > header > .inner, 
	body > footer > .inner,
		body > section > .inner, 
			body > section.slider > article >  .inner, 
				body > section:not(.slider)> article:not(.bee3D--parent) {
	max-width	:	1100px;
	margin		:	0 auto;
	text-align	:	left;
}
/* ==================================================================
HEADER
================================================================== */
body > header {
	height		:	100px;
	background	:	#2980B9;
}
body > header > .inner{
	height			:	100px;
}
body > header nav.main a{
	
	display			:	inline-block;
	margin-left		:	10px;
	font-size		:	15px;
	text-transform	:	uppercase;
	text-decoration	:	none;
	border			:	2px solid transparent;
	padding			:	5px 10px;	
	color			:	#FFFFFF;
}
body > header nav.main a:not(.btn):hover{
	background-color	:	#333333;
	border-color		:	#333333;
	color	:	#FFFFFF;

}
body > header nav.main a:not(.btn):active{
	background-color	:	#1e1e1e;
	border-color		:	#1e1e1e;
	color				:	#FFFFFF;
}
nav.main a.btn-white{
	color	:	#333333;
	padding	:	5px 10px;	
}

/* ==================================================================
SLIDER
================================================================== */
body > .slider {
	background	:	#2980B9;
}
body > section.slider > article, body > section.slider{
	height		:	650px;
}
section.slider article.animated:not(.load){
	opacity		:	0;
}

body > section.slider > article > header {
	position		:	absolute;
	width			:	100%;
	top			:	10%;
	left			:	0;
}

body > section.slider > article > header > h1{

	font-size		:	50px;
	color			:	#FFFFFF;
	font-weight		:	normal;
}
body > section.slider > article > header > h1 + h2{
	
	font-weight		:	300;
	
	font-size		:	20px;
	color			:	#FFFFFF;

}

body > section.slider > article > header > h2 + img{
	max-width	:	90%;
	margin-top	:	50px;
}
/* ==================================================================
CAROUSEL
================================================================== */
body > section.carousel > article > header{
	margin-top		:	50px;
}
body > section.carousel > article > header > h1{
	font-size		:	40px;
	font-weight		:	normal;
}
.carousel {
	position	:	relative;
	height		:	750px;
	border-bottom	:	50px solid #F4F4F4;
	overflow	:	hidden;
	
	background	:	#F4F4F4;
   /* margin: 50px 0 150px;*/
}

body > section.carousel > article > .bee3D--slide{
	margin-top	:	-50px;
}
section.carousel ~ section.contact{
	 margin-top: 0px;
}
.bee3D--inner > img {
	max-width:	100%;
	//max-height: 100%;
}
/* ==================================================================
ARTICLES
================================================================== */

body > article > header {
	height		:	200px;
	position	:	relative;
}
body > article > header h1{
	font-size			:	20px;
	text-align			: 	center;
	position			:	absolute;
	top					:	50%;
	width				:	100%;
	transform			:	translateY(-50%);
	-webkit-transform	:	translateY(-50%);
}
body > article > header h1 .btn{
	margin-left	:	20px;
}

body > header + section > article {
	margin-top	:	50px!important;
}
body > header + section > article > header{
	margin-bottom	:	25px;
}
body > header + section > article ul{
	margin-left	:	20px;
}
/* ==================================================================
SERVICES
================================================================== */
.animated:not(.load){
	opacity		:	0;
}
.animated.load{
	opacity		:	1;
}
body > section.services{
	margin		:	0px 0 100px 0 ;
	padding		:	20px 0;
	background	:	#efefef;
}

body > section.services .servicelist{
	margin			:	50px 0;	
}
body > section.services .servicelist .grid-line{
	margin-bottom	:	25px;
}
.servicelist article header .fa{
	font-size		:	20px;
	padding			:	10px 10px;	
	width			:	40px;
	text-align		:	center;
	color			:	#2980B9;
	background		:	#FFFFFF;
}
.servicelist article header h2{
	display			:	inline-block;
	
	font-size		:	18px;
	line-height		:	25px;
	padding			:	0px 10px;
}
.servicelist article header ~ *{
	margin-left		:	50px;
}

/* ==================================================================
SUBSCRIPTIONS
================================================================== */

body > section.subscriptions article.intro > header > h1{
	font-size		:	40px;
	font-weight		:	normal;
}
body > section.subscriptions article.intro > header > h1 + h2{
	font-size		:	20px;
	font-weight		:	normal;
}

.subscriptiontable{
	margin		:	50px 0px;
	text-align	:	center;
}
.subscriptiontable > article:nth-child(1){
	background	:	#ffc45e;
}
.subscriptiontable > article:nth-child(2){
	background	:	#fd685b;
}
.subscriptiontable > article:nth-child(1) .btn{
	color		:	#ffc45e;
}
.subscriptiontable > article:nth-child(2) .btn{
	color		:	#fd685b;
}
.subscriptiontable > article{
	float	:	none!important;
	display	:	inline-block!important;
	color	:	#FFFFFF!important;
	padding	:	30px 1%!important;	
	position	:	relative;
	z-index		:	10;
}
.subscriptiontable > article:hover{
	z-index		:	1000;
	transform	:	scale(1.1);
	
}
.subscriptiontable > article > header > h1{
	text-transform	:	uppercase;
	font-weight		:	bold;
}
.subscriptiontable > article > header > .price{
	font-size		:	20px;
}
.subscriptiontable > article{
	font-size		:	16px;
}
.subscriptiontable > article > header > .divider{
	display		:	inline-block;
	width		:	50%;
	height		:	3px;
	background	:	#FFFFFF;
	margin		:	25px 0 15px;
}
.subscriptiontable > article .grid-line{
	margin		:	10px 0;
}
.subscriptiontable > article .grid-line .btn{
	margin-top	:	30px;
}
/* ==================================================================
BACK TO TOP
================================================================== */
a.backtotop{
	opacity		:	0;
	position	:	fixed;
	right		:	25px;
	bottom		:	25px;
	border		:	none;
	color		:	#2980B9;
	font-size		:	35px;
	width			:	60px;
	height			:	60px;
	display			:	inline-block;
	-webkit-transition	: 	opacity 0.2s;
  	-moz-transition		: 	opacity 0.2s;
  	-ms-transition		: 	opacity 0.2s;
  	-o-transition		: 	opacity 0.2s;
	transition			: 	opacity 0.2s;
	outline	:	none;
}
a:hover{
	color				:	#333333;
	
}
a:active{
	bottom				:	23px;
	color				:	#FFFFFF;
}

/* ==================================================================
CONTACT
================================================================== */
body > section.contact{
	background	:	#cec8bc;
	padding		:	40px 0;
	margin-top	:	200px;
}
body > section.contact > .inner{
	max-width	:	800px;
}

body > section.contact > .inner > header{
	text-align		:	center;
	margin		:	50px 0 50px 0 ;
}

body > section.contact header h1{
	font-size		:	40px;
	color			:	#FFFFFF;
}
body > section.contact header h1 + h2{
	font-size	:	20px;
	color			:	#FFFFFF;
}
body > section.contact article > header h2{
	margin-bottom	:	30px;
	font-size		:	18px;
}
/* ==================================================================
FOOTER
================================================================== */
body > footer {
	padding			:	20px 0 0px 0 ;
	/*margin-bottom	:	100px;*/
}
body > footer  + .inner {
	margin-bottom	:	100px;
	font-size		:	90%;
}
body > footer h3{
	font-size		:	13px;
	color			:	#333333;
	text-transform	:	uppercase;
	font-weight	:	bold;
	margin-bottom	:	20px;
}
body > footer h3 + p{
	margin-top		:	0px;
}
body > footer a.social {
	display			:	inline-block;
	background		:	#cec8bc;
	width			:	40px;
	height			:	40px;
	margin			:	0px 2px;
}
body > footer a.social:hover{
	background		:	#928e85;
}
body > footer a.social > .fa{
	color			:	#FFFFFF;
	font-size		:	24px;
	line-height		:	40px;
}

body > footer:after{
	content		:	'';
	display		:	inline-block;
	width		:	30%;
	height		:	1px;
	background	:	#cec8bc;
}

/* ==================================================================
FORMS
================================================================== */
.contact input[type=text],.contact  textarea{
	display			:	inline-block;
	font-size		:	16px;
	text-decoration	:	none;
	border			:	3px solid #FFFFFF;
	padding			:	5px 10px;	
	color			:	#FFFFFF;
	margin-bottom	:	10px;
	width			:	100%;
	background		:	#cec8bc;
}
.contact textarea{
	height			:	132px;
}
.check, .radio {
    padding-left: 0px!important;
}
/* ==================================================================
EXCEPTION
================================================================== */
body.exception{
	background-color	: #2980B9;
}
body.exception > article{
	position	:	absolute;
	top			:	50%;
	left		:	50%;
	transform	:	translate(-50%,-50%);
	-webkit-transform	:	translate(-50%,-50%);
	background	:	#FFFFFF;
	padding		:	25px 50px;
	min-width	:	650px;
	max-width	:	100%;
	border-radius			:	10px;
	-moz-border-radius		:	10px;
	-webkit-border-radius	:	10px;
}
body.exception > article > header{
	height		:	auto;
	margin		:	25px 0 50px;
	
}
/* ==================================================================
MESSAGES
================================================================== */
div[class*='message-']{
	padding					:	10px;
	margin-bottom			:	20px
}
div[class*='message-'] > header{
	display				:	none;
}
div.message-warning, div.message-warning > header, div.message-warning  .message-close{
	background-color: #fcf8e3;
    border-color: #faebcc;
    color: #8a6d3b;
}
div.message-valid, div.message-valid > header, div.message-valid  .message-close{
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
}
div.message-error, div.message-error > header, div.message-error  .message-close{
	background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}
div.message-feedback, div.message-feedback > header, div.message-feedback  .message-close{
	background-color: #d9edf7;
    border-color: #bce8f1;
    color: #31708f;
}
form#mycontactform .attribute-panel{
	-webkit-transition		: 	all 0.5s;
  	-moz-transition		: 	all 0.5s;
  	-ms-transition		: 	all 0.5s;
  	-o-transition		: 	all 0.5s;
	transition			: 	all 0.5s;
}

form#mycontactform .message-feedback + .grid-layout{
	opacity		:	0;
}

/* ==================================================================
BUTTON
================================================================== */
.btn{

	display			:	inline-block;
	font-size		:	16px;
	text-transform	:	uppercase;
	text-decoration	:	none;
	border			:	2px solid #333333;
	padding			:	5px 10px;	
}
.btn:hover{
	background-color	:	#333333;
	color				:	#FFFFFF;
}
.btn:active{
	background-color	:	#231F20;
	border-color		:	#231F20;
	color				:	#FFFFFF;
}
.btn-yellow {
	background-color	:	#ffc45e;
	border-color		:	#ffc45e;
	color				:	#FFFFFF;
	font-size			:	16px;
	padding				:	10px 20px;
}
.btn-yellow:hover{
	background-color	:	#ffd07f;
	border-color		:	#ffd07f;
	color				:	#FFFFFF;
}
.btn-white {
	background-color	:	rgba(255,255,255,0.9);
	border-color		:	rgba(255,255,255,0.9);
	font-size			:	16px;
	padding				:	10px 20px;
}
.btn-white:hover{
	background-color	:	rgba(255,255,255,1);
	border-color		:	rgba(255,255,255,1);
	color				:	#FFFFFF;
}
.btn-blue{
	background-color	:	#2980B9;
	border-color		:	#2980B9;
	color				:	#FFFFFF;
	font-size			:	16px;
	padding				:	10px 20px;
}
.btn-blue:hover{
	background-color	:	#3498db;
	border-color		:	#3498db;
	color				:	#FFFFFF;
}
.btn-red {
	background-color	:	#fd685b;
	border-color		:	#fd685b;
	color				:	#FFFFFF;
	font-size			:	16px;
	padding				:	10px 20px;
}
.btn-red:hover {
	background-color	:	#de5b50;
	border-color		:	#de5b50;
	color				:	#FFFFFF;
}
button.stripe-button-el{
	background-image	:	none;
}
/* ==================================================================
GRID
================================================================== */
.grid-layout {
	position	:	relative;
}
.grid-line{
	margin-bottom	:	2px;
}
.grid-layout:after,.grid-line:after{
	clear	:	both;
	content	:	'';
	display	:	block;
	height	:	0px;
	overflow	:	hidden;
}
.grid-layout.nomargin > * ,.grid-layout.nomargin > .grid-line > *{
	padding			:	0;
}
.grid-layout > *[class^=g]:not(.grid-line),.grid-layout .grid-line > *[class^=g]{
	display			:	inline;
	float			:	left;
	position		:	relative;
	padding			:	0 1%;
}
.grid-layout.nomargin > *[class^=g],.grid-layout.nomargin .grid-line > *[class^=g],
	.grid-layout > *[class^=g].nomargin,.grid-layout .grid-line > *[class^=g].nomargin{
	padding			:	0;
}
.grid-line > label {
	display	:	block;
}

.g1 {width:8.333%;}
.g1_0{width:10%;}
.g1_1{width:11.111%;}
.g2 {width:16.667%;}
.g3 {width:25.0%;}
.g4 {width:33.333%;}
.g5 {width:41.667%;}
.g6 {width:50.0%;}
.g7 {width:58.333%;}
.g8 {width:66.667%;}
.g9 {width:75.0%;}
.g10 {width:83.333%;}
.g11 {width:91.667%;}
.g12 {width:100%; }

/* ==================================================================
TABLE GRID 
================================================================== */
.table-layout{
	display			:	table;
	width			:	100%;
	cellspacing		:	0;
	cellpadding		:	0;
}
.table-layout-fixed{
	table-layout: fixed;
}
.table-layout > .table-line{
	display			: table-row;
}
.table-layout > .table-line > *[class^=t]{
	display			:	table-cell;
	height			:	100%;
	float			:	none;
	vertical-align	:	top;
}
.table-layout-fixed > .table-line > [class^="t"].minh{
	height	:	1px;
}
.table-layout-fixed > .table-line>  [class^="t"].maxh{
	height	:	100%;
}
.t1 {width:8.333%;}
.t1_0{width:10%;}
.t1_1{width:11.111%;}
.t2 {width:16.667%;}
.t3 {width:25.0%;}
.t4 {width:33.333%;}
.t5 {width:41.667%;}
.t6 {width:50.0%;}
.t7 {width:58.333%;}
.t8 {width:66.667%;}
.t9 {width:75.0%;}
.t10 {width:83.333%;}
.t11 {width:91.667%;}
.t12 {width:100%; }


.table-line.h3 > *[class^=t]{
	height:25.0%;
	overflow: hidden;
}
.table-line.h4 > *[class^=t]{
	height:33.333%;
	overflow: hidden;
}
.table-line.h6 > *[class^=t]{
	height:50%;
	overflow: hidden;
}



/***
**	TOGGLE MOBILE
**/
body > header  input[name=togglenav]{
	opacity : 0;
	position	:	absolute;
	left		:	-5000px;
}
.mobileshow{
	display	:	none;
}

@media screen and (max-width: 1100px) {
	body > header > .inner, 
		body > section > .inner, 
			body > section.slider > article >  .inner, 
				body > section:not(.slider) > article{
		max-width	:	90%;
		margin		:	0 5%
	}
	
	
}
@media screen and (max-width: 1070px) {
	body > header{
		height	:	auto;
		padding-bottom	:	10px;
	}
	.servicelist article header h2 {
		font-size	: 	20px;
	}
	body > article > header {
		position	:	relative;
	}
	
	body > header > .table-layout,
		body > header > .table-layout > .table-line,
			body > header > .table-layout > .table-line > *{
		display	:	block!important;
		height	:	auto;
	}
	body > header > .table-layout > .table-line > *{
		width		:	100%;
		text-align	:	center;
	}
	body > header > .table-layout > .table-line > .t3 > img{
		margin		:	20px 0 10px 0;
	}
	body > header  nav.main{
		text-align		:	center;
		margin-bottom	:	10px;
	}
	
	
	
	
}
@media screen and (max-width:824px) {
	body > section.portfolio > .inner > .g9  .work-slider > .grid-line{
		height		:	200%;
	}
	body > section.portfolio > .inner > .g9  .work-slider > .grid-line > article{
		width		: 80%;
	}
	.work-slider > .grid-line article:nth-child(1){
	    left: 10%;
		top	: 25%;
	}
	.work-slider > .grid-line article:nth-child(2){
		left: 10%;
		top	: 75%;
	}
	input[type="text"], textarea {
		    width: 90%;
	}
	body > section.contact .col2 > * {
	    margin-left: 10%;
	}
	body > header  nav.main a{
	 	margin-left	: 10px;
		font-size	:	16px;
	}
	
}
@media screen and (max-width:724px) {
	
	.subscriptiontable > article{
		width	:	40%!important;
		
	}

}



@media screen and (max-width: 524px) {
	body > section.carousel{
		display	:	none;
	}
	body > header nav.main a[href='#Tour']{
	display	:	none;
	}
	.mobilehide{
		display	:none!important;
	}
	.mobileshow{
		display	:block;
	}
	body > header > .table-layout > .table-line > .t3{
		
		text-align	:	left!important;
	}
	body > header  label[for=togglenav]{
		position		:	absolute;
		right			:	0;
		display			:	block;
		top				:	10px;
		padding-right	:	5%;
	}
	body > header  label[for=togglenav]  > i{
		color		:	#FFFFFF;
		text-align	:	right;
		font-size	:	24px;
		margin-top	:	10px;
		cursor		:	pointer;
		padding			:	10px 15px;
		border			:	1px solid #FFFFFF;
	}
	
	body > header > .table-layout,
		body > header > .table-layout > .table-line,
			body > header > .table-layout > .table-line > *{
		display	:	block!important;
		height	:	auto;
	}
	body > header > .table-layout > .table-line > *{
		width	:	100%;
	}
	body > header > .table-layout > .table-line > .t3 > img{
		margin		:	30px 0 20px 0;
	}
	
	body > header  nav.main{
		background-color 	: 	#FFFFFF;
		display				:	block;
		max-height			: 	0;
    	transition			:	max-height 0.15s ease-out;
		overflow			:	hidden;
		border				:	0;
		margin				:	0;
	}
	body > header  input[name=togglenav]:checked ~ nav.main{
		 max-height		: 1500px;
   		 transition		: max-height 0.25s ease-in;
		/* border-top		:	1px solid #58585B;*/
	}
	body > header  nav.main > a, 
		body > header  nav.main > div{
			color 		:   #333333!important;
			background	:	#FFFFFF;
			border		:	none;
			border-radius	:	0;
			display		:	block;
			padding		:	10px 5%!important;
			margin		:	0!important;
			text-align	:	left;
	}	 

	body > header nav.main a:hover{
		background-color	:	#2980B9!important;
		border-color		:	#2980B9!important;
		color	:	#FFFFFF!important;
	
	}
	body > header nav.main a:active{
		background-color	:	#2980B9!important;
		border-color		:	#2980B9!important;
		color	:	#FFFFFF!important;
	}
	
	/** SLIDER **/
	
	body > section.slider > article > header > h2 + img {
	    margin-top: 20px;
	    max-width: 90%;
	}
	body > section.slider > article, body > section.slider {
	    height		: 400px;
	}
	body > article > header h1 {
	    font-size	: 20px;
	    line-height	: 30px;
	    text-align	: center;
		padding-top	:	30px;
	}
	/** SERVICES **/
	body > section.services .servicelist .g6 {
		width		:	100%;
	}
	.servicelist article{
		margin-bottom	:	20px;
	}
	.servicelist article header{
		text-align	:	center;
	}
	.servicelist article header h2 {
		font-size	: 	20px;
		margin		: 	20px 0;	
		width		:	100%;
	}
	.servicelist article header .fa {
	  
	}
	.servicelist article header ~ * {
    	margin-left: 0px;
	}
	
	body > section.portfolio > .inner > .g3{
		height		:	50%;
		width		:	100%;
	}
	body > section.portfolio > .inner > .g9{
		height		:	50%;
		width		:	100%;
	}
	
	body > section.contact > .inner > header {
	    margin: 50px 0 50px;
	    
	}
	body > section.contact header h1 {
	    font-size: 30px;
	}
	body > section.contact > .inner > .grid-layout > .g6 {
		width	:	100%;
	}
	
	form#mycontactform .attribute-panel .grid-line:last-child{
		text-align	:	center;
	}
	body > section.contact .col2 {
		margin-top	:	40px;
	}
	input[type="text"], textarea {
		    width: 100%;
	}
	body > section.contact .col2 > * {
	    margin-left: 0%;
	}
	.subscriptiontable > article{
		width	:	100%!important;
	}
	
	section.contact .g6{
		width	:	100%;
	}
	footer .g4:nth-child(1),footer .g4:nth-child(2){
		width	:	50%;
	}
	footer .g4:nth-child(2) h3{
		text-align	:	right;
	}
	footer .g4:nth-child(3){
		width	:	100%;
		clear	:	both;
		text-align	:	center!important;
	}
}

