@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600); @import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700); @import url(https://fonts.googleapis.com/css?family=Volkhov:400italic); /* * This css file includes styles added in the jekyll port of this theme. * To find the original style.css that ships with Airspace, read airspace.css * */ .italic { font-style: italic; } .bold { font-weight: bold; } .center-text { text-align: center; } .post-area { padding: 40px; width: 100%; min-height: 150px; background-color: white; border-bottom: 1px dotted #ddd; } .post-area a:link, .post-area a:visited { font-size: 30px; color: #333; } .post-area a:hover { color: #0D0017; } .lang-list { display: inline-block; margin-top: 15px; } .lang-list a { color: #0D0017; font-weight: bold; } /*-- Common Css --*/ body { font-family: 'Open Sans', sans-serif; -webkit-font-smoothing: antialiased; } h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; } h2 { font-size: 30px; font-weight: 400; } h3 { font-size: 28px; font-weight: 300; } p { font-size: 15px; line-height: 28px; } ul { /*padding: 0; margin: 0; list-style: none;*/ } .fz-20{ font-size: 20px; } a, a:active, a:focus, a:active { text-decoration: none !important; } .section { padding: 100px 0; } .section-title { margin-bottom: 70px; } .section-title h2 { text-transform: uppercase; font-size: 28px; font-weight: 600; } .section-title p { font-family: 'Volkhov', serif; font-style: italic; color: #666; } .btn-main, .btn-transparent, .btn-small { background: #655E7A; color: #fff; display: inline-block; font-size: 14px; letter-spacing: 1px; padding: 14px 35px; text-transform: uppercase; border-radius: 0; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .btn-main:hover, .btn-transparent:hover, .btn-small:hover { background: #353240; color: #fff; } .btn-solid-border { border: 1px solid #fff; background: transparent; color: #fff; } .btn-solid-border:hover { border: 1px solid #655E7A; background: #655E7A; } /*-- Header Start --*/ header { background: #fff; padding: 20px 0; } header .navbar { margin-bottom: 0px; border: 0px; } header .navbar-brand { padding-top: 5px; } header .navbar-default { background: none; border: 0px; } header .navbar-default .navbar-nav { padding-top: 10px; } header .navbar-default .navbar-nav li a { color: #333333; padding: 10px 26px; font-size: 15px; } font header .navbar-default .navbar-nav li a:hover { color: #000; } /*--------------------------------------------- Index Start -----------------------------------------------*/ /*-- Slider Start --*/ #slider { background-repeat: no-repeat; background-size: cover; background-attachment: fixed; background-position: 10% 0%; padding: 200px 0 280px 0; position: relative; } #slider:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; /*background: linear-gradient(to left, #8b86a3, #322e40);*/ background: rgba(0, 0, 0, 0.7); /*opacity: 0.8;*/ } #slider .block { color: #E3E3E4; } #slider .block h1 { font-family: 'Roboto', sans-serif; font-weight: 100; font-size: 45px; line-height: 60px; letter-spacing: 10px; padding-bottom: 45px; } #slider .block p { font-size: 23px; line-height: 40px; font-family: 'Roboto', sans-serif; font-weight: 300; letter-spacing: 3px; } /*-- wrapper Start --*/ #intro { padding: 100px 0; } #intro .block h2 { padding-top: 35px; line-height: 27px; margin: 0; } #intro .block p { color: #7B7B7B; padding-top: 20px; } #intro .block img { padding-left: 40px; width: 100%; } #intro .section-title { margin-bottom: 0px; } #intro .section-title p { padding-top: 20px; } /*-- service Start --*/ #service { text-align: center; padding: 90px 0; } #service .service-item { padding-bottom: 30px; } #service .service-item i { font-size: 60px; color: #4A4656; } #service .service-item h4 { padding-top: 20px; margin: 0; color: #666; } #service .service-item p { color: #888; padding-top: 10px; margin: 0; font-size: 14px; line-height: 1.8; } /*-- call-to-action Start --*/ #call-to-action { background-repeat: no-repeat; background-size: cover; background-attachment: fixed; padding: 70px 0px; position: relative; text-align: center; color: #fff; } #call-to-action:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; background: #1d192c; opacity: 0.8; } #call-to-action h2 { padding-bottom: 20px; line-height: 33px; margin: 0; font-size: 30px; } #call-to-action p { font-size: 14px; line-height: 1.6; } #call-to-action .btn-call-to-action { padding: 15px 35px; border: none; background-color: #fff; font-size: 15px; color: #333333; margin-top: 30px; } /*-- Feature Start --*/ #feature { background-position: 50% 94px; width: 100%; padding-top: 100px; /* background-attachment: fixed; */ /* display: block; */ /* position: relative; */ /* overflow: visible; */ /* background-repeat: no-repeat; */ /* background-position: center center; */ /* background-color: #fff; */ /* -webkit-background-size: cover; */ /* -moz-background-size: cover; */ /* -o-background-size: cover; */ /* background-size: cover; */ /* -webkit-box-sizing: border-box; */ /* -moz-box-sizing: border-box; */ /* box-sizing: border-box; */ /* -webkit-backface-visibility: hidden; */ /* backface-visibility: hidden; */ /* margin-top:200px; /* padding: 200px; */ } #feature h2 { font-size: 28px; font-weight: 600; margin-bottom: 30px; } #feature p { color: #8d8f92; margin-bottom: 20px; } #feature .btn-view-works { background: #655E7A; color: #fff; padding: 10px 20px; } /*-- content Start --*/ #testimonial { padding: 100px 0; } #testimonial .block h2 { line-height: 27px; color: #5C5C5C; padding-top: 110px; } #testimonial .block p { padding-top: 50px; color: #7B7B7B; } #testimonial .counter-box li { width: 50%; float: left; text-align: center; margin: 30px 0 30px; } #testimonial .counter-box li i { font-size: 35px; } #testimonial .counter-box li h4 { font-size: 30px; font-weight: bold; } #testimonial .counter-box li span { color: #555; } #testimonial .testimonial-carousel { text-align: center; width: 75%; border: 1px solid #DEDEDE; padding: 24px; margin: 0 auto; } #testimonial .testimonial-carousel img { padding-bottom: 38px; } #testimonial .testimonial-carousel p { line-height: 28px; font-weight: 300; padding-bottom: 20px; } #testimonial .testimonial-carousel .user img { padding-bottom: 0px; border-radius: 500px; } #testimonial .testimonial-carousel .user p { padding-bottom: 0; font-size: 12px; line-height: 20px; color: #353241; } #testimonial .testimonial-carousel .user p span { display: block; color: #353241; font-weight: 600; } #testimonial .testimonial-carousel .owl-carousel .owl-pagination div { border: 1px solid #1D1D1D; border-radius: 500px; display: inline-block; height: 10px; margin-right: 15px; width: 10px; } #testimonial .testimonial-carousel .owl-carousel .owl-pagination div.active { background: #5C5C5C; font-size: 30px; display: inline-block; border: 0px; } /*-- features Start --*/ #clients-logo-section { padding-top: 30px; padding-bottom: 75px; } #clients-logo-section .clients-logo-img { padding: 0px 50px; } /*--------------------------------------------- Work Start -----------------------------------------------*/ /*-- Slider-work Start --*/ #global-header { background-repeat: no-repeat; background-size: cover; padding-top: 150px; padding-bottom: 107px; position: relative; background-attachment: fixed; } #global-header:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); } #global-header .block { color: #E3E3E4; margin: 0 auto; padding-left: 90px; text-align: center; } #global-header .block h1 { font-weight: 100; font-size: 45px; letter-spacing: 6px; padding-bottom: 15px; margin-top: 0; text-transform: capitalize; } #global-header .block p { font-size: 16px; font-weight: 300; letter-spacing: 1px; word-spacing: 3px; } /*-- portfolio-work Start --*/ #portfolio-work { overflow: hidden; padding: 80px 0; } #portfolio-work .block .portfolio-menu { padding-bottom: 30px; text-align: center; } #portfolio-work .block .portfolio-menu ul { border: 1px solid #999999; display: inline-block; margin-bottom: 40px; } #portfolio-work .block .portfolio-menu ul li { display: inline-block; padding: 0px 25px; cursor: pointer; font-size: 15px; line-height: 40px; font-weight: 600; color: #333333; text-transform: capitalize; position: relative; } #portfolio-work .block .portfolio-menu ul .active { color: #655E7A; position: relative; } #portfolio-work .block .portfolio-menu ul .active:before { content: "\f0d7"; position: absolute; font-family: 'FontAwesome'; bottom: -18px; font-size: 30px; width: 20px; left: 0px; right: 0px; top: 23px; margin: 0 auto; color: #fff; text-shadow: 0 1px 0px rgba(0, 0, 0, 0.9); -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #portfolio-work .block .portfolio-menu ul li:hover:before { content: "\f0d7"; position: absolute; font-family: 'FontAwesome'; bottom: -18px; font-size: 30px; width: 20px; left: 0px; right: 0px; top: 24px; margin: 0 auto; color: #fff; text-shadow: 0 1px 0px rgba(0, 0, 0, 0.9); -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #portfolio-work .block .portfolio-contant ul li { float: left; width: 32.22%; overflow: hidden; margin: 6px; position: relative; } #portfolio-work .block .portfolio-contant ul li:hover .overly { opacity: 1; } #portfolio-work .block .portfolio-contant ul li:hover .position-center { position: absolute; top: 50%; -webkit-transform: translate(0%, -50%); -moz-transform: translate(0%, -50%); -ms-transform: translate(0%, -50%); transform: translate(0%, -50%); } #portfolio-work .block .portfolio-contant ul li a { display: block; color: #fff; } #portfolio-work .block .portfolio-contant ul li a h2 { font-size: 22px; text-transform: uppercase; letter-spacing: 1px; } #portfolio-work .block .portfolio-contant ul li a p { font-size: 15px; } #portfolio-work .block .portfolio-contant ul li a span { font-style: italic; font-size: 13px; color: #655E7A; } #portfolio-work .block .portfolio-contant ul img { width: 100%; height: auto; } #portfolio-work .block .portfolio-contant .overly { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: rgba(0, 0, 0, 0.9); opacity: 0; -webkit-transition: .3s all; -o-transition: .3s all; transition: .3s all; text-align: center; } #portfolio-work .block .portfolio-contant .position-center { position: absolute; top: 50%; left: 10%; -webkit-transform: translate(0%, 50%); -moz-transform: translate(0%, 50%); -ms-transform: translate(0%, 50%); transform: translate(0%, 50%); -webkit-transition: .5s all; -o-transition: .5s all; transition: .5s all; } #portfolio-work .block .mix { display: none; } /*-- wrapper-work Start --*/ #wrapper-work { overflow: hidden; padding-top: 100px; } #wrapper-work ul li { width: 50%; float: left; position: relative; } #wrapper-work ul li img { width: 100%; height: 100%; } #wrapper-work ul li .items-text { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; color: #fff; background: rgba(0, 0, 0, 0.6); padding-left: 44px; padding-top: 140px; } #wrapper-work ul li .items-text h2 { padding-bottom: 28px; padding-top: 75px; position: relative; } #wrapper-work ul li .items-text h2:before { content: ""; position: absolute; left: 0; bottom: 0; width: 75px; height: 3px; background: #fff; } #wrapper-work ul li .items-text p { padding-top: 30px; font-size: 16px; line-height: 27px; font-weight: 300; padding-right: 80px; } /*-- features-work Start --*/ #features-work { padding-top: 50px; padding-bottom: 75px; } #features-work .block ul li { width: 19%; text-align: center; display: inline-block; padding: 40px 0px; } /*--------------------------------------------- Work Close -----------------------------------------------*/ /*=============================================*/ /*--------------------------------------------- Contact Start -----------------------------------------------*/ /*-- contact-form Start --*/ #contact-form { padding-top: 70px; padding-bottom: 35px; } #contact-form .block form .form-group { padding-bottom: 15px; margin: 0px; } #contact-form .block form .form-group .form-control { background: #F6F8FA; height: 60px; border: 1px solid #EEF2F6; box-shadow: none; width: 100%; } #contact-form .block form .form-group-2 { padding-bottom: 15px; margin: 0px; } #contact-form .block form .form-group-2 textarea { background: #F6F8FA; height: 135px; border: 1px solid #EEF2F6; box-shadow: none; width: 100%; } #contact-form .block button { width: 100%; height: 60px; background: #47424C; border: none; color: #fff; font-family: 'Open Sans', sans-serif; font-size: 18px; } /*-- wrapper-contact Start --*/ .address-block li { margin-bottom: 20px; } .address-block li i { margin-right: 15px; font-size: 20px; width: 20px; } .social-icons { margin-top: 40px; } .social-icons li { display: inline-block; margin: 0 6px; } .social-icons a { display: inline-block; } .social-icons i { color: #2C2C2C; margin-right: 25px; font-size: 25px; } .google-map { position: relative; } .google-map #map { width: 100%; height: 300px; background-color: #ff432e; } #contact-box { padding-top: 35px; padding-bottom: 58px; } #contact-box .block img { width: 100%; } #contact-box .block h2 { font-family: 'Open Sans', sans-serif; font-weight: 300; color: #000; font-size: 28px; padding-bottom: 30px; } #contact-box .block p { color: #5C5C5C; display: block; } /*-- features-contact Start --*/ #features-contact { padding-top: 50px; padding-bottom: 75px; } #features-contact .block ul li { width: 19%; text-align: center; display: inline-block; padding: 40px 0px; } /* Blog */ .blog-post { margin-bottom: 50px; } .blog-post img { margin-bottom: 15px; } .blog-post p { margin: 15px 0 20px; } .post-title { color: #655E7A; font-size: 25px; font-weight: 600; display: block; margin-bottom: 10px; } /*--------------------------------------------- Contact Close -----------------------------------------------*/ /*--------- Heading------------*/ .heading { padding-bottom: 60px; text-align: center; } .heading h2 { color: #000; font-size: 30px; line-height: 40px; font-weight: 400; } .heading p { font-size: 18px; line-height: 40px; color: #292929; font-weight: 300; } /*---------------------------*/ /*-- footer Start --*/ footer { background: #F5F5F5; text-align: center; padding-top: 48px; padding-bottom: 55px; } footer p { font-size: 13px; line-height: 25px; color: #919191; } footer a { color: #595959; } footer .footer-manu { padding-bottom: 25px; } footer .footer-manu ul { margin: 0px; padding: 0px; } footer .footer-manu ul li { display: inline-block; padding: 0px 20px; } footer .footer-manu ul li a { display: inline-block; color: #494949; } footer .footer-manu ul li a:hover { color: #000; } /* Default Layout: 992px. Gutters: 24px. Outer margins: 48px. Leftover space for scrollbars @1024px: 32px. ------------------------------------------------------------------------------- cols 1 2 3 4 5 6 7 8 9 10 px 68 160 252 344 436 528 620 712 804 896 */ /* Tablet Layout: 768px. Gutters: 24px. Outer margins: 28px. Inherits styles from: Default Layout. ----------------------------------------------------------------- cols 1 2 3 4 5 6 7 8 px 68 160 252 344 436 528 620 712 */ @media only screen and (min-width: 768px) and (max-width: 991px) { /*--------------------------------------------- Index Start -----------------------------------------------*/ /*-- wrapper Start --*/ #wrapper { text-align: center; } #wrapper .block img { padding-top: 100px; width: 50%; } /*-- content Start --*/ #content { text-align: center; } #content .block { padding-bottom: 100px; } /*-- features Start --*/ #features { text-align: center; } /*-- footer Start --*/ footer .navbar { margin-bottom: 0px; border: 0px; min-height: 40px; } footer .navbar-default { border: 0px; width: 68%; } footer .navbar-default .navbar-nav li a { color: #494949; padding: 10px 10px; font-size: 15px; } footer .navbar-default .navbar-nav li a:hover { color: #000; } /*--------------------------------------------- Index Close -----------------------------------------------*/ /*=============================================*/ /*--------------------------------------------- Work Start -----------------------------------------------*/ /*-- slider-work Start --*/ #slider-work .block h1 { font-size: 28px; } #slider-work .block p { font-size: 15px; } /*-- portfolio Start --*/ #portfolio-work .block .portfolio-manu { padding-left: 0px; } #portfolio-work .block .portfolio-contant ul li a .img-heading { padding: 5px 0 5px 13px; } #portfolio-work .block .portfolio-contant ul li a .img-heading h2 { font-size: 20px; line-height: 25px; } #portfolio-work .block .portfolio-contant ul li a .img-heading p { font-size: 11px; line-height: 20px; } #portfolio-work .block .portfolio-contant ul li a .overlay { padding-left: 15px; } #portfolio-work .block .portfolio-contant ul li a .overlay h2 { padding-top: 30px; padding-bottom: 15px; font-size: 20px; line-height: 25px; } #portfolio-work .block .portfolio-contant ul li a .overlay p { font-size: 11px; line-height: 20px; padding-top: 15px; } /*-- wrapper Start --*/ #wrapper-work ul li .items-text { padding-top: 0; padding-left: 25px; } #wrapper-work ul li .items-text h2 { padding-bottom: 10px; padding-top: 40px; } #wrapper-work ul li .items-text p { font-size: 14px; line-height: 20px; padding-right: 30px; } /*-- features Start --*/ #features-work .block ul li { width: 49%; } /*--------------------------------------------- Work close -----------------------------------------------*/ /*=============================================*/ /*--------------------------------------------- contact start -----------------------------------------------*/ #wrapper-contact .block { padding-bottom: 50px; } /*-- features-contact Start --*/ #features-contact .block ul li { width: 49%; } /*--------------------------------------------- contact close -----------------------------------------------*/ /*------------------*/ } /* Mobile Layout: 320px. Gutters: 24px. Outer margins: 34px. Inherits styles from: Default Layout. --------------------------------------------- cols 1 2 3 px 68 160 252 */ @media only screen and (max-width: 767px) { /*--------------------------------------------- Index Start -----------------------------------------------*/ .heading { padding-left: 0px; } h2 { font-size: 18px; } p { font-size: 13px; } header .navbar-default .navbar-toggle { margin-top: 20px; margin-bottom: 20px; } #slider { padding-top: 90px; padding-bottom: 100px; } #slider .block { padding-left: 0px; } #slider .block h1 { font-size: 20px; } #slider .block p { font-size: 13px; } /*-- wrapper Start --*/ #wrapper { text-align: center; padding-top: 70px; padding-bottom: 100px; } #wrapper .block img { padding-top: 100px; padding-left: 0px; width: 100%; } /*-- service Start --*/ #service { padding-top: 100px; } #service .thumbnail { padding-bottom: 70px; } /*-- call-to-action Start --*/ #call-to-action p { padding: 0px 0px 40px; } #call-to-action .btn { padding: 10px 20px; font-size: 15px; } /*-- content Start --*/ #content { text-align: center; padding-top: 70px; } #content .block { padding-bottom: 100px; } #content .block h2 { padding-top: 0px; } #content .block-bottom { padding: 0px; } #content .block-bottom .item-img { padding-left: 0px; } /*-- features Start --*/ #features .features-img { text-align: center; } /*--------------------------------------------- Index Close -----------------------------------------------*/ /*=============================================*/ /*--------------------------------------------- Work Start -----------------------------------------------*/ #slider-work { padding-top: 100px; padding-bottom: 100px; } #slider-work .block { padding-left: 0px; } #slider-work .block h1 { font-size: 20px; } #slider-work .block p { font-size: 11px; line-height: 25px; } /*-- portfolio Start --*/ #portfolio-work .block .portfolio-manu { padding-left: 0px; text-align: center; } #portfolio-work .block .portfolio-manu ul li { padding: 0 8px; } #portfolio-work .block .portfolio-contant ul li { width: 100%; } #portfolio-work .block .portfolio-contant ul li a .img-heading { padding: 5px 0 5px 13px; } #portfolio-work .block .portfolio-contant ul li a .img-heading h2 { font-size: 20px; line-height: 25px; } #portfolio-work .block .portfolio-contant ul li a .img-heading p { font-size: 11px; line-height: 20px; } #portfolio-work .block .portfolio-contant ul li a .overlay { padding-left: 15px; } #portfolio-work .block .portfolio-contant ul li a .overlay h2 { padding-top: 65px; padding-bottom: 15px; font-size: 20px; line-height: 25px; } #portfolio-work .block .portfolio-contant ul li a .overlay p { font-size: 11px; line-height: 20px; padding-top: 15px; padding-right: 5px; } /*-- wrapper Start --*/ #wrapper-work ul li { float: none; width: 100%; } #wrapper-work ul li .items-text { padding-left: 15px; padding-top: 30px; } #wrapper-work ul li .items-text h2 { padding-top: 10px; padding-bottom: 15px; font-size: 20px; line-height: 25px; } #wrapper-work ul li .items-text p { font-size: 11px; line-height: 20px; padding-top: 15px; } /*-- features Start --*/ #features-work .block ul li { display: block; width: 100%; } /*--------------------------------------------- Work close -----------------------------------------------*/ /*=============================================*/ /*--------------------------------------------- contact Start -----------------------------------------------*/ /*-- slider-contact Start --*/ #slider-contact { padding-top: 100px; padding-bottom: 100px; } #slider-contact .block { padding-left: 0px; } #slider-contact .block h1 { font-size: 20px; } #slider-contact .block p { font-size: 11px; line-height: 25px; } /*-- wrapper-contact Start --*/ #wrapper-contact .block { padding-bottom: 50px; } #wrapper-contact .block .location p { width: 100%; } #wrapper-contact .block .social-media-icon a i { padding-top: 30px; } /*-- features-contact Start --*/ #features-contact .block ul li { display: block; width: 100%; } /*--------------------------------------------- contact close -----------------------------------------------*/ /*-- footer Start --*/ footer .footer-manu { display: none; } } /* Wide Mobile Layout: 480px. Gutters: 24px. Outer margins: 22px. Inherits styles from: Default Layout, Mobile Layout. ------------------------------------------------------------ cols 1 2 3 4 5 px 68 160 252 344 436 */ /* Retina media query. Overrides styles for devices with a device-pixel-ratio of 2+, such as iPhone 4. ----------------------------------------------- */ .carousel .carousel-caption { color: rgba(255, 255, 255, 1); font-size: 14px; font-weight: 400; text-align: center; display: block; z-index: 0; } .carousel .carousel-caption { background-color: rgba(0, 0, 0, 0.4); } .text-white { color: #FFF; }