


#con{width:100%;height:500px;}
/*-- services --*/
.ban1{width:100%; height:650px;}
.servicegrids {
    margin-top: 4em;
    margin-bottom: 4em;
}
.servicegrids h4 {
    font-size: 22px;
    color: #000;
    line-height: 30px;
}
.servicegrids h5 {
    font-size: 20px;
	font-weight: 600;
    color: #888;
    margin: .5em 0;
	position: relative;
}
.servicegrids h5:before {
    content: '';
    width: 20%;
    height: 2px;
    background: #000;
    position: absolute;
	top: -65%;
    left: 0%;
}
.servicegrids span.fa {
    font-size: 30px;
    margin-bottom: .8em;
}
.servicegrids p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #444;
	text-align: left;
	width:60%;
	margin-bottom:30px;
}
.servicebottomgrids h5{
    font-size: 20px;
    color: #000;
	font-weight: 700;
}
.serv1 h5 span.fa ,.serv2 h5 span.fa ,.serv3 h5 span.fa {
    margin-left: 1em;
    font-size: 30px;
}
.servicebottomgrids p{
    margin: .5em 0;
    font-size: 14px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #444;
}
.serv1 span.fa {
    color: #ff4c4c;
}
.serv2 span.fa {
    color: #0099e5;
}
.serv3 span.fa {
    color: #34bf49;
}
.serv4 span.fa {
    color: #ff4f81;
}
/*-- //services --*/

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right:65px;
  z-index: 99;
  border: none;
  outline: none;
width:50px;height:50px;
  color: white;
  cursor: pointer;
}


.button {
  display: inline-block;
  border-radius: 6px;
  background-color:#09C;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 15px;
  padding: 12px;
  width:145px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
}

.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button:hover span {
  padding-right: 25px;
}

.button:hover span:after {
  opacity: 1;
  right: 0;
}












