/*
Plugin: jQuery Parallax
Version 1.1.3
Author: Ian Lunn
Twitter: @IanLunn
Author URL: http://www.ianlunn.co.uk/
Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/

License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.
*/

@charset "utf-8";
/* CSS Document */

.float-left{
	float: left;	
	margin: 0 0 0 20px;
}

.float-right{
	float: right;
	margin: 0 20px 0 0;
}

.center{
	font-size: 2.5em;
	padding: 80px 0 0 0;
	text-align: center;
}

#intro, #second{
	width: 100%;
}

#intro{
	background:url('/image/parallax/first_parallax.jpg') 50% 0 no-repeat fixed;
	color: white;
	min-height: 809px;
	margin: -20px auto 0 auto;
	padding: 0;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	-moz-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
}

@media (min-width: 1601px) {
	#intro{
		min-height: 1080px;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

@media (max-width: 1024px) {
	#intro{
		background: url('/image/parallax/first_parallax.jpg') 50% 0 no-repeat fixed;
		min-height: 809px;
		/*background-attachment: scroll;*/
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

@media (max-width: 768px) {
	#intro{
		background: url('/image/parallax/first_parallax.jpg') 50% 0 no-repeat fixed;
		/*background-attachment: scroll;*/
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

@media (max-width: 425px) {
	#intro{
		background: url('/image/parallax/first_parallax.jpg') 50% 0 no-repeat fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

.overlay {
    background: url('/image/pattern.png');
    width: 100%;
    position: absolute;
    overflow: hidden;
    min-height: 809px;
	height: 100%;
}
/*first*/
#firstblock {
	//background: url('/image/parallax/bg.png') 50% 0 no-repeat;
	margin: 0 auto;
	min-height: 809px;
	height: 100%;
	//-webkit-box-shadow: 0px 50px 50px 50px rgb(0, 0, 0);
	//-moz-box-shadow: 0px 50px 50px 50px rgb(0, 0, 0);
	//box-shadow: 0px 50px 50px 50px rgb(0, 0, 0);
}
#html-firstblock {
	z-index: 998;
}
@media (max-width: 767px) {
	#html-firstblock .head-title > span{
	font-size: 295%;
	}
}

#html-firstblock {
	margin-top: 3%;
	margin-bottom: 3%;
}

#html-firstblock .head-title{
    margin-top: 25px;
    margin-bottom: 25px;
}

#html-firstblock .head-title > span {
    font-size: 55px;
    line-height: 60px;
    color: #000000;
    padding: 0px 8px 0 25px;
    border: solid 3px #000000;
}

#html-firstblock .box {
	border: solid 1px #ccc;
	width: 100%;
	min-height: 475px;
	cursor: default;
	margin: 8% auto 10px;
    padding: 10% 10% 10% 10%; 
	-webkit-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	-moz-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
}
#html-firstblock .head {
	font-size: 30px; 
	line-height: 30px; 
	margin-bottom: 20px;
	width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#html-firstblock .box .head > span {
	font-weight: 900;
	font-family: 'Arial Black', Arial;
}

#html-firstblock .icon {
	text-align: center;
}

#html-firstblock .icon .fa {
    font-size: 150px;
    background-color: #000000;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
}

#html-firstblock .h {
	font-size: 16px; 
	line-height: 25px; 
}


@media (max-width: 1200px) {
	#html-firstblock .box .h {
		font-size: 13px;
	}
}
@media (min-width: 992px) {
	#html-firstblock .head-title{
		margin-bottom: 40px;
	}
}
@media (max-width: 991px) {
	#html-firstblock .head {
		font-size: 25px;
	}
	#html-firstblock .box .h {
		font-size: 15px;
	}
}

@media (max-width: 767px) {
	#html-firstblock .head-title > span{
		font-size: 50px;
	}
	#html-firstblock .box {
		margin: 4% auto 10px;
	}
}

@media screen and (max-width: 480px) {
	#html-firstblock .head-title > span{
		font-size: 29px;
	}
	#html-firstblock .head-title {
		margin-top: 10px;
		margin-bottom: 10px;
	}
	#html-firstblock .box {
		margin: 5% auto 10px;
	}
}

