/* Large Layout: 1200px. */ @media only screen and (min-width: 1200px){ .container {padding: 0;} .container-fluid{padding: 0;} } /* Only For Mainmenu Area */ @media only screen and (min-width: 992px) and (max-width: 1199px) { .main-menu .navigation > li > a { padding: 27px 10px 28px; } .mainmenu-right-box { width: 260px; position: relative; } .search-option { padding-left: 15px; } } /* Only For Mainmenu Area */ @media only screen and (min-width: 768px) and (max-width: 991px) { .main-menu .navigation > li > a { padding: 27px 16px 28px; } .mainmenu-right-box { display: none; } } /* Medium screen */ @media only screen and (min-width: 992px) and (max-width: 1199px) { /*** ============================================= Top bar Area style ============================================= ***/ .top-bar-area .top-right { margin-left: -30px; } /*** ============================================= Header Area style ============================================= ***/ .header-area .header-right { overflow: hidden; margin-left: 40px; } /*** ============================================= Rev slider wrapper style ============================================= ***/ .rev_slider_wrapper .slide-content-box.mar-lft { margin-left: 80px !important; } /*** ============================================= Solution Area style ============================================= ***/ .solution-area .solution-botton .single-item .text-holder { border: 1px solid #f4f4f4; padding-left: 10px; padding-right: 10px; } .solution-area .solution-botton .single-item .text-holder h3 { margin: 0 0 4px; font-size: 15px; } /*** ============================================= slogan Area style ============================================= ***/ .slogan-area { padding-bottom: 25px; padding-top: 10px; } .slogan-area .text { float: none; width: 100%; text-align: center; margin: 0 0 5px; } .slogan-area .button { float: none !important; overflow: hidden; width: 100%; } .slogan-area .button a { margin: 0 auto; } /*** ============================================= Footer Area style ============================================= ***/ .footer-contact-info { padding: 10px 0 10px; } .footer-contact-info li { display: block; padding: 9px 7px; width: 100%; text-align: center; border: none; } .single-footer-widget.marginlft { margin-left: 0; } .single-footer-widget.pd-bottom50 { padding-bottom: 50px; } /*** ============================================= About Company Area style ============================================= ***/ .about-company-area .bottom .single-item .img-holder, .about-company-area .bottom .single-item .text-holder { display: block; vertical-align: middle; } .about-company-area .bottom .single-item .text-holder { padding-left: 0; padding-top: 15px; } /*** ============================================= Fact counter Area style ============================================= ***/ .fact-counter-area { padding-bottom: 50px; } .fact-counter-area .single-item { margin-bottom: 30px; } /*** ============================================= Blog Default Area style ============================================= ***/ #blog-area .blog-post { border-right: 0px solid #f4f4f4; margin-bottom: 0px; padding-bottom: 0px; margin-right: 0px; padding-right: 0px; margin-top: 0px; padding-top: 0px; } #blog-area .sidebar-wrapper { margin-left: 0; padding-top: 70px; } /*** ============================================= Checkout Area style ============================================= ***/ .checkout-area .form.shipping-info{ padding-top: 70px; } /*** ============================================= Login Register Area style ============================================= ***/ .login-register-area .form .social-icon { float: left; margin-right: -8px; margin-top: 15px; } .login-register-area .form.register{ padding-top: 70px; } /*** ============================================= Shop Area style ============================================= ***/ .shop-area .shop-content { border-right: none; margin-right: 0; padding-right: 0; margin-top: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 70px; } /*** ============================================= Single Shop Area style ============================================= ***/ .single-shop-area .shop-content { border-left: none; margin-left: 0; padding-left: 0; margin-top: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 0; } .single-shop-area .sidebar-wrapper { margin-left: 0px; margin-right: 0; padding-top: 60px; } .single-shop-content .content-box { margin-left: -85px; } .single-shop-content .img-holder { margin-right: 85px; } } /* Tablet Layout: 768px. */ @media only screen and (min-width: 768px) and (max-width: 991px) { /*** ============================================= Top bar Area style ============================================= ***/ .top-bar-area .top-right { float: none; width: 175px; margin: 20px auto 0; } /*** ============================================= Header Area style ============================================= ***/ .header-area .logo { margin: 0 0 25px; text-align: center; } /*** ============================================= Rev slider wrapper style ============================================= ***/ .rev_slider_wrapper .slide-content-box.mar-lft { margin-left: 80px !important; } /*** ============================================= Solution Area style ============================================= ***/ .solution-area .solution-botton .single-item { width: 100%; border: 1px solid #f4f4f4; margin-bottom: 25px; } .solution-area .solution-botton .single-item .text-holder { border: none; } /*** ============================================= Latest Project Area style ============================================= ***/ .latest-project-area .project-filter { float: left !important; margin: 0 0 30px; } /*** ============================================= About Industry Area style ============================================= ***/ .about-industry-area .img-holder { margin-right: 0; } .about-industry-area .text-holder { margin-left: 0; margin-top: 20px; } .about-industry-area #quote-form { margin-top: 40px; } /*** ============================================= Testimonial Area style ============================================= ***/ .testimonial-area { background: #f7f7f7 none repeat scroll 0 0; padding: 80px 0 10px; } .testimonial-area .single-item { position: relative; margin-bottom: 90px; } /*** ============================================= Latest blog area style ============================================= ***/ .latest-blog-area { padding-bottom: 30px; padding-top: 80px; } .latest-blog-area .single-blog-item { display: block; margin-bottom: 50px; overflow: hidden; position: relative; } /*** ============================================= slogan Area style ============================================= ***/ .slogan-area { padding-bottom: 25px; padding-top: 10px; } .slogan-area .text { float: none; width: 100%; text-align: center; margin: 0 0 5px; } .slogan-area .button { float: none !important; overflow: hidden; width: 100%; } .slogan-area .button a { margin: 0 auto; } /*** ============================================= Footer Area style ============================================= ***/ .footer-contact-info { padding: 10px 0 10px; } .footer-contact-info li { display: block; padding: 9px 7px; width: 100%; text-align: center; border: none; } .single-footer-widget.marginlft { margin-left: 0; } .single-footer-widget.pd-bottom50 { padding-bottom: 50px; } /*** ============================================= Copyright Area style ============================================= ***/ .copyright-area .support { text-align: center; margin: 0 0 5px; } .copyright-area .copyright { float: none; text-align: center; } /*** ============================================= About Company Area style ============================================= ***/ .about-company-area .text-holder { margin-top: 25px; } .about-company-area .bottom .single-item { margin-bottom: 25px; } /*** ============================================= Fact counter Area style ============================================= ***/ .fact-counter-area { padding-bottom: 50px; } .fact-counter-area .single-item { margin-bottom: 30px; } /*** ============================================= Main project Area style ============================================= ***/ .main-project-area .project-filter li { display: inline-block; margin: 0 7px; } /*** ============================================= Blog Default Area style ============================================= ***/ #blog-area .blog-post { border-right: 0px solid #f4f4f4; margin-bottom: 0px; padding-bottom: 0px; margin-right: 0px; padding-right: 0px; margin-top: 0px; padding-top: 0px; } #blog-area .sidebar-wrapper { margin-left: 0; padding-top: 70px; } /*** ============================================= Single Service Area style ============================================= ***/ #single-service-area .left-sidebar { margin-top: 70px; } #single-service-area .research-innovation-box .solution-single-chart-box { margin-bottom: 40px; margin-top: 30px; } /*** ============================================= Checkout Area style ============================================= ***/ .checkout-area .sec-title { padding-bottom: 30px; float: none !important; } .checkout-area .form.shipping-info{ padding-top: 70px; } /*** ============================================= Login Register Area style ============================================= ***/ .login-register-area .form .social-icon { float: left; margin-right: -8px; margin-top: 15px; } .login-register-area .form.register{ padding-top: 70px; } /*** ============================================= Cart area style ============================================= ***/ .cart-total { padding-top: 70px; } /*** ============================================= Shop Area style ============================================= ***/ .shop-area .shop-content { border-right: none; padding-right: 0; margin-top: 0; margin-right: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 70px; } /*** ============================================= Single Shop Area style ============================================= ***/ .single-shop-area .shop-content { border-left: none; margin-left: 0; padding-left: 0; margin-top: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 0; } .single-shop-content .img-holder { margin-right: 0; } .single-shop-content .content-box { margin-top: 40px; margin-left: 0; } .single-shop-area .sidebar-wrapper { margin-left: 0px; margin-right: 0; padding-top: 60px; } } /* Mobile Layout: 320px. */ @media only screen and (max-width: 767px) { .mainmenu-area .container{ position: relative; } .mainmenu-area .container .mainmenu-right-box { width: 280px; position: absolute; right: -20px; top: 0px; z-index: 99999999999; } .search-option { padding-left: 15px; } .outer-search-box .seach-toggle { font-size: 14px; height: 75px; line-height: 70px; width: 60px; } .search-box { right: 35px; } .main-menu { display: block; float: none !important; padding-bottom: 0; padding-top: 0; z-index: 5; width: 100%; } .main-menu .navigation li { margin-left: 0; margin-right: 0; padding: 0; } .main-menu .collapse { border: 5px solid #eabb06 !important; border-radius: 0px !important; float: none; margin: 0; max-height: 300px; overflow: auto; padding: 0; width: 100%; } .main-menu .collapse.in, .main-menu .collapsing { border: 1px solid #4b4b4b; border-radius: 3px; margin: 0 0 20px; padding: 0; border-top: none; } .main-menu .navbar-header{ position:relative; float:none; display:block; text-align: left; width:100%; padding: 20px 0px 19px; right:0px; z-index:12; } .main-menu .navbar-header .navbar-toggle { display: inline-block; z-index: 7; border: 2px solid #fdc900; float: none; margin: 0px; border-radius: 0; } .main-menu .navbar-header .navbar-toggle .icon-bar { background: #fdc900 none repeat scroll 0 0; font-weight: 700; } .main-menu .navbar-collapse > .navigation { background: #fdc900; float: none !important; margin: 0 !important; width: 100% !important; } .main-menu .navbar-collapse > .navigation > li{ margin:0px !important; float:none !important; width:100%; padding: 0; } .main-menu .navigation li.dropdown > a:after{ display:none !important; } .main-menu .navigation > li > a:before{ display: none; } .main-menu .navbar-collapse > .navigation > li > a{ padding:10px 10px !important; } .main-menu .navbar-collapse > .navigation > li > ul, .main-menu .navbar-collapse > .navigation > li > ul > li > ul{ position:relative; border:none; float:none; visibility:visible; opacity:1; display:none; margin:0px; left:auto !important; right:auto !important; top:auto !important; width:100%; background: none; border-radius:0px; -webkit-border-radius:0px; -ms-border-radius:0px; -o-border-radius:0px; -moz-border-radius:0px; transition:none !important; -webkit-transition:none !important; -ms-transition:none !important; -o-transition:none !important; -moz-transition:none !important; } .main-menu .navbar-collapse > .navigation > li > ul, .main-menu .navbar-collapse > .navigation > li > ul > li > ul{ border-top: 0px solid rgba(255,255,255,1) !important; } .main-menu .navbar-collapse > .navigation > li, .main-menu .navbar-collapse > .navigation > li > ul > li, .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li{ border-top: 1px solid #4b4b4b !important; opacity:1 !important; top:0px !important; left:0px !important; visibility:visible !important; } .main-menu .navbar-collapse > .navigation > li > a, .main-menu .navbar-collapse > .navigation > li > ul > li > a, .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li > a{ padding:10px 10px !important; line-height:22px; color:#333; background:#fdc900; text-align:left; } .main-menu .navbar-collapse .navigation > li > ul li a::before{ display: none; } .main-menu .navbar-collapse > .navigation > li > a:hover, .main-menu .navbar-collapse > .navigation > li > a:active, .main-menu .navbar-collapse > .navigation > li > a:focus{ background:#1b1b1b; } .main-menu .navbar-collapse > .navigation > li:hover > a, .main-menu .navbar-collapse > .navigation > li > ul > li:hover > a, .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li:hover > a, .main-menu .navbar-collapse > .navigation > li.current > a{ background:#292D2F; color:#fff !important; } .main-menu .navbar-collapse > .navigation li.dropdown .dropdown-btn{ display:block; } /*** ============================================= Top bar Area style ============================================= ***/ .top-bar-area .top-left { padding-left: 0; } .top-bar-area .top-left .our-office { width: 150px; margin: 0 auto; position: static; } .top-bar-area .top-left ul { overflow: hidden; padding-left: 0; } .top-bar-area .top-left ul li { display: block; float: none; margin-top: 8px; padding-right: 0; text-align: center; } .top-bar-area .top-left ul li span::before { display: none; } .top-bar-area .top-right { float: none; width: 165px; margin: 15px auto 0; } /*** ============================================= Header Area style ============================================= ***/ .header-area .logo { margin: 0 0 20px; text-align: center; } .header-area .header-right { overflow: hidden; } .header-area .header-right ul { display: block; float: none; overflow: hidden; width: 200px; margin: 10px auto 10px; } .header-area .header-right ul li { border-right: none; display: block; float: none; margin-right: 0; padding-right: 0; position: relative; margin-bottom: 12px; } .header-area .header-right .download-button { display: block; float: none; width: 200px; margin: 0 auto 0; } /*** ============================================= Rev slider wrapper style ============================================= ***/ .rev_slider_wrapper .slide-content-box.mar-lft { margin-left: 50px !important; } .tparrows { display: none; } /*** ============================================= Welcome Area style ============================================= ***/ .welcome-area .welcome-content .title, .welcome-area .welcome-content .text { display: block; } .welcome-area .welcome-content .title { border-right: 2px solid #f8c12d; margin-bottom: 15px; padding-bottom: 8px; padding-right: 20px; padding-top: 2px; text-align: right; width: 250px; } .welcome-area .welcome-content .title h1 { font-size: 30px; } /*** ============================================= Solution Area style ============================================= ***/ .solution-area .solution-botton .single-item { width: 100%; border: 1px solid #f4f4f4; margin-bottom: 25px; } .solution-area .solution-botton .single-item .text-holder { border: none; padding-left: 10px; padding-right: 10px; } .solution-area .solution-botton .single-item .text-holder h3 { margin: 0 0 4px; font-size: 15px; } /*** ============================================= Latest Project Area style ============================================= ***/ .latest-project-area .project-filter { float: left !important; margin: 0 0 30px; } /*** ============================================= About Industry Area style ============================================= ***/ .about-industry-area .img-holder { margin-right: 0; } .about-industry-area .text-holder { margin-left: 0; margin-top: 20px; } .about-industry-area #quote-form { margin-top: 40px; } /*** ============================================= Testimonial Area style ============================================= ***/ .testimonial-area { padding: 80px 0 10px; } .testimonial-area .top .sec-title { display: block; float: none !important; } .testimonial-area .single-item { position: relative; margin-bottom: 90px; } .testimonial-area .top .more-project { margin-top: 0px; overflow: hidden; float: left !important; margin-bottom: 25px; } .testimonial-area .single-item .inner-box .bottom .client-info { float: none !important; } .testimonial-area .single-item .inner-box .bottom .review-box { float: left !important; } /*** ============================================= Latest blog area style ============================================= ***/ .latest-blog-area { padding-bottom: 30px; padding-top: 80px; } .latest-blog-area .single-blog-item { display: block; margin-bottom: 50px; overflow: hidden; position: relative; } /*** ============================================= slogan Area style ============================================= ***/ .slogan-area { padding-bottom: 25px; padding-top: 10px; } .slogan-area .text { float: none; width: 100%; text-align: center; margin: 0 0 5px; } .slogan-area .button { float: none !important; overflow: hidden; width: 100%; } .slogan-area .button a { margin: 0 auto; } /*** ============================================= Footer Area style ============================================= ***/ .footer-contact-info { padding: 10px 0 10px; } .footer-contact-info li { display: block; padding: 9px 7px; width: 100%; text-align: center; border: none; } .single-footer-widget.marginlft { margin-left: 0; } .single-footer-widget.pd-bottom50 { padding-bottom: 50px; } .single-footer-widget.margin-top { margin-top: 50px; } /*** ============================================= Copyright Area style ============================================= ***/ .copyright-area .support { text-align: center; margin: 0 0 5px; } .copyright-area .copyright { float: none; text-align: center; } /*** ============================================= About Company Area style ============================================= ***/ .about-company-area .text-holder { margin-top: 20px; } .about-company-area .bottom .single-item { margin-bottom: 25px; } .about-company-area .bottom .single-item .img-holder, .about-company-area .bottom .single-item .text-holder { display: block; vertical-align: middle; } .about-company-area .bottom .single-item .text-holder { padding-left: 0px; } /*** ============================================= Fact counter Area style ============================================= ***/ .fact-counter-area { padding-bottom: 50px; } .fact-counter-area .single-item { margin-bottom: 30px; } /*** ============================================= Main project Area style ============================================= ***/ .main-project-area .project-filter li { margin: 0 13px; } .main-project-area .project-filter li span:before { display: none; } /*** ============================================= Blog Default Area style ============================================= ***/ #blog-area .blog-post { border-right: 0px solid #f4f4f4; margin-bottom: 0px; padding-bottom: 0px; margin-right: 0px; padding-right: 0px; margin-top: 0px; padding-top: 0px; } #blog-area .sidebar-wrapper { margin-left: 0; padding-top: 70px; } .single-blog-item .text-holder .meta-info li { line-height: 20px; } /*** ============================================= Blog Single Area style ============================================= ***/ .blog-single-area .middle-content-box .img-holder, .blog-single-area .middle-content-box .text-holder { display: block; } .blog-single-area .middle-content-box .img-holder { width: 100%; } .blog-single-area .middle-content-box .img-holder img { width: 100%; } .blog-single-area .middle-content-box .text-holder { padding-left: 0; padding-top: 45px; } .blog-single-area .middle-content-box .text-holder:before { top: 20px; left: 0px; } .blog-single-area .tag-social-share-box .social-share { float: left !important; margin-top: 25px; } /*** ============================================= Breadcrumb Area style ============================================= ***/ .breadcrumb-botton ul { padding: 18px 10px 17px; } .breadcrumb-area .breadcrumbs h1 { line-height: 50px; } .breadcrumb-botton .share-button a { font-size: 15px; } /*** ============================================= Contact Form Area style ============================================= ***/ .contact-form-area .sec-title { padding-bottom: 100px; } .contact-form-area .sec-title .select-box { left: 0; top: 80px; } /*** ============================================= Single Service Area style ============================================= ***/ #single-service-area .left-sidebar { margin-top: 70px; } #single-service-area .research-innovation-box .solution-single-chart-box { margin-bottom: 40px; margin-top: 30px; } #single-service-area .single-service-tabbox .tab-menu { width: 200px; } #single-service-area .single-service-tabbox .tab-content { border-left: 1px solid #ececec; border-right: 1px solid #ececec; margin-top: -30px; padding: 30px 30px 40px; border-top: 1px solid #ececec; margin-top: -31px; } /*** ============================================= Checkout Area style ============================================= ***/ .checkout-area .sec-title { padding-bottom: 30px; float: none !important; } .checkout-area .form.shipping-info{ padding-top: 70px; } /*** ============================================= Login Register Area style ============================================= ***/ .login-register-area .form .social-icon { float: left; margin-right: -8px; margin-top: 15px; } .login-register-area .form .social-icon .login-with { left: 0; position: relative; top: 0; } .login-register-area .form.register{ padding-top: 70px; } .login-register-area .form h6 { margin: 28px 0 0 0px; } /*** ============================================= Cart area style ============================================= ***/ .cart-middle .apply-coupon { padding-left: 0; } .cart-middle .apply-coupon input[type="text"] { position: relative; margin-bottom: 20px; } .cart-middle .update-cart { float: left !important; margin-top: 20px; } .cart-total { padding-top: 70px; } /*** ============================================= Shop Area style ============================================= ***/ .shop-area .sidebar-wrapper { margin-left: 0px; position: relative; display: block; overflow: hidden; } .shop-area .shop-content { margin-right: 0; border-right: none; padding-right: 0; margin-top: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 70px; } .shop-area .showing-result-shorting .showing { float: none !important; display: block; } .shop-area .showing-result-shorting .shorting { float: none !important; display: block; margin-top: 15px; } /*** ============================================= Single Shop Area style ============================================= ***/ .single-shop-area .shop-content { border-left: none; margin-left: 0; padding-left: 0; margin-top: 0; padding-top: 0; margin-bottom: 0; padding-bottom: 0; } .single-shop-content .img-holder { margin-right: 0; } .single-shop-content .content-box { margin-top: 40px; margin-left: 0; } .single-shop-area .sidebar-wrapper { padding-top: 30px; margin-right: 0; } } /* Wide Mobile Layout: 480px. */ @media only screen and (min-width: 480px) and (max-width: 767px) { }