@charset "utf-8";
/* Supepakworld web style written by atif riaz mughal at paras system grw*/

body
{
	background-color: #fff;
	font-family: Arial, Helvetica, Verdana;
	font-size: 14px;
	line-height: 22px;
	color: #666;
	position: relative;
	-webkit-text-size-adjust: none;
}
body *
{
	text-shadow: none;
}
h1, h2, h3, h4, h5, h6{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	line-height: 1;
	margin: 20px 0 10px 0;
	color:rgba(255,90,0,1);
}
h1, h2, h3
{
	font-size: 20px;
}
h4, h5, h6
{
	font-size: 16px;
}
p{
	font-size:12px;
	text-align:justify;
	}
a{
	transition:all ease-in-out .2s;
	}

.left_side{
	position:fixed;
	background:rgba(15,22,35,1);
	width:22%;
	height:100%;
	left:0;
	transition:all ease-in-out .3s;
	-webkit-transition:all ease-in-out .3s;
	-moz-transition:all ease-in-out .3s;
	-ms-transition:all ease-in-out .3s;
	-o-transition:all ease-in-out .3s;
	}
.page{
	width:78%;
	overflow-y:scroll;
	position:fixed;
	height:100%;
	right:0;
	overflow-x:hidden;

	}
.header, .contents, .footer{
	width:100%;
	}
.header, .footer{
	background:rgba(0,153,255,1);
	position:relative;
	display:inline-block;
	padding:3px 0;
	}
.contents{
	width:100%;
	display:inline-block;
	}
.logo{
	
	}
.logo img{
	width:100%;
	padding:0 50px;
	}
.main_menu{
	width: 100%;
	margin-top: 15px;
	position:relative;
	overflow-x: hidden;
	}
::-webkit-scrollbar {  
    width: 10px;
}  
::-webkit-scrollbar-track {  
    background-color: rgba(40,50,60,1);  
    border-left: 0;  
}  
::-webkit-scrollbar-thumb {  
    background-color: rgba(100,120,135,1);
	border-radius:0px;
	cursor:pointer;

}
::-webkit-scrollbar-thumb:hover {  
    background-color: rgba(150,160,170,1);  
} 

.main_nav, ul{
	width:100%;
	list-style:none;
	padding:0;
	height:auto;
	}
.main_nav li{
	width:100%;
	padding:0;
	}
.main_nav li a{
	text-align:left;
	color:rgba(161, 167, 174,1);
	letter-spacing:1px;
	padding:5px 10px 5px 20px;
	display:inline-block;
	width:100%;
	border-bottom: 1px solid rgb(2, 8, 16);
	border-top: 1px solid rgb(27, 35, 48);
	}
.main_nav li:first-child a{border-top:none}
.main_nav li:last-child a{border-bottom:none}

.main_nav li a i{margin:0px 15px 0 0; font-size:18px; color:rgba(35,45,60,1)}
.main_nav li a:hover{background:rgba(35,45,60,1);text-decoration:none;
	text-shadow:1px 1px 1px #000;
	}
