/*--
Author: W3layouts
Author URL: https://w3layouts.com
License: Creative Commons Attribution 3.0 Unaption
orted
License URL: https://creativecommons.org/licenses/by/3.0/
--*/

#cm-overlay-mask,
#cm-wrap
{
    position: fixed;
    left: 0;
    top: 0;
    width:100%;
    height:100%;
    z-index: 9991;
    text-align:center;
/* IE<9 support hack */
}
/* chrome bug fix causing overlay-mask to not appear 
@media screen and (-webkit-min-device-pixel-ratio:0) {
#cm-overlay-mask
{
    overflow:scroll;
}
#cm-overlay-mask::-webkit-scrollbar
{
    width:0px; 
}}*/
#cm-wrap
{
    visibility:hidden;
    white-space:nowrap;
}
#cm-wrap *
{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    
}
#cm-wrap .cm-box,
#cm-wrap .cm-scale
{
    white-space:normal;
    vertical-align:middle;
    position:relative;
    display:inline-block;

}
#cm-wrap .cm-scale
{
    height:100%;
    line-height:100%;
    width:0;
}
#cm-wrap .cm-box img,
#cm-wrap .cm-box iframe
{
    display:block;
}

/* customise mask colour */
#cm-overlay-mask
{
    background-color:#000000;
}
/* customise loader GIF */
#cm-wrap
{
    background:none;
}
#cm-wrap.cm-loaded
{
    background-image:none;
}
/* overlay border and shadow */
#cm-overlay
{
    -webkit-box-shadow: 0 0 90px #000;
    -khtml-box-shadow:0 0 90px 5px #000;
    -moz-box-shadow:0 0 90px 5px #000;
    box-shadow:0 0 90px 5px #000;
    /**/
    opacity:0;
    z-index:9992;
}
/* close link style */
#cm-wrap #cm-close
{
    display:block;
	height: 61px;
    width: 59px;
    position:absolute;
    right:0;
    top:0;
    background:transparent url(../images/close.png) scroll no-repeat center center;
    cursor:pointer;
    z-index:9993;
    text-indent:-999em;
    opacity:0.5;
}
/* prev and next buttons */
#cm-wrap #cm-prev,
#cm-wrap #cm-next
{
    display:block;
    position:absolute;
    height: 97px;
    width: 49px;
    top:50%;
    margin-top:-63px;
    text-indent:-999em;
    opacity:0.5;
    outline:none;
    z-index:9993;
}
#cm-wrap #cm-prev
{
    left:0;
    background:transparent url(../images/prev.png) scroll no-repeat 0 center;
}
#cm-wrap #cm-next
{
    right:0;
    background:transparent url(../images/next.png) scroll no-repeat 100% center;
}
#cm-wrap #cm-prev:hover,
#cm-wrap #cm-next:hover,
#cm-wrap #cm-close:hover
{
    opacity:1;
}

@media (max-width: 640px){
	#cm-wrap .cm-box img, #cm-wrap .cm-box iframe {
		display: block;
		width: 80%;
		margin: 0 auto;
		height: inherit;
	}
	#cm-overlay {
		border: none;
	}
}

/*-- //gallery ends here --*/

/*-- Responsive code --*/

@media screen and (max-width:1050px){
	.list-right {
		float: none;
		clear: both;
		padding: 0em 0em 1em;
		text-align: center;
	}
	.navbar-nav {
		float:right;
		padding: 5em 0em 2em;
	}
}
@media screen and (max-width:1024px){
	.about, .service-section, .gallery, .testimonials, .contact {
	padding: 40px 0;}
		
	.navbar-nav {
     padding: 3em 0 0 12em;}
	
	.list > li {
    padding: 0 1em 0 0;
}
	.list-right {
    float: none;
	clear: both;
	padding: 0em 0em 1em;
	text-align: center;}
	
	.navbar-brand {
    padding: 5px 8px;}
	 
	  	
	.callbacks .caption {
    padding: 14em 5em 0em;}

	.nav-tabs li a{
	padding: 0.5em 1em;}
	
	.about-grids h4 {
	font-size: 18px;}
	
	.service h2 {
    font-size: 24px;}
				
	.footer-left p {
    font-size: 14px;}
}	
@media screen and (max-width: 991px){
	.about, .service-section, .gallery, .testimonials, .contact {
	padding: 40px 0;}
		
	
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
	font-size: 38px;}
	
	.navbar-nav {
     padding: 3em 0 0 9em;}
	
	.list > li {
    padding: 0 1em 0 0;
}
	.list-right {
    float: none;
	clear: both;
	padding: 0em 0em 1em;
	text-align: center;}
	
	.navbar-brand {
    padding: 5px 8px;}
	 
	  
	.callbacks .caption {
    padding: 14em 5em 0em;}
	
	.about-grids h4 {
	font-size: 18px;}
	
	.service h2 {
    font-size: 24px;}
	
	.service {
     margin-top: 7%;}
	 
	 .service {
    width: 57%;
    padding: 18px;
}
	
	.img4,.img5 ,.img6,.img7,.service-text {
	min-height: 190px;}
	  	
   .service-text{
	border: 1px solid #e9e8e9;}
	
	.service-head {
    min-height: 370px;}
	
	.service-text h5 {
	font-size: 20px;}
	
	.testi-w3agileinfo .tab-content {
		width: 82%;}
				
	.contact-left input[type="text"] {
    width: 48.7%;}
			
	.contact-left input[type="email"] {
    width: 48.7%;}	
	
	.footer-left p {
    font-size: 14px;}
}

