/* Template Name: Biziness Author: MarkUps Author URI: http://www.markups.io/ Version: 1.0 */ /* Table of Content ================================================== #BASIC TYPOGRAPHY #HEADER #MENU #FEATURED SLIDER #ABOUT US #COUNTER #SERVICE #PORTFOLIO #TEAM #TESTIMONIAL #CLIENTS #CONTACT US #FOOTER #RESPONSIVE STYLE */ /*--------------------*/ /* BASIC TYPOGRAPHY */ /*--------------------*/ body, html { overflow-x:hidden; } body { font-family: 'Open Sans', sans-serif; font-size: 15px; letter-spacing: 0.5px; line-height: 1.5; color: #1c1b1b; } ul { padding: 0; margin: 0; } ul li { list-style: disc; font-size: 17px; line-height: 1.59; } a { text-decoration: none; color: #2f2f2f; } a:hover, a:focus { outline: none; text-decoration: none; } h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: 700; margin-top: 0; } h1 { font-size: 38px; } h2 { font-size: 32px; line-height: 1.13; } h3 { font-size: 26px; } h4 { font-size: 22px; } h5 { font-size: 20px; } h6 { font-size: 18px; } img { border: none; max-width: 100%; } strong { font-weight: 500; } code { background-color: #ee6e73; border-radius: 2px; color: #fff; padding: 2px 4px; } pre { background-color: #f8f8f8; border: 1px solid #eee; border-radius: 4px; padding: 10px; } pre code { background-color: transparent; color: #333; } del{ text-decoration-color: #ee6e73; } kbd { background-color: #ddd; padding: 4px 6px; border-radius: 2px; color: ; } address { line-height: 1.5; padding-left: 10px; } dl dt { font-weight: 700; } dl dd { margin-left: 0; } blockquote { background-color: #f8f8f8; border-radius: 0 4px 4px 0; padding: 5px 15px; } blockquote p { margin-top: 10px; } button { padding: 5px 15px; border: none; } button:focus { outline: none; border: none; } /*Wordpress default class*/ .alignleft { float:left; margin-right:8px; } .aligncenter { display:block; margin:10px auto; } .alignright { float:right; margin-left:8px; } .alignnone { max-width: 100%; } .wp-caption-text { font-size: 12px; font-style: italic; text-align: center; } /* ========= BUTTON =========*/ .mu-primary-btn { background-color: transparent; border-radius: 100px; border: solid 1px #ffffff; color: #fff; display: inline-block; font-size: 15px; font-weight: 400; letter-spacing: 01px; padding: 12px 25px; -webkit-transition: all 0.5s; transition: all 0.5s; } .mu-primary-btn:hover, .mu-primary-btn:focus { background-color: #fff; color: #000; } .mu-send-msg-btn { border-radius: 4px; border: 1px solid #888; background-color: transparent; font-size: 13px; font-weight: 600; letter-spacing: 1px; text-align: center; padding: 14px 24px; margin-top: 10px; -webkit-transition: all 0.5s; transition: all 0.5s; width: 130px; } .mu-send-msg-btn:hover, .mu-send-msg-btn:focus { background-color: #fff; } /*--------------------*/ /* HEADER */ /*--------------------*/ #mu-header { display: inline; float: left; width: 100%; position: absolute; left: 0; right: 0; top: 0; padding: 25px 0; z-index: 999; transition: all 0.5s; } .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { color: #fff; font-size: 35px; font-family: 'Montserrat', sans-serif; margin-top: -5px; } .navbar-brand img{ margin-top: -12px; } #mu-header.mu-fixed-nav{ background-color: rgba(0,0,0,0.8); width: 100%; position: fixed; padding: 15px 0; } /*--------------------*/ /* MENU */ /*--------------------*/ .navbar-default { min-height: auto; } .mu-navbar { background-color: transparent; border: none; border-radius: 0; margin-bottom: 0; } .navbar-default .mu-menu li a { border-bottom: 2px solid transparent; color: #fff; font-size: 15px; font-weight: 400; padding: 0 0 5px; margin: 10px 15px 5px; transition: all 0.5s; } .navbar-default .mu-menu li a:hover, .navbar-default .mu-menu li a:focus { border-bottom: 2px solid #ffffff; color: #fff; } .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover{ background-color: transparent; color: #fff; } /*--------------------*/ /* FEATURED SLIDER */ /*--------------------*/ #mu-featured-slider{ display: inline; float: left; width: 100%; } .mu-featured-slider-area{ display: inline; float: left; width: 100%; } .mu-featured-slide { display: inline; float: left; width: 100%; } .mu-featured-slider-single { display: inline; float: left; position: relative; width: 100%; } .mu-featured-slider-single::before{ content: ''; position: absolute; bottom: 0; left: 0; top: 0; right: 0; opacity: 0.92; } .mu-featured-slider-content { position: absolute; left: 20%; right: 20%; bottom: 0; top: 35%; text-align: center; } .mu-featured-slider-content h1 { color: #fff; font-size: 50px; margin-bottom: 20px; } .mu-featured-slider-content p { color: #fff; padding: 0 100px; margin-bottom: 20px; } .mu-featured-slider-content .mu-primary-btn{ margin-top: 20px; } .slick-dotted.slick-slider{ margin-bottom: 0; } .slick-dots { background-color: transparent; bottom: 40px; } .slick-dots li button { background-color: #fff; border-radius: 10px; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.5s; transition: all 0.5s; opacity: 0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; height: 18px; width: 18px; } .slick-dots li button:hover, .slick-dots li button:focus, .slick-dots li.slick-active button { -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } .slick-dots li button::before, .slick-dots li.slick-active button::before { color: #fff; height: 18px; width: 18px; } /*--------------------*/ /* ABOUT US */ /*--------------------*/ #mu-about { display: inline; float: left; width: 100%; } .mu-about-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-about-header { display: inline; float: left; text-align: center; width: 100%; } .mu-heading-title { color: #1c1b1b; margin-bottom: 15px; position: relative; } .mu-header-dot { background-color: #7d7373; border-radius: 0; height: 3px; width: 100px; display: inline-block; margin-bottom: 20px; } .mu-about-content{ display: inline; float: left; margin-top: 70px; width: 100%; } .mu-about-content-single{ display: inline; float: left; text-align: center; width: 100%; } .mu-about-icon-box { font-size: 25px; padding: 5px 12px; margin-bottom: 30px; display: inline-block; border-radius: 10px; } .mu-about-content-single h4{ margin-bottom: 20px; } /*--------------------*/ /* COUNTER */ /*--------------------*/ #mu-counter { background-image: url("assets/images/counter-bg.jpeg"); background-position: center center; background-size: cover; background-attachment: fixed; display: inline; float: left; position: relative; width: 100%; } #mu-counter:before { bottom: 0; content: ''; left: 0; top: 0; right: 0; position: absolute; opacity: 0.84; } .mu-counter-area { display: inline; float: left; padding: 150px 0; width: 100%; } .mu-counter-area h2 { color: #fff; text-align: center; } .mu-counter-block { display: inline; float: left; margin-top: 80px; width: 100%; } .mu-single-counter { display: inline; float: left; text-align: center; width: 100%; } .mu-single-counter i { color: #fff; font-size: 40px; border-bottom: 3px solid #fff; padding: 15px 15px; margin-bottom: 0px; display: inline-block; } .counter-value { font-size: 40px; font-weight: 700; margin-top: 10px; margin-bottom: 10px; color: #fff; } .mu-counter-name { color: #ecf0f1; } /*--------------------*/ /* SERVICE */ /*--------------------*/ #mu-service { display: inline; float: left; width: 100%; } .mu-service-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-service-header { display: inline; float: left; text-align: center; width: 100%; } .mu-heading-title { color: #1c1b1b; margin-bottom: 15px; position: relative; } .mu-header-dot { background-color: #7d7373; border-radius: 0; height: 3px; width: 100px; display: inline-block; margin-bottom: 20px; } .mu-service-content{ display: inline; float: left; margin-top: 70px; width: 100%; } .mu-service-content-single{ display: inline; float: left; text-align: left; margin-top: 20px; margin-bottom: 20px; padding: 0 10px; width: 100%; } .mu-service-icon-box { font-size: 35px; margin-bottom: 20px; display: inline-block; border-radius: 10px; } .mu-service-content-single h4{ margin-bottom: 20px; font-size: 20px; } .mu-service-content-single p{ font-size: 15px; } /*--------------------*/ /* PORTFOLIO */ /*--------------------*/ #mu-portfolio { background-color: #f8f8f8; display: inline; float: left; width: 100%; } .mu-portfolio-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-portfolio-header { display: inline; float: left; text-align: center; width: 100%; } .mu-heading-title { color: #1c1b1b; margin-bottom: 15px; position: relative; } .mu-header-dot { background-color: #7d7373; border-radius: 0; height: 3px; width: 100px; display: inline-block; margin-bottom: 20px; } .mu-portfolio-content{ display: inline; float: left; margin-top: 50px; width: 100%; } .mu-portfolio-filter-area{ display: inline; float: left; width: 100%; margin-top: 70px; } .filtr-item { margin-bottom: 0px; padding: 16px; transform-style: unset !important; } .mu-imglink { background-color: transparent; } .filtr-item h4 { font-size: 18px; } .mu-filter-item-content { position: absolute; left: 16px; top: 16px; right: 16px; bottom: 16px; color: #fff; padding-top: 30%; text-align: center; -webkit-transform: scale(0); transform: scale(0); -webkit-transition: all 0.5s; transition: all 0.5s; opacity: 0.9; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; } .filtr-item:hover .mu-filter-item-content{ -webkit-transform: scale(1); transform: scale(1); } /* Filter controls */ .mu-simplefilter { text-align: center; } .mu-simplefilter li { border: 1px solid #ccc; color: #333; cursor: pointer; display: inline-block; text-transform: uppercase; padding: 1rem 2rem; margin: 0 5px; -webkit-transition: all 0.5s; transition: all 0.5s; font-size: 15px; } .mu-simplefilter li:hover, .mu-simplefilter li.active { color: #fff; border-color: #fff; } /*--------------------*/ /* TEAM */ /*--------------------*/ #mu-team { display: inline; float: left; width: 100%; } .mu-team-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-team-header { display: inline; float: left; text-align: center; width: 100%; } .mu-team-content{ display: inline; float: left; margin-top: 70px; width: 100%; } .mu-team-content-single { background-color: #ecf0f1; display: inline; float: left; text-align: left; margin-top: 20px; margin-bottom: 20px; width: 100%; padding: 15px; } .mu-team-content-single:hover { -webkit-transition: background-color 1000ms linear; -ms-transition: background-color 1000ms linear; transition: background-color 1000ms linear; } .mu-team-content-single:hover .mu-team-info { color: #fff; } .mu-team-profile { display: inline; float: left; position: relative; width: 100%; } .mu-team-info { display: inline; float: left; width: 100%; text-align: center; padding: 10px; } .mu-team-info h4 { font-size: 18px; text-transform: uppercase; margin-top: 10px; margin-bottom: 0; } .mu-team-info span{ font-size: 13px; } .mu-team-social-info { background: rgba(0,0,0,0.85); position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 10; opacity: 0.9; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; text-align: center; padding-top: 49%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -webkit-transition: all 0.5s; transition: all 0.5s; } .mu-team-content-single:hover .mu-team-social-info{ opacity: 1; } .mu-team-social-info a { color: #fff; border: 1px solid #fff; text-align: center; border-radius: 50%; width: 45px; height: 45px; display: inline-block; font-size: 18px; line-height: 45px; margin: 0 4px; -webkit-transition: all 0.5s; transition: all 0.5s; } .mu-team-social-info a:hover, .mu-team-social-info a:focus{ background-color: #fff; border-color: #fff; } /*--------------------*/ /* CLIENT TESTIMONIALS */ /*--------------------*/ #mu-testimonials { background-image: url("assets/images/testimonials-bg.jpeg"); background-position: center center; background-size: cover; background-attachment: fixed; display: inline; float: left; position: relative; width: 100%; } #mu-testimonials::before { background: rgba(0,0,0,0.9); bottom: 0; content: ''; left: 0; top: 0; right: 0; position: absolute; opacity: 0.84; } .mu-testimonials-area { display: inline; float: left; padding: 150px 0 210px; width: 100%; } .mu-testimonials-area h2 { color: #fff; text-align: center; } .mu-testimonials-block { display: inline; float: left; margin-top: 60px; width: 100%; } .mu-testimonial-slide li{ list-style: none; text-align: center; } .mu-testimonial-slide li p{ color: #fff; } .mu-ct-name { margin-bottom: 5px; color: #fff; line-height: 1; text-transform: uppercase; margin-top: 30px; } .mu-ct-title { color: #fff; font-size: 14px; } .mu-testimonial-slide .slick-dots { bottom: -70px; } .mu-testimonial-slide .slick-dots li { height: 20px; width: 35px; } .mu-testimonial-slide .slick-dots li button { border-radius: 0px; height: 3px; padding: 0; width: 35px; } .mu-testimonial-slide .slick-dots li button:hover, .mu-testimonial-slide .slick-dots li button:focus, .mu-testimonial-slide .slick-dots li.slick-active button { opacity: 1; } /*--------------------*/ /* CLIENTS */ /*--------------------*/ #mu-clients { display: inline; float: left; width: 100%; } .mu-clients-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-clients-header { display: inline; float: left; text-align: center; width: 100%; } .mu-clients-content{ display: inline; float: left; margin-top: 80px; width: 100%; } .mu-clients-content-single { display: inline; float: left; text-align: left; width: 100%; padding: 15px; } /*--------------------*/ /* CONTACT US */ /*--------------------*/ #mu-contact { background-color: #f8f8f8; display: inline; float: left; width: 100%; } .mu-contact-area { display: inline; float: left; padding: 100px 0; width: 100%; } .mu-contact-header { display: inline; float: left; text-align: center; width: 100%; } .mu-contact-content{ display: inline; float: left; margin-top: 50px; width: 100%; } .mu-contact-left { display: inline; float: left; width: 100%; } .mu-contact-form .form-group input { background: transparent; color: #333; font-size: 15px; border: 1px solid #333; border-radius: 0; height: 45px; margin-bottom: 24px; } .mu-contact-form .form-group textarea{ color: #333; background: transparent; border: 1px solid #333; border-radius: 0; font-size: 18px; padding: 10px; height: 190px; } .mu-contact-form .form-control:focus { background-color: #fff; outline: 0; box-shadow: none; } © .mu-contact-form .form-control::-webkit-input-placeholder { color: #888; font-size: 15px; } .mu-contact-form .form-control:-moz-placeholder { /* Firefox 18- */ color: #888; font-size: 15px; } .mu-contact-form .form-control::-moz-placeholder { /* Firefox 19+ */ color: #888; font-size: 15px; } .mu-contact-form .form-control:-ms-input-placeholder { color: #888; font-size: 15px; } .mu-contact-form button { float: left; margin-left: 0; border-radius: 0px; } .mu-contact-form .button-default::after, .mu-contact-form .button-default > span { padding: 12px 40px; } .mu-contact-right { display: inline; float: left; width: 100%; } .mu-contact-right h4{ font-size: 24px; } .mu-contact-right address { padding-left: 0; margin-top: 15px; display: block; width: 100%; } .mu-contact-right address p { font-size: 16px; } .mu-contact-right address p i{ margin-right: 10px; } .mu-social-media { display: inline; float: left; width: 100%; } .mu-social-media a { display: inline-block; font-size: 16px; border: 1px solid #333; width: 35px; height: 30px; line-height: 30px; text-align: center; margin: 0 5px; -webkit-transition: all 0.5s; transition: all 0.5s; } .mu-social-media a:hover, .mu-social-media a:focus { background-color: #fff; } #form-messages { margin-bottom: 10px; background-color: #fff; } .success { padding: 1em; margin-bottom: 0.75rem; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); color: #468847; background-color: #dff0d8; border: 1px solid #d6e9c6; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .error { padding: 1em; margin-bottom: 0.75rem; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); color: #b94a48; background-color: #f2dede; border: 1px solid rgba(185, 74, 72, 0.3); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /* GOOGLE MAP */ #mu-google-map { display: inline; float: left; width: 100%; } #mu-google-map iframe{ pointer-events: none; } /*--------------------*/ /* FOOTER */ /*--------------------*/ #mu-footer{ display: inline; float: left; width: 100%; } .mu-footer-area{ display: inline; float: left; padding: 30px 0; text-align: center; width: 100%; } .mu-footer-area a{ font-weight: 600; } /*--------------------*/ /* RESPONSIVE STYLE */ /*--------------------*/ @media (max-width: 1199px) { .mu-featured-slider-content { left: 10%; right: 10%; bottom: 0; top: 25%; } .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { margin-top: -7px; } .navbar-brand img { width: 145px; margin-top: -10px; } .navbar-default .mu-menu li a { margin: 10px 12px 5px; } } @media (max-width: 991px) { .navbar-default .mu-menu li a { font-size: 14px; margin: 10px 5px; } .mu-featured-slider-content h1 { font-size: 25px; margin-bottom: 10px; } .mu-featured-slider-content p { padding: 0; margin-bottom: 0; font-size: 14px; } .mu-primary-btn { font-size: 14px; padding: 12px 22px; } .mu-about-content-single, .mu-single-counter { margin-top: 15px; margin-bottom: 15px; } .mu-simplefilter li{ margin-bottom: 10px; } .mu-clients-content-single img{ width: 100%; } .mu-contact-right { margin-top: 50px; } } @media (max-width: 767px) { .navbar-default .navbar-toggle { border-color: #fff; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{ background-color: transparent; } .navbar-default .navbar-toggle .icon-bar { background-color: #fff; } .navbar-default .navbar-collapse, .navbar-default .navbar-form { background-color: rgba(0,0,0,0.8); text-align: center; } .navbar-default .mu-menu li a { display: inline-block; } .mu-team-content .row > div { width: 49.5%; float: left; } .mu-testimonial-slide li { padding: 0 15px; } } @media (max-width: 640px){ #mu-header.mu-fixed-nav { padding: 10px 0; } .mu-featured-slider-content { left: 0; right: 0; bottom: 0; top: 30%; padding: 0 10px; } .mu-featured-slider-content h1 { font-size: 20px; margin-bottom: 5px; } .mu-featured-slider-content p { font-size: 12px; } .mu-primary-btn { font-size: 12px; padding: 10px 12px; margin-top: 15px; } .slick-dots { bottom: 15px; } } @media (max-width: 480px) { #mu-header { padding: 10px 0; } .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { font-size: 25px; margin-top: 0px; } .navbar-toggle { padding: 7px 8px; } .navbar-toggle .icon-bar { width: 18px; } .mu-featured-slide .slick-dots { display: none !important; } h2{ font-size: 25px; } .mu-heading-title { margin-bottom: 10px; } .mu-about-content-single h4 { margin-bottom: 18px; } .mu-simplefilter li { padding: 1rem 1.3rem; font-size: 14px; } .mu-team-social-info a { width: 35px; height: 35px; font-size: 16px; line-height: 35px; } .mu-contact-form button { width: 100%; } .filtr-item h4 { font-size: 14px; } } @media (max-width: 360px){ .mu-featured-slider-content { top: 49%; } .mu-featured-slider-content p, .mu-featured-slider-content .mu-primary-btn { display: none; } .mu-featured-slider-content h1 { font-size: 18px; margin-bottom: 0; } .mu-filter-item-content { padding-top: 25%; padding-left: 5px; padding-right: 5px; } .filtr-item h4 { font-size: 12px; } .mu-team-content .row > div { width: 100%; } .mu-simplefilter li { padding: 1rem 1rem; font-size: 12px; } } @media (max-width: 320px){ }