
/* ================================== custom css ============================  */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');



body {font-family: 'Roboto', sans-serif !important; font-size:16px; letter-spacing:.5px;}
p{color:#979797; font-size:1em;}
li {list-style:none;}
.navbar-brand img {}
.bg-custom {background:#fff; box-shadow: 0px 6px 0px #039145;}
.navbar-nav li a.nav-link {color:#039145; font-weight:600;}
#wb-hero { color:#979797;background-repeat:no-repeat !important; background-size:cover !important; background-attachment:fixed !important;
}
#wb-hero h3 {font-size:1.6em; font-weight:600;}
.banner-text {margin-top:18%; padding-bottom:18%;}
.banner-text h1 {font-size:3em; text-transform:capitalize; color:#039145;}
.banner-text h2 {font-size:1.4em;}
.app-dwn-btns a img { max-width: 200px;}
.app-dwn-btns a + a {margin-left:15px;}
.page-header h2{font-weight:500; font-size:1.1em; text-transform:capitalize; color:#979797; letter-spacing:2px;}
.page-header h1{font-weight:600; font-size:2em; text-transform:capitalize; color:#039145; max-width:50%; display:inline-block;}
.navbar-toggler i {font-weight:300; font-size:1.2em; color:#039145;}
.navbar-toggler,.navbar-toggler:focus{border-color:#039145;}
.navbar-nav li a:hover {color:#000000;}
.navbar-toggler:focus{outline-color:#039145; }

#wb-features h2{font-weight:600; font-size:1em; text-transform:capitalize; color:#333;}
#wb-features p{font-weight:400; font-size:1em; color:#979797; }
#wb-features .wb-icon img {max-width:70px; max-height:70px;}
.inner-section.page-header h1{max-width:100%;}
.page-header span.head-bar {width:65px; height:5px; background:#039145; display:block; clear:both; margin-bottom:15px;}
.wb-feature-list li {padding-left:30px;position:relative; margin-right:10px; color:#039145;}
.wb-feature-list li i { color:#039145; position:absolute; left:0px;top: 6px;
    font-size: 12px;}
.wb-src-img {position:relative;}
.wb-src-img img {max-width:100%; max-height:500px;}
.wb-src-img .wb-screen2, .wb-src-img .wb-screen1 {position:absolute; top:0; left:15%; }
.wb-src-img .wb-screen1 {left:30%;}
.wb-src-img .wb-screen1, .wb-src-img .wb-screen2 { transition:all ease 450ms;}
#wb-features-list:hover .wb-screen1 {left:35%} 
#wb-features-list:hover .wb-screen2 {left:10%} 
.intro-col {color:#fff; background:#039145; position:relative; height:270px; z-index:99; }
.intro-col h2 {font-size:2.2em; font-weight:600;}
.intro-col h2 big {font-size:2.8em;}
.intro-col i {font-size:3em;}
.video-placeholder {height:450px; background:#f0f0f0; margin-left:-50px; background:url(../images/video-placeholder.png) no-repeat center center; background-size:cover;}
#play-intro {padding:10px 30px; border-radius:10px; background:#e02a26; border:0; cursor:pointer;}
#play-intro i {color:#fff; font-size:1.2em}
.wb-owl .item .wb-owl-inner{padding:20px; width:100%; font-weight:400; text-align:center; background:#f8f8f8; color:#555555;}
.wb-owl-inner p {line-height:26px; min-height:120px; position:relative; padding:30px 0; font-size:.9em;}
.wb-owl-inner h3 {vertical-align:bottom;  font-size:14px; margin-top:20px; font-weight:400;}
.wb-owl-inner h3 strong{display:block;  font-size:16px; }
 .wb-owl-inner p:before {position:absolute; top:-5px; left:49%; color:#ccc; font-size:1.5em; content:''; font-family: 'FontAwesome' ;}

.owl-dots .owl-dot { display: inline-block;   position: relative; margin-top:40px; outline:none; }
.owl-dots .owl-dot span{float:left;  transform:scale(1);  height:18px; width:18px; margin:5px; background: #eaeaea; border-radius:50%; transition:all ease 300ms;}
.owl-dots .owl-dot.active span{  transform:scale(1.1); background:#039145; }
.owl-carousel .owl-item {margin-top:30px; margin-bottom:30px;}
#owl-comments .owl-item.active + .owl-item.active .item .wb-owl-inner { background: #fff !important; box-shadow: 0px 0px 21px rgba(0,0,0,0.1);}
#owl-comments .owl-item.active + .owl-item.active + .owl-item.active .item .wb-owl-inner { background:#f8f8f8 !important; box-shadow:none;}
.contant-info p {font-size:1.3em; color:#979797; font-weight:300; margin-bottom:5px;}
.contant-info p big{font-size:1.4em; color:#979797; font-weight:400; }
.contact-section input, .contact-section textarea {border:1px solid #e4e4e4; border-radius:10px; height:47px; margin-bottom:20px; font-size:1em;}
.contact-section textarea {height:150px; resize:none;  }
.contact-section button.wb-btn {padding:10px 15px; color:#fff; text-transform:uppercase; font-size:.8em; font-weight:500; background:#039145;}
.contact-section button.wb-btn:hover {background:#000000 ;}
#wb-footer {}
.wb-full-outer {display:block; border-bottom:1px solid #dcdcdc;}
.wb-footer-logo img{max-width:100px;}
ul.footer-nav {display:block; width:100%; clear:both; color:#555; margin-top:5px;}
.footer-nav li{display:inline-block; color:#555; padding:5px 10px;}
.navbar-nav.footer-nav li a {font-weight:400; color:#aaa; font-size:16px;}
.navbar-nav.footer-nav li a:hover {color:#039145;}
.copyright {padding:10px 0; background:#e8e8e8; width:100%;  font-size:0.9em;}
ul.wb-social {padding:0; margin:0;display:inline; }
ul.wb-social li{display:inline-block; margin-top:10px; padding-bottom:5px; }
ul.wb-social li a {padding:10px 5px; color:#555555; padding-bottom:0;}
ul.wb-social li a:hover {color:#fe785f;}
.copyright p {font-weight:300; margin-bottom:0px;}


.modal-dialog {  max-width: 800px;   margin: 30px auto;}
.modal-body { position:relative; padding:0px;}
.close { position:absolute; right:-30px; top:0; z-index:999; font-size:2rem; font-weight: normal; color:#fff; opacity:1;}

#owl-screens .owl-item.active + .owl-item.active + .owl-item.active .item .wb-owl-inner { z-index:-999; }
#owl-screens .owl-item.active .wb-owl-inner img{ transform:scale(1); opacity:1 !important;}
#owl-screens.wb-owl .item .wb-owl-inner {background:none;}
 
/* #owl-screens .owl-stage-outer:before {background:url(../images/iwbon-mockup.png) no-repeat center center; background-size:contain; position:absolute; left:0%; content:''; top:0; height:100%; width:100%; z-index:999; padding:30px; overflow:hidden; box-sizing:border-box;} */
.carousal-skin #owl-screens .owl-item { padding:0px;  }
.carousal-skin #owl-screens .owl-item img{   margin:2px 0 0 2px;}
.carousal-skin  { position:relative; padding:12px; padding-left:23px; display:block;  min-height:400px; float:left; width:100%; margin-top:20px;}
.carousal-skin:after {background:url(../images/screen-frame.png) no-repeat center center; background-size:contain; position:absolute;  left:0%; content:''; top:0; height:100%; width:100%; z-index:999;}
.abt-img img {max-width:85%;}
.abt-text h1, .abt-text p {width:100%; max-width:100%;}
#contant-section .abt-text h1 { 
	 
    letter-spacing: 0px;   
    text-transform: capitalize;
    margin-top:20px;

}

#contant-section .abt-text h1 small {font-size:14px;}



/* footer logo pop animations */


.wb-footer-logo a img {max-width:100%;}


/* media sections homepage */
section#contact-section {
    padding-top: 10px !important;
}





/* contant pages */
#contant-section {padding-top:50px; padding-bottom:50px; border-bottom:1px solid #dbdbdb;  font-weight:300;}
#contant-section h1 {color:#039145; font-weight:500; font-size:1.6em;}
#contant-section ul {padding-left:15px; color:#039145; }
#contant-section ul li{list-style:disc; color:#039145; }
#contant-section ul li p {margin-bottom:10px; margin-left:6px;}

/*new*/
.wb-btn{
border-radius: 25px;
    padding: 10px 15px;
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    background: #039145;
}

.text-black{
	color:#000!important;
}
.banner_img{margin-left:-50px;}
.banner_img img{
width:100%;

}

/* rv */
#contant-section h2{
	color: #039145;
    font-weight: 500;
    font-size: 1.3em;
	padding-bottom: 10px;;
}
#contant-section strong {
    color: #039145;
}
#contant-section ul  {
    padding-left: 20px;
}
#contant-section ul li {
    padding-bottom: 10px;
}
#contant-section ul a{
	color: #039145;
	text-decoration: underline;
}
.contant-info p big a {
    font-size: 1.2em;
    color: #979797;
    font-weight: 400;
}
a:hover{
	text-decoration: none;
}


/*responsive*/

@media (min-width:767px){
	.wb-mediaNews {
		text-align: right;
	}
}

@media only screen and (max-width:1200px) {
	body{font-size:13px;}
	.navbar-brand img { max-width: 55px;}
	header + .container-fluid {margin-top:75px !important;}
	.page-header h1 {font-size: 1.8em;}
	.carousal-skin #owl-screens .owl-item { padding:0px;}
	.carousal-skin {padding: 11px; padding-left:20px;}
	.owl-carousel .owl-item {margin-bottom: 26px;}
}


@media only screen and (max-width:991px) {
	.banner-text h1 { font-size: 2.5em; }
	.intro-col h2 big {font-size: 2.3em;}
	.wb-owl .item .wb-owl-inner { padding:0px;}
	.carousal-skin #owl-screens .owl-item img{   margin:0 0 0 2px;}
	.carousal-skin { padding-left:18px;}
	
}


@media only screen and (max-width:800px) {
	.banner-text { margin-top: 10%; padding-bottom: 10%;}
	#wb-hero {background-attachment:scroll !important;}
	.app-dwn-btns a img, .app-dwn-btns a img { max-width: 145px;}
	.banner-text h2 { font-size: 1.5em;}
	
	
}

@media only screen and (max-width:767px) {
	.wb-src-img {height: 450px;}
	.wb-src-img img{max-height:100%;}
	.intro-col {text-align: center !important; height:auto;}
	.intro-col h2 big {display: block; }
	.video-placeholder { height: 320px; margin-left:0px;}	
	.page-header h1 {max-width:100%}
	.wb-full-outer .row { text-align: center;}
	.wb-full-outer .row h2 {margin-bottom:20px !important;}
	#wb-hero, #contact-section .text-left, #wb-features-list .text-left {text-align:center !important}
	/*.wb-src-img .wb-screen1 { left: 20%;}*/
	.wb-src-img .wb-screen1 {
		left: 0 !important;
	}
	.wb-src-img .wb-screen2 {left: 5%;}
	#wb-features-list:hover .wb-screen2 { left: 3%;}
	#wb-features-list:hover .wb-screen1 { left: 22%;}
	.contant-info p big {font-size: 1.1em;}
	.page-header span.head-bar {display: inline-block;}
	.wb-feature-list li {text-align:left !important;}
	.wb-owl .item .wb-owl-inner { padding:12px;}
	.carousal-skin #owl-screens .owl-item img{   margin:3px 0 0 2px;}
	img{max-width: 100%;}
	
}
 
@media only screen and (max-width:575px) {
	.navbar-nav {padding-top:15px; margin-top:15px; border-top:1px solid #039145;}
	footer .navbar-nav{border:none;}
	.navbar-nav li {padding:5px 0 !important;}
	.banner-text h1 { font-size: 2em;}
	.carousal-skin::after {content:none; display:none;}
}