@media screen and (max-width: 900px){
	
	.navbar-nav {
    padding: 3em 0 0 0em;}

	.callbacks .caption {
    padding: 12em 5em 0em;}
		
	.service-head {
    min-height: 320px;}
	
	.testi-w3agileinfo .tab-content {
    width: 90%;}
	
	.service {  
    margin-top: 3%;}
	
	.callbacks .caption {
    padding: 11em 5em 0em;}
	
	
}

@media screen and (max-width: 800px){
	
	.navbar-collapse {
    padding-right: 0px;}
	
	.list > li {
    padding: 0.5em 0;}
	
	.service {
     margin-top: 5%;}
	 
	 .navbar-brand {
    padding: 7px 3px;}
	
	.list > li {
    padding: 0 0 0 0;}
	
	.callbacks .caption {
    padding: 6em 5em;}
	
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
    font-size: 34px;}
			
	.testi-w3agileinfo .tab-content {
    width: 85%;}
	
	}

@media screen and (max-width: 768px){
	.logo h1 span {
    font-size: 41px;}
		
		
	.navbar-nav {
    padding: 3em 0 0 0;
	text-align: center;
    float: none;}
	
   .service {
    width: 57%;
    margin-top: 5%;
    padding: 18px 0;}
	
	.service h2 {
    font-size: 22px;}
	
	.contact-head h3 {
       margin-bottom: 0px;
	}
	.list-right {
	padding: 1em 0em ;}
	
	.footer {
	padding-top: 1em;}
}	


@media screen and (max-width: 736px){
	.list > li {
    padding: 0.5em 0;}
	
	.container-fluid > .navbar-header {
    margin-right: 0px;
    margin-left: 0px; }
	
	.navbar-brand {
	margin: 0 15em;}
	
	.navbar-default .navbar-toggle {
	margin: 2em  0 0 13em;}
	
	.callbacks .caption {
    padding: 7em 2em;}
	
	.service-head {
    min-height: 280px;}
	
	.service h2 {
    font-size: 21px;}
	
	.caption h3 {
    font-size: 1.2em;}
	
	.img4, .img5, .img6, .img7, .service-text {
    min-height: 184px;}

	 .service-text {
	 padding: 40px 20px ; }
	
	 .service-text h5 {
    padding-bottom: 0.8em;
    font-size: 15px;}
    
	p {
	line-height: 2;
	font-size: 14px; }
		
	.nav-tabs li a {
    padding:0.5em;}

	.service {
    width: 55%;
    margin-top: 3%;
    padding: 20px 12px;}
	
	.service h2 {
    font-size: 20px;}
	
	.testi-w3agileinfo .tab-content { 
	width: 70%;
    padding: 1em 2em;}
	
	.testi-w3agileinfo .nav-tabs {
    border-bottom: none;
    margin: 2em 0em;}
	
	.footer {
    padding-top: 1em;
    padding-bottom: 1em;}
	
	.footer-left{
    float: none;
    text-align: center;
    width: 100%;}
	
	.footer-right{
    float: none;
    text-align: center;
    width: 100%;}
	
	.list-right {
     padding: 1em 0em ;}	
	 
	  #toTop {
       bottom: 66px;}
}	   

