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

*{margin:0;padding:0;transition:all 0.3s ease-in-out;}
html, body{height:100%;}
#main-wrap{height:100%;}
body{
	background-color:#0a0a0a;
	color:#ccc;
	font-family:'Open Sans', sans-serif;
	font-weight:300;
}
#bg-para{
	width:100%;
	height:200%;
	background-image:url(../images/bg.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	transition:none;
	}
#bg-paramob{
	display:none;
	width:100%;
	height:200%;
	background-image:url(../images/bg.jpg);
	background-repeat:no-repeat;
	transition:none;
}
@media (max-width:999px){#bg-para{height:100%;}}
@media (max-width:899px){#bg-para{display:none;} #bg-paramob{height:100%; background-position:top right; background-size:cover; background-attachment:local;display:block;}}
/*main-menu*/
#main-menu{
	width:425px;
	height:900px;
	background-color: rgba(93, 81, 161, 0.53);;
	margin-left:-280px;
	box-shadow: 0 0 40px 30px rgba(0, 0, 0, 0.78);
	position:absolute!important;
	z-index:2;
	top:0;
	}
#menu-stroke{
	width:2px;
	height:920px;
	background-color:#5d51a1;
	margin-left:144px;
	position:absolute;
	top:0;
	}
#main-menu:hover{margin-left:-220px; background-color:#5d51a1;}
#main-menu:hover + #menu-stroke{margin-left:204px;}	
.skew{
	transform: skew(-25deg);
	-webkit-transform: skew(-25deg);
	position:absolute;
	z-index:2;
	}
#main-menu ul{list-style:none;float:right;text-align:right;margin-top:30px;width:250px;}
#main-menu ul li{padding-right:15px;}
#main-menu ul li a{
	display:block;
	padding:1% 0;
	color:#fff;
	text-transform:uppercase;
	text-decoration:none;
	font-size:15pt;
	transition:all 0.3s ease-in-out;
	transform: skew(25deg);
	-webkit-transform: skew(25deg);
	}
#main-menu ul li:hover{
	background:#000;
	}
#main-menu ul li.active{background:#000; /*border-bottom:1px solid #5d51a1;*/}
#main-menu ul li.active > a{font-size:17pt;}
/*Responsive menu*/
#tog{width:100%;height:auto;overflow:hidden;margin:0 auto; display:none;}
#mob-logo{
	float:left;
	display:block;
	height:75px;
	width:119px;
	padding:10px 10%;	
	}
#mob-logo img{
	width:100%;
	}
#toggle-nav{
	display: block;
	width: 50px;
	height: 44px;
	margin-top: 20px;
	margin-right: 20px;
	background: #5d51a1;
	color:#fff;
	cursor: pointer;
	font-size: 26pt;
	float: right;
	text-align: center;
	padding-bottom: 7px;
}
#toggle-nav img{width:100%;}
@media (max-width:750px){
	#tog{display:block;}
	#main-menu{
		position:relative!important;
		box-shadow:none;
		width:100%;
		height:auto;
		overflow:hidden;
		background-color: #222;
		margin-left:0;
		z-index:2;
	}
	#main-menu:hover{margin-left:0; background-color:#222;}
	#main-menu ul{margin-top:0;width:100%;}
	#main-menu ul li{border-bottom:1px solid #333;border-top:1px solid #000;}
	#main-menu ul li.active{background:#5d51a1;}
	#main-menu ul li a{
		text-align:center;
		transform: none;
		-webkit-transform: none;
	}
	#menu-stroke{display:none;}
	.skew{transform:none;-webkit-transform:none;position:fixed;}
	}
@media (max-width:250px){
	#tog{background-color:#333;}
	#mob-logo{width:98%; float:none; margin:0 1%; padding:0; height:auto;}
	#toggle-nav{float:left; margin:0;}
	#first a{background-color:#5d51a1!important;}
	}
/*content*/
#first{
	max-width:505px;
	width: 36%;
	height: 500px;
	position: absolute;
	left: 0;
	z-index: 1;
	right: 0;
	margin-right: auto;
	margin-left: auto;
	top: 30%;
	text-align:center;
	}
	#first img{width:100%;}
	#first a{
		background-color:rgba(255, 255, 255, 0);
		display:inline-block;
		padding:10px 15px;
		border-radius:3px;
		border:2px solid #fff;
		text-decoration:none;
		color:#fff;
		margin-top:20px;
		}
	#first a:hover{
		background-color:#fff;
		color:#5d51a1;
		}
