@import url(http://fonts.googleapis.com/css?family=Titillium+Web:300,400,600,600italic,700);

body {font-family: 'Titillium Web', sans-serif; font-size: 14px; color: #808080; font-weight: normal; overflow-x: hidden; line-height: 25px; 
 background:url(../img/pattern.gif) repeat; margin:0; -webkit-backface-visibility: hidden;}
 
 *{ outline:none !important;}
 
 #banner .item img{ width:100%;}

#header { font-family: Droid Sans; font-size: 18px; line-height: 1.6em; font-weight: bold; text-align: center; padding:0px; text-shadow: 0 1px 1px rgba(0,0,0,.2); width:100%; box-sizing:border-box;}

#header .is-sticky{background:rgba(0, 0, 0, 0.8);}
.header { background:none; min-height: 75px; position: relative; overflow: hidden;}
.sticky-wrapper{background:rgba(0, 0, 0, 01); height:75px !important;}
#header .navbar-inverse{background:rgba(0, 0, 0, 0.8);}

.navbar {overflow: hidden; border: 0; font-family: 'Titillium Web', sans-serif; border-radius :0;  text-align:left;-webkit-box-shadow: 0px 5px 11px 0px rgba(50, 50, 50, 0.08); box-shadow: 0px 5px 11px 0px rgba(50, 50, 50, 0.08);}

#main-nav { width: 100%; font-size:16px; z-index: 1000; min-height: 75px;}
#main-nav .active a{color: #fff; background:none;}
.navbar-inverse .navbar-nav > li { font-weight:normal; display:block; margin-right: 00px; margin-top: 00px;}
.navbar-inverse .navbar-nav > li:last-child { margin-right: 0 !important;}
.navbar-inverse .navbar-nav > li > a { color: #777; padding: 0 10px; outline:none; line-height: 35px;}
.navbar-brand { height: 76px; position: relative; line-height: 45px;}

.navbar-inverse .navbar-nav > li > a:hover {color: #fff; outline: none; }

.navbar-toggle { border: 0; background-color: #808080; margin-top: 23px;}
.navbar-inverse .navbar-toggle:hover,.navbar-inverse .navbar-toggle:focus {background-color: #e96656; filter: alpha(opacity=100); opacity: 1;}


#banner .item{ height:150px; margin:0;}
p {margin: 0; padding:0;}

h1,h2,h3,h4,h5,h6 { margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline;}

h1,h2 { font-family: 'Titillium Web', sans-serif; font-weight: 700; text-transform: uppercase;}
h1 {font-size: 28px;}
h2 {font-size: 23px;}
h3 {font-size: 20px;}

h5 {font-size: 17px;}
h6 {font-size: 16px;}

.input-box {border:0; width:100%; text-align: left; text-transform: none; padding: 8px; min-height:30px;  display: inline-block; border-radius: 4px; background: rgba(255,255,255, 0.95);}
.textarea-box {border: 0; text-align: left; width:100%; text-transform: none; padding: 8px; min-height: 250px; display: inline-block;border-radius: 4px; background: rgba(255,255,255, 0.95);}
 textarea:hover, 
input:hover, 
textarea:active, 
input:active, 
textarea:focus, 
input:focus {  -webkit-appearance:none;  -webkit-box-shadow:none !important; box-shadow:none !important;        }

.aboutus,.services,.features,.packages,.products,.testimonial,.contact-us {padding-top: 100px;}

.welcome_box { padding: 80px 0;}
#aboutus{font-family: 'Titillium Web', sans-serif; text-align:center;}
#aboutus h1{ color:#333333; font-weight:300; margin:0 0 40px; text-transform:uppercase; text-align:center;}
.font_color{ color:#ce0000;}
#aboutus h5{ margin: auto auto 50px; color:#333333; font-size:20px; line-height:29px; max-width:90%; font-weight:300; text-transform:uppercase; text-align:center;}

#about_us h4{ margin:0 0 20px; color:#333333; border-bottom:1px solid #333333; display:inline-block; font-size:20px; line-height:29px;  font-weight:300; text-transform:uppercase; }

#about_us h3{ color:#333333; font-size:30px; font-weight:600; margin:0 0 40px; text-transform:uppercase;  }

#about_bg{ background:url(../img/building_bg.jpg) center center; padding:50px 20px}
#aboutus h2{ margin:0 0 20px; color:#a4a3a3; font-size:30px; font-weight:600; text-transform:uppercase; text-align:center;}
#aboutus h2 span{ color:#ce0000;}

#aboutus .text{ font-size:16px; text-transform:uppercase; margin-bottom:20px; text-align:center; line-height:28px;}
#aboutus .nav-tabs{ border:none;}
#aboutus .tab-pane{ background:rgba(0,0,0, 0.6); padding:20px; color:#fff; margin-bottom:20px;}

#aboutus .nav-tabs > li {float: none; margin-bottom: 2px;}

#aboutus .nav-tabs > li > a {background:#000; border:none; outline:none; border-radius:0; font-size:17px; padding:15px 25px; color: #fff; line-height: 1.42857; margin-right: 2px;}
#aboutus .nav-tabs > li > a:hover{background-color: #ce0000; color: #fff;}
#aboutus .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: #ce0000; border:none; color: #fff;  cursor: default;}

#about_us .nav-tabs{ margin-left:0;}

.portfolio_btn{ background:#ce0000; width:auto; font-size:18px;}
.portfolio_btn a{ display:block; color:#fff; text-decoration:none; padding:6px 15px; text-align:center;}
.portfolio_btn a:hover{ background:#000;}

#services{font-family: 'Titillium Web', sans-serif; }
#services h2{ color:#333333; font-size:25px; font-weight:300; line-height:40px; margin-bottom:30px; text-transform:uppercase; text-align:center;}
.services_box{ margin-bottom:30px;}
.services_icon{ background:url(../img/icon_bg.png) no-repeat; width:167px; height:180px; margin:0 auto 15px; text-align:center;}
.services_icon .icon_img{ margin-top:50px;}

.services_icon a { display: block; min-height: 175px;}
.services_box h3{color:#333333; font-size:23px; font-weight:400; margin-bottom:10px; text-transform:uppercase; text-align:center;}
.services_box p{ text-align:center; color:#333333; font-size:16px; line-height:24px;}

#testimonials{font-family: 'Titillium Web', sans-serif;  background:url(../img/testi_bg.jpg) top center repeat; padding:60px 10px 20px;}
#testimonials h1{ text-align:center; font-size:30px;  font-weight:300; color:#fff; text-transform:uppercase; margin:0 0 30px;}

.testi_img{ border:3px solid #fff; border-radius:85px; overflow:hidden; width:130px; height:132px; margin:auto auto 15px;}
.testi_img img{ width:;}
.testi_box p{ font-family:Arial, Helvetica, sans-serif; text-align:center; color:#fff; font-size:14px; line-height:20px;}
.testi_box p a{color:#fff;}
.testi_box h3{ font-size:20px; color:#fff; margin:0 0 5px;}

#testimonials .carousel-caption {  bottom: auto; top:130px;  text-align:center;  text-shadow: none;}
#testimonials .carousel-inner {  min-height: 380px; overflow-x: hidden;}

#contact_us{ position:relative; font-family: 'Titillium Web', sans-serif;}
.contact_left{ background:#1d1d1d; height:auto; width:100%; left:0; top:0; position:inherit;}
.contact_right{ background:#1d1d1d; height:auto; width:100%; right:0; text-align:left; top:0; position:inherit;}

.contact_left_box{ width:100%; float:none; padding:60px 20px 20px;}
.contact_left h1{ font-size:30px; font-weight:600; color:#fff; text-transform:uppercase; margin:0 0 20px;}
.contact_form .form-control{resize:none; color:#fff; background:#131311; border:#000 1px solid; border-radius:0; padding:6px 8px; }
.contact_form .form-control:focus { border-color: #000; background:#232321;  box-shadow:none; outline: 0 none;}
.contact_form .form-group{ margin-bottom:5px;}

.btn_submit{ background:#ce0000;  color:#fff; border:none; border-radius:0; font-weight:600; font-size:16px; padding:10px 30px;  transition:all 0.6s ease; outline:none; -webkit-transition:all 0.6s ease; -moz-transition:all 0.6s ease; -o-transition:all 0.6s ease;}
.btn_submit:hover{ background:#000; color:#fff; }

.contact_right_box{ width:100%; float:none; padding:10px 20px 30px;}
.contact_right h1{ font-size:30px; font-weight:600; color:#fff;  text-transform:uppercase; margin:0 0 20px;}
.contact_details{ width:100%; float:none;}
.contact_details p{ color:#fff; font-size:16px; line-height:25px; }

.social_icon{padding-top:20px;}
.social_icon a{ color:#fff; font-size:22px; background:#000; padding:5px 15px; outline:none; border-radius:40px; margin-right:5px;}
.social_icon a:hover{ background:#ce0000;}

#contact_map{ height:200px; overflow:hidden;}

#footer{ background:#000; padding:20px;}
#footer p{ color:#fff; text-align:center; padding:0; margin:0; font-size:13px;}

.btn-scroll{ color:#fff; background:#ce0000; outline:none; padding:4px 13px 8px; border-radius:30px; font-size:20px; position:fixed; right:15px; bottom:20px;}
.btn-scroll:hover{ color:#fff; background:#000;}

#contact_map iframe{ width:100%;} 


/*............................*/

#portfolio_box{font-family: 'Titillium Web', sans-serif; padding-bottom:40px;}
#portfolio_box h2{ float:none; color:#333333; font-size:20px; margin:0; font-weight:300;}

#portfolio_box .nav-tabs{ border:none;  font-size:15px; text-transform:uppercase;}
#portfolio_box .tab-pane{ background:none; padding:0px; color:#333; margin-bottom:20px;}

#portfolio_box .nav-tabs > li {float: none; margin-bottom: 2px; line-height: 1.42857; margin-right: 2px;}

#portfolio_box .nav-tabs > li > a {background:none; outline:none; border:none; border-radius:0;; padding:0px 5px; color: #333; }
#portfolio_box .nav-tabs > li > a:hover{background-color: none; color: #ce0000;}
#portfolio_box .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: none; border:none; color: #ce0000;  cursor: default;}

#portfolio_box hr{ margin:5px 0 15px; border-color:#8b8a8a; border-style:dotted;}

.portfolio_item{ border:1px solid #ccc; margin-bottom:25px;  position:relative;}
.portfolio_item_img{transition:all 0.6s ease; outline:none; -webkit-transition:all 0.6s ease; -moz-transition:all 0.6s ease; -o-transition:all 0.6s ease;}
.portfolio_item .portfolio_item_img img{ width:100%;-webkit-filter: none;
   -moz-filter: none;
   -ms-filter: none;
   filter: none;}

.portfolio_item:hover .portfolio_item_img img{ 
   
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */    
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   filter: grayscale(100%);
   filter: gray; /* IE 6-9 */ 
   
}

.portfolio_item_details{ display:none; background:rgba(0,0,0, 0.8); color:#adadad; padding:15px 15px 20px; left:-1px; right:-1px; z-index:99; position:absolute;}
.portfolio_item:hover .portfolio_item_details{ display:none; }
.portfolio_item:hover{border:1px solid #333;  box-shadow: 0 5px 20px #333;}
.portfolio_item:hover .portfolio_item_details{  box-shadow: 0 5px 20px #333; }

.portfolio_item_details h3{ font-size:15px; margin:0 0 8px; padding-bottom:8px; color:#adadad; border-bottom:#adadad 1px dashed;}
.portfolio_item_details h3 a{ color:#adadad; text-decoration:none;}
.portfolio_item_details h3 a:hover{ color:#f22f2f;}
.portfolio_item_details p{ font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px;}

.read_more{ font-size:13px; text-transform:uppercase; text-align:center;}
.read_more a{ background:none; border:1px solid #adadad; color:#adadad; padding:0px 15px; text-decoration:none; display:inline-block;}
.read_more a:hover{  border:1px solid #f22f2f; color:#f22f2f; }

.filter_nav > li {float: none; margin-bottom: 2px; line-height: 1.42857; margin-right: 2px;}

.filter_nav > li > a {background:none; outline:none; border:none; border-radius:0;; padding:0px 5px; color: #333; }
.filter_nav > li > a:hover{background-color: none; color: #ce0000;}
.filter_nav > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: none; border:none; color: #ce0000;  cursor: default;}
.thumbnails { margin:0; padding:0;}
.thumbnails li{ list-style:none;  } 

.internal_page{ padding-top:50px;}
.internal_page h1{ margin:0 0 30px;}
.internal_page h5{ margin:0 0 50px;}

.training_box{ font-size:16px; color:#333; margin:0 0 30px; min-height:215px;}
.training_box ul{ margin:0; padding:0; list-style:none; }
.training_box ul li{ margin:0 0 6px;}
.training_box ul li .fa{ margin-right:5px; color:#ce0000;}


/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
body{ overflow-x:hidden;}
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
h1 {font-size: 45px;}
h2 {font-size: 30px;}
h3 {font-size: 25px;}
#main-nav { position: absolute;}
.navbar-inverse .navbar-nav > li { display:inline; margin-right: 20px; margin-top: 20px;}
.navbar-inverse .navbar-nav > li >a { padding: 0 00px;}

#banner .item{ height:310px; margin:0;}

#aboutus{ padding:50px 0 0;}
#aboutus .nav-tabs > li { float: left;}
#aboutus .nav-tabs{ margin-left:20%;}
.portfolio_btn{ background:#ce0000; width:18%; margin:auto; font-size:18px;}

.what_wedo_bg{ background:url(../img/about_banner.png) no-repeat ; background-size:100%; margin: -20px; padding: 80px 50px 90px;}
.what_wedo_in{ background:rgba(0, 0, 0, 0.5); padding:40px 60px;}
.services_box{ margin-bottom:60px;}

.portfolio_item:hover .portfolio_item_details{ display:block; }
#portfolio_box h2{ float:left;}
#portfolio_box .nav-tabs{float:right;}
#portfolio_box .nav-tabs > li { float: left;}
#portfolio_box .nav-tabs > li a{ float:left;}

.portfolio_item:hover .portfolio_item_details{ display:block; }


.filter_nav { float:right;}
.filter_nav > li {float: left;}

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
#banner .item{ height:400px; margin:0;}
	
#about_us .nav-tabs{ margin-left:32%;}
#aboutus{ padding:70px 0 0;}
#aboutus h1{ font-size:70px;}
#aboutus h5{font-size:22px; margin-bottom:80px; line-height:32px;}
#aboutus h4{font-size:28px; margin-bottom:80px; line-height:32px;}

#about_bg{ padding:80px 20px}
#aboutus .tab-pane{ padding:50px;}

#services h2{  font-size:40px;}

#about_us h2{ font-size:40px;}
#about_us .text{ font-size:19px; line-height:34px;}

#testimonials{padding:80px 10px 50px;}
#testimonials h1{  font-size:40px;}
#testimonials .carousel-caption {  bottom: auto; top:130px;  text-align:center;  text-shadow: none;}
#testimonials .carousel-inner {  min-height: 300px; overflow-x: hidden;}

.contact_left{ background:url(../img/contact_left.png) no-repeat right top; height:600px; width:65%; left:0; top:0; position:absolute;}
.contact_right{ background:url(../img/contact_right.png) no-repeat left top; height:600px; width:65%; text-align:right; right:0; top:0; position:absolute;}

.contact_left_box{ width:95%; padding:70px 0; float:right; margin:0px;}
.contact_left h1{ font-size:38px; }
.contact_right h1{ font-size:38px;  }

#contact_map{ height:600px;}

.contact_form{ width:40%;}
.contact_right_box{ padding:370px 0 0 0; width:95%; float:left;}
.contact_details{ width:55%; float:right;}
.social_icon{ text-align:right; }

.what_wedo_bg{ margin:-50px; padding: 80px 50px 90px;}

.services_box{ margin-bottom:80px;}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
#aboutus .nav-tabs{ margin-left:32%;}
#banner .item{ height:590px; margin:0;}
.contact_left{ background:url(../img/contact_left.png) no-repeat right top; height:600px; width:52%; left:0; top:0; position:absolute;}
.contact_right{ background:url(../img/contact_right.png) no-repeat left top; height:600px; width:52%; text-align:right; right:0; top:0; position:absolute;}
}

@media only screen and (min-width : 1700px) {
#banner .item{ height:888px; margin:0;}

}



.services_box:hover .services_icon{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	
}

@keyframes services_icon {
	0% {
		transform: scale(0.9);
		opacity: 0.7;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.9);
		opacity: 0.7;	
	}			
}

@-webkit-keyframes services_icon {
	0% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;		
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;	
	}			
}

.services_icon
.pulse{
}
.pulse:hover{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	
}

@keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 0.7;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.9);
		opacity: 0.7;	
	}			
}

@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;		
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;	
	}			
}