.footer-top{
	padding:5em 0;
	    background: #171616;
}
.footer-top h3 {
    font-size: 1.3em;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 1.5em;
}
.footer-top p {
    font-size: 0.9em;
    color: #696464;
    margin: 0 0 1em;
    line-height: 1.8em;
    letter-spacing: .5px;
}
.footer {
    background: #283645;
    padding: 1em 0;
    text-align: center;
}
.footer p {
    color: #fff;
    font-size: 1em;
}
.footer p a{
    color: #fff;
}
.footer p a:hover{
    color: #ED4F2E;
}
.contact-btm span {
      color: #fff;
    font-size: 1.2em;
    display: inline-block;
    vertical-align: middle;
}
.contact-btm p {
    display: inline-block;
    vertical-align: middle;
      color: #696464;
    margin: 0 0 0 10px;
}
.contact-btm {
    margin-bottom: 0.5em;
}
.contact-btm p a {
      color: #696464;
}
.contact-btm p a:hover {
    color: #3be8b0;
}
.foot-left li {
    display: inline-block;
    float: left;
    width: 31%;
    margin: 1%;
}
.foot-left input[type="text"] ,.foot-left input[type="email"] {
    width: 100%;
    color: #888;
    background: #fff;
    padding: 10px 10px;
    outline: none;
    border: 1px solid #fff;
    font-size: 13px;
    margin-bottom: 1em;
    letter-spacing: 1px;
}
.foot-left form input[type=submit] {
    color: #fff;
    width: 100%;
    padding: 10px 21px;
    font-size: 15px;
    cursor: pointer;
    background: #f0b50a;
    margin: 4px 0 0 0px;
    outline: none;
    border: none;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.foot-left form input[type=submit]:hover {
    background: #00acee;
    color: #fff;
    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;
}
.icon span.fa {
    color: #00acee;
    font-size: 18px;
    background: #444;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
	transition: 0.5s all;
}
.icon span.fa:hover {
    background: #00acee;
    color: #fff;
}
/*-- /copyrights end here --*/
.copy-right {
    padding: 1em 0;
     background: #030303;
}
.copy-right  p {
    color: #FFF;
    letter-spacing: 1px;
}
.copy-right p a {
       color: #f0b50a;
}
.copy-right p a:hover {
    color: #fff;
	text-decoration:none;
}
.footericons li{
	display: inline-block;
    margin: 0 5px;
}
.footericons li a{
	color: #fff;
    font-size: 15px;
}
ul.footericons {
    text-align: right;
}
.middle a {
    color: #fff;
    text-transform: capitalize;
    padding: 0 10px;
    font-size: 15px;
}
.text {
    padding: 0;
}
/*-- //copyrights end here --*/


/*-- map --*/
.map{
	position: relative;
}
.map iframe {
    width: 100%;
    min-height: 450px;
    border: none;
	position: relative;
}
.contactgrids {
    position: absolute;
    bottom: 0px;
	left: 14%;
    width: 73%;
}
.gridleft,.gridright {
    background: #2dbaf1;
    padding: 2em;
    position: relative;
}
.gridleft span.fa, .gridright span.fa {
    font-size: 170px;
    position: absolute;
    right: 2%;
    color: rgba(255, 255, 255, 0.45);
    opacity: 0.5;
    bottom: 10%;
}
.gridleft h3 ,.gridright h3 {
    font-size: 23px;
    text-transform: capitalize;
    color: #000;
	font-weight:600;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #000;
}
.gridleft p,.gridright p {
    color: #fff;
    font-size: 15px;
    letter-spacing: 1px;
    margin: 10px 0;
}
.gridright a {
    color: #000;
}
/*-- //map --*/

/*-- contact --*/
.contact-form input[type="text"] {
  display: inline-block;
  background: none;
  border:solid 1px #999999;
  width: 43.8%;
  outline: none;
  padding:1em;
  font-size: .9em;
  color: #999999;
  margin-bottom: 1.5em;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;;
    -ms-border-radius: 30px;;
    -o-border-radius: 30px;
    border-top-left-radius: 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-top-left-radius: 0px;;
    -ms-border-top-left-radius: 0px;;
    -o-border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-bottom-left-radius: 0px;;
    -ms-border-bottom-left-radius: 0px;;
    -o-border-bottom-left-radius: 0px;
  margin-right: 1em;
}

.contact-form input[type="text"]:first-child {
  margin-right: 1em;
}
.contact-form span.fa {
    background: #444;
    width: 55px;
    height: 51px;
    text-align: center;
    color: #fff;
	font-size:20px;
    line-height: 46px;
	margin:-4px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
}
.contact-form input[type="email"] {
  display: inline-block;
  background: none;
  border:solid 1px #999999;
  width: 43.8%;
  margin-right:1em;
  outline: none;
  padding:1em;
  font-size: .9em;
  color: #999999;
  margin-bottom: 1.5em;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;;
    -ms-border-radius: 30px;;
    -o-border-radius: 30px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.contact-form textarea {
  display: inline-block;
  background: none;
  border:solid 1px #999999;
  width: 99%;
  outline: none;
  padding:1em;
  font-size: .9em;
  color: #999999;
  margin-bottom: 1.5em;
  min-height:150px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;;
    -ms-border-radius: 30px;;
    -o-border-radius: 30px;
}
button.btn1{
    color: #fff;
    width: 30%;
    padding: 10px 21px;
	padding:1em;
    font-size: 15px;
    cursor: pointer;
    background: #f0b50a;
    margin: 4px auto 0px;
    outline: none;
    border: none;
    text-transform: uppercase;
	display : block;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;;
    -ms-border-radius: 30px;;
    -o-border-radius: 30px;
}
button.btn1:hover {
    background: #00acee;
    color: #fff;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}
/*-- contact --*/




/* Responsive Design */
@media(max-width:1440px){
	.bannergrids ul li {
		margin: 0 1em;
	}
	.w3_agile_banner_info h2,.w3_agile_banner_info h3 {
		font-size: 5em;
	}
	.w3_agile_banner_info {
		margin: 9em 12em 0;
	}
	.agileinfo-dot, .agile-dot,.banner {
		min-height: 720px;
	}
	.contactgrids {
		left: 10%;
		width: 78%;
	}
}
@media(max-width:1366px){
	.bannergrids ul li {
		margin: 0 .5em;
	}
	.w3_agile_banner_info h2,.w3_agile_banner_info h3 {
		font-size: 4em;
	}
	.contactgrids {
		left: 8%;
		width: 82%;
	}
}
@media(max-width:1280px){
	.bannerbott1 {
		padding: 1.4em;
	}
	.w3_agile_banner_info p {
		font-size: 15px;
	}
	.banneraddress li, .banneraddress li a, .bannergrids p, .bannergrids p a {
		font-size: 14px;
		letter-spacing: .5px;
	}
	.bannerbottom p {
		font-size: 13px;
		letter-spacing: .5px;
	}
	.contactgrids {
		left: 9%;
	}
	.team, .map, .contact-form, .about, .services, .footer-top {
		padding: 3.5em 0;
	}
	.about {
		padding: 3em 0 0;
	}
	.agile_testimonials {
		padding: 5em 0;
	}
}
@media(max-width:1080px){
	.bannergrids {
		width: 85%;
	}
	.w3l_header ,.team .w3l_header,.agile_testimonials h3.head{
		font-size: 40px;
	}
	.w3_agile_banner_info {
		margin: 7em 6em 0;
	}
	.w3_agile_banner_info h2, .w3_agile_banner_info h3 {
		font-size: 3.5em;
	}
	.agileinfo-dot, .agile-dot, .banner {
		min-height: 630px;
	}
	.aboutgrids p {
		font-size: 13px;
	}
	.aboutgrids h4 {
		font-size: 20px;
	}
	.slider-info ,.slider-info1, .slider-info2, .slider-info3 {
		min-height: 300px;
	}
	.bottomgrids h4 {
		font-size: 22px;
	}
	.bottomgrids p {
		font-size: 13.5px;
		letter-spacing: .2px;
	}
	.bottomgrids span.fa {
		top: 20.5%;
	}
	.servicegrids h4 {
		font-size: 20px;
	}
	.contact-form input[type="text"],.contact-form input[type="email"] {
		width: 42.8%;
	}
	.foot-left {
		padding: 0;
	}
	.gridleft span.fa, .gridright span.fa {
		font-size: 130px;
	}
}
@media(max-width:320px){
	.aboutgrids h4 {
		font-size: 18px;
	}
	.servicebottomgrids h5 {
		font-size: 18px;
	}
	.serv1 h5 span.fa, .serv2 h5 span.fa, .serv3 h5 span.fa {
		margin-left: .5em;
	}
	.agileits_team_grid {
		width: 90%;
	}
	.w3l_header, .team .w3l_header, .agile_testimonials h3.head {
		font-size: 33px;
	}
	.contact-form input[type="text"], .contact-form input[type="email"] {
		width: 77.8%;
	}
	.navbar-brand {
		font-size: .7em;
	}
	.navbar-brand span {
		font-size: 11px;
	}
	.agile_tesimonials_content h4 {
		font-size: 13px;
	}
	.modal-header {
		font-size: 1.1em;
	}
	.bannergrids ul li {
		margin: 0px 1.5em;
	}
}


/* //Responsive Design */