.main_nav li a:hover i{color:#fff}
.followby{
	padding:5px 10px;
	margin-top:5px;
	margin-bottom:10px;
	width:100%;
	display:none;
	}
.followby form{width:100%; display:inline-block;}
.followby input[type="email"]{
	width:100%;
	padding:2px 5px;
	margin:2px 0 5px 0;
	border:0;
	background:rgba(45,55,60,1);
	color:#000;
	}
.followby button{
	display:block;
	padding:2px 5px;
	float:right;
	border:0;
	background:rgba(45,55,60,1);
	color:#fff;
	text-shadow:1px 1px 1px #000;
	}
.HeaderBorder{
	border-bottom:1px dashed #fff;
	display:inline-block;
	width:100%;
	padding:20px 20px 10px 20px;
	}
.HeaderLeft{
	width:100%;
	float:left;
	}
.HeaderRight{
	width: auto;
	float: right;
	padding: 5px 15px;
	background-color:rgb(202, 96, 231);
	border-radius: 5px;
	box-shadow: 1px 1px 1px rgb(119, 119, 119);
	}
.HeaderLeft img{
	width:100%;
	}
.HeaderLeft img.mainlogo, img.medium{
	width:100%;
	display:none;
	}

.HeaderRight h2{
	color:rgba(153,51,0,1);
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	margin:0 0 0 0; padding:0;
	text-align:right;
	}
.HeaderRight h2 span{
	font-size:33px;
	color:rgba(15,22,35,1);
	text-shadow:1px 1px 3px #fff;
	}
.HeaderRight{
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
	}

.one {background-color: rgba(255,255,0,1);}
.two {background-color: rgb(85, 237, 11);}
.three {background-color: rgb(202, 96, 231);}
.ContentsHolder{
	display:inline-block;
	position:relative;
	width:100%;
	}
.banner{
	width:100% !important;
	display:inline-block;
	position:relative;
	height:auto;
	box-shadow:1px 1px 3px #333;
	}
.banner img{
	position:absolute;
	height:auto;
	width:100%;
	display:inline-block;
	border-radius:0;
	margin:0; padding:0;
	}
.next{ z-index:5; opacity:0;}
.current{ z-index:3;}
.footer{
	margin-top:20px;
	padding:20px;
	}
.footer_menu, .SubscribeUs{
	width:40%;
	display:inline-block;
	float:left;
	margin-bottom:5px;
	}
.FooterSocial{
	width:20%;
	display:inline-block;
	float:left;
	margin-bottom:5px;
	}
.footer_menu,.FooterSocial{ padding-top:10px;}
.footer_menu ul li{
	float:left;
	margin-right:5px;
	color:#fff;
	}
.footer_menu ul li a{
	color:#fff;
	margin-right:5px
	}
.footer_menu ul li a:hover{
	color:rgba(15,22,35,1);
	}
.SubscribeUs form{
	width:90%;
	float:right;
	display:inline-block;
	padding:5px;
	background:#fff;
	}
.SubscribeUs form input{
	width:75%;
	float:left;
	border:0;
	height:25px;
	padding:3px;
	font-size:12px;
	}
.SubscribeUs form input:focus, .SubscribeUs form input:enabled{
	border:0;
	box-shadow:none;
	}
.SubscribeUs form button{
	width:25%;
	float:left;
	background:rgba(15,22,35,1);
	border:none;
	height:25px;
	color:#fff;
	text-align:center;
	font-size:12px;
	}
.CenterAlign{
	margin:0 auto;
	display:table;
	}
.FooterSocial a{margin-right:10px;color:#fff}
.FooterSocial a:hover{color:rgba(15,22,35,1)}
.FooterSocial a i{
	font-size:18px
	}

.CostumHeading{
	margin-bottom: 30px;
	background-color: rgb(255, 90, 0);
	padding: 10px;
	color: rgb(255, 255, 255);
	}

.IndexAbout h1, .IndexAbout p{
	text-align:center;
	}
.button{
	display:table;
	padding:5px 10px;
	background:rgba(0,150,255,1);
	color:#fff;
	margin:0 auto;
	text-shadow:1px 1px 1px #333;
	}
.button:hover{
	background:rgba(0,102,255,1);
	text-decoration:none;
	color:#fff;
	}
.IndexServices{
	
	}
.services{
	width:100%;
	margin-top:50px;
	margin-bottom:50px;
	}
.services span{
	width: auto;
	display: table;
	font-size: 40px;
	text-align: center;
	/* background: rgb(0, 150, 255); */
	padding: 30px;
	color: rgb(255, 90, 0);
	margin: 0 auto;
	border-radius: 100%;
	border: 2px solid rgb(255, 90, 0);
	}
.services h3, .services p{
	text-align:center;
	}
.aboutus, .marginBT{
	margin-top:50px; margin-bottom:50px;
	}
.aboutus p.Pside{
	
	}
.dealin{
	width:100%;
	display:inline-block;
	float:right;
	border:1px solid rgba(255,90,0,1);
	padding:0;
	margin-left:3%;
	}
.dealin h3{
	background:rgba(255,90,0,1);
	color:#fff;
	margin:0;padding:5px;
	}
.dealin p{
	margin:0;padding:5px 10px;
	}
.dealin p i{
	margin:0 5px 0 0;
	color:rgba(255,90,0,1);
	}


.list_carousel {
	margin: 0;
	width: 100%;
	}
.caroufredsel_wrapper{
	width: ;
	margin: 0px !important;
	cursor: pointer !important;
	}
.list_carousel ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	}
.list_carousel li {
	padding: 0;
	margin: 6px;
	display: block;
	float: left;
	}
.Team{
padding: 15px 0;
margin: 10px 0;
background: rgb(15, 22, 35);
}
.TeamItem{margin-bottom:10px;}
.TeamItem img{}
.TeamItem h3{margin: 5px 0;}
.TeamItem h4{margin: 0 0 5px 0;}
.TeamItem p{font-size: 12px;color:rgb(161, 167, 174);line-height: 1.5;}
.TeamSocial{}
.TeamSocial a{margin-right: 10px;}
.TeamSocial a:hover i{color:rgba(255,90,0,1);}
.TeamSocial a i{font-size: 18px; color: rgb(255, 255, 255);}
.pager{
	margin:0;
	}
.pager a{
	width: 22px;
	display: inline-block;
	background: rgb(15, 22, 35);
	margin-right: 5px;
	color:#fff;
	}
.pager a:hover, .pager a:visited{
	text-decoration:none;
	}
.pager a.selected{
	background: rgb(0, 153, 255);
	color: rgb(51, 51, 51);
	}
.List{padding:10px 25px}
.List li{margin-bottom:5px; display:table;width:100%;}
.List li i{width:5%; float:left; margin:2px 0 0 0; font-size:18px;color: rgb(255, 90, 0);}
.List li p{width:95%; float:right; margin:0; padding:0;}


.list-group-item i{margin-right:10px; margin-top:5px;color:rgba(255,90,0,1); float:left;}
.list-group-item span{margin-left:10px; float:right;}

.LinkBox{width: 100%;}
.LinkBox a{
display: inline-block;
padding: 20px;
text-align: center;
text-decoration:none !important;
}
.LinkBox a Img{
width: 100%;
}
.LinkBox a h2, .LinkBox a p, .LinkBox a:hover{
text-align:center;
text-decoration:none !important;
}
.RequirementBox{
	display: inline-block;
	width: 100%;
	border: 1px solid rgb(15, 22, 35);
	}
.RequirementBox .list-group{padding:10px;}
.BoxHeading {
	width: 100%;
	display: inline-block;
	padding: 10px;
	background: rgb(35, 45, 60);
	margin-bottom: 5px;
	color: rgb(255, 255, 255);
	font-size: 15px;
	letter-spacing: 1px;
	}
.marginTop{margin-top:15px}
.col-xs-2 i{
	text-align: center;
	display: block;
	font-size: 18px;
	color: rgb(100, 120, 135);
	}
.form-control {
	height: auto;
	padding: 5px 10px;
	font-size: 12px;
	color: rgb(35, 45, 60);
	background-color: rgb(255, 255, 255);
	border: 1px solid rgb(100, 120, 135);
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	}
label {
	font-size: 13px;
	font-weight:normal;
	color: rgb(15, 22, 35);
	}
button.btn-default{
	border-radius:0;
	border:none;
	padding: 5px 10px;
	background: rgb(0, 150, 255);
	color: rgb(255, 255, 255);
	margin: 0 auto;
	text-shadow: 1px 1px 1px rgb(51, 51, 51);
	}
button.btn-default:hover {
	background: rgb(0, 102, 255);
	text-decoration: none;
	color: rgb(255, 255, 255);
	}
.menubtn{
	width:40px;
	height:40px;
	position:absolute;
	top:15px;
	right:20px;
	z-index:900000000;
	cursor:pointer;
	display:none
	}
.menubtn i{
	font-size:25px;
	text-align:center;
	background:rgb(15,22,35);
	padding:10px;
	color:rgb(0, 153, 255);
	}
.showmenu{
	margin-left:0 !important;
	}
@media (max-width: 1100px) {
	
	.showmenu{
	margin-left:0 !important;
	}
	.left_side{
		z-index:1000000;
		width:270px;
		margin-left:-270px;
		}
	.page{
		width:100%;
		}
	.menubtn{display:block;}
	.logo{display:none;width:0; height:0;}
	.HeaderLeft{
		width:100%;
		}
	.HeaderLeft img.main{
	display:none;
	}
	.HeaderLeft img.mainlogo{
		width:100%;
		display:inline-block;
		}
	}
@media (min-width: 768px) {
	.TeamItem img {
	width: 100%;
	}
	}
@media (max-width: 768px) {
	.pager{margin-top:20px;}
	.HeaderLeft img.mainlogo{display:none}
	.HeaderLeft img.medium{display:inline-block;width:100%;}
	.footer_menu, .FooterSocial, .SubscribeUs{
		width:100%;
		float:none;
		margin-bottom:10px;
		}
	.footer_menu ul{
		display: table;
		margin: 0 auto;
		width: auto;
		height: 20px;
		}
	.SubscribeUs form {
	width: 90%;
	float: none;
	display: table;
	margin: 10px auto;
	}
}