@import "http://fonts.googleapis.com/css?family=Roboto:300,700";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
@import url('https://fonts.googleapis.com/css?family=Cuprum');
body{font-family:Roboto;font-size:14px;font-weight:300;line-height:24px;font-style:normal;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:subpixel-antialiased; border-top:1px solid #000000;}
a{color:#3d566e;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;transition:all .2s linear}
a:hover{color:#26303a}
ul{list-style:none;margin:0;padding:0}
.row{padding:87px 0 60px 0; margin:0px;}
.btn{border:0;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;transition:all .2s linear;text-transform:uppercase}
.btn i{margin-right:10px}
.btn-common{background:#3d566e;color:#fff}
.btn-common:hover{background:#26303a;color:#fff}
.btn-border,.btn-common-white:hover{background:0 0;border:1px solid #fff;color:#fff}
.btn-common-white,.btn-border:hover{background:#fff;color:#444;border:1px solid #fff}
.social i{border:2px solid #fff;color:#fff;padding:10px;line-height:25px;margin-right:5px;width:50px;height:50px;vertical-align:middle;border-radius:100%}
.visiblenone{ display:none;}
.social i:hover{border:2px solid transparent;-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both
}.social .social-links a:hover{color:#fff}
.social .fa-facebook:hover{background:#3b5998;color:#fff}
.social .fa-twitter:hover{background:#00CAFB;color:#fff}
.social .fa-google-plus:hover{background:#D23A1D;color:#fff}
.social .fa-linkedin:hover{background:#007bb6;color:#fff}
.social .fa-dribbble:hover{background:#ea4c89;color:#fff}
.social .fa-github:hover{background:#171515;color:#fff}
.section-title{text-align:center;font-size:50px;font-weight:700;}
.section-subtitle{text-align:center;font-weight:300;padding-bottom:30px;position:relative;color:#bdc3c7}
.widget-title{color:#ccc;font-size:24px;text-transform:uppercase;margin-top:0;margin-bottom:15px;font-weight:300}
.matter_portfolio .mix{display:none}
#carousel-area{overflow:hidden;background:#E36222;}
#carousel-area .carousel-inner:before{background-color:rgba(44,62,80,.2);position:absolute;width:100%;height:100%;top:0;bottom:0;content:"";display:block;z-index:9}
#carousel-area .item{background-attachment:fixed;background-size:100%;background-size:cover}
#carousel-area .item .carousel-caption{ top:45%; right:auto; left:5%; bottom: auto; padding:15px 30px 15px 30px; text-shadow:none;z-index:99; text-align:left;}
#carousel-area .item .carousel-caption h1{font-size:40px;font-weight:100; font-family: "open Sans", arial; padding:0px; margin:0px;}
#carousel-area .item .carousel-caption h2{font-size:23px;font-weight:100; font-family: Philosopher, Arial; padding:0px; margin:0px;}
#carousel-area .item .carousel-caption .btn{padding:10px 20px;margin:10px 20px;font-size:20px}
#carousel-area .carousel-control{z-index:10;display:none;width:50px;height:56px;top:50%;padding:10px 5px;box-shadow:none;background-image:none;background-color:rgba(0,0,0,.5)}
#carousel-area:hover .carousel-control{display:block}
.topnavi{ padding-top:10px; display: block;}
.navbar{margin-bottom:0; min-height:114px;margin-bottom:20px; margin-top:10px;}
.navbar-header{ margin-top:-30px;}
.navbar li{color:#FFFFFF;}
.navbar-default{border:0;border-radius:0;background:none;}
.navbar-default .navbar-brand{padding:0;margin-top:40px;}
.navbar-default .navbar-nav li a,.navbar-default .navbar-nav>li>a:focus{font-size:14px;padding:0 0 2px;text-transform:uppercase;margin:22px 15px;outline:0;color:#FFFFFF;}
.navbar-default .navbar-nav>li>a:after{content:"";display:inline-block;width:0;height:1px;background:#5F3213;position:absolute;left:0;bottom:-1px;-webkit-transition:all 800ms cubic-bezier(0.19,1,.22,1) 0s;-moz-transition:all 800ms cubic-bezier(0.19,1,.22,1) 0s;-o-transition:all 800ms cubic-bezier(0.19,1,.22,1) 0s;transition:all 800ms cubic-bezier(0.19,1,.22,1) 0s}
.navbar-default .navbar-nav>li>a:hover:after{width:100%}
.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>li>a:focus .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus .current{background:0 0; padding-bottom:2px; border-bottom:3px solid #B0CB1F; color:#ffffff;}
.navbar-default .navbar-brand{font-size:55px}
.navbar-default .navbar-toggle .icon-bar{background:#fff}
.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{background:#000}

.navbar-right{line-height: 18px;}
.navbar-right .numbertop{background:url(../images/icon_phone.png) left 1px no-repeat; padding: 0px 20px 0px 25px; margin: 0px 20px 0px 25px; line-height: 18px; color: #ffffff; border-right: 1px solid #ffffff; float: left;}
.navbar-right .emailtop{background:url(../images/icon_email.png) left 0px no-repeat; padding: 0px 15px 0px 25px; margin: 0px 20px 0px 0px; line-height: 18px; color: #ffffff; border-right: 1px solid #ffffff; float: left;}
.navbar-right .emailtop a{color: #ffffff;}
.navbar-right .emailtop a:hover{color:#B0CB1F; text-decoration: none;}
.navbar-right .socialtop{float: left;}
.navbar-right .socialtop span{padding: 0px 8px 0px 0px;}


.affix.navbar{margin-bottom:0; min-height:60px;margin-bottom:20px; margin-top:0px;}
.affix.navbar-default{ background-color:rgba(0,0,0,.6)}
.affix{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-name:fadeInDown;animation-name:fadeInDown}
.affix .navbar-right{ margin:0px;}
.affix .navbar-brand{margin-top:-5px;}
.affix .navbar-brand img{width:75%;}
.affix .navbar-header{ margin-top:10px;}
.affix .navbar-nav li a,.affix .navbar-nav li a:focus{margin:15px}
.affix .to-top a,.affix .to-bottom a{line-height:56px;padding:20px}
.navbar .to-top,.navbar .to-bottom{display:none}
.affix-top .to-bottom{display:block!important}
.affix .to-top{display:block!important}
.to-top,.to-bottom{list-style:none}
.to-top a,.to-bottom a{padding:26px 22px;line-height:70px;outline:0;color:#ffffff;}
.switcher-area{position:fixed;width:300px;left:0;top:155px;left:-300px;z-index:9999;background:#fff;padding:25px 20px;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear}


#slider,#contact,#portfolio,#clients{color:#fff}
#slider .section-title{line-height:50px}
#services{background:url(../images/services_bg.png) repeat;}
#services h2{ font-family:"open Sans", arial; font-size:32px; color:#ffffff; padding:0px 0px 20px 0px; margin:0px; font-weight:500;}
#services h2 span{ font-family:"open Sans", arial; font-weight:100;}
#services p{ font-family:"open Sans", arial; font-size:14px; line-height: 32px; color:#ffffff; padding:0px 0px 40px 0px; margin:0px; font-weight:normal;}
#mainabout{background: url(../images/services_bg.png);}
#services h3{ font-family:"open Sans", arial; font-size:28px; color:#ffffff; padding:20px 0px 20px 0px;  font-weight:100;}
#services .spaceboth{margin:0px 0px 60px 0px;}
#services .sideline{border-right: 1px solid #ffffff;}


/* entire container, keeps perspective */
.flip-container {perspective: 1000px; text-align:center; margin:55px auto 0px auto;}
/* flip the pane when hovered */
.flip-container:hover .flipper, .flip-container.hover .flipper {transform: rotateY(180deg);}
.flip-container, .front, .back {width: 164px;height: 164px;}
/* flip speed goes here */
.flipper {transition: 0.6s;	transform-style: preserve-3d;position: relative;}
/* hide back of pane during swap */
.front, .back {backface-visibility: hidden;	position: absolute;top: 0;left: 0;}
/* front pane, placed above back */
.front {z-index: 2;	/* for firefox 31 */transform: rotateY(0deg);}
/* back, initially hidden pane */
.back {	transform: rotateY(180deg);}
.flipheading{ font-family: "open Sans", arial; font-size:18px; color:#444444; font-size: 16px; font-weight: 100; margin:10px 0px 0px 0px; text-align:center;}


.matter-filter{margin:30px 0}
.matter-filter .filter{font-family: 'Open Sans', sans-serif; font-weight:lighter; text-transform:uppercase; font-size:32px; color:#524C46; display:inline-block; cursor:pointer;}
.matter-filter .filter:hover,.matter-filter .filter.active{ color:#9F252A;}


#portfolio{background:url(../images/bg_idealfor.jpg) no-repeat right 50px;}
#portfolio h1{ font-family:"open Sans", arial; font-size:32px; color:#B0CB1F; padding:33px 0px 0px 0px; margin:0px; font-weight:500;}
#portfolio h1 span{ font-family:"open Sans", arial; color:#525252; font-weight:100;}
.portfolio-item{position:relative;margin-bottom:30px; border:5px solid #ddd;}
.portfolio-item img{width:100%}
.matter-filter .port_slash{ display:inline-block; font-size:35px; margin:0px 10px;}
.portfolio-item .overlay{position:absolute;top:0;width:100%;height:100%;z-index:10;background-color:rgba(0,0,0,.8);display:none}
.portfolio-item:hover .overlay{position:absolute;top:0;width:100%;height:100%;z-index:10;background-color:rgba(0,0,0,.8);display:block}
.portfolio-item i{padding:12px;margin:-42px;font-size:20px;width:42px;height:42px;border-radius:0}.portfolio-item .icons .link{position:absolute;left:53%;top:50%;margin-left:42px;color:#fff;-webkit-animation-name:fadeInRight;animation-name:fadeInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.portfolio-item .icons .link i{color:#fff;background:#3d566e}
.portfolio-item .icons .preview{position:absolute;left:40%;top:30%;color:#fff;-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.portfolio-item .icons .preview i{color:#3d566e;background:#fff}
.owl-theme .owl-controls .owl-page span{height:7px!important;border:0!important}.owl-theme .owl-controls .owl-page span:hover{background:#3D566E}.owl-theme .owl-controls .owl-page.active span{background:#3D566E}

#testimonial{background:url(../images/gallery_back.jpg) repeat left top;}
#testimonial .row{padding-bottom:60px}

#testimonial .feature-title{margin-top:0px; margin-bottom: 80px; text-align: center; font-size: 32px; color: #999999; font-family: "open Sans", arial; font-weight: 100;}
#testimonial .feature-title span{ font-weight: 500; }
#testimonial .feature-sideimg{margin-top:80px;}


#testimonial i{padding-right:10px;color:rgba(102,102,102,.5)}
#clients{background:url(../img/clients/brand-bg.jpg) center center fixed;background-size:cover}#clients .logo-slider .owl-buttons{position:absolute;top:-33px;right:3px}#clients .logo-slider .owl-buttons div{background:transparent!important;border:1px solid #fff;border-radius:4px;margin-left:15px;padding:0 10px}

#about{background:url(../images/bg_about.jpg) center left no-repeat; color:#3F4044;}
#about p{line-height:30px; font-size:13px; color:#878787; font-family: "open Sans", arial; line-height: 25px;}
#about h2{ color: #545454; font-family: "open Sans", arial; font-weight: 100; font-size:45px; padding: 0px 0px 50px 0px; margin: 0px; text-align: center; }
#about h2 span{ color: #B0CB1F; font-weight: 400;}
#about .titleone{ color: #B0CB1F; font-family: "open Sans", arial; font-weight:bold; font-size:13px; padding: 20px 0px 20px 0px; margin: 0px; }

#about .about-title{ font-size: 13px; font-weight: bold; color: #B0CB1F; font-family:"open Sans", arial; margin-top:130px; margin-bottom: 30px;}
#about ul li{ background:url(../images/dots.png) no-repeat left 9px; padding:0px 15px 0px 20px; margin:10px 15px 5px 5px; font-family: "open Sans", arial; font-size: 13px; color: #858585;}

#pricing{background: #ffffff; padding: 0px 0px 60px 0px}
#pricing h2{font-size: 32px; color:#B0CB1F; font-family:"open Sans", arial; font-weight: 500; text-align: center;}
#pricing h2 span{color:#525252; font-weight: 100;}
#pricing .colorbggreen{ background:#B0CB1F; padding: 20px; margin: 40px 0px;  }


#contact{ background:#F8F8F8;}
#contact ::-webkit-input-placeholder{color:#ecf0f1}
#contact :-moz-placeholder{color:#ecf0f1}
#contact ::-moz-placeholder{color:#222222;}
#contact :-ms-input-placeholder{color:#ecf0f1}
#contact .section-title{ font-family:"open Sans", arial; font-size:32px; color:#222222; font-weight:100; text-align:left; padding-top:20px;}
#contact h1{ color:#B0CB1F; font-family: "open Sans", arial; font-weight: 500; font-size:32px; padding: 0px 0px 50px 0px; margin: 0px; text-align: center; }
#contact h1 span{ color: #525252; font-weight: 100;}
#contact h4{ font-family: 'Open Sans', sans-serif;font-size:22px; color:#E36222; padding-top:15px; padding-bottom:0px; margin:0px; font-weight:bold;}
#contact h5{ font-family: 'Open Sans', sans-serif; font-size:32px; color:#466C31; text-align:left; padding:20px 0px 20px 0px; font-weight: 100;}
#contact p{ font-family: 'Open Sans', sans-serif; font-size:13px; color:#212121; padding-top:5px; line-height:20px;}
#contact .contact-info{margin:40px 0}
#contact .contact-info p{font-size:20px}
#contact .contact-form .form-control{background:0 0; color:#222222;border:1px solid #CCCCCC;box-shadow:none;font-size:11px; margin-bottom:20px}
#contact .contact-form textarea.form-control{min-height:116px;margin-bottom:20px}
#contact .contact-form input[type=text],#contact .contact-form input[type=email]{height:44px}
#contact .contact-form .btn{ background:#3F6729; border:none; margin-top:3px; font-family:"open Sans", arial; font-size:14px;}
#contact .contact-form .btn:hover{ background:#333333; color:#FFFFFF; border:none; margin-top:3px; font-family:"open Sans", arial; font-size:14px;}
#matter-footer{background:#333;color:#BDC3C7}
#matter-footer .row{padding:40px 0}
#matter-footer .text img{margin-bottom:25px}
#matter-footer .link li{padding:4px 0;border-bottom:1px solid rgba(0,0,0,.1);margin-bottom:0}
#matter-footer .link li a{font-size:inherit;color:#BDC3C7;text-decoration:none}
#matter-footer .link li a:hover{color:#fff}
.copyright{padding-bottom:15px}
.copyright p{margin:0; text-align:center;}
.copyright a{color:#fff}
.copyright a:hover{color:#fff;text-decoration:none}
#video-bg{position:relative;width:100%;height:689px}
header .wrapper{margin-top:30px;margin-bottom:40px}header .wrapper .section-title{font-size:36px}header .wrapper .section-title span{color:#3D566E}#version-page{background:#ECEEF1;overflow:hidden}#version-page img{max-width:100%;-webkit-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear}#version-page .post{margin:15px 0 45px;position:relative;text-align:center}#version-page .post:hover img{max-width:100%;-webkit-transform:scale(1.1);-moz-transform:scale(1.1);transform:scale(1.1)}