/*
Author       : theme_ocean
Template Name: Chicago - Multipurpose One Page Bootstrap Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT DESIGN
    05. START TEAM DESIGN
    06. START VIDEO DESIGN
    07. START PROMOTION DESIGN
    08. START PROCESS DESIGN
    09. START RECENT PROJECT DESIGN
    10. START PROTFOLIO DESIGN
    11. START TESTIMONIALS DESIGN
    12. START PRICING DESIGN
    13. START NEWSLETTER DESIGN
    14. START CONTACT DESIGN
    15. START PROMOTION DESIGN
    16. START CONTACT ADDRESS DESIGN
    17. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
color: #444;
font-family: 'Poppins', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 28px;
background:#fff;
overflow-x:hidden;
}
html,
body { height: 100%;position:relative;  }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0px;
  margin-top: 0px; 
  font-family: 'Poppins', sans-serif;
  color: #1d293e;
  font-weight: 400;
}
a {
font-family: 'Poppins', sans-serif;
text-decoration: none;
transition: all 0.2s ease 0s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
}

::-webkit-input-placeholder {
  font-weight: 300;
  font-family:'Poppins', sans-serif; }

:-moz-placeholder {
  font-weight: 300;
  font-family: 'Poppins', sans-serif;}

::-moz-placeholder {
  font-weight: 300;
  font-family: 'Poppins', sans-serif; }

:-ms-input-placeholder {
  font-weight: 300;
font-family: 'Poppins', sans-serif;}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN*/
.preloader {
    background: #fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
}

