html, body{
font-size: 100%;
background:	#fff;
font-family: 'Lato', sans-serif;}

body a{
transition: 0.5s all ease;
-webkit-transition: 0.5s all ease;
-moz-transition: 0.5s all ease;
-o-transition: 0.5s all ease;
-ms-transition: 0.5s all ease;}

h1,h2,h3,h4,h5,h6{margin:0;	}
p{margin:0;}

ul,label{
margin:0;
padding:0;}

body a:hover{text-decoration:none;}
/*-- Header Part Starts Here --*/


.header { 
height:314px;
padding: 40px 0 0 0;}

.logo { margin:0 45px 0 80px; float: left;}
.logo a {display: block;}


.navigation {float: left;}


ul.navig {
padding: 0;
margin-top: 22px;}

ul.navig li span {
color: #fff;
margin: 0 15px;
font-size: 16px;}

ul.navig li {
display: inline-block;
margin: 0 2px;
position: relative;}

ul.navig li a {
font-size: 12px;
color:#ffffff;
font-weight: 700;
text-decoration: none;
padding:0px; 
margin:0 14px;}

ul.navig li a:hover,ul.navig li a.active{color: #00b2b2}

ul.navig li a:hover ul.navig li a:after{
	display: block;
}
ul.navig li a:after{
	width:15px;
	height:15px;
	background:red;
	display: none;
	content:"";
	position:absolute;
	top:0;
}
.head_grid{
	text-align:center;
	width: 26.3%;
}
.head_grid_center{
	margin: 0 7em;
}
.grid_ba{
	width:100%;
	background:#dfdfdf;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius:50%;
	-o-border-radius:50%;
	text-align:center;
	padding: 5em 1em;
	margin:0 auto;
}
.grid_ba p{
	margin:1em 0 0 0;
	font-size:1em;
	font-weight:600;
	color: #4c4a5a;
}
.stars {
	margin: 7em 0 2em 0;
	text-align: center;
	position: relative;
}
.stars:before {
	content: "";
	background: rgba(88, 86, 104, 0.33);
	height: 1px;
	width: 35%;
	position: absolute;
	top: 59%;
	left: 9%;
}
.stars:after {
	content: "";
	background: rgba(88, 86, 104, 0.33);
	height: 1px;
	width: 35%;
	position: absolute;
	top: 59%;
	right: 9%;
}




.title { width:100%; text-align:center; padding:76px; float: left;}
.title p{ font-size:40px; font-weight:300; color:#FFF}




@media (max-width: 768px){
span.menu:before {
content: url(../images/nav-icon.png);
cursor: pointer;	
height:32px;}

ul.navig li.plan:hover ul.sub-nav{display:none;}

.head {
margin: 0 auto;
position: absolute;
width: 100%;
left: 0;}

ul.navig {
width: 11%;
float: right;
margin:0;}

ul.navig{display:none;}

ul.navig li {
font-size: 12px; 
display:inline-block;
width: 100%;
margin:0;}

ul.navig li a {
padding: 10px 0px;
font-size: 16px;
width: 100%;
font-weight: 400;
display: block;
color: rgba(255, 255, 255, 0.69);
color:#000 !important;}


ul.navig li a:hover{color:#06C !important;}

span.menu {
display: block;
float: right;
margin: 10px 7px 0 0;}

ul.navig {
margin: 0;
z-index: 999;
position: absolute;
width: 96%;
text-align: center;
top: 71%;
left: 2%;
background: rgba(255, 255, 255, 0.97);}

.navigation {
height: 60px;
padding: 0px 16px 0em;
margin-bottom: 0em;}

ul.navig li:nth-of-type(4) {margin: 0 0px 0 0em;}
ul.navig li:nth-of-type(3) {margin: 0 0em 0 0px;}
}
/*--Header-Part-Ends-Here --*/



/*--banner-Part-starts-Here --*/
.banner {padding:10px 0 65px 0;}

.banner-main { text-align:center}

.banner-main h1 {
font-weight: 300;
font-size: 40px;
color: #fff;
margin: 0;}

.banner-main h2 {
font-weight: 700; 
font-size:40px;
color: #c6c6c6;
margin: 5px 0 0 0;}



.b-btn {margin:80px 0 120px 0;}

.b-btn ul{padding:0;}
.b-btn ul li{
list-style:none;
display:inline-block;}

.b-btn ul li a.contact {
font-size: 14px;
color: #ffffff;
font-weight: 700;
padding: 12px 35px;
background: #00b2b2;
border-radius:20px;
margin:0 7px 2px 7px}

.b-btn ul li a.contact:hover{background: #000000;}

.b-btn ul li a.work {
font-size: 14px;
color: #fff;
font-weight: 700;
padding:12px 25px;
border: 1px solid #fff;
border-radius:20px; 
margin:0 7px 2px 7px}

.b-btn ul li a.work:hover{color:#00b2b2; border: 1px solid #00b2b2;}


.banner-main a.br { text-align:center}


/*--banner-Part-Ends-Here --*/




/*--client-Part-starts-Here --*/
.client{
padding:80px 0px;
background:#000000;}

.client-main { text-align:center}

.client-main .box { 
width:46%; 
margin:0 2%; 
text-align:center; 
float:left}

.client-main .box h1{ font-size:20px; font-weight:300; color:#ffffff; margin:0 0 25px 0;}
.client-main .box p{ font-size:12px; font-weight:300; color:#ffffff; line-height:21px; text-align:justify;}


.client-main p{ font-size:22px; font-weight:300; color:#FFF; line-height:40px; text-align: left}

.client-main .box1 { 
width:30%; 
margin:40px 1.5% 0 1.5%; 
text-align:center; 
float:left}

.client-main .box1 p{ font-size:22px; font-weight:300; color:#ffffff; text-align:center; }



/*--client-Part-Ends-Here --*/





/*--lorem-Part-starts-Here --*/
.lorem{ padding:80px 0; background:url(../images/lorem-banner.jpg) no-repeat;}

.lorem-top{ text-align:center}

.lorem-top p{
color:#fff;
font-size:25px;
font-weight:300; 
line-height:38px;
margin:0;}



/*--lorem-Part-Ends-Here --*/





/*--footer-Part-starts-Here --*/
.footer {
background: #000000;
padding:77px 0px;}



.footer-left{
width:55%; padding:0 5% 0 0; 
text-align:left; 
float:left;}

.footer-left p{ margin:10px 0 0 0; font-size:14px; font-weight:300; color:#FFF; line-height:28px}




.footer-text{
width:20%;
float:left;}

.footer-text h1{
color:#ffffff;
font-weight:700;
font-size:14px;}

.footer-text ul{
padding:0;
margin-top:6px;}

.footer-text ul li{
list-style:none;
display:block;}

.footer-text ul li a{
color:#ffffff;
font-weight:300;
font-size:12px;}


.footer-text ul li a:hover{color:#00b2b2}

.footer-text p{ 
margin-top:6px;
color:#ffffff;
font-weight:300;
font-size:12px; 
line-height:22px;}


.footer-text a{ 
color:#ffffff;
font-weight:300;
font-size:12px; 
line-height:22px;}

.footer-text a:hover{color:#00b2b2}



/*--footer-Part-Ends-Here --*/









/*--contact-Part-Ends-Here --*/
#toTop {
	display: none;
	text-decoration: none;
	position: fixed;
	bottom: 10px;
	right: 10px;
	overflow: hidden;
	width: 32px;
	height: 32px;
	border: none;
	text-indent: 100%;
	background: url(../images/top-arrow.png) no-repeat;
}
/*--media-quaries-starts-here--*/


@media (max-width:1440px){}
@media (max-width:1366px){}
@media (max-width:1280px){}
@media (max-width:1024px){}

@media (max-width:768px){ }

@media (max-width:640px){

.header {height:270px;}

.title p{ font-size:35px; font-weight:300; color:#FFF}

.client-main p{ font-size:20px; line-height:36px; padding:0 2%}


.banner-main h1 {font-size: 30px;}
.banner-main h2 {font-size:30px;}

.lorem-top p{font-size:22px; line-height:30px;}

}

@media (max-width:480px){
	
.header {height:300px;	}
.logo { width:100%; text-align:center;  margin:0 0 10px 0; float: left;}
.logo img { width:50%}
.navigation { width:100%; text-align:center; float:none;}
span.menu {display: block; float:none; margin:0px 0 0 0;}

.title p{ font-size:29px; font-weight:300; color:#FFF}

.banner-main h1 {font-size: 26px;}
.banner-main h2 {font-size:26px;}
.b-btn {margin:80px 0 30px 0;}
.b-btn ul li a.contact {margin:0 7px 25px 7px; float:left}
.b-btn ul li a.work {margin:0 7px 2px 7px; float:left}


.client{padding:40px 0px;}
.client-main .box { width:96%; margin:0 2% 10% 2%; }
.client-main p{ font-size:18px; line-height:30px; padding:0 2%}

.lorem{ padding:60px 0; background:url(../images/lorem-banner.jpg) no-repeat;}

.lorem-top p{font-size:18px; line-height:23px;}


.footer-left{width:100%; padding:0 0 10% 0; text-align: center; }
.footer-text{width:40%; margin:0 0 0 10%;}

.client-main .box1 { width:97%; margin:40px 1.5% 0 1.5%; }
	

}

@media (max-width:320px){
	
	
.header {height:270px;}
.logo { width:100%; text-align:center;  margin:0 0 10px 0; float: left;}
.logo img { width:70%}
.navigation { width:100%; text-align:center; float:none;}
span.menu {display: block; float:none; margin:0px 0 0 0;}


.title p{ font-size:24px; font-weight:300; color:#FFF}


.banner-main h1 {font-size: 22px;}
.banner-main h2 {font-size:22px;}
.b-btn ul li a.contact {margin:0 7px 25px 7px; float:left}
.b-btn ul li a.work {margin:0 7px 2px 7px; float:left}


.client{padding:40px 0px;}
.client-main .box { width:96%; margin:0 2% 10% 2%; }
.client-main p{ font-size:15px; line-height:24px; padding:0 2%}


.lorem{ padding:40px 0; background:url(../images/lorem-banner.jpg) no-repeat;}
.lorem-top p{font-size:18px; line-height:22px;}


.footer-left{width:100%; padding:0 0 10% 0; text-align: center; }
.footer-text{width:40%; margin:0 0 0 10%;}	

}
/*--media-quaries-end-here--*/