/*css*/
@import "../css/reset.css";
@import "../css/skeleton.css";
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);
@import url(//fonts.googleapis.com/css?family=Racing+Sans+One);

html, body {
	background: #ed6c4e;
	font: 12px/12px Arial, sans-serif;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	color: #CCC;
	min-width:300px;
}
body { padding-top: 15px;}

.bg-1 {
	background: #ed6c4e;
	padding-bottom: 90px;
	position: relative;
	background-color: #FF0000;
}
.bg-1:after {
	position: absolute;
	content:"";
	width: 49px;
	height: 25px;
	background: url(../images/arrow-3.png) 0 0 no-repeat; 
	bottom: -25px;
	left: 50%;
	margin-left: -25px;
}

* { -webkit-text-size-adjust: none;}

a { color: inherit; text-decoration: none;}
a:hover {
	text-decoration: none;
	font-family: "Open Sans", sans-serif;
	color: #F00;
}
a[href^="tel:"] {color: inherit;text-decoration:none;}
.a-hov { transition: all 0.4s ease;}
.a-hov:hover { color: #323a45;}

ul li a { transition: all 0.4s ease;}

h1, h2, h3, h4, h5, h6 { text-transform: uppercase; font-weight: 300;}
h1 { font-family: 'Racing Sans One', cursive; font-size: 30px; line-height: 30px; padding-top: 30px; letter-spacing: -1px;}
h1 span {
	font-size: 10px;
	line-height: 20px;
	color: #FFF;
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
	display: block;
	letter-spacing: 1px;
	margin-top: -2px;
}
h2 {
	font-size: 40px;
	line-height: 55px;
	text-align: center;
	padding-top: 110px;
	padding-bottom: 67px;
	padding-right: 30px;
}
h2 span { font-size: 12px; line-height: 30px; color: #68707b; display: block; padding-left: 12px;}
h3 { font-size: 18px; line-height: 24px; padding-bottom: 47px;}
h4 { }
h5 { }


.title-1 {
	font-size: 50px;
	line-height: 55px;
	text-align: center;
	text-transform: uppercase;
	margin-top: 2px;
	font-style: opacity 80%;
} 
.title-1 span {
	color: #CCC;
}
.title-1 span + span {
	color: #333;
}
.text-1 { font-size: 95px; line-height: 95px; color: #fff; font-family: 'Racing Sans One', cursive;}
.text-2 { font-size: 18px; line-height: 18px; color: #fff; text-transform: uppercase;}
.text-3 { color: #fec9bc; line-height: 24px;}
.text-4 { font-size: 15px; line-height: 26px; color: #fff;}

.color-1 { color: #323a45;}
.color-2 { }

h2.v1 { padding-top: 113px; padding-bottom: 62px;}
h2.v2 { padding-top: 160px; padding-bottom: 77px;}
h2.v3 { padding-top: 84px; padding-bottom: 67px;}
h2.v4 { padding-bottom: 71px;}

.btn {
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	transition: all 0.4s ease;
	font-family: 'Racing Sans One', cursive;
	font-size: 10px;
	line-height: 25px;
	color: #fff;
	text-transform: uppercase;
	margin-top: 39px;
	padding-right: 1px;
}
.btn:hover { color: #68707b;}
.btn.v1 { margin-top: 69px;}

.list li {
	font-family: Arial, sans-serif;
	font-size: 15px;
	line-height: 17px;
	color: #fec9bc;
	background: url(../images/icon-1.png) 0 3px no-repeat;
	padding-left: 26px;
	text-transform: uppercase;
	margin-top: 25px;
}
.list li + li { margin-top: 13px;}
.list li a { }
.list li a:hover { color: #323a45;}


/*auxiliary*/

.img-ind {float: left; margin-right: 24px; margin-top: 0px;margin-left: 12px;}
.wrapper {width: 100%; position: relative;}
.extra-wrap {overflow:hidden;}
.grid_inside { margin: 0 -10px;}
.aligncenter {text-align: center !important;}
.alignleft { text-align: left !important; }
.it {font-style:italic; display: inline-block;}
.fleft {float: left;}
.fright {float: right;}
.h-underline:hover {
	text-decoration: underline;
	font-family: Arial, Helvetica, sans-serif;
}
.underline {text-decoration: underline;}
.upp {text-transform: uppercase;}
.transition {transition: all 0.4s ease;}

.clearfix { *zoom: 1;}
.clearfix:before,.clearfix:after {display: table; content: "";line-height: 0;}
.clearfix:after { clear: both;}

.pad-left { padding-left: 10px;}
.pad-top { padding-top: 20px;}

p { padding-bottom: 26px;}
.pad-bot { padding-bottom: 113px;}

.img-ind + div > div:first-child,
.img-ind + div > p:first-child { padding-top: 21px;}
.img-ind-1 + div > div:first-child { padding-top: 8px;}
.img-circle { 
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
}
.img-ind-1 {float: left; margin-right: 24px; margin-top: 0px;}
.shape-1 { 
	background: url(../images/shape-1.png) 0 0 no-repeat;
	width: 119px;
	height: 119px;
	text-align: center;
	line-height: 103px;
	color: #ed6c4e;
	font-size: 50px;
	padding-left: 8px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	 box-sizing: border-box; 
}
.shape-2 {
	display: block;
	background: #f29883;
	border: 1px solid #fff;
	width: 140px;
	height: 140px;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	-ms-border-radius: 500px;
	-o-border-radius: 500px;
	border-radius: 500px;
	text-align: center;
	line-height: 126px;
	font-size: 46px;
}
.shape-2.img-ind { margin-left: 0; margin-right: 17px;}

.w3 { width: 83%;}

/************Header************/

header {
	background: #666666;
	position: relative;
	z-index: 0;
	background-image: url(../images/back.png);
	background-repeat: no-repeat;
	background-position: center;
}
header:after { 
	position: absolute;
	content: "";
	background: url(../images/arrow-1.png) left top repeat;
	width: 49px;
	height: 25px;
	bottom: -25px;
	left: 50%;
	margin-left: -24px;
	z-index: 1000;
}
h1 { text-align: center; margin-bottom: 74px;}


.block-1 { margin-bottom: 156px;}
.box-1 {
	width: 260px;
	height: 260px;
	float: left;
	border:1px solid #3e4650;
	margin-right: -36px;
	border-radius: 500px;
	position: relative;
	margin-top: 82px;
	z-index: 1;
	transition: all 0.4s ease;
}
.box-1 .arrow {
	display: block;
	background: url(../images/arrow-2.png) center 0 no-repeat;
	position: absolute;
	top: -3px;
	left: 50%;
	margin-left: -30px;
	width: 60px;
	height: 35px;
	opacity: 0;
	transition: all 0.2s ease;
}
.box-1:hover .arrow,
.box-1.current .arrow {
	opacity: 1;
}

.box-1 .inside {
	display: block;
	background: #343c47;
	opacity: .5;
	position: absolute;
	top: 1px;
	bottom: 1px;
	left: 1px;
	right: 1px;
	border-radius: 500px;
	transition: all 0.4s ease;
}
.box-1 .text-1 {
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
	text-transform: uppercase;
	font-size: 20px;
	line-height: 30px;
	color: #68707b;
	bottom: 24%;
	font-family: Arial, Helvetica, sans-serif;
	transition: all 0.4s ease;
}

.box-1 .text-1 i {
	font-family: FontAwesome;
	line-height: 60px;
	color: #68707b;
	text-align: center;
	display: block;
	transition: all 0.4s ease;
	font-size: 60px;
	margin-bottom: 22px;
}
.box-1:hover .text-1 i,
.box-1.current .text-1 i,
.box-1:hover .text-1,
.box-1.current .text-1 {	color: #fff;}
.box-1:hover .inside, .box-1.current .inside {
	opacity: 1;
	background-image: url(../images/ball.png);
	background-position: center;
}

.box-1.current { z-index: 100;}
.box-1.current { opacity: .9;}
.box-1:hover { z-index: 101;}
.box-1:hover { opacity: 1;}


/************Content***********/
.content { background: #323a45; padding-bottom: 176px; position: relative;}
.content.v1 { padding-bottom: 0;}
.content.v1:after { display: none;}
.content:after {
	position: absolute;
	content: "";
	background: url(../images/arrow-1.png) 0 0 no-repeat;
	width: 49px;
	height: 25px;
	bottom: -25px;
	left: 50%;
	margin-left: -24px;
}
.block-2 { margin-bottom: 37px;}
.box-2 { text-align: center; padding-top: 43px; position: relative; padding-bottom: 30px;}
.box-2 + .box-2:after { 
	position: absolute;
	content: "";
	left: -9px;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #f07f65;
}
.box-2 .text-3 { padding: 47px 19px 0px;}
.box-2 .btn { margin-top: 75px;}

.block-3 .img-ind { margin-left: 4px;}

.block-4 .block-3 .img-ind-1 + div { max-width: 380px;}
.block-4 { margin-top: -69px;}
.img-ind-1 + div .btn { margin-top: 36px;}
.block-4 .block-3 { margin-top: 79px;}

.block-5 > div { width: 212px; float: left; text-align: right; margin-top: 19px;}
.block-5 > div:first-child { width: auto;}
.block-5 a img { transition: all .4s ease;}
.block-5 a:hover img { opacity: .4;}

.block-6 { margin-top: 15px;}
.block-6 + .block-6 { margin-top: 85px;}

.block-7 { margin-top: -68px;}
.block-7 .img-ind + div > div:first-child { padding-top: 7px;}
.box-3 { margin-top: 78px;}

/*blog*/
.blog-post { margin-top: 29px;}
.date {
	float: left;
	font-size: 18px;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	margin: 15px 54px 0 0;
}
.date span {
	font-family: 'Racing Sans One', cursive;
	font-size: 95px;
	line-height: 92px;
	display: block;
}
.post-info { margin-bottom: 43px;}
.blog-post + .blog-post { margin-top: 61px;}

/************Footer************/

footer { font-family: 'Open Sans', sans-serif; background: #292f39; font-size: 10px; line-height: 18px; color: #68707b; text-transform: uppercase; padding-top: 41px; padding-bottom: 83px; text-align: center; margin-bottom: 20px;}
footer .col-1,
footer .col-2 { width: 135px; margin-top: 50px;}
footer .col-1 i,
footer .col-2 i {color: #ed6c4e; font-size: 30px; font-family: FontAwesome; display: block;padding-bottom: 27px;}
footer .col-1 { margin-right: 94px;}
footer .col-2 { margin-left: 94px;}
footer .a-hov:hover { color: #ed6c4e;}
footer .logo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 30px;
	line-height: 30px;
	color: #fff;
	margin-top: 109px;
}
footer .copyright { letter-spacing: 1px; margin-top: -3px;}
.top { display:block; margin-top: 76px;}
.top img { padding-right: 11px;}
.top img:hover { opacity: .7;}

/*==================================RESPONSIVE LAYOUTS===============================================*/


@media only screen and (max-width: 995px) {
	.box-1 { width: 210px; height: 210px;}
	.block-5 > div { width: 162px;}
	.post-info .img-circle { height: 50%; width: 50%; max-height: 180px;}
	.w3 { width: 100%;}
	.bg-1:after { bottom: -24px;}
	.content:after { bottom: -24px;}
}
@media only screen and (max-width: 767px) {
	.box-2 + .box-2:after {display: none; }
	.box-1 {margin-top: -1px; width: 207px;height: 207px;  margin-right: 0;}
	.block-1 { margin-top: 80px;}
	h2.alignleft { text-align: center!important;}
	.w2 { width: 50% !important;}
	.img-circle.img-ind { width: 50%; height: 50%;}
	.post-info .img-circle { max-height: 210px;}
}
@media only screen and (max-width: 479px) {
	.title-1 { font-size: 40px;}
	.box-1 { float: none; margin-left: auto; margin-right: auto;}
	.block-3 .img-ind + div { overflow: hidden;}
	footer .col-1 { margin-right: 0;}
	footer .col-2 { margin-left: 0;}
	.block-5 > div, .block-5 > div:first-child { width: 149px; text-align: left;} 
	.date { margin-right: 10px;}
}
@media only screen and (max-width: 320px) {

}
