/*----------------------------------------*/ /* 1. Theme default CSS /*----------------------------------------*/ html, body { height: 100%; } .floatleft { float:left; } .floatright { float:right; } .alignleft { float:left; margin-right:15px; margin-bottom: 15px; } .alignright { float:right; margin-left:15px; margin-bottom: 15px; } .aligncenter { display:block; margin:0 auto 15px; } a:focus { outline:0px solid; } img {max-width:100%; height:auto; } .fix { overflow:hidden; } p { margin:0 0 15px; color: #777; } h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; margin: 0 0 15px; color: #444; font-weight: 700; } h1{ font-size: 48px; line-height: 50px; } h2{ font-size: 38px; line-height: 40px; } h3{ font-size: 30px; line-height: 32px; } h4{ font-size: 24px; line-height: 26px; } h5{ font-size: 20px; line-height: 22px; } h6{ font-size: 16px; line-height: 20px; } a { transition: all 0.3s ease 0s; text-decoration:none; } a:hover { color: #e22a31; text-decoration: none; } a:active, a:hover { outline: 0 none; } a:hover, a:focus { color: #333; text-decoration: none; } body { background: #fff none repeat scroll 0 0; color: #777; font-family: 'Open Sans', sans-serif; font-size: 14px; text-align: left; overflow-x: hidden; line-height: 22px; } #scrollUp { background: #000 none repeat scroll 0 0; border-radius: 2px; bottom: 15px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); color: #fff; font-size: 20px; height: 34px; line-height: 30px; opacity: 0.6; right: 15px; text-align: center; transition: all 0.3s ease 0s; width: 34px; } #scrollUp:hover { background: #e22a31; opacity: 1; } .clear{ clear:both; } ul{ list-style: outside none none; margin: 0; padding: 0; } input, select, textarea, input[type="text"], input[type="date"], input[type="url"], input[type="email"], input[type="password"], input[type="tel"], button, button[type="submit"] { -moz-appearance: none; box-shadow: none !important; } input:focus, textarea:focus, select:focus { outline: none; } div#preloader { position: fixed; left: 0; top: 0; z-index: 99999; width: 100%; height: 100%; overflow: visible; background: #fff url('../../assets/img/logo/preloader.gif') no-repeat center center; } .navbar-collapse { padding-left: 0px; } ::-moz-selection { background: #e22a31; text-shadow: none; } ::selection { background: #e22a31; text-shadow: none; } .color{ color:#e22a31; font-weight: 800; } .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } .area-padding{ padding: 90px 0px; } .area-padding-2{ padding: 70px 0px 50px; } .padding-2{ padding-bottom: 90px; } .section-headline{ margin-bottom: 60px; position: relative; } .section-headline h3 { display: inline-block; font-size: 30px; font-weight: 700; text-transform: uppercase; } .section-headline.white-headline h3 { color:#fff; } .section-headline.text-left { margin-bottom: 30px; } .section-headline::after { border: 1px solid #e22a31; bottom: -20px; content: ""; left: 0; margin: 0 auto; position: absolute; width: 60px; right: 0; } .section-headline.text-left h3::after { border: 2px solid #e22a31; left: 0; right: auto; } .section-headline p { max-width: 650px; font-size: 16px; letter-spacing: 0.5px; margin: 0 auto; line-height: 26px; } .archive-description p{ color: #FFF; } .sub-head h4 { color: #fff; font-size: 30px; position: relative; padding-bottom: 30px; } .sub-head h4::after { border: 2px solid #e22a31; bottom:0px; content: ""; left: 0; margin: 0 auto; position: absolute; width: 20%; } .sub-head p { color: #fff; font-size: 17px; margin-top: 20px; line-height: 26px; } .mar-row{ margin-top: 50px; } .small-title { text-transform: uppercase; font-size: 12px; margin-bottom: 10px; color:#e22a31; } /*--------------------------------*/ /* 2. Header top Area /*--------------------------------*/ .header-one{ position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 999; } .topbar-left ul li { display: inline-block; } .topbar-area { background: rgba(0,0,0,0.40); } .topbar-left ul li a { color: #fff; display: block; font-weight: 400; margin-right: 20px; padding: 10px 0; text-decoration: none; } .topbar-left ul li a i { color: #e22a31; font-size: 16px; padding-right: 7px; } .topbar-right { position: relative; display: block; } .top-social { float: right; padding: 10px 0px; margin-right: 10px; } .top-social ul li{ display: inline-block; } .top-social ul li a { color: #fff; margin-right: 12px; display: block; text-align: center; font-size: 16px; } .top-social ul li a:hover{ color:#e22a31; } .quote-button { float: right; } .quote-btn { text-transform: uppercase; font-size: 14px; font-weight: 800; color: #fff; background: #e22a31; display: inline-block; border: 1px solid #e22a31; padding: 10px 20px; } .quote-btn:hover{ color: #e22a31; background: #fff; border: 1px solid #fff; } /*----------------------------------------*/ /* 2.1 Header Bottom Area /*----------------------------------------*/ .header-area{ background: rgba(0,0,0,0.30) } .logo { display: block; } .logo a { display: inline-block; height: auto; padding: 20px 0; } .main-menu ul.navbar-nav li { float: left; position: relative; } .main-menu ul.navbar-nav li a { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #fff; font-size: 14px; font-weight: 700; padding: 40px 15px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; } .main-menu ul.navbar-nav li a:hover{ color: #e22a31; } .main-menu ul.navbar-nav li.active a:focus { color: #333; } .main-menu ul.navbar-nav li.active a { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #e22a31; position: relative; z-index: 9999999; } .navbar { border: medium none; margin-bottom: 0; } .navbar-default { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; } .main-menu ul.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { background: none; color:#333; } .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { background-color: transparent; color: #fff; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background: none; } .main-menu ul.nav li ul.sub-menu { background: #252525; border-top: 2px solid #e22a31; left: 0; opacity: 0; position: absolute; top: 115%; transition: all 0.3s ease 0s; visibility: hidden; width: 220px; z-index: -99; } .main-menu ul.nav li ul.sub-menu li ul.sub-menu{ left: 100%; top: 0; } .pagess { position: relative; } .navbar.navbar-default { float: right; } .main-menu ul.nav li ul.sub-menu li { border-bottom: 1px solid #333; padding: 0; position: relative; width: 100%; } .main-menu ul.nav li:hover>ul.sub-menu{ top:100%; opacity:1; z-index:999; visibility:visible; } .main-menu ul.nav li ul.sub-menu li a { color: #fff; display: block; font-size: 13px; font-weight: 700; padding: 10px 15px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; } .main-menu ul.nav li ul.sub-menu li a span{ color: #e22a31; } .main-menu ul.nav li:hover ul.sub-menu li a:hover{ color:#fff; background: #e22a31; } .main-menu ul.nav li ul.sub-menu li:last-child { border:none; } .stick span.search-button i,.stick .header-search input{color:#444} .search-option-5 button.button { display: inline-block; border: none; background: none; padding: 0; } .search-option { background: #fff none repeat scroll 0 0; bottom: -48px; color: #444; display: none; position: absolute; right: 20px; width: 260px; z-index: 99999; } .search-option input { background: #fff none repeat scroll 0 0; border: medium none; color: #444; display: block; float: left; font-size: 14px; font-style: italic; padding: 8px 10px; width: 210px; height: 44px; } .search-option button.button { background: #e22a31; border: medium none; color: #fff; display: inline-block; float: right; font-size: 17px; line-height: 35px; padding: 5px 15px; text-align: center; } .header-right-link a.main-search { color: #fff; display: inline-block; float: right; font-size: 16px; line-height: 32px; position: relative; text-align: center; padding: 34px 15px; } /*--------------------------------*/ /* 2.2. Sticky Header Area /*--------------------------------*/ .header-area.stick { left: 0; position: fixed; top: 0; width: 100%; z-index: 999999; box-shadow: 0px 0px 5px #000, -2px -2px 5px #000; background: #252525; } .header-area.stick .logo a { display: inline-block; height: auto; padding: 15px 0; } .header-area.stick .main-menu ul.navbar-nav li a { padding: 25px 15px; } .header-area.stick .quote-button { float: right; padding: 13px 5px; } .header-area.stick .header-right-link a.main-search { padding: 19px 15px; } .header-area.stick .main-menu ul.nav li ul.sub-menu li a { color: #fff; display: block; font-size: 13px; font-weight: 700; padding: 10px 15px; } .header-area.stick .main-menu ul.nav li ul.sub-menu li a:hover{ color: #fff; background: #e22a31; } .header-area.stick .navbar-brand>img { display: block; width: 160px; height: auto; } /*----------------------------------------*/ /* 2.3. Mobile Menu Area /*----------------------------------------*/ .mobile-menu-area { background: #f9f9f9 none repeat scroll 0 0; padding: 10px 0px ; } .mean-container .mean-bar::after { content: ""; font-size: 21px; left: 5%; position: absolute; top: 12px; text-transform: uppercase; font-weight: 500; } .mean-container a.meanmenu-reveal:hover { color:#252525 } .mean-container .mean-nav ul { list-style-type: none; margin: 20px 0px; padding: 0; width: 100%; } .mean-container .mean-nav ul li a { background: #f8f8f8 none repeat scroll 0 0; color: #444; display: block; float: left; font-size: 12px; font-weight: 700; margin: 0; padding: 13px 10px; text-align: left; text-decoration: none; text-transform: uppercase; width: 90%; } .mean-nav ul li.mean-last { margin-bottom: 20px; } .mean-container .mean-nav ul li a.mean-expand { color: #444; line-height: 17px; } .mean-container .mean-nav ul li { width: 99.7%; } /*----------------------------------------*/ /* 12. Blog Area /*----------------------------------------*/ .blog-area{ background: #f5f5f5; } .blog-grid { margin-top: -30px; } .blog-image{ overflow: hidden; display: block; } .image-scale { position: relative; transform: scale(1.1); display: block; transition: 0.5s; } .image-scale::after{ position: absolute; content: ""; background: rgba(0,46,91,0.10); width: 100%; height: 100%; left:0; top:0; } .post-thumbnail img{ min-width: 100%; max-height: 100%; } .blog-content a h4 { font-size: 18px; text-transform: capitalize; font-weight: 600; color: #444; line-height: 24px; } .blog-meta { padding: 15px 0px 10px; } .blog-meta span, .blog-meta a { color: #444; font-size: 14px; font-weight: 700; padding-right: 4px; } .blog-meta a{ color: #6F6F6F; } .blog-meta a:hover{ color: #e22a31; } .single-blog:hover .image-scale { transform: scale(1); transition: 0.5s; } .single-blog:hover .image-scale::after{ background: rgba(0,46,91,0); } .single-blog { margin-top: 30px; position: relative; overflow: hidden; } .blog-grid-fast { margin-top: -30px; } .single-blog.b-mar{ margin-top: 20px; } .blog-content a h4:hover{ color:#e22a31; } .blog-btn { display: inline-block; font-weight: 700; color: #444; position: relative; text-transform: uppercase; font-size: 12px; } .blog-btn::after { position: absolute; content: "\f105"; right:-12px; top: 0px; font-family: fontAwesome; font-size: 10px; transition: 0.5s; } .blog-btn:hover { color: #e22a31; } .blog-btn:hover.blog-btn::after { right: -20px; opacity: 1; transition: 0.5s; } /*----------------------------------------*/ /* 21. Breadcumbs Area /*----------------------------------------*/ .page-area{ position: relative; } .page-area { background-repeat: no-repeat; background-size: cover; background-position: top center; } .breadcumb-overlay { position: absolute; background: rgba(10, 27, 40, 0.6) none repeat scroll 0 0; top: 0; width: 100%; left: 0; height: 100%; } .breadcrumb{ padding: 100px 0px; background-color: transparent; margin-bottom: 0; } .breadcrumb .section-headline{ margin-bottom: 0px; } .breadcrumb .section-headline h3::after { display: none; } .breadcrumb ul { padding: 10px 0px; } .breadcrumb ul li { display: inline-block; color: #fff; padding: 0px 10px 0px 20px; position: relative; font-size: 16px; } .breadcrumb ul li a{ color: #fff; } .breadcrumb ul li.home-bread{ padding-left: 0px; } .breadcrumb ul li:after { position: absolute; content: "\f105"; font-family: fontAwesome; right: -10px; top: 0; } .breadcrumb ul li:last-child:after{ content: ""; } .breadcrumb .section-headline::after { display: none; } .testimonial-page-area{ background: #f9f9f9; } .welcome-page-area { background: #f9f9f9; } .pricing-page-area{ background: #f9f9f9; } .testimonial-page-area .single-testi { margin-top: 30px; } /*---------------------------------------- 22. Blog Details page ----------------------------------------*/ .search-form .screen-reader-text{display: none;} .search-form label { width: 70%; } .search-form input[type="search"]{ padding: 5px 15px; width: 100%; border: 1px solid #ccc; height: 42px; } .blog-search-option { margin-bottom: 30px; display: block; } .search-form .search-submit { display: inline-block; background: #e22a31; border: 1px solid #e22a31; font-size: 17px; padding: 9px 10px; width: 28%; color: #fff; height: 43px; } .search-form .search-submit:hover { color: #fff; background: #002c57; border: 1px solid #002c57; } .left-blog h4 { border-bottom: 1px solid #ddd; color: #444; font-size: 17px; font-weight: 500; margin-bottom: 0; padding: 15px 10px; text-transform: uppercase; } .left-blog { background: #f9f9f9 none repeat scroll 0 0; overflow: hidden; padding-bottom: 20px; } .left-blog li { border-bottom: 1px solid #ddd; display: block; } .left-blog ul li a { color: #444; display: block; font-size: 16px; padding: 10px; text-transform: capitalize; position: relative; } .left-blog ul li a:after { position: absolute; content: "\f105"; font-family: fontAwesome; right: 12px; top: 10px; font-size: 14px; } .popular-tag.left-blog ul li a:after { display: none; } .recent-single-post { border-bottom: 1px solid #ddd; display: block; overflow: hidden; padding: 15px 0px; } .recent-single-post:last-child { border-bottom: none; } .post-img { display: inline-block; float: left; padding: 0 5px; width: 35%; } .pst-content { display: inline-block; float: left; width: 65%; padding-left: 10px; } .pst-content p a:hover,.left-blog ul li a:hover { color: #e22a31; } .left-blog-page { margin-top: 30px; } .pst-content p a { color: #444; font-size: 15px; } .blog-tags { padding: 1px 0; } .left-blog li:last-child { border-bottom: 0 ; } .popular-tag.left-blog ul li a:hover{ color: #fff; } .popular-tag.left-side-tags.left-blog ul { padding: 0 10px; } .left-tags .left-side-tags ul li { border-bottom: 0; display: inline-block; margin: 5px 0px; } .tagcloud a { padding: 3px 10px; margin: 1px; width: auto; border: 1px solid #e22a31; background: #e22a31; color: #fff; border-radius: 5px; font-weight: 700; font-size: 14px !important; float: left; } .tagcloud a:hover { border: 1px solid #002c57; background: #002c57; } .left-side-tags h4 { margin-bottom: 15px; } .comments-heading h3, h3.comment-reply-title { border-bottom: 1px solid #e8e8e9; color: #444; font-size: 18px; margin: 0 0 20px; padding: 0 0 5px; text-transform: capitalize; } .comments a{ color: #e22a31; } .comment-reply-link{ float: right; color: #e22a31; } .comment-section .form-submit{ display: inline-block; width: 100%; } .logged-in-as a, .reply-title a, .comment-reply-title a{ color: #e22a31; } .comments-list ul li{ margin-bottom: 25px; } .comments-list-img{ float: left; margin-right: 15px; } .comments-content-wrap { color: #444; font-size: 14px; margin: 0 0 15px 60px; padding: 10px; position: relative; } .blog-content p { font-size: 15px; } blockquote { padding: 10px 20px; margin: 0 0 20px; font-size: 15px; border-left: 5px solid #e22a31; font-style: italic; } blockquote p { font-size: 18px !important; line-height: 28px; } .author-avatar { display: inline-block; float: left; width: 10%; } .author-description h2 { color: #777; font-size: 20px; text-transform: uppercase; } .author-description h2 a { color: #333; } .comments-content-wrap span b{margin-right:5px} .comments-content-wrap span a:hover{} span.post-time{margin-right:5px} .comments-content-wrap p { color: #444; margin-top: 10px; } li.threaded-comments{margin-left:50px} .comment-respond { margin-top: 20px; } span.email-notes{color: #42414f; display: block; font-size: 12px; margin-bottom: 10px;} .comment-respond p { color: #444; margin-bottom: 5px; } .comment-respond input[type=text],.comment-respond input[type=email]{ border: 1px solid #e5e5e5; border-radius: 0; height: 32px; margin-bottom: 15px; padding: 0 0 0 10px; width: 100%;} .comment-respond textarea#comment{ border: 1px solid #e5e5e5; border-radius: 0; max-width: 100%; padding: 10px;height: 130px; width: 100%; } .comments-content-wrap span a { color: #333; } .comments-content-wrap span a:hover { color: #e22a31; } .comment-respond .add-btn.contact-btn { background: #e22a31; color: #fff; display: block; font-size: 16px; margin-top: 5px; padding: 12px 20px; transition: 0.4s; border-radius: 5px; width: auto !important; margin-top: 20px; border: 1px solid #e22a31; text-transform: uppercase; font-weight: 700; } .comment-respond .add-btn.contact-btn:hover{ background: #333; color: #fff; border:1px solid #333; } .pagination { display: inline-block; padding-left: 0; margin: 40px 0 0px; border-radius: 4px; } .pagination .screen-reader-text{ display: none; } .pagination a, .pagination span { position: relative; float: left; padding: 6px 12px; line-height: 1.42857143; text-decoration: none; color: #fff; background-color: #333; border: none; margin-left: -1px; border-radius: 5px; } .pagination .page-numbers { display: inline-block; margin: 0px 3px; } .pagination .current, .pagination .current:hover, .pagination .current:focus { z-index: 3; color: #fff; background-color: #e22a31; border-color: #e22a31; cursor: default; border-radius: 5px; } .blog-page-details .single-blog{ margin-top: 0; } .blog-page-details .hentry{ margin: 0; } .blog-page-details .left-blog-page { margin-top:0px; margin-bottom:30px; } .single-post-comments { margin-top: 30px; } /*error*/ .error-btn { background: #e22a31; border: 1px solid #e22a31; color: #fff; font-size: 16px; padding: 12px 20px; transition: 0.4s; margin-top: 15px; text-transform: capitalize; margin-top: 30px; display: inline-block; } .error-btn:hover{ background: #fff; border: 1px solid #e22a31; color: #e22a31; } /*-------------------------------------------------------------- ## post-navigation --------------------------------------------------------------*/ .post-navigation{ border-top: 1px solid #e22a31; border-bottom: 1px solid #e22a31; display: inline-block; width: 100%; padding: 10px 0; margin: 15px 0; color: #ccc; } .post-navigation h2{display: none;} .post-navigation a{color: #444;} .post-navigation a:hover{color: #e22a31;} .post-navigation .nav-previous{float: left;width: 45%;padding-left: 5px;} .post-navigation .nav-next{float: right;width: 45%;text-align: right;padding-right: 5px;border-left: 1px solid #09A223; } .post-navigation .post-title{display: block;} .posts-navigation{border-top: 1px solid #09a223;padding-top: 10px;} .posts-navigation .screen-reader-text{font-size: 24px;} /*----------------------------------------*/ /* 13. Footer Area /*----------------------------------------*/ .footer-area { padding: 70px 0; background: #111; } .footer-widget{ margin-bottom: 20px; } .footer-head h4 { color: #ddd; font-size: 18px; margin-bottom: 20px; text-transform: uppercase; font-weight: 700; } .footer-area .widget_tag_cloud { float: left; } .footer-area .widget_tag_cloud a { color: #ddd; display: block; font-size: 14px; line-height: 28px; text-align: center; margin: 3px; border: 1px solid #222; background: #222; font-weight: 600; padding: 3px 5px; border-radius: 2px; } .footer-area .widget_tag_cloud a:hover{ color: #fff; background: #e22a31; border:1px solid #e22a31; } .footer-area ul li a { color: #ddd; padding: 7px 0px 7px 20px; display: block; position: relative; font-weight: 500; } .footer-area ul li a:first-child{ padding-top: 0px; } .footer-area ul li a::after { position: absolute; content: "\f105"; right: auto; top: 2px; font-family: fontAwesome; font-size: 12px; left: 0; } .footer-area ul li a:hover { color: #e22a31; } .footer-area-bottom { background: #111 none repeat scroll 0 0; padding: 25px 0; border-top: 1px solid #333; } .copyright-text a:hover{text-decoration: underline;color:#e22a31;} .copyright-text a { color: #ddd; } .copyright > p { margin-bottom: 0; color: #ddd; } .copyright a { color: #e22a31; } .single-brand-item a { border: 1px solid #f5f5f5; display: block; }