/* ------------------------------------------------------------------------------

	Template Name: Coming soon
	Template URI: http://http://www.themeelite.com/comingsoon
	Description: Full Screen Coming Soon Template
	Author: Andy
	Author URI: http://www.themeelite.com
	License: GNU General Public License version 3.0
	License URI: http://www.gnu.org/licenses/gpl-3.0.html
	Version: 1.0
	
	1.	CSS Reset
	2.	Document Setup (body, common classes, structure etc)
		2.1 body contaner style
		2.2 Countdown style
		2.3 social style
		2.4 contact us style
		2.5 About us style
		2.6 subscription style
	3. Background slider CSS style
	5. Theme changes style
	6. Responsive style
		
		
---------------------------------------------------------------------------------
/* 1. CSS Reset
-------------------------------------------------------------------------------*/

* {
	padding:0;
	margin:0;
}
body {
	color:#fff;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 300;
	position:relative;
	background:#000;
	width:100%;
	height:100%;
	overflow: scroll;
	overflow-x: hidden;
}
a {
	text-decoration:none;
	color:#fff;
	outline:none;
}
h1 {
	font-size:36px;
	margin-bottom:20px;
}
h3 {
	font-size:18px;
	margin-bottom:20px;
}
p {
	font-size:14px;
	line-height:21px;
	color:#fff;
	margin-bottom:20px;
}
/*----------------------------------------------------
 2.	Document Setup
------------------------------------------------------*/
#header {
	height:125px;
	background: rgba(255, 70, 41, 0.8);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);
	zoom: 1;
}
#header h3 {
	float:left;
	width:377px;
	height:108px;
	font-family: 'Roboto Slab', serif;
	text-align:center;
	font-size:42px;
	padding-top:17px;
	margin:0;
	background: rgba(28, 23, 30, 0.86);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);
	zoom: 1;
}
#header h3 span {
	display:block;
	font-size:18px;
	text-transform:uppercase;
	font-weight:normal;
}
#footer {
	height:37px;
	background:#1c171e;
	position: fixed;
	bottom:0;
	left:0;
	width:100%;
	color:#5f5c61;
	text-align:center;
	line-height:37px;
	font-size:12px;
}
/* 2.1 body contaner style */
#wrapper {
	width:940px;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	transition-duration: 1s;
	-webkit-transition-duration: 1s;
}
a.close {
	width:52px;
	height:52px;
	/*background:#ff4629;*/
	color:#fff;
	line-height:52px;
	text-align:center;
	text-decoration:none;
	display:block;
	float:right;
	outline:none;
	font-size:35px;
	font-weight:normal;
	text-align:center;
	padding-right:0;
	font-family: 'Average Sans', sans-serif;
	font-weight: normal;
	position:absolute;
	right:0px;
	background: rgba(255, 70, 41, 0.8);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);
	zoom: 1;
}
#cont {
	/*background:#ff4629;*/
	color:#fff;
	padding:20px;
	padding-top:52px;
	padding-bottom:0;
	clear:both;
	margin-top:0px;
	font-family: 'Roboto Slab', serif;
	background: rgba(255, 70, 41, 0.8);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);
	zoom: 1;
}
.close:before {
	content:"+";
}
.open:before {
	content:"-";
}
.close.open {
	width:925px;
	float:none;
	text-align:right;
	padding-right:15px;
	background:none;
}
.upbox {
	transform: translate(0px, -200px);
	-ms-transform: translate(0px, -200px); /* IE 9 */
	-webkit-transform: translate(0px, -200px); /* Safari and Chrome */
	transition-duration: 1s;
	-webkit-transition-duration: 1s;
}
.none {
	display:none;
}
.block {
	display:block;
}
.container {
	overflow:hidden;
	position:relative;
}
.slides {
	position:absolute;
	top:0;
	left:0;
	list-style:none;
	padding:0;
	margin:0;
}
.slides li {
	position:absolute;
	top:0;
	width:920px;
	display:none;
	padding:0px;
	margin:0;
}
.slides li .inner {
	padding:40px;
	padding-top:0;
}
#loopedSlider, #newsSlider {
	margin:0 auto;
	position:relative;
	clear:both;
	height:300px;
}
#loopedSlider .container {
	overflow:visible;
}
.slides li {
	padding-bottom:0;
}
a.previous, a.next {
	position:absolute;
	top:100px;
	font-size:55px;
	font-family: 'Clicker Script', cursive;
	color:#fff;
	z-index:9999;
}
a.previous {
	left:-15px;
}
a.next {
	right:-15px;
}
/* 2.2 Countdown style */
#countdown {
	padding:0;
	position:relative;
	margin-left:377px;
}
.hasCountdown {
}
.item {
	display: inline-block;
	text-align:center;
	margin:0 15px;
	padding:0;
	text-transform:uppercase;
	font-size:14px;
	line-height:45px;
	width:100px;
	height:auto;
	font-family: 'Roboto Slab', serif;
	transition: background 1s;
	-webkit-transition: background 1s;
	-moz-transition: background 1s;
	-o-transition: background 1s;
}
.item span {
	clear:both;
	color:#fff;
	display:inline-block;
	text-transform:lowercase;
	padding:0;
}
.item p {
	text-align:center;
	margin:40px 0 0;
	font-size:48px;
	padding:0;
	font-weight:bold;
}
/* 2.3 social style */
.socialWrap {
	width:526px;
	margin:0 auto;
	text-align:center;
}
.socialWrap a {
	display:inline-block;
	width:58px;
	height:58px;
	font-size:0;
	text-indent:-10000px;
	margin:0 20px 0 0;
	background:url(../images/social.png) 0 0 no-repeat;
	/* Fallback for web browsers that don't support RGBa */
    background-color: rgb(255, 255, 255);
	/* RGBa with 0.6 opacity */
    background-color: rgba(255, 255, 255, 0.3);
	/* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	transition: background 0.5s;
	-webkit-transition: background 0.5s;
	-moz-transition: background 0.5s;
	-o-transition: background 0.5s;
}
.socialWrap a.last {
	margin-right:0;
}
.socialWrap a:hover {
	background-position:0 100%;
}
.socialWrap a.fb {
	background-position:-58px 0;
}
.socialWrap a.fb:hover {
	background-position:-58px 100%;
}
.socialWrap a.gp {
	background-position:-116px 0;
}
.socialWrap a.gp:hover {
	background-position:-116px 100%;
}
.socialWrap a.pin {
	background-position:-174px 0;
}
.socialWrap a.pin:hover {
	background-position:-174px 100%;
}
.socialWrap a.glb {
	background-position:-232px 0;
}
.socialWrap a.glb:hover {
	background-position:-232px 100%;
}
.socialWrap a.a {
	background-position:-290px 0;
}
.socialWrap a.a:hover {
	background-position:-290px 100%;
}
.socialWrap a.in {
	background-position:-348px 0;
}
.socialWrap a.in:hover {
	background-position:-348px 100%;
}
/* 2.4 contact us style */
#contactdiv {
	width:790px;
	margin:0 auto;
}
#contactdiv input {
	width:355px;
	height:36px;
	background:#fff;
	font-size:16px;
	line-height:27px;
	color:#c5c3c5;
	font-style:italic;
	padding:10px 16px;
	margin:0 11px 18px 0;
	border:none;
	font-family: 'Roboto Slab', serif;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}
