/*
Author       : theme_ocean.
Template Name: Orange - 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 PROMOTION DESIGN
    07. START PROCESS DESIGN
    08. START RECENT PROJECT DESIGN
    09. START PROTFOLIO DESIGN
    10. START TESTIMONIALS DESIGN
    11. START PRICING DESIGN
    12. START NEWSLETTER DESIGN
    13. START CONTACT DESIGN
    14. START PROMOTION DESIGN
    15. START CONTACT ADDRESS DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
background: #fff none repeat scroll 0 0;
color: #212529;
font-family: 'Poppins', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 24px;
overflow-x: hidden;
margin: auto;
}
html,
body { height: 100%;position:relative;  }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0px;
  margin-top: 0px; 
  font-family: 'Jost', sans-serif;
  color: #1b2032;
  font-weight: 400;
}
a {
font-family: 'Jost', 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;
}
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 #72c02c;
    border-right: 8px solid #72c02c;
    border-bottom: 8px solid #72c02c;
    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: 60px 0;}
/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom:60px;}
.section-title  h1 {
font-size: 44px;
font-weight: 700;
margin-top: 0;
position: relative;
text-transform: uppercase;
}
h1.section-title-white{
color:#fff;
font-size: 54px;
font-weight: 700;
margin-top: 0;
position: relative;
text-transform: uppercase;
}
p.section-title-white{color:#fff;}
@media only screen and (max-width:480px) { 
.section-title  h1  {font-size:30px;}
}
.section-title span{
background: #72c02c 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: #72c02c 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: #232a34;
    color: #fff;
}
/*END SCROLL TO TOP*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.site-logo {
color: #fff;
position: relative;
}
.site-logo a {
color: #fff;
}
.site-logo img{
	width: auto;
	height: 50px;
}
.navbar-fixed .logo-hidden{
display:block!important;	
}
.bg-faded {
	background-color:transparent;
	-webkit-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
.navbar-fixed {
    z-index: 999;
    position: fixed;
    opacity: .98;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";
    width: 100%;
	padding:20px 0;
    top: 0;
    -webkit-animation: fadeInDown 800ms;
    animation: fadeInDown 800ms;
    -webkit-backface-visibility: hidden;
    border-radius: 0px;
    background: #232a34;
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.07);
}

#navigation{
	padding: 20px 0;
}
#navigation.navbar-fixed {
	padding: 20px 0;
}
.header_right {
float:right;
}
@media only screen and (max-width:767px) { 
.header_right {float:none;}
}
#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: 18px;
	text-transform: capitalize;
	-webkit-transition: .3s;
	transition: .3s;
}
#navigation.navbar-fixed #main-menu ul li a{
	color: #fff;
}
#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:#72c02c;
}

.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: #1b2032;

}

#navigation ul li ul ,
#navigation ul li ul li ul{
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
position: inherit;
top: 0;
-webkit-transition: all 0.3s ease 0s;
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;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
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:768px) {
.bg-faded {background-color:#232a34;}
.navbar-fixed {background: #232a34;}
.navbar-brand { padding-top: 20px;}
.slicknav_menu {
	font-size: 15px;
	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
* ----------------------------------------------------------------------------------------
*/
@media only screen and (max-width:480px) { 
#fw_al_003{margin-top:90px;}
}

.home_parallax{height: 700px;position:relative;}
.home_parallax:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
  content: "";
  left: 0;
  top: 0;
}
.hero-text{
	padding-top:250px;
	position: relative;
	top: 30px;
}
@media only screen and (max-width:1024px) { 
.hero-text{
	top: 0px;
	}
}
@media only screen and (max-width:768px) { 
.hero-text{
	top: 30px;
	}
}
@media only screen and (max-width:480px) { 
.hero-text{
	padding-top:200px;
	top: 80px;
	}
}
@media only screen and (max-width:360px) { 
.hero-text{padding-top:150px;}
}
.hero-text img{margin-bottom:30px;position: relative;}	
.hero-text h1{	
color: #fff;
font-size: 70px;
font-weight: 900;
position:relative;
text-transform: uppercase;
}
@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;
font-size: 24px;
position:relative;
margin-bottom: 25px;	
}
@media only screen and (max-width:480px) { 
.hero-text p {width: 100%;}
}
.btn-home-bg{
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 3px solid #fff;
border-radius: 500px;
color: #fff;
font-size: 14px;
padding: 12px 40px;
text-transform: uppercase;
position:relative;
font-weight: 500;
transition: all 0.3s ease 0s;
}
.btn-home-bg:hover, .btn-home-bg:focus{
background:#fff;
border: 3px solid #fff;	
color: #1b2032;
}
.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
* ----------------------------------------------------------------------------------------
*/

.single_about_img{text-align: center;}
.single_about_img img{}
.single_about {
	padding: 50px 0px;
}
@media only screen and (min-width: 992px) {
	.about_description {
		height: 370px;
		position: relative;
	}
	.single_about {
		margin: auto;
		padding: 0px;
		position: absolute;
		top: 30%;
	}
}