.status-mes {
    width: 45px;
    height: 45px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    font-size: 10px;
    text-indent: -12345px;
    border-top: 8px solid #35ac39;
    border-right: 8px solid #35ac39;
    border-bottom: 8px solid #35ac39;
    border-left: 8px solid #fff;
    border-radius: 50%;
    -webkit-animation: spinner 700ms infinite linear;
    animation: spinner 700ms infinite linear;
    z-index: 10000;
}

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.status-mes h4 {
color: #f7f7f7;
position:relative;
font-size:24px;
margin-top: 30px;
text-transform: capitalize;
letter-spacing: 1px;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
.section-padding {padding:80px 0;}
/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom:60px;}
.section-title  h1 {
font-size: 44px;
font-weight: 600;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
h1.section-title-white{
color:#fff;
font-size: 44px;
font-weight: 600;
margin-top: 0;
position: relative;
text-transform: capitalize;
}
p.section-title-white{color:#fff;}
@media only screen and (max-width:480px) { 
.section-title  h1  {font-size:30px;}
}
.section-title span{
background: #35ac39 none repeat scroll 0 0;
display: block;
height: 2px;
margin: 10px auto;
width: 100px;
}

.section-title-white{color:#fff;position:relative;}
.section-title  p{
padding: 0 10px;
width: 60%;
margin: auto;	
}
@media only screen and (max-width:480px) { 
.section-title  p{
padding: 0 10px;
width: 90%;
margin: auto;	
}
}
/*END SECTION TITLE DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #35ac39 none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
color: #fff;
cursor: pointer;
font-size: 22px;
height: 50px;
line-height: 47px;
opacity: 1;
position: fixed;
right: 5px;
text-align: center;
transition: all 0.2s ease 0s;
width: 50px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.site-logo img{
	width: 150px;
	height: auto;
}
.logo-hidden{
 display:none;
width: 150px;	
}
.navbar-fixed .navbar-logo img {
  display:none;
}
.navbar-fixed .logo-hidden{
display:block!important;	
}
.bg-faded {
	background-color:transparent;
	transition: all 0.5s ease 0s;
}
@media only screen and (max-width:767px) { 
.bg-faded {background-color:#35ac39;}
}
.navbar-fixed {
    z-index: 999;
    position: fixed;
    opacity: .98;
    width: 100%;
	padding:10px 0;
    top: 0;
    -webkit-animation: fadeInDown 800ms;
    animation: fadeInDown 800ms;
    -webkit-backface-visibility: hidden;
    border-radius: 0px;
    background: #fff;
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.07);
}

@media only screen and (max-width:767px) { 
.navbar-fixed {background: #35ac39;}
}
#navigation{
	padding: 20px 0;
}
#navigation.navbar-fixed {
	padding: 15px 0;
}
.header_right {
	display: flex;
	flex-basis: auto;
}
#main-menu{
	margin-top: 12px;
}
#main-menu ul{
	list-style-type: none;
}
#main-menu ul li{
	display: inline-block;
	padding:0px 12px;
	position: relative;
}
#main-menu ul li a {
	color: #fff;
	font-size: 16px;
	text-transform: capitalize;
	font-weight: 500;
	transition: .3s;
}
#navigation.navbar-fixed #main-menu ul li a{
	color: #1d293e;
}
#navigation.navbar-fixed #main-menu ul li a:hover,
#navigation.navbar-fixed #main-menu ul li a:focus,
#main-menu ul li a:hover,
#main-menu ul li a:focus{
	color:#35ac39;
}

.slicknav_nav_icon{
	color: #fff;
	font-size: 24px;
}
.slicknav_menu .slicknav_icon::before {
	background: transparent;
	width: 1.125em;
	height: 0.875em;
	display: block;
	content: "\e68e";
	position: absolute;
	font-family: 'themify';
	color: #fff;
	font-size: 20px;
}
#mobile_menu{display: none;}
@media only screen and (max-width:767px) { 
.navbar-default {
padding: 10px!important;
}
.navbar-collapse{
margin-top: 15px;
}

#navigation ul li a{ 
position: inherit;
color: #333;

}

#navigation ul li ul ,
#navigation ul li ul li ul{
opacity: 1;
position: inherit;
top: 0;
transition: all 0.3s ease 0s;
z-index: 1;
visibility: visible;
background: #fff none repeat scroll 0 0;
box-shadow: 0 0px 2px 0 rgba(0, 0, 0, 0.05);
padding: 15px;
left: 0;
background: #f5f5f5;
list-style: none;
width: 100%;
}



#navigation ul li ul.sub-menu li{
z-index: 1;
}

#navigation ul li:hover ul.sub-menu{
top:0;
opacity:1;
z-index:999;
visibility:visible;
}
#main-menu{
display: none;
}	
#mobile_menu{
display: block;
width: 100%;
}
.slicknav_nav ul li a{
color: #fff !important;
	font-size: 16px;
	text-transform: capitalize;
	font-weight: 600;
}
	
}
@media only screen and (max-width:767px) { 
  .navbar-brand {
    padding-top: 20px;
  }
.slicknav_menu {
	font-size: 16px;
	box-sizing: border-box;
	background: transparent;
	padding: 0;
	margin-top: 10px;
}  
}
@media only screen and (max-width:480px) { 
.slicknav_menu {
	margin-top: -50px;
}
}
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
.home_parallax{height: 700px;position:relative;}
.home_parallax:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background:#020928;
  content: "";
  left: 0;
  top: 0;
  opacity:0.6;
}
.hero-text{padding-top:200px;}
@media only screen and (max-width:360px) { 
.hero-text{padding-top:150px;}
}
.hero-text img{margin-bottom:30px}	
.hero-text h1 {
	color: #fff;
	font-size: 75px;
	font-weight: 400;
	text-transform: capitalize;
}
@media only screen and (max-width:768px) { 
.hero-text h1{font-size:40px;}
}

@media only screen and (max-width:320px) { 
.slider-info h1{font-size:30px;}
}
.hero-text p {
	color: #fff;
	width: 70%;
	margin: auto;
	margin-bottom: 40px;
	margin-top: 25px;
}
@media only screen and (max-width:480px) { 
.hero-text p {width: 100%;}
}
.btn-home-bg {
	background: #35ac39;
	border: 1px solid #35ac39;
	border-radius: 5px;
	color: #fff;
	font-size: 16px;
	padding: 14px 60px;
	text-transform: capitalize;
	transition: all 0.3s ease 0s;
	font-weight: 700;
}
.btn-home-bg:hover, .btn-home-bg:focus{
background:#35ac39;
border: 1px solid #35ac39;	
color: #fff;
}
.home_video{height: 750px;position:relative;}
.home_video:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  content: "";
  left: 0;
  top: 0;
}
.html-video {
    top: 0%;
    left: 0%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.slider-caption {
    position: absolute;
    top: 33%;
    width: 100%;
    left: 0;
    text-align: center;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}
video {
	min-width: 100%;
	height: 100%;
}
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 04.START ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/
.about_us {
	background: #e0eff4;
}
.single_about_img{text-align: center;}
.single_about_img img{}
.single_about {
  padding-top: 120px;
}
@media only screen and (max-width:768px){
.single_about {
  padding-top:0px;
}
}
@media only screen and (max-width:480px){
.single_about {padding-top:60px;}
}
.single_about h1{
text-transform: capitalize;
font-weight: 800;
font-size: 40px;	
}
.single_about span{
background: #35ac39 none repeat scroll 0 0;
display: block;
height: 2px;
margin: 10px 0;
width: 100px;	
}
.single_about p{margin-bottom:30px}

.service_bg{background:#f9f9f9;}
.serviceBox {
	margin-top: 10px;
	position: relative;
	background: #fff;
	padding: 40px;
}
@media only screen and (max-width:768px){
.serviceBox{ margin-bottom:40px; }
}
.serviceBox:after{
    content: "";
    width: 100%;
    height: 10px;
    background: transparent;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: all 0.5s ease 0s;
}
.serviceBox:hover:after{
    border-color: #35ac39;
}
.serviceBox .service-icon{
color: #1d293e;
font-size: 60px;
line-height: 0;
margin: 0 0 20px 0px;
transition: all 0.5s ease 0s;
}
.serviceBox:hover .service-icon{color: #35ac39;}
.serviceBox .title{
font-size: 22px;
font-weight: 600;
margin: 0 0 15px;
text-transform: capitalize;
}
.serviceBox .service-no{
    display: inline-block;
    float: right;
    font-size: 32px;
    color: #ddd;
    line-height: 20px;
}
.serviceBox .description{
    margin: 0;
}
@keyframes loading{
    49%{ transform: translateY(-100%); }
    50%{
        opacity: 0;
        transform: translateY(100%);
    }
    51%{ opacity: 1; }
}
@media only screen and (max-width:990px){
    .serviceBox{ margin-bottom: 40px; }
}
/*
* ----------------------------------------------------------------------------------------
* 04.END ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 05.START TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/
.single-team{
position: relative;
border-radius: 10px;
}
@media only screen and (max-width:768px) { 
.single-team{margin-bottom: 30px;}
}
.single-team::before {
	content: "";
	background:rgba(0, 0, 0, 0.4);
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: 0.3s;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	border-radius: 10px;
}
.single-team .img img {
	border-radius: 10px;
	width: 100%;
}
.single-team .team-content {
	text-align: center;
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 20px;
	transition: 0.3s;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	opacity: 0;
	visibility: hidden;
	background: #fff;
	padding: 20px;
	border-radius: 10px;
}
.team-content h3{
	margin: 0px;
	font-weight: 600;
	font-size: 22px;
	margin-bottom: 5px;
}
.team-content p{
font-weight: 500;
font-size: 14px;
}

.single-team .team-content  ul.social{list-style:none;margin-top: 10px;}
.single-team .team-content .social li {display: inline-block;}
.single-team .team-content .social li a {
	display: block;
	height: 40px;
	width: 40px;
	line-height: 40px;
	border-radius: 100px;
	border: 1px solid #eee;
	font-size: 14px;
	color: #1d293e;
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.single-team .team-content .social li a:hover {
color: #35ac39;
}
.single-team:hover::before {
  opacity: 0.7;
}
.single-team:hover .team-content {
  opacity: 1;
  visibility: visible;
}
/*
* ----------------------------------------------------------------------------------------
* 05.END TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 06.START VIDEO DESIGN
* ----------------------------------------------------------------------------------------
*/
.watch_video {}
.watch_video h2 {
	margin-bottom: 20px;
	font-size: 34px;
	line-height: 42px;
	font-weight: 700;
}
.watch_video p {
	margin-bottom: 20px;
}
.video-play {
	margin-top: 35px;
	display: block;
}
.video-play i {
	background: #35ac39;
	color: #fff;
	width: 60px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	border-radius: 100px;
	margin-right:15px;
	display: inline-block;
	box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.15);
}
.video-title {
	font-weight: 600;
	color: #35ac39;
}
@media only screen and (max-width:768px) { 
.watch_video_img{margin-bottom:60px;}
.watch_video_img  img{width:100%;}
}
/*
* ----------------------------------------------------------------------------------------
* 06.END VIDEO DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 * 07.START PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */
.promotion_offer{
background-position: center top;
background-repeat: repeat-y;
position: relative;
}
.promotion_offer:before {
    background:#020928;
	opacity:0.7;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.promotion_content {
	background: #fff;
	padding: 60px;
}
.promotion_content p {
	font-size: 30px;
	line-height: 40px;
	color: #1d293e;
	margin: 0 auto 30px;
	font-weight: 600;
}
@media only screen and (max-width:480px) { 
.promotion_content p{font-size: 30px;}
}
.btn-promotion-bg {
	background: #35ac39;
	border: 1px solid #35ac39;
	border-radius: 5px;
	color: #fff;
	font-size: 16px;
	padding: 14px 60px;
	text-transform: capitalize;
	transition: all 0.3s ease 0s;
	font-weight: 700;
}
.btn-promotion-bg:hover, .btn-promotion-bg:focus{
background:#35ac39;
border: 1px solid #35ac39;	
color: #fff;
}
@media only screen and (max-width:480px) { 
.btn-promotion-bg{padding: 12px 40px;}
}
/*
 * ----------------------------------------------------------------------------------------
 * 07.END PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */

/*
* ----------------------------------------------------------------------------------------
* 08.START PROCESS DESIGN
* ----------------------------------------------------------------------------------------
*/
.our_service {
	background: #e0eff4;
}
.single_service {
	background: #fff;
	padding: 40px;
}
@media only screen and (max-width:768px){
.single_service{ margin-bottom:30px; }
}
.single_service:hover{}
.single_service h3 {
	font-size: 24px;
	font-weight: 600;
	margin-top: 30px;
	text-transform: capitalize;
	margin-bottom: 20px;
}
@media only screen and (max-width:768px) { 
.single_service h3 {font-size: 22px;}
}
.single_service > i {
background: #35ac39 none repeat scroll 0 0;
border: 1px solid #35ac39;
border-radius: 100px;
box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
color: #fff;
font-size: 30px;
height: 80px;
left: 45px;
line-height: 80px;
text-align: center;
top: 0;
transition: all 0.3s ease 0s;
width: 80px;
}
.single_service p{margin-bottom: 20px;}
.single_service ul{list-style: outside none none;}
.single_service ul li i{
	color: #1d293e;
margin-right: 10px;
}
.single_service ul li{line-height: 30px;}
/*
* ----------------------------------------------------------------------------------------
* 08.END PROCESS DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 09.START RECENT PROJECT DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_project {
	background: #fff;
	text-align:center;
	margin: 20px 0;
	z-index: 2;
	position: relative;
	padding: 20px;
	-webkit-transition: all 0.4s ease 0s;
	-o-transition: all 0.4s ease 0s;
	transition: all 0.4s ease 0s;
	border-radius:10px;
	height: 350px;
}
.single_project:before {
    background:#020928;
	opacity:0.6;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.single_project:hover{
-webkit-box-shadow:0px 60px 60px rgba(0,0,0,0.1);
        box-shadow:0px 60px 60px rgba(0,0,0,0.1);
position:relative;
z-index:100;
background:#3b7eff;
-webkit-transform: translate(0, -10px);
    -ms-transform: translate(0, -10px);
        transform: translate(0, -10px);
}

.single_project h2 {
	margin: 0;
	position: relative;
	text-transform: capitalize;
	top: 90px;
	-webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
	-o-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
	transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
	font-weight: 700;
	font-size: 26px;
	color: #fff;
	line-height: 32px;
	padding-top: 10px;
}
.single_project:hover h2 {
    color: #fff;
    top: 80px;
	margin-bottom:20px;
}

.single_project a{
opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    -o-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
    transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
} 
.single_project:hover a{
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.project_btn {
	background: #35ac39;
	border: 1px solid #35ac39;
	border-radius: 5px;
	color: #fff;
	font-size: 16px;
	overflow: hidden;
	display: inline-block;
	padding:12px 40px;
	text-transform: capitalize;
	transition: all 0.3s ease 0s;
	font-weight: 700;
	margin-top:40%
}
.project_btn:hover, .project_btn:focus{
background:#35ac39;
border: 1px solid #35ac39;	
color: #fff;
}
/*project modal*/
.modal-title {
    color: #1d293e;
    margin: 0;
	display: none;
    text-transform: uppercase;
}
.modal-content {
    padding: 10px 30px;
    border-radius: 0px;
}
.modal-body { margin-bottom: 15px }
.modal-body p { margin: 15px 0 0 }
.project-list { margin-top: 30px }
.project-list label {
	color: #1d293e;
	margin-bottom: 0;
	margin-right: 0;
	width: 120px;
}
.project-list li {
    padding: 7px 0;
    font-size: 14px;
}
.project-list li a {
    color: #1d293e;
    margin-bottom: 0;
    margin-right: 7px;
    width: 125px;
}
.project-list li a:hover { color: #35ac39; }
/*End project modal*/
/*
* ----------------------------------------------------------------------------------------
* 09.END RECENT PROJECT DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 10.START PROTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/
.recent-projects{
padding-top:60px;
padding-bottom:30px;	
}
.portfolio-filters { margin-bottom: 60px }
.portfolio-filters li.active {
color: #fff;
background:#35ac39;
border: 1px solid #35ac39;
}
.portfolio-filters li {
border: 1px solid #eee;
border-radius: 30px;
color: #1d293e;
cursor: pointer;
display: inline-block;
font-weight: 600;
margin-right: 5px;
padding: 8px 40px;
text-transform: capitalize;
transition: all 0.4s ease 0s;
}
@media only screen and (max-width:768px) { 
    .portfolio-filters li { padding: 8px 24px;margin-bottom: 10px }
}
.portfolio-filters li:hover {
    color: #fff;
	background:#35ac39;
border: 1px solid #35ac39;
}
.grid {
  overflow: hidden;
}
.grid .mix {
    display: none;
    opacity: 0;
    filter: alpha(opacity=0);
}
.box{
    overflow: hidden;
    perspective: 800px;
    position: relative;
}
.box:after{
    content: "";
    width: 100%;
    height: 100%;
    background:rgba(0,0,0,0.6);
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform: rotateX(-90deg);
    transform-origin: 50% -50% 0;
    visibility: hidden;
    transition: all 0.5s ease 0s;
}
.box:hover:after{
    transform: rotateX(0deg);
    visibility: visible;
    opacity: 1;
}
.box img{
    width: 100%;
    height: auto;
}
.box .box-content {
	width: 70%;
	text-align: center;
	position: absolute;
	top: 0;
	left: 15%;
	opacity: 0;
	z-index: 1;
	transform: translate(0%, 0%);
	transition: all 0.5s ease 0s;
	background: #fff;
	padding: 20px;
}
.box:hover .box-content{
    opacity: 1;
    top: 50%;
    transform: translate(0%, -50%);
}
.box .title {
	font-size: 20px;
	font-weight: 800;
	margin-top: 0;
	text-transform: capitalize;
}
.box .post{
text-transform: capitalize;
}
.box .icon{
    list-style: none;
    padding: 0;
    margin: 10px 0 0 0;
    opacity: 0;
    transition: all 0.5s ease 0.3s;
}
.box:hover .icon{
    opacity: 1;
}
.box .icon li{
    display: inline-block;
    margin-right: 5px;
    position: relative;
    transition: all 0.5s ease 0.3s;
}
.box .icon li:first-child{ left: -40%; }
.box .icon li:last-child{ right: -40%; }
.box:hover .icon li:first-child{ left: 0; }
.box:hover .icon li:last-child{ right: 0; }
.box .icon li a{
    width: 35px;
    height: 35px;
    line-height: 34px;
    border-radius: 50%;
    border: 1px solid #fff;
    font-size: 16px;
    color: #fff;
    transition: all 0.5s ease 0s;
}
.box .icon li a:hover{
    border-color: transparent;
}
/*
* ----------------------------------------------------------------------------------------
* 10.END PROTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 11.START TESTIMONIALS DESIGN
* ----------------------------------------------------------------------------------------
*/
.testimonial{
    background: #e0eff4;
    text-align: center;
    padding: 30px 30px 70px;
    margin: 0 15px 100px;
    position: relative;
}
.testimonial-title h2{
font-size: 30px;
line-height: 46px;
margin: auto auto 60px;
width: 70%;		
}
@media only screen and (max-width:768px) { 
.testimonial-title h2{
padding:0px 10px;
width: 100%;	
}
}
.testimonial:before,
.testimonial:after{
    content: "";
    border-top: 40px solid #e0eff4;
    border-right: 125px solid transparent;
    position: absolute;
    bottom: -40px;
    left: 0;
}
.testimonial:after{
    border-right: none;
    border-left: 125px solid transparent;
    left: auto;
    right: 0;
}
.testimonial .icon{
    display: inline-block;
    font-size: 70px;
    color: #35ac39 ;
    margin-bottom: 20px;
    opacity: 0.6;
}
.testimonial .description {
	margin-bottom: 30px;
}
.testimonial .testimonial-content{
    width: 100%;
    position: absolute;
    left: 0;
}
.testimonial .pic{
border: 2px solid #fff;
border-radius: 50%;
box-shadow: 0 0 2px 2px #35ac39;
display: inline-block;
margin-bottom: 5px;
overflow: hidden;
position: relative;
z-index: 1;
}
.testimonial .pic img {
	width: 90px;
	height: auto;
}
.testimonial .title{
    font-size:20px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 0 0 5px 0;
}
.testimonial .post{
    display: block;
    font-size: 14px;
}

@media only screen and (max-width: 650px) and (min-width: 400px){
    .testimonial:before{ border-right: 325px solid transparent; }
    .testimonial:after{ border-left: 325px solid transparent; }
}
.owl-theme .owl-controls {
    margin-top: 50px;
    text-align: center;
}
.owl-theme .owl-controls .owl-page { display: inline-block }
.owl-controls .owl-page,
.owl-controls .owl-buttons div { cursor: pointer }
.owl-theme .owl-controls .owl-page span {
	background-color: #35ac39 !important;
	border-radius: 20px;
	display: block;
	height: 6px;
	margin: 5px 3px;
	width: 6px;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { background-color: #fff }
.owl-theme .owl-controls {
  display: block !important;
  margin-top:10px;
  text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 11.END TESTIMONIALS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
 * ----------------------------------------------------------------------------------------
 * 12.START PRICING DESIGN
 * ----------------------------------------------------------------------------------------
 */
.our_pricing {
	background: #e0eff4;
}

.pricingTable{
background: #fff none repeat scroll 0 0;
color: #1d293e;
padding: 50px 15px;
-webkit-perspective: 700px;
        perspective: 700px;
position: relative;
text-align: center;
-webkit-transition: all 0.3s ease-in-out 0s;
-o-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
z-index: 1;
}
@media only screen and (max-width:480px){
.pricingTable{ margin-bottom:30px; }
}
.pricingTable .pricingTable-header{}
.pricingTable .title {
	display: block;
	font-size: 26px;
	font-weight: 600;
	text-transform: capitalize;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}
.pricingTable .price-month {
	font-size: 16px;
	font-weight: 500;
	margin-top: 5px;
	border-bottom: 1px solid #eee;
	padding-bottom: 10px;
}
.pricingTable .price-value {
	font-size: 170px;
	line-height: 112px;
	position: relative;
	color: #e4f1ff;
	margin: 40px 0;
}
@media only screen and (max-width:768px) { 
.pricingTable .price-value {font-size: 100px;}
}
.pricingTable .price-value .value-bg {
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	    transform: translateX(-50%) translateY(-50%);
	color: #1386fc;
	font-weight: 600;
	font-size: 60px;
	line-height: 60px;
}
@media only screen and (max-width:768px) { 
.pricingTable .price-value .value-bg {font-size:36px;}
}
.pricingTable-2 .price-value {
  color: #e0eff4;
}

.pricingTable-2 .price-value .value-bg {
  color: #35ac39;
}
.pricingTable .pricing-content{
    list-style: none;
    padding: 0;
    margin: 20px 0 20px 0;
}
.pricing-content-border{}
.pricing-content-border > li {
  border: 1px solid #eee;
  margin-bottom: 10px;
}
.pricingTable .pricing-content li{
    line-height: 40px;
}
.btn-price-bg {
	background: #35ac39;
	border: 2px solid #35ac39;
	border-radius: 4px;
	color: #fff;
	display: inline-block;
	font-size: 16px;
	overflow: hidden;
	padding: 10px 60px;
	text-transform: capitalize;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	font-weight: 700;
}
.pricingTable:hover .btn-price-bg{
background:#1d293e;
color:#fff;
border: 2px solid #1d293e;
}
@media only screen and (max-width:768px) { 
.btn-price-bg {padding: 10px 30px;}
}
/*
 * ----------------------------------------------------------------------------------------
 * 12.END PRICING DESIGN
 * ----------------------------------------------------------------------------------------
 */
 
/*
* ----------------------------------------------------------------------------------------
* 13.START NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.newsletter_section{
background:#232a34;
padding:100px 0;
}
.newsletter-title {
	color: #fff;
	font-weight: 700;
	margin-bottom: 30px;
	text-transform: uppercase;
	font-size: 32px;
}
@media only screen and (max-width:768px) { 
.newsletter-title {
font-size: 22px;
margin-bottom: 30px;
margin-top: 0;
text-align: center;
}
}
.newsletter input {
background: #fff none repeat scroll 0 0;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius:0px !important;
box-shadow: none;
color: #1d293e;
font-family: montserrat,sans-serif;
font-size: 14px;
height: 50px !important;
}
.newsletter input:hover,
.newsletter input:focus {
background: #fff none repeat scroll 0 0;
border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: none !important;
}
.newsletter_form_border{
background: #35ac39 none repeat scroll 0 0;
display: block;
height: 2px;
margin: auto auto 30px;
width: 100px;	
}
.btn-newsletter-bg {
background: #35ac39 none repeat scroll 0 0;
border: 2px solid #35ac39;
border-radius: 0;
box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.1);
color: #fff;
font-size: 14px;
font-weight: 500;
letter-spacing: 0.5px;
margin-left: 20px;
padding: 8px 20px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
@media only screen and (max-width:480px) { 
.btn-newsletter-bg {padding: 7px 20px;}
}
.btn-newsletter-bg:hover,
.btn-newsletter-bg:focus {
    background: #fff;
    color: #1d293e;
    border: 2px solid #fff;
}
@media only screen and (max-width:480px) { 
.btn-newsletter-bg {margin-left:0px;  }
}
/*
* ----------------------------------------------------------------------------------------
* 13.END NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/
 
 
/*
* ----------------------------------------------------------------------------------------
* 14.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact_us{background:#e0eff4;}
@media only screen and (max-width:768px) { 
.contact_image{margin-bottom:60px;}
}
.contact {
	background: #fff;
	padding: 60px;
}
.contact input {
	background: #f5f8fa;
	border: 2px solid #f5f8fa;
	border-radius: 2px;
	box-shadow: none;
	color: #1d293e;
	font-size: 16px;
	font-weight: 400;
	height: 52px;
	padding: 10px 10px 10px 30px;
	width: 100%;
}
.contact textarea {
	background: #f5f8fa;
	border: 2px solid #f5f8fa;
	border-radius: 2px;
	box-shadow: none;
	color: #1d293e;
	font-size: 16px;
	font-weight: 400;
	padding: 10px 10px 10px 30px;
	width: 100%;
}
.contact input:focus {
border: 2px solid #35ac39 ;
    box-shadow: none;
    outline: 0 none;
}
.contact textarea:focus {
border: 2px solid #35ac39 ;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #35ac39 none repeat scroll 0 0;
border-radius: 30px;
color: #fff;
display: inline-block;
font-size: 14px;
font-weight: 500;
letter-spacing: 0.5px;
outline: medium none;
padding: 15px 27px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #1d293e;
    color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 14.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 15.START PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
.buy_now {}
.buy_now_bg {
    background: #232a34 none repeat scroll 0 0;
    padding: 60px 0;
	border-radius:10px;
	box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.15);
}
.buy_now_title {
color: #fff;
font-size: 40px;
font-weight: 700;
margin-bottom: 30px;
text-transform: uppercase;
}
@media only screen and (max-width:768px) { 
    .buy_now_title { font-size: 22px }
}
@media only screen and (max-width:360px) { 
    .buy_now_title { font-size: 15px }
}
.btn-buy-bg {
	background: #35ac39;
	border: 1px solid #35ac39;
	border-radius: 5px;
	color: #fff;
	font-size: 16px;
	padding: 14px 60px;
	text-transform: capitalize;
	transition: all 0.3s ease 0s;
	font-weight: 700;
}
.btn-buy-bg:hover, .btn-buy-bg:focus{
background:#35ac39;
border: 1px solid #35ac39;	
color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 15.END PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 16.START CONTACT ADDRESS DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact-address{
background:#e0eff4;
}
.address{
background:#fff;
padding: 60px 30px;	
}
@media only screen and (max-width:768px){
.address{ margin-bottom:30px; }
}
.single_address{margin-bottom:30px;}
.single_address i {
	color: #fff;
	font-size: 22px;
	margin-right: 20px;
	float: left;
	margin-bottom: 50px;
	background: #35ac39;
	width: 60px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	border-radius: 30px;
}
.single_address h4 {
	overflow: hidden;
	margin-bottom: 15px;
	font-weight: 700;
	font-size: 22px;
	text-transform: capitalize;
}
.single_address p {
	overflow: hidden;
	margin-bottom: 0px;
}
/*START FOOTER SOCIAL DESIGN*/
.footer_social {margin-top:40px; }
.footer_social h4 {
	margin-bottom: 20px;
	font-weight: 600;
	text-transform: capitalize;
	border-bottom: 1px solid #eee;
	padding-bottom: 10px;
}
.footer_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.footer_social ul li { display: inline-block }
.footer_social ul li a {
	border-radius: 30px;
	color: #fff;
	display: block;
	font-size: 20px;
	height: 50px;
	line-height: 50px;
	margin: 2px;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.3s ease 0s;
	width: 50px;
	text-align: center;
}
@media only screen and (max-width:768px) { 
    .footer_social ul li a { font-size: 12px }
}
@media only screen and (max-width:480px) { 
    .footer_social ul li a { font-size: 16px }
}
.footer_social ul li a:hover {
background:#35ac39;
 border: 1px solid #35ac39!important;
color: #fff;}
.f_facebook {
    background: #5D82D1;
    border: 1px solid #5D82D1;
}
.f_twitter {
    background: #40BFF5;
    box-shadow: 0 0 0 0px #40BFF5;
    border: 1px solid #40BFF5;
}
.f_google {
    background: #EB5E4C;
    box-shadow: 0 0 0 0px #EB5E4C;
    border: 1px solid #EB5E4C;
}
.f_linkedin {
    background: #238CC8;
    box-shadow: 0 0 0 0px #238CC8;
    border: 1px solid #238CC8;
}
.f_youtube {
    background: #CC181E;
    box-shadow: 0 0 0 0px #CC181E;
    border: 1px solid #CC181E;
}
.f_skype {
    background: #00AFF0;
    box-shadow: 0 0 0 0px #00AFF0;
    border: 1px solid #00AFF0;
}
/*END FOOTER SOCIAL DESIGN*/ 
.map{}
.map iframe {
	width: 100%;
	height: 625px;
	background: #fff;
	padding: 10px;
}
/*
* ----------------------------------------------------------------------------------------
* 16.END CONTACT ADDRESS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 17.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

.footer{
    background: #232a34 none repeat scroll 0 0;
    padding: 30px 0;
}

.footer_copyright{padding-top:0px;}
.footer_copyright p{
color: #fff;
text-align: center;
text-transform: capitalize;
} 

/*
* ----------------------------------------------------------------------------------------
* 17.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

#menu-tab {
	margin-bottom: 60px;
}
.tab-content > .active {
	display: block;
}
.nav-tabs {
	border: none;
	width:58%;
	margin: 0 auto;
}
@media only screen and (max-width:768px) { 
.nav-tabs {width:90%;}
}
.nav-tabs > li.active > a{
	background: #f9461d!important;
	color: #fff!important;
}
.nav-tabs > li > a{
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
border-color: #eee #eee #ddd;
border-image: none;
border-radius: 0;
border-style: solid;
border-width: 1px;
color: #333;
font-size: 16px;
font-weight: 600;
margin-right: 10px;
padding: 10px 25px;
text-transform: uppercase;
}
@media only screen and (max-width:480px) { 
.nav-tabs > li > a{margin-bottom:10px;}
}
.nav-tabs > li > a:hover,
.nav-tabs > li.active > a:hover{
	background: #f9461d!important;
	color: #fff!important;
	border: 1px solid #f9461d!important;	
}
.menu-item {
	border-bottom: 1px solid #eee;
	padding: 30px;
}
@media only screen and (max-width:768px) { 
.menu-item {padding:10px;margin-bottom: 30px;}
}
.menu-item img {
	float: left;
	margin-right: 15px;
}

.menu-inner {
	padding-top: 30px;
}

.menu-inner h4 {
display: block;
font-size: 20px;
font-weight: 700;
line-height: 28px;
padding-bottom: 0;
text-transform: uppercase;
}

.menu-inner span {
	line-height: 36px;
	color: #35ac39;
	font-size: 26px;
	margin-bottom: 10px;
	display: block;
}


.effect-bubba{margin: 0 15px 20px;}

.style-switcher {
	position: relative;
	top: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	background: #fff;
	padding: 10px;
}
.style-switcher ul{list-style:none;}
.style-switcher ul li{}
.style-switcher ul li a {
	font-weight: 600;
	color: #333;
	text-transform: uppercase;
	font-size: 13px;
	transition: 0.3s;
}
.style-switcher ul li a:hover{color:#35ac39;}