/*second*/
#second{
	background: url('/image/parallax/brown.jpg') 50% 0 no-repeat fixed;
	color: white;
	min-height: 1080px;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	-moz-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
}

#second .bg{
	/*background: url('/image/parallax/bg.png') 50% 0 no-repeat fixed;*/
	height: 1080px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width: 100%;
	z-index: 200;    
	float: right;
}

#secondblock {
	background-color:#FFF;
	margin: 0 auto;
	min-height: 580px;
	height: 100%;
}

#second  .container .row  {
	margin-top: 350px;
	font-size: 30px; 
	line-height: 40px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
}

#html-secondblock {
	z-index: 998;
}

#html-second  .box {
	padding: 5px 5px;
	background-color: rgba(41, 41, 41, 0.6);
}

#html-second  .box > div {
	font-weight: 900;
	font-family: 'Arial Black', Arial;
}

#html-second #sublist > ul > li > span {
	font-weight: initial;
}

#html-secondblock {
    margin-top: 3%;
    margin-bottom: 3%;
}

#html-secondblock > div.hbox {
	
}

#html-secondblock > div > div:nth-child(1) {
	text-align: center;
    margin-bottom: 25px;
}

#html-secondblock .hbox > div > span {
	cursor: default;
	margin-bottom: 35px;
    font-size: 35px;
    line-height: 35px;
	color: #000;
	font-weight: 900;
    font-family: 'Arial Black', Arial;
}

#html-secondblock .box {
	border: solid 1px #ccc;
	padding-top: 10px;
	margin-bottom: 12px;
	min-height: 561px;
	cursor: default;
	-webkit-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	-moz-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
}

#html-secondblock .box > div > span {
	font-size: 18px;
    line-height: 22px;
}

#html-secondblock .box .h > span {
	font-size: 14px;
    line-height: 18px;
	text-shadow: none;
}

#html-secondblock  .box > img {
	margin-left: auto;
	margin-right: auto;
}

#html-secondblock .box .h {
    padding: 5% 5% 5%;
	text-align: left;
}

/*third*/

#third{
	background: url('/image/parallax/black.jpg') 50% 0 no-repeat fixed;
	color: white;
	min-height: 809px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	-moz-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
}

@media (min-width: 1601px) {
	#third{
		min-height: 1080px;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}
@media (max-width: 425px) {
	#third{
		background: url('/image/parallax/black.jpg') 50% 0 no-repeat fixed;
		height: 809px;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}
#third .container .row {
	margin-top: 20%;
	font-size: 30px; 
	line-height: 40px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
}

#thirdblock {
	background-color:#FFF;
	margin: 0 auto;
	min-height: 580px;
	height: 100%;
}

#html-third .box {
	padding: 5px 5px;
	background-color: rgba(41, 41, 41, 0.6);
}

#html-third .box > div {
	font-weight: 900;
	font-family: 'Arial Black', Arial;
}

#html-thirdblock {
	z-index: 998;
}

#html-thirdblock {
    margin-top: 3%;
	margin-bottom: 3%;
}

#html-thirdblock .head {
	font-size: 35px;
	line-height: 40px;
	font-weight: 900;
	font-family: 'Arial Black', Arial;
	text-shadow: 1px 1px 2px #ccc;
	color: #000;
}

#html-thirdblock .box {
	border: solid 1px #ccc;
	width: 100%;
	min-height: 402px;
	cursor: default;
	margin-bottom: 10px;
    padding: 5% 5% 5% 5%;
	-webkit-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	-moz-box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
	box-shadow: 5px 5px 5px 0px rgba(204,204,204,1);
}
#html-thirdblock .head {
	font-size: 30px; 
	line-height: 30px; 
	margin-bottom: 5%;
	width: 100%;
    margin-left: auto;
    margin-right: auto;
	text-shadow: 1px 1px 2px #ccc;
}

#html-thirdblock .title {
	margin-bottom: 16px;
}

#html-thirdblock .icon {
	text-align: center;
}

#html-thirdblock .icon .fa {
	font-size: 150px;
	color: #FFCD00;
}


#html-thirdblock .h {
    padding-top: 10px;
	font-size: 14px; 
	line-height: 18px; 
}