#cnt-wrap{width:100%;/*background-color:#0a0a0a;*/height:auto;min-height:100%;overflow:hidden;position:absolute;z-index:1;top:100%;background-image:url(../images/cnt-bg.jpg);background-repeat:repeat-x;background-position:top center;}
@media (max-width:999px){#cnt-wrap{top:0!important; position:relative;}}
@media (max-height:500px){
	#first{position:relative; margin-top:-500px;}
	#bg-para{height:500px;}
	#cnt-wrap{position:relative; top:0;}
}
.layout-showcase {
	/*background-image:url(../images/slide-bg.jpg);*/
	background-size:cover;
	background-repeat:no-repeat;
	padding:5% 0;
}
.sprocket-features-container{overflow:hidden;width:90%;margin:0 auto;}
.sprocket-features-img-container{float:right!important;}
.sprocket-features-img-container a img{width:96%!important;border-radius:100%!important;}
.sprocket-features-content{padding-top:5%!important;}
.sprocket-features-title{
	font-weight: 300!important;
	font-size: 30pt!important;
	background-image:url(../images/h2-bg.jpg!important);
	background-repeat:no-repeat!important;
	background-position:bottom left!important;
	padding-bottom:15px!important;
	margin-bottom:30px!important;
	}
.sprocket-features-title a{color:#eee!important;text-decoration:none!important;}
.sprocket-features-desc > .readon{display:block!important; text-decoration:none!important; color:#fff!important; margin-top:25px!important; font-size:10pt!important;}
.sprocket-features-desc > .readon span{display:inline-block!important; padding:3px 6px!important; border:1px solid #fff!important;}
.sprocket-features-desc > .readon span:hover{color:#5d51a1!important; background-color:#fff!important;}
.layout-showcase .sprocket-features-arrows .arrow {
	width: 78px!important;
	height: 74px!important;
	top: 40%!important;
}
.layout-showcase .sprocket-features-arrows .next {background:url(../images/slider-arrow-right.png)!important;background-color:none!important;box-shadow:none!important;}
.layout-showcase .sprocket-features-arrows .prev {background:url(../images/slider-arrow-left.png)!important;background-color:none!important;box-shadow:none!important;}
.layout-showcase .sprocket-features-pagination li, .layout-showcase .sprocket-features-arrows .arrow span{display:none!important;}
@media (max-width:750px){
	#cnt-wrap{padding-bottom:50px!important;}
	.layout-showcase .sprocket-features-list li{text-align:center!important;}
	.sprocket-features-img-container{width:100%!important; text-align:center!important;}
	.sprocket-features.arrows-onhover .sprocket-features-arrows .arrow{opacity:1!important;}
	.sprocket-features-img-container a img{max-width:375px!important; width:96%!important;border-radius:100%!important;float:none!important;margin:0 auto!important;}
	.sprocket-features-arrows{top: 92%!important;position:absolute!important;width:100%!important;height:80px!important;}
	.sprocket-features-title{font-size: 20pt!important; margin-top:20px!important;display: inline-block!important;background-position: bottom center!important;}
	.layout-showcase .sprocket-features-arrows .next {background:url(../images/slider-arrow-right.png)!important;background-color:none!important;box-shadow:none!important;}
.layout-showcase .sprocket-features-arrows .prev {background:url(../images/slider-arrow-left.png)!important;background-color:none!important;box-shadow:none!important;}
	}

#ftr{
	padding:20px 5%; width:90%; background-image:url(../images/ftr-bg.png); overflow:hidden;
	-moz-box-shadow: inset 0 0 100px #000;
	-webkit-box-shadow: inset 0 0 100px #000;
	box-shadow: inset 0 0 100px #000;
	}
#inf{
	width:350px;
	float:left;
	}
#inf h3{margin:5px 0;}
#inf > div > p:nth-child(2){margin-bottom:10px;}
#optime{font-size:10pt;}
#social{
	width:auto;
	float:right;
	padding-top:3%;
	}
#copyright{text-align:center; padding:10px; font-size:10pt;}
#copyright a{color:#ccc; text-decoration:none;}
@media (max-width:500px){
	#inf{width:90%; margin:5px 5%; text-align:center;}
	#social{padding:0; width:90%; text-align:center; margin:5px 5%;}
	}