.single_about h1 {
	text-transform: uppercase;
	font-weight: 700;
	font-size: 40px;
}
.single_about span{
background: #03a9f4 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 {
	/* padding-bottom: 40px; */
	/* margin-top: 10px; */
	position: relative;
	background: #fff;
	box-shadow: 0 10px 40px -10px rgba(0,64,128,.2);
	padding: 40px;
	border-radius: 5px;
}
@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: #72c02c;
}
.serviceBox .service-icon{
color: #1b2032;
font-size: 60px;
line-height: 0;
margin: 0 0 20px 0px;
transition: all 0.5s ease 0s;
}
.serviceBox:hover .service-icon{
    animation: 0.3s ease 0s normal forwards 1 running loading;
	color: #72c02c;
}
.serviceBox .title {
	font-size: 20px;
	font-weight: 700;
	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 VISION DESIGN
 * ----------------------------------------------------------------------------------------
 */
.vision{
background-position: center top;
background-repeat: repeat-y;
height: 500px;
position: relative;
}
.vision:before {
background: rgba(0, 0, 0, 0.3);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.vision_content p{
color: #fff;
font-size: 40px;
line-height: 50px;
margin: 0 auto 30px;
padding-top: 180px;
}
@media only screen and (max-width:480px) { 
.vision_content p{
font-size: 30px;
padding-top: 120px;
}
}
.btn-vision-bg {
background: #72c02c none repeat scroll 0 0;
border: 1px solid #72c02c;
border-radius: 2px;
box-shadow: 0 11px 11px 0 rgba(0, 0, 0, 0.06);
color: #fff;
font-size: 14px;
font-weight: 600;
letter-spacing: 0.5px;
padding: 12px 40px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.btn-vision-bg:hover,
.btn-vision-bg:focus {
    background: #fff;
    border: 1px solid #fff;
    color: #1b2032;
}
/*
 * ----------------------------------------------------------------------------------------
 * 05.END VISION DESIGN
 * ----------------------------------------------------------------------------------------
 */
 

/*
* ----------------------------------------------------------------------------------------
* 06.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact{margin-bottom:0px;}
.contact input {
background:none repeat scroll 0 0;
border: 2px solid #eee;
border-radius: 30px;
box-shadow: none;
color: #1b2032;
font-size: 16px;
font-weight: 400;
height: 50px;
margin-bottom: 30px;
padding: 10px 10px 10px 30px;
width: 100%;
}
.contact textarea {
background:none repeat scroll 0 0;
border: 2px solid #eee;
border-radius: 30px;
box-shadow: none;
color: #1b2032;
padding: 10px;
width: 100%;
font-size:16px;
margin-bottom: 30px;
padding-left: 30px;
font-weight: 400;
}
.contact input:hover, .contact input:focus {
border: 2px solid #72c02c ;
    box-shadow: none;
    outline: 0 none;
}
.contact textarea:hover, .contact textarea:focus {
border: 2px solid #72c02c ;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #72c02c 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: #1b2032;
    color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 06.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 07.START JOIN US DESIGN
* ----------------------------------------------------------------------------------------
*/
.joinus {
    background: #232a34 none repeat scroll 0 0;
    padding: 60px 0;
	color: #fff;
}
.joinus_title {
	color: #fff;
	font-size: 40px;
	font-weight: 700;
	margin-bottom: 30px;
	text-transform: uppercase;
}
@media only screen and (max-width:768px) { 
    .joinus_title { font-size: 22px }
}
@media only screen and (max-width:360px) { 
    .joinus_title { font-size: 15px }
}
.joinus p {
	margin-bottom: 30px;
}
.joinus a {
	color: #dde4ed;
	font-family: 'Poppins', sans-serif;
	text-decoration: underline;
}

.joinus a:hover {
	text-decoration: none;
}
/*
* ----------------------------------------------------------------------------------------
* 07.END JOIN US DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 08.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
	color: #fff;
	background-color: #454a52;
}
.footer_contact{
background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
padding: 60px 30px;	
}
.footer_contact h2{
color: #f2f2f2;
font-size: 40px;
position:relative;
}
@media only screen and (max-width:480px) { 
.footer_contact h2{font-size: 20px;}
}
.footer_contact h1{
color: #f2f2f2;
font-size: 60px;
position:relative;
font-weight: 800;
}
@media only screen and (max-width:480px) { 
.footer_contact h1{font-size: 40px;}
}
.footer_contact h3{
color: #f2f2f2;
font-size: 40px;
position:relative;
line-height: 58px;
}
@media only screen and (max-width:480px) { 
.footer_contact h3{
font-size: 30px;
line-height: 40px;}
}
.footer_copyright{padding:15px 0;}
.footer_copyright p{
text-align: left;
text-transform: capitalize;
} 
/*START FOOTER SOCIAL DESIGN*/
.footer_social {margin: 30px 0; }
.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: 16px;
    height: 50px;
    line-height: 50px;
	position:relative;
    margin: 2px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 50px;
}
@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:#fff;
 border: 1px solid #fff!important;
color: #1b2032;}
.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*/ 
/*
* ----------------------------------------------------------------------------------------
* 08.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 0.START MENU DESIGN
* ----------------------------------------------------------------------------------------
*/

#menu-tab {}

#menu-tab {
	margin-bottom: 60px;
}

.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: #72c02c!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: #1b2032;
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: #72c02c!important;
	color: #fff!important;
	border: 1px solid #72c02c!important;	
}
.menu-item {
	padding-bottom: 30px;
	border-bottom: 1px solid #eee;
}

.menu-item img {
	float: left;
	margin-right: 15px;
	width: 40%;
	background: #fff;
}

.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 h4 span {
	margin-left: 20px;
	background: #fff;
	display: inline-block;
	text-align: center;
	line-height: 35px;
	color: #72c02c;
	font-size: 30px;
	float: right;
}

/*
* ----------------------------------------------------------------------------------------
* 0.END MENU DESIGN
* ----------------------------------------------------------------------------------------
*/
.effect-bubba{margin: 0 15px 20px;}