/*fourth*/

#fourth{
	background: url('/image/parallax/blueb.jpg') 50% 0 no-repeat fixed;
	color: white;
	min-height: 809px;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	-moz-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
}

#fourth  .container .row {
	margin-top: 20%;
	font-size: 30px; 
	line-height: 40px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
}

#fourthblock{
	background-color:#FFF;
	margin: 0 auto;
	min-height: 600px;
	height: 100%;
}

#fourthblock .container .row {
	color:#000;
	font-family: arial;
	font-weight: 600;
	margin-top: 55px;
	font-size: 20px; 
	line-height: 40px; 
	text-shadow: 1px 1px 0px rgb(189, 189, 189);
}

#html-fourthblock{
	z-index: 998;
}

#html-fourth  .box {
	padding: 5px 5px;
	background-color: rgba(41, 41, 41, 0.6);
}

#html-fourth  .box > div {
	font-weight: 900;
	font-family: 'Arial Black', Arial;
}

#html-fourthblock .title {
    margin-bottom: 16px;
}

#html-fourthblock .head {
	color: #000;
    font-size: 40px;
    line-height: 45px;
	font-weight: 900;
    margin-bottom: 25px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-shadow: 1px 1px 2px #ccc;
}

/*fifth*/

#fifth{
	background: url('/image/parallax/brown_parallax.jpg') 50% 0 no-repeat fixed;
	color: white;
	min-height: 809px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;	
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	-moz-box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
	box-shadow: inset 0px 0px 50px 0px rgb(0, 0, 0);
}

#fifth  .container .row {
	margin-top: 350px;
	font-size: 30px; 
	line-height: 40px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
}

@media (max-width: 1024px) {
	#fifth{
		min-height: 488px;
	}
	
	#fifth .container .row {
		margin-top: 5%;
	}
}

#html-fifth  .box {
	padding: 5px 5px;
	background-color: rgba(41, 41, 41, 0.6);
}

#html-fifth  .box > div {
	color: #fff;
	font-weight: 900;
	font-family: 'Arial Black', Arial;
}
/*story & sub*/

.story{
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
}

#subtext {
	font-size: 20px; 
	line-height: 30px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
}
#sublist {
	font-size: 20px; 
	line-height: 30px; 
	text-shadow: 4px 4px 2px rgb(19, 19, 19);
	font-weight: 100;
}

#sublist > p {
	font-family: arial;
    font-weight: 100;
}

.container:nth-child(5), 
.container:nth-child(7), 
.container:nth-child(9) {
	display:none;
}

/*Extra*/
#order {
    margin-top: 35%;
    margin-bottom: 10px;
}

#glow {
    font-size: 25px;
    font-weight: 900;
    font-family: arial;
    padding: 5% 0;
	white-space: normal;
}
/*Extra*/

/*Button Glowing*/
@-webkit-keyframes glowing {
  0% { color: #F00; -webkit-text-shadow: 0 0 3px #000;}
  30% { color: #000; -webkit-text-shadow: 0 0 10px #F00;}
  100% { color: #F00; -webkit-text-shadow: 0 0 3px #000;}
}

@-moz-keyframes glowing {
  0% { color: #F00; -moz-text-shadow: 0 0 3px #000;}
  30% { color: #000; -moz-text-shadow: 0 0 10px #F00;}
  100% { color: #F00; -moz-text-shadow: 0 0 3px #000;}
}

@-o-keyframes glowing {
  0% { color: #F00; text-shadow: 0 0 3px #000;}
  30% { color: #000; text-shadow: 0 0 10px #F00;}
  100% { color: #F00; text-shadow: 0 0 3px #000;}
}

@keyframes glowing {
  0% { color: #F00; text-shadow: 0 0 3px #000;}
  30% { color: #000; text-shadow: 0 0 10px #F00;}
  100% { color: #F00; text-shadow: 0 0 3px #000;}
}

.offer {
	background-image: none;
    -webkit-animation: glowing 300ms infinite;
    -moz-animation: glowing 300ms infinite;
    -o-animation: glowing 300ms infinite;
    animation: glowing 300ms infinite;
}
/*Button Glowing*/