#contactdiv textarea {
	width:357px;
	height:96px;
	background:#fff;
	font-size:16px;
	line-height:18px;
	color:#c5c3c5;
	padding:15px;
	margin-right:0;
	margin-bottom:10px;
	float:none;
	border:none;
	font-family: 'Roboto Slab', serif;
	font-style:italic;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}
#contactdiv input.btn {
	width:175px;
	height:57px;
	padding:0;
	margin:0 auto;
	display:block;
	background:#1c171e;
	float:none;
	cursor:pointer;
	font-size:18px;
	color:#fff;
	font-weight:bold;
	opacity: 1;
 transition: opacity .25s ease-in-out;
 -moz-transition: opacity .25s ease-in-out;
 -webkit-transition: opacity .25s ease-in-out;
	font-style:normal;
}
#contactdiv input.btn:hover {
	opacity: 0.8;
}
.error_message {
	color:#000;
	padding-bottom:10px;
	font-size:12px;
}
#success_page {
	color:#9ce726;
	padding-bottom:10px;
	font-size:12px;
}
/* 2.5 About us style */
#about {
	width:800px;
	margin:0 auto;
}
/* 2.6 subscription style */
#subscription {
	width:737px;
	margin:0 auto;
	text-align:center;
}
#subscription input#subemail {
	float:left;
	width:517px;
	height:36px;
	background:#fff;
	font-size:16px;
	line-height:27px;
	color:#c5c3c5;
	font-style:italic;
	padding:10px 16px;
	margin:0 10px 0 0;
	border:none;
	font-family: 'Roboto Slab', serif;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}