@media screen and (max-width: 667px){
	.list > li {
    padding: 0.5em 0;}
    
    .navbar-brand {
    margin: 0 11em;}	
	
	.img4, .img5, .img6, .img7 {
    min-height: 165px;}
	
	.service {
    width: 66%;}
		
    .callbacks .caption {
     padding: 5em 3em;}
	 
	 .caption h3 {
    font-size: 1.1em;}
	
	.service-text {
	 min-height: 165px;
     padding: 40px 20px 0;}
	 
	 .list-right {
	padding: 1em 0em ;}
 
	   
	.footer-left {
    float: none;
    width: 84%;
    margin: 0 4em;}
	
	.footer-right {
    width: 82%;
    margin: 0px 6em;
	text-align: center;}
	
	.contact-left h4, .contact-right h4 {
      padding: 1.5em 0;}
	  
	.contact-left input[type="text"] {
    width: 48.4%;}
	
	.contact-left input[type="email"] {
    width: 48.4%;}  
}	


@media screen and (max-width: 640px){
	.list > li {
    padding: 0.5em 0;}
	
	.navbar-brand {
    margin: 0 9em;}
	
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
    font-size: 32px;}
	
	.callbacks .caption {
	width: 54%;}

	.caption p {
		font-size: 0.8em;
	}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 15em;} 
	
	.footer-right .icon {
     margin-right: 10px;}
	 
	 #toTop {
       bottom: 66px;}
	   
	 .footer-left {
    padding-left: 1em;}
	
	.service {
    width: 65%;}
	
	.testi-w3agileinfo .tab-content {
    width: 75%;
    padding: 1em 2em;}
	
	.list-right {
	padding: 1em 0em ;}
			
}	
	

@media screen and (max-width: 600px){
	.list > li {
    padding: 0.5em 0;}
	
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
	margin-bottom: 20px;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 14em;}
	
	.service {
	width: 70%;}
	
	.nav-tabs {
    margin: 2em 0em;}
	
	.footer-right .icon {
    margin-right: 8px;}
	
	 .footer-left {
    padding:0;}
	
	.navbar-brand {
    margin: 0 7em;}
	
	.callbacks .caption {
    padding: 4em 3em;}
	
	.callbacks .caption {
	width: 58%;}
	
	.nav-tabs > li {
    margin: 0 7px;}
	
	.testi-w3agileinfo .tab-content {
    width: 79%;
    padding: 0.85em 2em;}
	
	.footer {
     padding-bottom: 5em;}
	 
	.footer-left {
    padding: 0 7em 0 1em;}
	
	.footer-right .icon {
    margin-right: 10px;}
	
	.list-right {
     padding: 1em 0em ;}
	 
	 .footer {
      padding: 1em 0;}
	
	.footer-left {
      width: 90%;
    margin: 0 5em;}
}	 

@media screen and (max-width: 568px){
	.list > li {
    padding: 0.5em 0;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 10em;}
	
	.callbacks .caption {
	width: 62%;}
	
	.callbacks .caption {
    padding: 4em 2em;}
	
	.testi-w3agileinfo h5 {
      font-size: 2em;}
	  
	  	.list-right {
     padding: 1em 0em ;}
	 
	 .footer {
      padding: 1em 0;}
	
	.footer-left{
       width: 70%;
    margin: 0 13em;}
	
	.footer-right {
    width: 91%;
    margin: 1em 5em 0;}
	
	#toTop {
    bottom: 93px;}
	
	.footer-right .icon {
	margin-right: 15px;}
	
	.nav-tabs li a {
    padding: 0.5em 1em;}
	
	.contact-left input[type="text"] {
    width: 48.1%;}
	.contact-left input[type="email"] {
    width: 48.1%;}
}	 
@media screen and (max-width: 480px){
	.list > li {
    padding: 0.5em 0;}
	
	.callbacks .caption {
    padding: 2em;
    width: 73%;}
	
	.navbar-brand {
    margin: 0 4em;}
	
	.service-head {
    min-height: 275px;}
	
	.service{
    padding: 14px;
    width: 81%;
    margin-left: 2%;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 2em;}
    
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
    font-size: 30px;}
	
	.service-head {
    margin-top: 30px;}
	
	.testi-w3agileinfo h5 {
    font-size: 1.5em;}
	
   .contact-left input[type="email"] {
   width: 46%;}
   
   	.list-right {
	padding: 1em 0em ;}
	 
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 7em;}
	
	.footer-left {
    width: 81%;
    margin: 0 8em;}
	
	.footer-right {
    width: 84%;}
	
	.testi-w3agileinfo h5 {
		margin: 0 0 0.5em 0;
	}
	.contact-left input[type="text"],.contact-left input[type="email"]{
    width: 100%;
    margin-right: 0;}
}