#subscription input.btn2 {
	width:175px;
	height:57px;
	padding:0;
	margin:0 auto;
	display:block;
	background:#1c171e;
	float:none;
	cursor:pointer;
	font-size:18px;
	color:#fff;
	font-weight:bold;
	opacity: 1;
 transition: opacity .25s ease-in-out;
 -moz-transition: opacity .25s ease-in-out;
 -webkit-transition: opacity .25s ease-in-out;
	font-style:normal;
	border:none;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}
#subscription input.btn2:hover {
	opacity: 0.8;
}
/*---------------------------------------------------------------------------------
 3. Background slider CSS style
-------------------------------------------------------------------------------*/
.ri-grid {
	margin:0px auto;
	position: relative;
	height: auto;
}
.ri-grid ul {
	list-style: none;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
}
.ri-grid ul:before, .ri-grid ul:after {
	content: '';
	display: table;
}
.ri-grid ul:after {
	clear: both;
}
.ri-grid ul {
	zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
.ri-grid ul li {
	-webkit-perspective: 400px;
	-moz-perspective: 400px;
	-o-perspective: 400px;
	-ms-perspective: 400px;
	perspective: 400px;
	margin: 0;
	padding: 0;
	float: left;
	position: relative;
	display: block;
	overflow: hidden;
	background: #000;
}
.ri-grid ul li a {
	display: block;
	outline: none;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	background-size: 100% 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #333;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
/* Grid wrapper sizes */
.ri-grid-size-1 {
	width: 55%;
}
.ri-grid-size-2 {
	width: 100%;
}
.ri-grid-size-3 {
	width: 100%;
	margin-top: 0px;
}
/* Shadow style */
.ri-shadow:after, .ri-shadow:before {
	content: "";
	position: absolute;
	z-index: -2;
	bottom: 15px;
	left: 10px;
	width: 50%;
	height: 20%;
	max-width: 300px;
	max-height: 100px;
	box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
.ri-shadow:after {
	right: 10px;
	left: auto;
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	transform: rotate(3deg);
}
.ri-grid-loading:after, .ri-grid-loading:before {
	display: none;
}
.ri-loading-image {
	display: none;
}
.ri-grid-loading .ri-loading-image {
	position: relative;
	width: 30px;
	height: 30px;
	left: 50%;
	margin: 100px 0 0 -15px;
	display: block;
}

/*---------------------------------------------------------------------------------
 5. Theme changes style 
-------------------------------------------------------------------------------*/
.theme-changer-wrap {
	position:fixed;
	z-index:5000;
	top:100px;
	left:-154px;
}
.theme-changer {
	float: left;
	background:url(../images/container-bg.png) repeat scroll;
	text-transform:uppercase;
	font-weight:bold;
	font-size:12px;
	font-family:Helvetica, Arial;
	padding:15px 20px;
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
}
.changer-inner {
	overflow:hidden;
	width:114px;
}
.theme-changer-wrap a {
	float:left;
	display:block;
	margin-right:3px;
	margin-left:3px;
	margin-bottom:5px;
	width:32px;
	height:32px
}
a.light-skin {
	height:32px;
	width:51px;
	margin-bottom:5px;
	float:left;
	display:block;
	box-shadow: #b2b2b2 1px 1px 1px;
	margin-right:3px;
	margin-left:3px;
	background:#fff;
}
a.dark-skin {
	height:32px;
	width:51px;
	margin-bottom:5px;
	float:left;
	display:block;
	box-shadow: #b2b2b2 1px 1px 1px;
	margin-right:3px;
	margin-left:3px;
	background:#3f3f3f;
	opacity:1;
	z-index:1000;
}
a.color-themes {
	cursor:pointer;
}
a.col2 {
	background:#FF772F
}
a.col1 {
	background:#29C5FF
}
a.col3 {
	background:#F63180
}
a.col4 {
	background:#00B159
}
a.col5 {
	background:#FF4629
}
a.col6 {
	background:#B53CF0
}
.changer-inner span {
	display: block;
	margin-bottom:15px
}
.theme-changer-wrap a.pat {
	float:left;
}
.theme-changer-wrap a.pat#pat1 {
	background:url(../images/test/pattern1.jpg);
}
.theme-changer-wrap a.pat#pat2 {
	background:url(../images/test/pattern2.jpg);
}
.theme-changer-wrap a.pat#pat3 {
	background:url(../images/test/pattern3.jpg);
}
.theme-changer-wrap a.pat#pat4 {
	background:url(../images/test/pattern4.jpg);
}
.theme-changer-wrap a.pat#pat5 {
	background:url(../images/test/pattern5.jpg);
}
.theme-changer-wrap a.pat#pat6 {
	background:url(../images/test/pattern6.jpg);
}
div.open-close {
	position: relative;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	-moz-border-top-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	left:0;
	display: block;
	width:38px;
	height: 36px;
	float: left;
	cursor:pointer;
	background:url(../images/sett.png) #2e2e2e no-repeat 50% 50%;
	opacity:0.8;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
}
.cb-slideshow, .cb-slideshow:after {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
}
.cb-slideshow:after {
	content: '';
	background: transparent url(../images/pattern.png) repeat 0 0;
}
.pat1:after {
	content: '';
	background: transparent url(../images/patterns/pat1.png) repeat 0 0 !important;
}
.pat2:after {
	content: '';
	background: transparent url(../images/patterns/pat2.png) repeat 0 0 !important;
}
.pat3:after {
	content: '';
	background: transparent url(../images/patterns/pat3.png) repeat 0 0 !important;
}
.pat4:after {
	content: '';
	background: transparent url(../images/patterns/pat4.png) repeat 0 0 !important;
}
.pat5:after {
	content: '';
	background: transparent url(../images/patterns/pat5.png) repeat 0 0 !important;
}
.pat6:after {
	content: '';
	background: transparent url(../images/patterns/pat6.png) repeat 0 0 !important;
}

	
/*---------------------------------------------------------------------------------
 6. Responsive style
-------------------------------------------------------------------------------*/

@media screen and (max-width: 950px) {
	#wrapper{
		width:100%;
	}
	#header h3{
		width:37%;
	}
	#countdown{
		margin-left: 37%;
	}
	.item{
		width: 20%;
		margin:0 2%;
	}
	
	.slides,
	.slides li{
		width:100% !important;
	}
	
	.socialWrap{
		width:100%;
	}
	
	#contactdiv{
		width:100%;
	}
	#contactdiv textarea,
	#contactdiv input{
		width:86%;
		float:none !important;
		margin-right:0;
	}
	#contactdiv textarea{
		height: 63px;
		margin-bottom:10px;
	}
	#contactdiv input {
		height: 24px;
		margin-bottom:10px;
	}
	
	#about{
		width:100%;
	}
	
	#subscription{
		width:100%;
	}
	
	#subscription input#subemail{
		width: 89%;
		margin-bottom:10px;
		float:none;
	}
}

@media screen and (max-width: 810px) {
	body{
		min-height:700px;
	}
	#header h3{
		font-size: 38px;
	}
	#header h3 span{
		font-size: 16px;
	}
	
}

@media screen and (max-width: 768px) {
	#header{
		position: relative;
	}
	#header h3{
		position: absolute;
		top: -125px;
		width: 100%;
		float: none;
		display: block;
		font-size: 38px;
	}
	#header h3 span{
		font-size: 16px;
	}
	#countdown{
		margin-left: 0;
	}
	.item p{
		font-size: 40px;
	}
	.item{
		font-size: 13px;
	}
	
	#loopedSlider, #newsSlider{
		min-height: 500px;
		height: 100%;
	}
	ul.slides{
		min-height: 463px;
		height: 100%;
	}
}


@media screen and (max-width: 650px) {
	#wrapper{
		top: 200px !important;
	}
	.upbox{
		transform: translate(0px, -70px);
		-ms-transform: translate(0px, -70px); /* IE 9 */
		-webkit-transform: translate(0px, -70px); /* Safari and Chrome */
	}
}


@media screen and (max-width: 400px) {
	#loopedSlider, #newsSlider{
		min-height: 650px;
		height: 100%;
	}
	ul.slides{
		min-height: 600px;
		height: 100%;
	}
	
	.item{
		width: 19%;
	}
	.item p {
		font-size: 36px;
	}
}