@media screen and (max-width: 414px){
	.list > li {
    padding: 0.5em 0;}
	
	.nav-tabs > li > a {
    margin-right: 2px;}
	
	.navbar-brand {
    margin: 0;}
	
	.nav-tabs > li {
    margin: 0 2px;
	}
	
	.list-right {
     padding: 1em 0em ;}
	 
	.service {
	margin-top: 0%;}	
 
  .navbar-default .navbar-toggle {
    margin: 2em 0 0 8em;} 
	
	.callbacks .caption {
    padding: 1em 2em;
    width: 75%;}
	
	.about-section-grids {
    padding-top: 3em;}
		
	#toTop {
    bottom: 93px;}
	
	.callbacks_nav {
	top:52%;
	height: 40px;}
	
	.callbacks_nav.next {
    left: auto;
    background-position: -35px -11px;}
	
	.callbacks_nav.prev{
    left: auto;
    background-position: 0px -10px;}
	
	.footer-left {
     margin: 0 7em;}
	 
	 .about-grids {
	 float: none;
	 text-align: center;
	 width: 100%;}
	 
	 .service {
      width: 89%;}
	  
	.service-text {
    min-height: 165px;
    padding: 20px 20px 0;}
	
	.contact-left textarea,.contact-left input[type="text"],.contact-left input[type="email"]{
       width: 100%;
	} 
	.w3_tab_img_left{
		width:50%;
	}
}
@media screen and (max-width: 384px){
	
	.callbacks .caption {
    padding: 1em 3em;
    width: 92%;}
	
	.service-head {
    min-height: 226px;}
	
	.callbacks_nav {
    top: 63%;
    height: 40px;}
	
	.service-head {
	padding-top: 4em;}
	
	.service-grid {
		float: none;}
	
	.callbacks_nav.next {
    left: auto;
    background-position: -35px -11px;}
	
	.callbacks_nav.prev{
    left: auto;
    background-position: 0px -10px;}
	
	.service {
    padding: 8px;
    width: 96%;
    margin-left: 2%;}
	
	.service-text {
    min-height: 165px;
    padding: 35px 20px;
	float:none;
	text-align:center;
	width: 100%;}
	 
	 .img4, .img5, .img6, .img7 {
    min-height: 200px;
	float:none;
	width:100%;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 5em;} 

	.footer-left {
    width: 83%;
    margin: 0px 6em;}
	
	.footer-right {
    width: 76%;}
	
	#toTop {
    bottom: 113px;}
	
	.caption p {
    line-height:1.7;}
	
	.nav-tabs li a {
    padding: 0.6em;}

}

@media screen and (max-width: 375px){
	
	.service-text {
	 min-height: 165px;
     padding: 35px 20px;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 4em;} 
	
	.callbacks .caption {
    padding: 1em 2em;
    width: 78%;}
	
	.about-head h3, .services-head h3,.testimonials-head h3{
    margin-bottom: 25px;}
	
	.caption p {
      font-size: 0.9em;}
	  
	.about-section-grids {
    padding-top: 0em;}
	
	.contact-left h4, .contact-right h4 {
    padding: 1em 0;}
}

@media screen and (max-width: 320px){
	.logo h1 {
    font-size: 30px;}
	
	.navbar-default .navbar-brand {
	margin-top: 5px;}
	
	.navbar-default .navbar-toggle {
    margin: 2em 0 0 2em;}
	
	.navbar-toggle .icon-bar {
    display: block;
    width: 18px;}
	
	.caption p {
    font-size: 13px;}
	
	.caption h3 {
    font-size: 1.1em;}
	
	.caption p {
    line-height:1.7;}
	
	.callbacks .caption {
    width: 100%;
    padding: 1em 2em;}
	
	.callbacks_nav {
    top: 70%;
    height: 30px;
    width: 30px;}
	
	.service-head {
		padding-top: 2em;
	}
	.callbacks_nav.next {
    left: auto;
    background-position: -40px -15px;}
	
	.callbacks_nav.prev{
    left: auto;
    background-position: -5px -17px;}
	
	.about-head h3, .services-head h3, .gallery-head h3, .testimonials-head h3, .contact-head h3 {
    font-size: 24px;}
	
	.service-text {
    min-height: 165px;
   padding: 35px 20px;}
   
   .testi-w3agileinfo .nav-tabs li {
    width: 28%;}
		
	.contact-left p {
    font-size: 13px;}
	
	.footer-left {
    width: 80%;
    margin: 0 6em;}
	
	.footer-right {
    width: 72%;}
	
	#toTop {
    bottom: 115px;}
	
	.nav-tabs li a {
    padding: 0.5em;
    font-size: 1.3em;}
}
	
	
/*-- //Responsive code --/
