/*------------------------------------------------------------------ [Master Stylesheet] Theme Name: Charity Plus - Nonprofit, Crowdfunding & Charity HTML5 Template Version: 1.0.0 Author: themexriver URL: http://themeforest.net/user/themexriver -------------------------------------------------------------------*/ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- #0.1 Theme Reset Style #0.2 Global Elements #0.3 header #0.4 hero-slider #0.5 footer #0.6 popular-campaign #0.7 help #0.8 cta #0.9 latest-causes #1.0 cta-2 #1.1 volunteers #1.2 evnets #1.3 cta-3 #1.4 latest news #1.5 news letter ----------------------------------------------------------------- >>> causes grid page ----------------------------------------------------------------- #2.0 page-title ----------------------------------------------------------------- >>> causes list page ----------------------------------------------------------------- #3.0 page-title #3.1 causes list section #3.2 urgent donation #3.3 newsletter ----------------------------------------------------------------- >>> causes single page ----------------------------------------------------------------- #4.0 page-title #4.1 causes-single-wrapper ----------------------------------------------------------------- >>> volunteers ----------------------------------------------------------------- #5.0 page-title #5.1 cta-2 ----------------------------------------------------------------- >>> volunteer single page ----------------------------------------------------------------- #6.0 page-title #6.1 Volunteer single section ----------------------------------------------------------------- >>> gallery 3 col page ----------------------------------------------------------------- #7.0 page-title #7.1 gallery-3col-content ----------------------------------------------------------------- >>> gallery 4 col page ----------------------------------------------------------------- #8.0 page-title #8.1 gallery-4col-content ----------------------------------------------------------------- >>> gallery fullwidth page ----------------------------------------------------------------- #9.0 page-title #9.2 gallery-fullwidth-content ----------------------------------------------------------------- >>> event 2 col page ----------------------------------------------------------------- #10.0 page-title #10.1 event-2col-section ----------------------------------------------------------------- >>> event 3 col page ----------------------------------------------------------------- #11.0 page-title #11.1 event-2col-section ----------------------------------------------------------------- >>> shop page ----------------------------------------------------------------- #12.0 page-title #12.1 shop-main-content ----------------------------------------------------------------- >>> shop single page ----------------------------------------------------------------- #13.0 page-title #13.1 shop-details-main-content ----------------------------------------------------------------- >>> blog page ----------------------------------------------------------------- #14.0 page-title #14.1 blog-main-content ----------------------------------------------------------------- >>> blog detail page ----------------------------------------------------------------- #15.0 page-title #15.1 blog-detail-main-content ----------------------------------------------------------------- >>> contact page ----------------------------------------------------------------- #16.0 page-title #16.1 contact-main-content ----------------------------------------------------------------- >>> about page ----------------------------------------------------------------- #17.0 page-title #17.1 about-details #17.2 cta-4 ----------------------------------------------------------------- >>> event single page ----------------------------------------------------------------- #18.0 page-title #18.1 event-single-main-content ----------------------------------------------------------------- >>> error 404 page ----------------------------------------------------------------- #19.0 error-404-content #19.1 search-something ----------------------------------------------------------------- >>> home page style two ----------------------------------------------------------------- #20.0 urgent-donation #20.1 cta-4 #20.2 events-nearby ----------------------------------------------------------------- >>> home page style three ----------------------------------------------------------------- #21.0 urgent-donation #21.1 cta-4 #21.2 shop slider ----------------------------------------------------------------- >>> home page style four ----------------------------------------------------------------- #22.0 cta-4 #22.1 important-causes #22.2 next-event-section #22.3 about style 2 #22.4 recent news #22.5 fun fact #22.6 gallery style 2 #22.7 testimonials #22.8 partner ----------------------------------------------------------------- >>> home page style five ----------------------------------------------------------------- #23.0 urgent-causes #23.1 main-banar #23.2 cta-5 #23.3 important-causes #23.4 events-nearby-s2 #23.5 about-st3 ----------------------------------------------------------------*/ /*--------------------------- Fonts ----------------------------*/ @import url("https://fonts.googleapis.com/css?family=Montserrat:400,700|Noto+Sans|Work+Sans"); /*-------------------------------------------------------------- #0.1 Theme Reset Style --------------------------------------------------------------*/ body { font-family: "Montserrat", sans-serif; background-color: #fff; font-size: 15px; -webkit-font-smoothing: antialiased; overflow-x: hidden; } @media (max-width: 767px) { body { font-size: 14px; } } p { color: #828791; line-height: 1.8em; } h1, h2, h3, h4, h5, h6 { color: #3d424b; font-weight: bold; } ul { list-style-type: none !important; padding-left: 0; margin: 0; } a:hover, a:focus { text-decoration: none; } /*-------------------------------------------------------------- #0.2 Global Elements --------------------------------------------------------------*/ .page-wrapper { position: relative; overflow: hidden; } .fi:before { margin: 0; } .section-padding { padding: 125px 0; } @media (max-width: 991px) { .section-padding { padding: 90px 0; } } @media (max-width: 767px) { .section-padding { padding: 80px 0; } } .wow { visibility: hidden; } /** for popup image ***/ .mfp-wrap { background-color: rgba(0, 0, 0, 0.9); z-index: 99999; } .mfp-with-zoom .mfp-container, .mfp-with-zoom.mfp-bg { opacity: 0; -webkit-backface-visibility: hidden; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .mfp-with-zoom.mfp-ready .mfp-container { opacity: 1; } .mfp-with-zoom.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-with-zoom.mfp-removing .mfp-container, .mfp-with-zoom.mfp-removing.mfp-bg { opacity: 0; } /*** for fancybox video ***/ .fancybox-overlay { background: rgba(0, 0, 0, 0.9); z-index: 9999 !important; } .fancybox-wrap { z-index: 99999 !important; } .preloader { background: #fff; width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 999999; } .preloader .middle { width: 80px; height: 80px; line-height: 80px; text-align: center; color: #fb5e1c; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .preloader .middle i:before { font-size: 45px; } .preloader .middle:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 4px solid #cccccc; border-top: 4px solid #fb5e1c; border-bottom: 4px solid #fb5e1c; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; -webkit-animation: proloaderAnimation 0.8s linear infinite; animation: proloaderAnimation 0.8s linear infinite; } /*** proloader animation ***/ @-webkit-keyframes proloaderAnimation { form { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes proloaderAnimation { form { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .section-title { text-align: center; margin-bottom: 75px; } @media (max-width: 767px) { .section-title { margin-bottom: 40px; } } .section-title span { font-family: "Noto Sans", sans-serif; font-size: 18px; color: #fb5e1c; text-transform: uppercase; } @media (max-width: 767px) { .section-title span { font-size: 16px; } } .section-title h2 { font-size: 32px; line-height: 1em; color: #3d424b; margin: 0; padding: 0.28em 0 0.6em; position: relative; text-transform: capitalize; } @media (max-width: 767px) { .section-title h2 { font-size: 25px; } } .section-title h2:before { content: ""; background-color: #fb5e1c; width: 70px; height: 7px; position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 767px) { .section-title h2:before { width: 50px; height: 5px; } } .section-title-s2 { text-align: center; margin-bottom: 60px; } @media (max-width: 767px) { .section-title-s2 { margin-bottom: 40px; } } .section-title-s2 h2 { font-size: 32px; margin: 0; text-transform: capitalize; } .section-title-s2 h2 span { color: #fb5e1c; } @media (max-width: 767px) { .section-title-s2 h2 { font-size: 25px; } } .section-title-s3, .section-title-single-heading, .section-title-s4 { text-align: center; } @media screen and (min-width: 992px) { .section-title-s3, .section-title-single-heading, .section-title-s4 { margin-bottom: 20px; } } @media (max-width: 767px) { .section-title-s3, .section-title-single-heading, .section-title-s4 { padding: 0 15px; } } .section-title-s3 h2, .section-title-single-heading h2, .section-title-s4 h2 { font-size: 40px; font-weight: normal; color: #000; margin: 0 0 0.4em; text-transform: capitalize; } .section-title-s3 h2 span, .section-title-single-heading h2 span, .section-title-s4 h2 span { font-weight: bold; } @media (max-width: 991px) { .section-title-s3 h2, .section-title-single-heading h2, .section-title-s4 h2 { font-size: 32px; } } @media (max-width: 767px) { .section-title-s3 h2, .section-title-single-heading h2, .section-title-s4 h2 { font-size: 28px; } } .section-title-s3 p, .section-title-single-heading p, .section-title-s4 p { font-size: 16px; color: #333333; margin: 0 0 2.39em !important; } .section-title-single-heading { margin-bottom: 35px; } .section-title-s4 p { color: #828791; margin: 0 0 3.39em !important; } .side-section-title h2 { font-size: 36px; margin: 0 0 1em; text-transform: capitalize; } .side-section-title h2 span { color: #fb5e1c; } @media (max-width: 767px) { .side-section-title h2 { font-size: 25px; } } .theme-btn { background-color: #fb5e1c; line-height: 0.66em; color: #fff; padding: 15px; border: 0; text-transform: uppercase; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2); -o-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2); } .theme-btn:hover, .theme-btn:focus, .theme-btn:active { background-color: #f94d04; color: #fff; } @media (max-width: 767px) { .theme-btn { padding: 12px; font-size: 13px; } } .theme-btn-s2 { background-color: transparent; line-height: auto; font-size: 16px; font-weight: bold; color: #fff; border: 2px solid #fff; padding: 11px 30px; } .theme-btn-s2:hover { color: #fb5e1c; border-color: #fb5e1c; } @media (max-width: 767px) { .theme-btn-s2 { font-size: 15px; border: 1px solid #fff; padding: 7px 30px; } } .form input, .form textarea, .form select { border-color: #bfbfbf; border-radius: 0; outline: 0; box-shadow: none; color: #595959; } .form input:focus, .form textarea:focus, .form select:focus { border-color: #fb5e1c; -webkit-box-shadow: 0 0 5px 0 #fc824e; -moz-box-shadow: 0 0 5px 0 #fc824e; -o-box-shadow: 0 0 5px 0 #fc824e; -ms-box-shadow: 0 0 5px 0 #fc824e; box-shadow: 0 0 5px 0 #fc824e; } .form ::-webkit-input-placeholder { font-style: 12px; font-style: normal; color: #595959; } .form :-moz-placeholder { font-style: 12px; font-style: normal; color: #595959; } .form ::-moz-placeholder { font-style: 12px; font-style: normal; color: #595959; } .form :-ms-input-placeholder { font-style: 12px; font-style: normal; color: #595959; } .form select { font-style: italic; background: url(../images/select-icon.png) no-repeat 95% center; display: inline-block; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; cursor: pointer; } .form select::-ms-expand { /* for IE 11 */ display: none; } .sticky { width: 100% !important; position: fixed !important; left: 0; top: 0; z-index: 9999 !important; } @media screen and (min-width: 992px) { .sticky #navbar > ul > li > a { padding: 25px 20px; text-transform: uppercase; } } .sticky .social-links { top: 23px; } @media (max-width: 991px) { .sticky .social-links { top: 12px; } } .sticky .mini-cart-wrapper { top: 18px; } @media (max-width: 991px) { .sticky .mini-cart-wrapper { top: 8px; } } .sticky .mini-cart-wrapper .mini-cart { top: 48px !important; } @media (max-width: 991px) { .sticky .mini-cart-wrapper .mini-cart { top: 38px !important; } } /*** header style tow ***/ .header-style-two .sticky .navbar-brand { height: 70px; padding-top: 0; padding-bottom: 0; } @media (max-width: 767px) { .header-style-two .sticky .navbar-brand { height: auto; padding-top: 15px; padding-bottom: 15px; } } .header-style-two .sticky .navbar-brand img { -webkit-transform: scale3d(0.8, 0.8, 1); -moz-transform: scale3d(0.8, 0.8, 1); -o-transform: scale3d(0.8, 0.8, 1); -ms-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); } @media (max-width: 767px) { .header-style-two .sticky .navbar-brand img { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @media (max-width: 991px) { .header-style-two .sticky .social-links-mini-cart { top: 21px; } } @media (max-width: 767px) { .header-style-two .sticky .social-links-mini-cart { top: 13px; } } .header-style-two .sticky .navbar-header button { top: 17px; } @media (max-width: 767px) { .header-style-two .sticky .navbar-header button { top: 15px; } } /*** header style four ***/ @media screen and (min-width: 992px) { .header-style-four .sticky #navbar > ul > li > a, .header-style-five .sticky #navbar > ul > li > a { font-weight: bold; color: gray; padding: 25px 30px 25px 25px; } } @media screen and (min-width: 992px) { .header-style-four .sticky .social-links-mini-cart, .header-style-five .sticky .social-links-mini-cart { top: 5px; } } /*** header style five ***/ @media screen and (min-width: 992px) { .header-style-five .sticky .navbar-brand { margin-top: 7px; } .header-style-five .sticky .navbar-brand img { width: 220px; } } @media (max-width: 1199px) { .header-style-five .sticky #navbar > ul > li > a { padding: 22px 27px 22px 15px; } } .social-links { overflow: hidden; } .social-links li { float: left; margin-right: 24px; } .social-links li a { color: #a9b0be; text-align: center; } .social-links li a:hover { color: #fb5e1c; } @media (max-width: 400px) { .volunteers-grid > .col { width: 95%; margin: 0 0 0 2.3%; } } .volunteers-grid .box { position: relative; } .volunteers-grid .box:hover .hover-text { opacity: 1; } .volunteers-grid .box:hover .hover-text > div { bottom: 0; opacity: 1; } .volunteers-grid .hover-text { background-color: rgba(61, 66, 75, 0.8); width: 100%; height: 100%; position: absolute; left: 0; top: 0; text-align: center; overflow: hidden; opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } .volunteers-grid .hover-text > div { width: 100%; position: absolute; bottom: -20%; opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } .volunteers-grid .hover-text h4, .volunteers-grid .hover-text a { color: #fff; } .volunteers-grid .hover-text h4 { font-size: 20px; margin: 0; text-transform: uppercase; } @media (max-width: 767px) { .volunteers-grid .hover-text h4 { font-size: 16px; } } .volunteers-grid .hover-text span { display: block; font-size: 14px; color: #fb5e1c; margin-bottom: 1em; } .volunteers-grid .hover-text .social-links { top: 0; } .volunteers-grid .hover-text .social-links li { width: 33.33%; margin: 0; padding: 0; } .volunteers-grid .hover-text .social-links li:first-child a { background-color: #00529c; } .volunteers-grid .hover-text .social-links li:first-child a:hover { background-color: #004583; } .volunteers-grid .hover-text .social-links li:nth-child(2) a { background-color: #00acee; } .volunteers-grid .hover-text .social-links li:nth-child(2) a:hover { background-color: #009ad5; } .volunteers-grid .hover-text .social-links li:last-child a { background-color: #0071ad; border-right: 0; } .volunteers-grid .hover-text .social-links li:last-child a:hover { background-color: #006094; } .volunteers-grid .hover-text .social-links a { padding: 0; display: block; font-size: 34px; padding: 12px 0; border-right: 1px solid #3d424b; } @media (max-width: 767px) { .volunteers-grid .hover-text .social-links a { font-size: 20px; } } .volunteers-grid .hover-text .social-links a:hover { color: #fff; } .blog-grid img { width: auto !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .blog-grid a:hover, .blog-grid a:focus { text-decoration: none; color: #fb5e1c; } .blog-grid h3 { font-size: 18px; margin: 0 0 0.5em; } .blog-grid h3 a { color: #3d424b; } @media (max-width: 767px) { .blog-grid h3 { font-size: 17px; } } .blog-grid .post .entry-media { text-align: center; } .blog-grid .post .entry-media img { display: inline-block; } .blog-grid .post .entry-body { padding: 20px; -webkit-box-shadow: 0 0 25px 0 #dbdbdb; -moz-box-shadow: 0 0 25px 0 #dbdbdb; -o-box-shadow: 0 0 25px 0 #dbdbdb; -ms-box-shadow: 0 0 25px 0 #dbdbdb; box-shadow: 0 0 25px 0 #dbdbdb; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -o-border-radius: 0 0 5px 5px; -ms-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } @media (max-width: 767px) { .blog-grid .post .entry-body { padding: 15px; } } .blog-grid .post .entry-date-author ul { margin-bottom: 30px; overflow: hidden; } @media (max-width: 767px) { .blog-grid .post .entry-date-author ul { margin-bottom: 20px; } } .blog-grid .post .entry-date-author ul li { font-size: 13px; float: left; margin-right: 5px; padding-right: 5px; position: relative; } .blog-grid .post .entry-date-author ul li a { color: #999999; } .blog-grid .post .entry-date-author ul li a:hover { color: #fb5e1c; } .blog-grid .post .entry-date-author ul li:after { content: "/"; color: #999999; position: absolute; right: -2px; top: 0; } .blog-grid .post .entry-date-author ul li:last-child:after { display: none; } .blog-grid .post .read-more a { font-size: 16px; color: #fb5e1c; } .blog-grid .post .read-more a:hover { color: #e04504; } @media (max-width: 767px) { .blog-grid .post .read-more a { font-size: 14px; } } .page-title { text-align: center; position: relative; } .page-title:before { content: ""; background-color: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 50; } .page-title .page-title-bg { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-filter: sepia(100%); filter: sepia(100%); } .page-title > .container { position: relative; height: 390px; z-index: 100; } @media (max-width: 991px) { .page-title > .container { height: 320px; } } .page-title .title-box { width: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .page-title .title-box h1 { font-size: 50px; color: #fb5e1c; margin: 0 0 0.25em; text-transform: uppercase; } .page-title .title-box h1 span { color: #fff; } @media (max-width: 991px) { .page-title .title-box h1 { font-size: 40px; } } @media (max-width: 767px) { .page-title .title-box h1 { font-size: 30px; } } .page-title .title-box ol { background: transparent; padding: 0; margin: 0; } .page-title .title-box ol li, .page-title .title-box ol a { color: #a9b0be; font-size: 18px; text-transform: capitalize; } @media (max-width: 991px) { .page-title .title-box ol li, .page-title .title-box ol a { font-size: 16px; } } @media (max-width: 767px) { .page-title .title-box ol li, .page-title .title-box ol a { font-size: 15px; } } .page-title .title-box ol a:hover { text-decoration: none; color: #fb5e1c; } .causes-list-box { overflow: hidden; -webkit-box-shadow: 0 0 15px 5px #e6e6e6; -moz-box-shadow: 0 0 15px 5px #e6e6e6; -o-box-shadow: 0 0 15px 5px #e6e6e6; -ms-box-shadow: 0 0 15px 5px #e6e6e6; box-shadow: 0 0 15px 5px #e6e6e6; } @media (max-width: 767px) { .causes-list-box { padding: 15px; } } .causes-list-box .img-holder { width: 45%; float: left; } .causes-list-box .details, .causes-list-box > .title { width: 55%; float: right; padding: 45px 90px 45px 40px; } @media (max-width: 1199px) { .causes-list-box .details, .causes-list-box > .title { padding: 30px 20px 30px 30px; } } @media (max-width: 767px) { .causes-list-box .details, .causes-list-box > .title { padding: 30px 0 10px 0; } } .causes-list-box .details h3, .causes-list-box > .title h3 { font-size: 27px; margin: 0 0 0.9em; } @media (max-width: 1199px) { .causes-list-box .details h3, .causes-list-box > .title h3 { font-size: 22px; } } .causes-list-box .details .progress, .causes-list-box > .title .progress { background-color: #3d424b; max-width: 300px; height: 13px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .causes-list-box .details .progress .progress-bar, .causes-list-box > .title .progress .progress-bar { background-color: #fb5e1c; line-height: 13px; font-size: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .causes-list-box .details h4, .causes-list-box > .title h4 { font-size: 17px; font-weight: 600; margin: 0 0 1.47em; } @media (max-width: 1199px) { .causes-list-box .details h4, .causes-list-box > .title h4 { font-size: 15px; } } .causes-list-box .details h4 span, .causes-list-box > .title h4 span { color: #fb5e1c; } .causes-list-box .details p, .causes-list-box > .title p { color: #9da1a9; margin: 0 0 1.5em; } .causes-list-box .details .theme-btn, .causes-list-box > .title .theme-btn { font-weight: bold; padding: 17px 30px; } @media (max-width: 1199px) { .causes-list-box .details .theme-btn, .causes-list-box > .title .theme-btn { padding: 14px 27px; } } @media (max-width: 767px) { .causes-list-box .img-holder, .causes-list-box .details { width: 100%; float: none; } } .sidebar .widget { margin-bottom: 65px; } @media (max-width: 991px) { .sidebar .widget { margin-bottom: 50px; } } @media (max-width: 767px) { .sidebar .widget { margin-bottom: 45px; } } .sidebar .widget:last-child { margin-bottom: 0; } .sidebar .widget a { color: #3d424b; } .sidebar .widget a:hover, .sidebar .widget a:focus { text-decoration: none; color: #fb5e1c; } .sidebar .widget > div { margin-bottom: 25px; } .sidebar .widget > div:last-child { margin-bottom: 0; } .sidebar .widget h3 { font-size: 22px; margin: 0 0 1em; text-transform: capitalize; } @media (max-width: 767px) { .sidebar .widget h3 { font-size: 20px; } } .sidebar .widget h4 { font-size: 16px; margin: 0 0 0.2em; } @media (max-width: 767px) { .sidebar .widget h4 { font-size: 15px; } } .sidebar .widget h4 a { color: #545b67; } .sidebar .widget .date, .sidebar .widget .remaing-date { font-size: 14px; color: gray; margin: 0; } .sidebar .search-widget form div { position: relative; } .sidebar .search-widget form div ::-webkit-input-placeholder { font-style: 12px; font-style: normal; color: #fb5e1c; } .sidebar .search-widget form div :-moz-placeholder { font-style: 12px; font-style: normal; color: #fb5e1c; } .sidebar .search-widget form div ::-moz-placeholder { font-style: 12px; font-style: normal; color: #fb5e1c; } .sidebar .search-widget form div :-ms-input-placeholder { font-style: 12px; font-style: normal; color: #fb5e1c; } .sidebar .search-widget form div input { height: auto; color: #fb5e1c; padding: 7px 45px 7px 25px; border-color: #cccccc; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } .sidebar .search-widget form div input:focus { border-color: #fb5e1c; box-shadow: none; } .sidebar .search-widget form div .btn { background: transparent; color: #fb5e1c; position: absolute; right: 0; top: 0; } .sidebar .search-widget form div .btn:hover, .sidebar .search-widget form div .btn:focus { outline: none; border: 0; box-shadow: 0; } .share { padding-bottom: 10px; } .share > ul, .share > span { display: inline-block; } .share span { font-size: 18px; font-weight: bold; color: #3d424b; text-transform: uppercase; margin-right: 25px; } .share ul { position: relative; top: 10px; overflow: hidden; } .share ul li { background-color: #00529c; width: 30px; height: 30px; line-height: 30px; float: left; margin-right: 12px; opacity: 0.9; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; } .share ul li:hover { opacity: 1; } .share ul li:nth-child(2) { background-color: #00acee; } .share ul li:nth-child(3) { background-color: #d84d31; } .share ul li:last-child { background-color: #0071ad; margin-right: 0; } .share ul li a { display: block; font-size: 20px; color: #fff; text-align: center; } /******************* pagination ********************/ .pagination-wrapper { text-align: center; } .pagination-wrapper > ul { display: inline-block; overflow: hidden; padding: 5px; } .pagination-wrapper > ul > li { text-align: center; float: left; margin-right: 10px; } @media (max-width: 767px) { .pagination-wrapper > ul > li { margin-right: 7px; } } .pagination-wrapper > ul > li:last-child { margin-right: 0; } .pagination-wrapper > ul > li a { width: 35px; height: 35px; line-height: 35px; display: block; font-size: 18px; color: gray; border: 1px solid #cccccc; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 0 5px 1px #e6e6e6; -moz-box-shadow: 0 0 5px 1px #e6e6e6; -o-box-shadow: 0 0 5px 1px #e6e6e6; -ms-box-shadow: 0 0 5px 1px #e6e6e6; box-shadow: 0 0 5px 1px #e6e6e6; } @media (max-width: 767px) { .pagination-wrapper > ul > li a { width: 30px; height: 30px; line-height: 30px; font-size: 17px; } } .pagination-wrapper > ul > li a:hover { text-decoration: none; background-color: #fb5e1c; color: #fff; border-color: #fb5e1c; } /*********************** gallery grid ***********************/ .gallery a:hover, .gallery a:focus { text-decoration: none !important; } .gallery .gallery-filters { text-align: center; margin-bottom: 36px; } @media (max-width: 991px) { .gallery .gallery-filters { margin-bottom: 25px; } } .gallery .gallery-filters ul { display: inline-block; overflow: hidden; margin-top: -5px; } .gallery .gallery-filters ul li { float: left; margin-right: 25px; padding-right: 25px; position: relative; } @media (max-width: 991px) { .gallery .gallery-filters ul li { margin-right: 10px; padding-right: 10px; } } .gallery .gallery-filters ul li:after { content: "/"; color: #b3b3b3; font-size: 20px; font-weight: bold; position: absolute; right: 0; top: 0; } @media (max-width: 991px) { .gallery .gallery-filters ul li:after { font-size: 14px; } } .gallery .gallery-filters ul li:last-child { margin: 0; padding: 0; } .gallery .gallery-filters ul li:last-child:after { display: none; } .gallery .gallery-filters ul li a { font-size: 17px; font-weight: bold; color: #b3b3b3; display: block; text-transform: uppercase; } @media (max-width: 991px) { .gallery .gallery-filters ul li a { font-size: 14px; } } .gallery .gallery-filters ul li a:hover, .gallery .gallery-filters ul li .current { color: #fb5e1c; } .gallery .gallery-container { overlay: hidden; } .gallery .gallery-container .box > a { display: block; position: relative; } .gallery .gallery-container .box > a:before { content: ""; opacity: 0; background-color: rgba(251, 94, 28, 0.85); width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-transform: scale3d(0.5, 0.5, 1); -moz-transform: scale3d(0.5, 0.5, 1); -o-transform: scale3d(0.5, 0.5, 1); -ms-transform: scale3d(0.5, 0.5, 1); transform: scale3d(0.5, 0.5, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; -ms-transition: all 0.4s; transition: all 0.4s; } .gallery .gallery-container .box > a:after { font-family: "FontAwesome"; content: "\f00e"; font-size: 22px; color: #fff; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; } .gallery .gallery-container .box > a:hover:before { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .gallery .gallery-container .box > a:hover:after { opacity: 1; } .event-grid-wrapper { overflow: hidden; } .event-grid-wrapper .event-box { text-align: center; -webkit-box-shadow: 0 0 15px 0 #bfbfbf; -moz-box-shadow: 0 0 15px 0 #bfbfbf; -o-box-shadow: 0 0 15px 0 #bfbfbf; -ms-box-shadow: 0 0 15px 0 #bfbfbf; box-shadow: 0 0 15px 0 #bfbfbf; } .event-grid-wrapper .event-box img { display: inline-block; } .event-grid-wrapper .event-box .event-details { padding: 28px 0 35px; } .event-grid-wrapper .event-box .event-details .date { background-color: #fb5e1c; font-size: 14px; font-weight: bold; color: #fff; display: inline-block; padding: 0 10px; text-transform: uppercase; } @media (max-width: 767px) { .event-grid-wrapper .event-box .event-details .date { font-size: 12px; padding-top: 3px; } } .event-grid-wrapper .event-box .event-details h3 { font-size: 20px; margin: 0.9em 0 0.13em; text-transform: capitalize; } @media (max-width: 767px) { .event-grid-wrapper .event-box .event-details h3 { font-size: 18px; } } .event-grid-wrapper .event-box .event-details h3 a { color: #3d424b; } .event-grid-wrapper .event-box .event-details h3 a:hover { color: #fb5e1c; } .event-grid-wrapper .event-box .event-details .location { display: block; font-weight: bold; color: #a6a6a6; margin-bottom: 1.5em; text-transform: capitalize; } @media (max-width: 767px) { .event-grid-wrapper .event-box .event-details .location { font-size: 14px; } } .event-grid-wrapper .event-box .event-details .location i { color: #fb5e1c; } .event-grid-wrapper .event-box .event-details .btn { font-size: 16px; font-weight: bold; color: #fb5e1c; text-transform: capitalize; } @media (max-width: 767px) { .event-grid-wrapper .event-box .event-details .btn { font-size: 15px; } } .event-grid-wrapper .event-box .event-details .btn:hover { color: #e04504; } /*** shop sidebar ***/ .shop-sidebar { /*** range filtering ***/ } .shop-sidebar .widget { margin-bottom: 65px; } .shop-sidebar .widget:last-child { margin-bottom: 0; } .shop-sidebar .widget h3 { font-size: 20px; margin: 0 0 1.7em; padding-bottom: 0.6em; text-transform: uppercase; position: relative; } .shop-sidebar .widget h3:before { content: ""; background-color: #fb5e1c; width: 30px; height: 2px; position: absolute; left: 0; bottom: 0; } @media (max-width: 991px) { .shop-sidebar .widget h3 { font-size: 18px; } } .shop-sidebar .widget > ul li { font-size: 14px; } .shop-sidebar .widget > ul li:first-child a { padding-top: 0; } .shop-sidebar .widget > ul li:last-child a { padding-bottom: 0; border-bottom: 0; } .shop-sidebar .widget > ul li a { display: block; font-weight: bold; color: #333333; padding: 9px 0; border-bottom: 1px solid #e6e6e6; position: relative; } .shop-sidebar .widget > ul li a:hover, .shop-sidebar .widget > ul li a:hover .badge { color: #fb5e1c; } .shop-sidebar .widget > ul li a i { position: absolute; right: 18px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .shop-sidebar .widget > ul li a .badge { color: #333333; background: transparent; position: absolute; right: 7px; } .shop-sidebar .widget > ul li a .badge:before { content: "("; position: absolute; left: 0; } .shop-sidebar .widget > ul li a .badge:after { content: ")"; position: absolute; right: 0; } .shop-sidebar .filter-price-widget .slider.slider-horizontal { width: 100%; } .shop-sidebar .filter-price-widget .slider.slider-horizontal .slider-track { background: #d9d9d9 !important; height: 2px; margin: 0; } .shop-sidebar .filter-price-widget .slider.slider-horizontal .slider-track .slider-selection { background: #404040 !important; } .shop-sidebar .filter-price-widget .slider.slider-horizontal .slider-handle { background: #fb5e1c; width: 14px; height: 14px; top: 3px; } .shop-sidebar .filter-price-widget .value { overflow: hidden; margin-top: 17px; } .shop-sidebar .filter-price-widget .value > div { display: inline-block; float: left; } .shop-sidebar .filter-price-widget .price { font-size: 14px; font-weight: bold; color: #999999; line-height: 30px; float: right !important; } .shop-sidebar .filter-price-widget .price #min-value, .shop-sidebar .filter-price-widget .price #max-value { color: #000; } .shop-sidebar .filter-price-widget .price #max-value { display: inline-block; position: relative; padding-left: 15px; } .shop-sidebar .filter-price-widget .price #max-value:before { content: ""; border-bottom: 1px solid #000; width: 10px; height: 1px; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .shop-sidebar .filter-price-widget .theme-btn { font-size: 13px; font-weight: bold; padding: 11px 17px; text-transform: uppercase; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } /*** shop grid ***/ .shop-content { overflow: hidden; margin-right: -25px; margin-left: -5px; } .shop-content .grid { width: 33.33%; float: left; padding: 0 25px 30px 5px; margin-bottom: 45px; } @media (max-width: 991px) { .shop-content .grid { width: 50%; } } @media (max-width: 767px) { .shop-content .grid { margin-bottom: 15px; } } @media (max-width: 500px) { .shop-content .grid { width: 100%; float: none; } } .shop-content .grid .img-holder { text-align: center; } .shop-content .grid .img-holder img { display: inline-block; } .shop-content .grid .details { position: relative; padding: 15px 22px 19px; -webkit-box-shadow: 0 0 15px 1px #cccccc; -moz-box-shadow: 0 0 15px 1px #cccccc; -o-box-shadow: 0 0 15px 1px #cccccc; -ms-box-shadow: 0 0 15px 1px #cccccc; box-shadow: 0 0 15px 1px #cccccc; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .shop-content .grid h3 { font-size: 18px; margin: 0 0 0.8em; text-transform: capitalize; } .shop-content .grid h3 a { color: #3d424b; } @media (max-width: 991px) { .shop-content .grid h3 { font-size: 16px; } } .shop-content .grid .add-to-cart { color: #fb5e1c; font-weight: bold; } .shop-content .grid .price { background-color: #fb5e1c; width: 60px; height: 60px; text-align: center; color: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; padding-top: 18px; right: -8px; bottom: -30px; } .shop-content .grid .price > span { width: 100%; text-align: center; font-size: 18px; display: block; } .shop-content .grid .price .old-price { font-size: 12px; text-decoration: line-through; margin-top: -8px; } .shop-content .grid .box:hover .details { background-color: #fb5e1c; } .shop-content .grid .box:hover .details h3 a { color: #fff; } .shop-content .grid .box:hover .details .add-to-cart { color: #3d424b; } .shop-content .grid .box:hover .details .price { background-color: #fff; color: #fb5e1c; -webkit-box-shadow: 0 0 2px 0 #b3b3b3; -moz-box-shadow: 0 0 2px 0 #b3b3b3; -o-box-shadow: 0 0 2px 0 #b3b3b3; -ms-box-shadow: 0 0 2px 0 #b3b3b3; box-shadow: 0 0 2px 0 #b3b3b3; } /*** important causes grid ***/ .important-causes-content .grid { position: relative; padding: 112px 75px 28px 28px; overflow: hidden; } @media (max-width: 767px) { .important-causes-content .grid { padding: 112px 25px 28px 28px; } } .important-causes-content .grid:hover .causes-info { top: 0; opacity: 1; visibility: visible; } .important-causes-content .grid:before { content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .important-causes-content .grid > div { position: relative; } .important-causes-content .grid .time-count, .important-causes-content .grid h3 { color: #fff; } .important-causes-content .grid .time-count { background-color: #fb5e1c; font-size: 15px; display: inline-block; padding: 6px 12px; margin-bottom: 15px; } @media (max-width: 767px) { .important-causes-content .grid .time-count { font-size: 13px; display: inline-block; padding: 4px 10px; margin-bottom: 10px; } } .important-causes-content .grid h3 { font-size: 20px; line-height: 1.3em; margin: 0; text-transform: capitalize; } @media (max-width: 767px) { .important-causes-content .grid h3 { font-size: 16px; } } .important-causes-content .grid .causes-info { background-color: rgba(251, 94, 28, 0.9); width: 100%; height: 100%; position: absolute; left: 0; top: 10%; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .important-causes-content .grid .causes-info .btn { background-color: #fff; width: 120px; height: 43px; line-height: 43px; font-size: 16px; font-weight: bold; color: #fb5e1c; padding: 0; position: absolute; right: 0; bottom: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } @media (max-width: 767px) { .important-causes-content .grid .causes-info .btn { font-size: 14px; width: 100px; height: 28px; line-height: 28px; } } .important-causes-content .grid .causes-info .meter3 { text-align: center; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .important-causes-content .grid .causes-info .goal, .important-causes-content .grid .causes-info .raised { text-align: center; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .important-causes-content .grid .causes-info .goal { left: 45px; } @media (max-width: 1199px) { .important-causes-content .grid .causes-info .goal { left: 25px; } } @media (max-width: 767px) { .important-causes-content .grid .causes-info .goal { left: 10px; } } .important-causes-content .grid .causes-info .raised { right: 45px; } @media (max-width: 1199px) { .important-causes-content .grid .causes-info .raised { right: 25px; } } @media (max-width: 767px) { .important-causes-content .grid .causes-info .raised { right: 10px; } } .important-causes-content .grid .causes-info .goal span, .important-causes-content .grid .causes-info .raised span { font-size: 9px; color: #fff; text-transform: uppercase; } .important-causes-content .grid .causes-info .goal h4, .important-causes-content .grid .causes-info .raised h4 { font-size: 16px; color: #000; margin: 0; } .important-causes-content .grid .meter3 { position: relative; } .important-causes-content .grid .meter3 span, .important-causes-content .grid .meter3 p { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .important-causes-content .grid .meter3 span { font-size: 24px; font-weight: bold; color: #fff; top: 40%; } .important-causes-content .grid .meter3 p { font-size: 14px; color: #fff; top: 55%; } /*-------------------------------------------------------------- #0.3 header --------------------------------------------------------------*/ header { background: #15181d; /******************* topbar ********************/ /******************* navigation ********************/ /* navigation open and close btn hide for width screen */ /* style for navigation less than 992px */ /*navbar collaps less then 992px*/ } header .top-bar { padding: 30px 0 20px; border-bottom: 1px solid #0a0c0e; } @media (max-width: 767px) { header .top-bar { text-align: center; padding: 20px 0; } } @media (max-width: 767px) { header .top-bar .logo-holder { border-bottom: 1px solid #0a0c0e; padding-bottom: 10px; margin-bottom: 15px; } } header .top-bar .logo { display: inline-block; } @media (max-width: 991px) { header .top-bar .logo { width: 180px; } } header .top-bar .contact-info { overflow: hidden; position: relative; } @media screen and (min-width: 1200px) { header .top-bar .contact-info { padding-left: 150px; top: 10px; } } @media (max-width: 1199px) { header .top-bar .contact-info { padding-left: 50px; } } @media (max-width: 991px) { header .top-bar .contact-info { padding-left: 0; } } header .top-bar .contact-info .box { width: 60%; float: left; position: relative; padding-left: 70px; } @media (max-width: 991px) { header .top-bar .contact-info .box { width: 50%; padding-left: 45px; } } @media (max-width: 767px) { header .top-bar .contact-info .box { width: 100% !important; padding-left: 0; text-align: center; padding-bottom: 20px; } header .top-bar .contact-info .box:last-child { padding-bottom: 0; } } header .top-bar .contact-info .box:last-child { width: 40%; } header .top-bar .contact-info .box img { position: absolute; left: 0; } @media (max-width: 767px) { header .top-bar .contact-info .box img { position: static; } } header .top-bar .contact-info .details h5 { font-size: 20px; color: #a9b0be; margin: 0; } @media (max-width: 991px) { header .top-bar .contact-info .details h5 { font-size: 18px; } } header .top-bar .contact-info .details p { font-family: "Work Sans", sans-serif; color: #6f7b92; margin: 0; } @media (max-width: 991px) { header .top-bar .contact-info img { width: 35px; } } header .navigation { background-color: #15181d; margin-bottom: 0; border: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } header #navbar { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } header #navbar > ul { margin: 0; } header #navbar a:hover { text-decoration: none; } @media (max-width: 991px) { header #navbar a { font-size: 14px !important; } } @media screen and (min-width: 992px) { header #navbar > ul > li { margin-right: 15px; } } header #navbar > ul > li:last-child { margin-right: 0; } header #navbar > ul > li > a { font-size: 14px; color: #525866; text-transform: uppercase; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } @media screen and (min-width: 992px) { header #navbar > ul > li > a { padding: 40px 20px; } } header #navbar > ul > li > a:hover, header #navbar > ul > li.current > a, header #navbar > ul > li > ul > li.current a { color: #fff; } header #navbar li.sub-menu, header #navbar li.sub-sub-menu { position: relative; } header #navbar li.sub-menu > a, header #navbar li.sub-sub-menu > a { position: relative; } header #navbar li.sub-menu > a:before, header #navbar li.sub-sub-menu > a:before { content: "\f107"; font-family: "FontAwesome"; width: 30px; text-align: center; border-left: 1px solid #cccccc; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media screen and (min-width: 992px) { header #navbar li.sub-menu > a:before, header #navbar li.sub-sub-menu > a:before { border-left: 0; right: -5px; } } @media (max-width: 991px) { header #navbar li.sub-menu > a:before, header #navbar li.sub-sub-menu > a:before { width: 40px; } } @media screen and (min-width: 992px) { header #navbar li.sub-sub-menu > a:before { right: 8px; top: 10px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } } header #navbar li.sub-menu > ul { background: #0f1114; } @media screen and (min-width: 992px) { header #navbar li.sub-menu > ul { width: 220px; position: absolute; top: 110%; left: 0; opacity: 0; visibility: hidden; z-index: 100; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } } @media (max-width: 991px) { header #navbar li.sub-menu > ul { background-color: #fff; } } @media screen and (min-width: 992px) { header #navbar li.sub-menu:hover > ul { top: 100%; opacity: 1; visibility: visible; z-index: 1000; } } header #navbar li.sub-menu > ul > li, header #navbar li.sub-sub-menu > ul > li { border-bottom: 1px solid #cccccc; } @media screen and (min-width: 992px) { header #navbar li.sub-menu > ul > li, header #navbar li.sub-sub-menu > ul > li { border-bottom: 1px solid #08090b; } } header #navbar li.sub-menu > ul > li:last-child, header #navbar li.sub-sub-menu > ul > li:last-child { border-bottom: 0; } @media (max-width: 991px) { header #navbar li.sub-menu > ul > li:first-child, header #navbar li.sub-sub-menu > ul > li:first-child { border-top: 1px solid #cccccc; } } header #navbar li.sub-menu ul li a { font-size: 13px; display: block; padding: 10px 15px; color: #a9b0be; text-transform: capitalize; } @media (max-width: 991px) { header #navbar li.sub-menu ul li a { padding: 10px 10px 10px 50px; } } @media screen and (min-width: 992px) { header #navbar li.sub-menu ul li a:hover { background-color: #111317; color: #fff; } } header #navbar li.sub-sub-menu { position: relative; } @media screen and (min-width: 992px) { header #navbar li.sub-sub-menu > ul { background: #0f1114; width: 220px; position: absolute; left: 110%; top: 0; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } header #navbar li.sub-sub-menu:hover > ul { left: 100%; visibility: visible !important; opacity: 1 !important; } } @media (max-width: 991px) { header #navbar li.sub-sub-menu > a { padding-top: 0 !important; padding-bottom: 0 !important; height: 40px !important; line-height: 40px !important; } header #navbar li.sub-sub-menu > ul > li > a { padding-left: 65px; } } @media screen and (min-width: 992px) { header .navbar-header .open-btn { display: none; } header #navbar .close-navbar { display: none; } } @media (max-width: 991px) { header { /* class for show hide navigation */ } header .container { width: 100%; } header .navbar-header button { background-color: #fb5e1c; width: 35px; height: 30px; border: 0; padding: 5px 7px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; outline: 0; position: absolute; right: 15px; top: 9px; z-index: 9999; } header .navbar-header button span { background-color: #fff; display: block; height: 2px; margin-bottom: 5px; } header .navbar-header button span:last-child { margin: 0; } header #navbar { background: #fff; display: block !important; width: 280px; height: 100% !important; margin: 0; padding: 0; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; position: fixed; right: -300px; top: 0; z-index: 99999; } header #navbar a { color: #000 !important; font-weight: 600; } header #navbar a:hover { color: #fb5e1c !important; } header #navbar .navbar-nav { height: 100%; overflow: auto; } header #navbar .close-navbar { background-color: #fb5e1c; width: 35px; height: 35px; color: #fff; border: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; outline: none; position: absolute; left: -18px; top: 10px; z-index: 20; } header #navbar > ul > li { border-bottom: 1px solid #cccccc; } header #navbar > ul > li > a { height: 40px; line-height: 40px; padding: 0 15px 0 35px !important; } header .dropdown-toggle .mob-icon { width: 40px; height: 40px; line-height: 40px; text-align: center; border-left: 1px solid #cccccc; position: absolute; right: 0; top: 0; } header .slideInn { right: 0 !important; } } @media (max-width: 767px) { header .navbar-header .navbar-brand { font-size: 24px; } } @media (max-width: 991px) { header .navbar-collapse.collapse { display: none !important; } header .navbar-collapse.collapse.in { display: block !important; } header .navbar-header .collapse, header .navbar-toggle { display: block !important; } header .navbar-header { float: none; } header .navbar-right { float: none !important; } header .navbar-nav { float: none; } header .navbar-nav > li { float: none; } } /**** small menu ****/ .small-menu .sub-menu ul { visibility: hidden; height: 0; } .small-menu .sub-menu ul.open { visibility: visible; height: auto; } .social-links { position: relative; top: 39px; } @media (max-width: 991px) { .social-links { top: 12px; } } .social-links-mini-cart { margin: 0; } .social-links-mini-cart > ul { display: inline-block; } .mini-cart-wrapper { position: relative; top: 33px; } @media (max-width: 991px) { .mini-cart-wrapper { top: 7px; } } .mini-cart-wrapper a:hover, .mini-cart-wrapper a:focus { text-decoration: none; } .mini-cart-wrapper > li > a { color: #a9b0be; position: relative; } .mini-cart-wrapper > li > a:hover { text-decoration: none; } .mini-cart-wrapper > li > a span { background-color: #fb5e1c; width: 20px; height: 20px; line-height: 20px; display: inline-block; font-size: 9px; color: #fff; text-align: center; position: absolute; right: -16px; top: -11px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .mini-cart-wrapper .mini-cart { background: #fff; width: 280px; padding: 20px; position: absolute; z-index: 10; right: 0; top: 63px; border: 1px solid #fb5e1c; z-index: 1000; } @media (max-width: 991px) { .mini-cart-wrapper .mini-cart { right: auto; left: -122px; top: 39px; } } .mini-cart-wrapper .mini-cart .item { overflow: hidden; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #b3b3b3; } .mini-cart-wrapper .mini-cart .product-img { width: 80px; float: left; } .mini-cart-wrapper .mini-cart .product-details { width: 150px; float: right; } .mini-cart-wrapper .mini-cart .product-details h6 { font-size: 13px; margin: 0 0 1em; } .mini-cart-wrapper .mini-cart .product-details p { font-size: 13px; color: #fb5e1c; font-weight: bold; margin: 0; } .mini-cart-wrapper .mini-cart .product-details i { color: red; } .mini-cart-wrapper .mini-cart .product-details i:before { font-size: 14px; } .mini-cart-wrapper .mini-cart .price-total { font-size: 14px; } .mini-cart-wrapper .mini-cart .price-total > span, .mini-cart-wrapper .mini-cart .price-total > div { display: inline-block; } .mini-cart-wrapper .mini-cart .price-total > div { float: right; } .mini-cart-wrapper .mini-cart .checkout-btn { margin-top: 15px; } .mini-cart-wrapper .mini-cart .checkout-btn .theme-btn { width: 100%; font-size: 12px; } /*** header style 2 ***/ .header-style-two #main-navigation > .container { position: relative; } .header-style-two #navbar { margin-right: 33px; } @media (max-width: 1199px) { .header-style-two #navbar { margin-right: 20px; } } @media (max-width: 991px) { .header-style-two #navbar { margin-right: 0; } } .header-style-two .navbar-brand { height: auto; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .header-style-two .navbar-brand img { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 767px) { .header-style-two .navbar-brand img { width: 150px; } } .header-style-two .navbar-header button { top: 30px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 767px) { .header-style-two .navbar-header button { top: 15px; } } @media (max-width: 1199px) { .header-style-two #navbar > ul > li { margin-right: 20px; } } @media (max-width: 991px) { .header-style-two #navbar > ul > li { margin-right: 0; } } .header-style-two .social-links-mini-cart { position: absolute; right: 30px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 991px) { .header-style-two .social-links-mini-cart { top: 33px; right: 90px; } } @media (max-width: 767px) { .header-style-two .social-links-mini-cart { top: 14px; } } .header-style-two .mini-cart-wrapper { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .header-style-two .mini-cart-wrapper .mini-cart { top: 67px; } @media (max-width: 991px) { .header-style-two .mini-cart-wrapper .mini-cart { left: auto; right: -88px; } } /*** header style three ***/ .header-style-three .upper-topbar { padding: 12px 0; } @media (max-width: 991px) { .header-style-three .upper-topbar { padding: 8px 0 5px; } } @media (max-width: 767px) { .header-style-three .upper-topbar { display: none; } } /*** upper topbar ***/ @media (max-width: 991px) { .header-style-three .contact-info { margin-top: 2px; } } .header-style-three .contact-info ul { overflow: hidden; } .header-style-three .contact-info ul li { float: left; font-size: 14px; color: #a9b0be; margin-right: 25px; } @media (max-width: 991px) { .header-style-three .contact-info ul li { font-size: 12px; margin-right: 15px; } } .header-style-three .contact-info ul li:last-child { margin-right: 0; } .header-style-three .contact-info ul li i { color: #fb5e1c; display: inline-block; padding-right: 7px; } .header-style-three .social { overflow: hidden; } .header-style-three .social ul { overflow: hidden; float: right; } .header-style-three .social ul li { float: left; margin-right: 12px; } .header-style-three .social ul li:last-child { margin-right: 0; } .header-style-three .social ul li a { font-size: 16px; color: #a9b0be; } @media (max-width: 991px) { .header-style-three .social ul li a { font-size: 13px; } } .header-style-three .social ul li a:hover { color: #fb5e1c; } /*** lower topbar ***/ .header-style-three .lower-topbar { background-color: #fff; padding: 25px 0 18px; } @media (max-width: 991px) { .header-style-three .lower-topbar { padding: 15px 0 8px; } } .header-style-three .logo { margin-top: 10px; text-align: center; } @media (max-width: 991px) { .header-style-three .logo { margin: 0 0 15px; border-bottom: 1px solid #ebebeb; } } @media (max-width: 991px) { .header-style-three .logo a { display: inline-block; } } .header-style-three .next-event { overflow: hidden; text-align: right; } @media (max-width: 991px) { .header-style-three .next-event { text-align: center; padding: 15px 0; } } .header-style-three .next-event > div { display: inline-block; } @media (max-width: 767px) { .header-style-three .next-event > div { display: block; width: 255px; margin: 0 auto; } } .header-style-three .next-event .subject { padding-left: 60px; padding-right: 20px; position: relative; top: -14px; } @media (max-width: 767px) { .header-style-three .next-event .subject { padding-left: 50px; } } .header-style-three .next-event .subject img { position: absolute; left: 0; } @media (max-width: 767px) { .header-style-three .next-event .subject img { width: 40px; } } .header-style-three .next-event h5 { font-size: 20px; color: #000; margin: 5px 0 0; text-transform: capitalize; } .header-style-three .next-event h5 span { display: block; color: #fb5e1c; text-align: left; margin-top: 5px; } @media (max-width: 767px) { .header-style-three .next-event h5 { text-align: left; font-size: 15px; } } .header-style-three #clock, .home-style-four #event-clock { overflow: hidden; } .header-style-three #clock .box, .home-style-four #event-clock .box { width: 70px; float: left; font-size: 14px; font-weight: bold; color: #fff; text-align: center; margin-right: 10px; } @media (max-width: 767px) { .header-style-three #clock .box, .home-style-four #event-clock .box { width: 60px; font-size: 12px; margin-right: 5px; } } .header-style-three #clock .box:last-child, .home-style-four #event-clock .box:last-child { margin-right: 0; } .header-style-three #clock .box > div, .home-style-four #event-clock .box > div { background-color: #fb5e1c; padding: 8px 5px; font-size: 24px; } @media (max-width: 767px) { .header-style-three #clock .box > div, .home-style-four #event-clock .box > div { font-size: 20px; } } .header-style-three #clock .box span, .home-style-four #event-clock .box span { background-color: #545b67; display: block; padding: 4px 0; } .header-style-three #main-navigation > .container { position: relative; } .header-style-three .social-links-mini-cart { position: absolute; right: 25px; top: 6px; } @media (max-width: 991px) { .header-style-three .social-links-mini-cart { right: auto; top: 6px; } .header-style-three .social-links-mini-cart .mini-cart { left: 0; } } .header-style-three .social-links-mini-cart .mini-cart-wrapper { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .header-style-three .social-links-mini-cart .mini-cart { top: 60px; } @media (max-width: 991px) { .header-style-three .social-links-mini-cart .mini-cart { top: 38px; } } .header-style-three #navbar > ul > li { margin-right: 0; } @media screen and (min-width: 992px) { .header-style-three #navbar > ul > li > a { padding-right: 30px; } .header-style-three #navbar > ul > li > a:before { right: 4px; } } @media screen and (min-width: 992px) { .header-style-three #navbar > ul > li > a:hover, .header-style-three #navbar > ul > li.current > a, .header-style-three #navbar > ul > li > ul > li.current a { background-color: #000 !important; color: #fb5e1c !important; } } /*** header style four ***/ /** topbar ***/ .header-style-four .top-bar, .header-style-five .top-bar { padding: 28px 0; background-color: #fff; } @media (max-width: 991px) { .header-style-four .top-bar, .header-style-five .top-bar { padding: 18px 0; } } .header-style-four .top-bar .social-links-btns, .header-style-five .top-bar .social-links-btns { line-height: 65px; } @media (max-width: 991px) { .header-style-four .top-bar .social-links-btns, .header-style-five .top-bar .social-links-btns { line-height: 45px !important; } } @media (max-width: 767px) { .header-style-four .top-bar .social-links-btns, .header-style-five .top-bar .social-links-btns { line-height: 25px !important; margin-top: 15px; padding-top: 15px; border-top: 1px solid #f2f2f2; } } .header-style-four .top-bar .social-links-btns > div:first-child, .header-style-five .top-bar .social-links-btns > div:first-child { float: left; } @media (max-width: 767px) { .header-style-four .top-bar .social-links-btns > div:first-child, .header-style-five .top-bar .social-links-btns > div:first-child { float: none; } } .header-style-four .top-bar .social-links-btns > div:last-child, .header-style-five .top-bar .social-links-btns > div:last-child { float: right; } @media (max-width: 767px) { .header-style-four .top-bar .social-links-btns > div:last-child, .header-style-five .top-bar .social-links-btns > div:last-child { float: none; } } .header-style-four .top-bar .social ul, .header-style-five .top-bar .social ul { overflow: hidden; } @media (max-width: 767px) { .header-style-four .top-bar .social ul, .header-style-five .top-bar .social ul { display: inline-block; } } .header-style-four .top-bar .social ul li, .header-style-five .top-bar .social ul li { float: left; margin-right: 20px; } @media (max-width: 991px) { .header-style-four .top-bar .social ul li, .header-style-five .top-bar .social ul li { margin-right: 10px; } } .header-style-four .top-bar .social ul li:last-child, .header-style-five .top-bar .social ul li:last-child { margin-right: 0; } .header-style-four .top-bar .social ul li a, .header-style-five .top-bar .social ul li a { font-size: 30px; color: #999999; } @media (max-width: 1199px) { .header-style-four .top-bar .social ul li a, .header-style-five .top-bar .social ul li a { font-size: 25px; } } @media (max-width: 991px) { .header-style-four .top-bar .social ul li a, .header-style-five .top-bar .social ul li a { font-size: 18px; } } .header-style-four .top-bar .social ul li a:hover, .header-style-five .top-bar .social ul li a:hover { color: #fb5e1c; } .header-style-four .top-bar .btns a, .header-style-five .top-bar .btns a { font-size: 16px; font-weight: normal; color: #fb5e1c; border-color: #fb5e1c; padding: 7px 15px; text-transform: uppercase; } .header-style-four .top-bar .btns a i:before, .header-style-five .top-bar .btns a i:before { font-size: 15px; } @media (max-width: 991px) { .header-style-four .top-bar .btns a, .header-style-five .top-bar .btns a { font-size: 16px; padding: 5px 18px; } } @media (max-width: 767px) { .header-style-four .top-bar .btns a, .header-style-five .top-bar .btns a { font-size: 15px; padding: 5px 18px; } } .header-style-four .top-bar .btns a:hover, .header-style-five .top-bar .btns a:hover { background-color: #fb5e1c; color: #fff; } /*** minicart ***/ .header-style-four #main-navigation > .container, .header-style-five #main-navigation > .container { position: relative; } .header-style-four .social-links-mini-cart, .header-style-five .social-links-mini-cart { position: absolute; right: 16px; top: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 991px) { .header-style-four .social-links-mini-cart, .header-style-five .social-links-mini-cart { right: 90px; top: 5px; } .header-style-four .social-links-mini-cart .mini-cart-wrapper .mini-cart, .header-style-five .social-links-mini-cart .mini-cart-wrapper .mini-cart { left: -175px; } } @media screen and (min-width: 992px) { .header-style-four .social-links-mini-cart .mini-cart-wrapper .mini-cart, .header-style-five .social-links-mini-cart .mini-cart-wrapper .mini-cart { top: 56px; } } /*** naviation ***/ @media (max-width: 991px) { .header-style-four .logo, .header-style-five .logo { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @media screen and (min-width: 992px) { .header-style-four .logo, .header-style-five .logo { position: relative; top: 5px; } } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li, .header-style-five #navbar > ul > li { margin-right: 0; } } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li > a, .header-style-five #navbar > ul > li > a { font-weight: bold; color: gray; padding: 35px 25px; } } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li > a:before, .header-style-five #navbar > ul > li > a:before { right: 2px; } } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li > a:hover, .header-style-five #navbar > ul > li > a:hover { background-color: #000; color: #fb5e1c; } } .header-style-four #navbar > ul a:hover, .header-style-five #navbar > ul a:hover { color: #fb5e1c !important; } @media screen and (min-width: 992px) { .header-style-four #navbar > ul ul a:hover, .header-style-five #navbar > ul ul a:hover { background-color: #000 !important; } } .header-style-four #navbar > ul > li, .header-style-five #navbar > ul > li { margin-right: 0; } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li > a, .header-style-five #navbar > ul > li > a { padding-right: 30px; } .header-style-four #navbar > ul > li > a:before, .header-style-five #navbar > ul > li > a:before { right: 4px; } } @media screen and (min-width: 992px) { .header-style-four #navbar > ul > li > a:hover, .header-style-five #navbar > ul > li > a:hover, .header-style-four #navbar > ul > li.current > a, .header-style-five #navbar > ul > li.current > a, .header-style-four #navbar > ul > li > ul > li.current a, .header-style-five #navbar > ul > li > ul > li.current a { background-color: #000 !important; color: #fb5e1c !important; } } /*** header style five ***/ @media (max-width: 991px) { .header-style-five > #main-navigation { min-height: 75px; } } @media screen and (min-width: 992px) { .header-style-five .navbar-brand { height: auto; padding: 0; margin-top: 15px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } } @media (max-width: 991px) { .header-style-five .navbar-brand { padding-top: 13px !important; } } .header-style-five .navbar-brand img { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } @media (max-width: 991px) { .header-style-five .navbar-brand img { max-width: 200px; } } @media (max-width: 991px) { .header-style-five .navbar-header button { top: 22px; } } @media (max-width: 1199px) { .header-style-five #navbar > ul > li > a { padding: 35px 27px 35px 15px; } } /*-------------------------------------------------------------- #0.4 hero slider --------------------------------------------------------------*/ .hero { position: relative; height: 100vh; /** slider nav **/ /*** caption animation ***/ } @media (max-width: 767px) { .hero { min-height: 470px; } } .hero .hero-slider { height: 100vh; } @media (max-width: 767px) { .hero .hero-slider { min-height: 470px; } } .hero .slide { height: 100vh; margin: 0; position: relative; background-repeat: no-repeat; position: relative; } .hero .slide:before { content: ""; background-color: rgba(0, 0, 0, 0.6); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } @media (max-width: 767px) { .hero .slide { min-height: 470px; } } .hero .slide img { display: none; } .hero .slide .slider-title { text-align: center; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .hero .slide .slider-title > span, .hero .slide .slider-title p, .hero .slide .slider-title h1, .hero .slide .slider-title .theme-btn { opacity: 0; } .hero .slide .slider-title > span { font-size: 24px; color: #fb5e1c; display: block; } @media (max-width: 991px) { .hero .slide .slider-title > span { font-size: 18px; } } .hero .slide .slider-title h1 { font-size: 60px; color: #fff; margin: 0 0 0.35em; } @media (max-width: 991px) { .hero .slide .slider-title h1 { font-size: 48px; } } @media (max-width: 767px) { .hero .slide .slider-title h1 { font-size: 35px; } } .hero .slide .slider-title p { font-size: 20px; color: #b8bbc1; line-height: 1.6em; margin-bottom: 2.5em; } @media (max-width: 991px) { .hero .slide .slider-title p { font-size: 16px; } } @media (max-width: 767px) { .hero .slide .slider-title p { font-size: 15px; } } .hero .slide .slider-title .theme-btn { font-size: 16px; padding: 20px 45px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } @media (max-width: 991px) { .hero .slide .slider-title .theme-btn { font-size: 16px; padding: 15px 25px; } } @media (max-width: 767px) { .hero .slide .slider-title .theme-btn { font-size: 14px; padding: 10px 15px; } } .hero .hero-slider .owl-nav { width: 100%; margin: 0; padding: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 767px) { .hero .hero-slider .owl-nav { display: none; } } .hero .hero-slider .owl-nav .owl-prev, .hero .hero-slider .owl-nav .owl-next { background-color: #fb5e1c; width: 40px; height: 90px; line-height: 90px; color: #fff; font-size: 20px; padding: 0; margin: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .hero .hero-slider .owl-nav .owl-prev:hover, .hero .hero-slider .owl-nav .owl-next:hover { width: 60px; background: #e04504; } @media (max-width: 991px) { .hero .hero-slider .owl-nav .owl-prev, .hero .hero-slider .owl-nav .owl-next { width: 30px; height: 80px; line-height: 80px; color: #fff; font-size: 20px; } .hero .hero-slider .owl-nav .owl-prev:hover, .hero .hero-slider .owl-nav .owl-next:hover { width: 40px; background: #e04504; } } .hero .hero-slider .owl-nav .owl-prev { left: 0; } .hero .hero-slider .owl-nav .owl-next { right: 0; } .hero .hero-slider .owl-dots { display: none !important; } @media (max-width: 767px) { .hero .hero-slider .owl-dots { display: block !important; position: relative; top: -60px; } } .hero .hero-slider .owl-dots .owl-dot span { width: 14px; height: 14px; margin: 5px; border: 2px solid #fff; } .hero .hero-slider .owl-dots .active span { background: #fb5e1c; } .hero .hero-slider .owl-dots .owl-dot:hover span { background: #fb5e1c; } .hero .owl-stage .active .slider-title > span { -webkit-animation: slideInUpSlow 1s 0.7s forwards; animation: slideInUpSlow 1s 0.7s forwards; } .hero .owl-stage .active h1 { -webkit-animation: slideInUpSlow 1s 1.2s forwards; animation: slideInUpSlow 1s 1.2s forwards; } .hero .owl-stage .active p { -webkit-animation: slideInUpSlow 1s 1.7s forwards; animation: slideInUpSlow 1s 1.7s forwards; } .hero .owl-stage .active .btn { -webkit-animation: slideInUpSlow 1s 2s forwards; animation: slideInUpSlow 1s 2s forwards; } /*** hero style two ***/ .hero-style-two .slide .slider-title, .hero-style-three .slide .slider-title { text-align: left; } .hero-style-two .slider-title, .hero-style-three .slider-title { padding-left: 45px; } @media (max-width: 991px) { .hero-style-two .slider-title, .hero-style-three .slider-title { padding-left: 25px; } } @media (max-width: 767px) { .hero-style-two .slider-title, .hero-style-three .slider-title { padding-left: 0; width: 80%; } } @media (max-width: 550px) { .hero-style-two .slider-title, .hero-style-three .slider-title { width: 100%; } } .hero-style-two .slider-title h1, .hero-style-three .slider-title h1 { margin: 0 0 0.1em; } .hero-style-two .slider-title h1 span, .hero-style-three .slider-title h1 span { color: #fb5e1c; } .hero-style-two .slider-title > span, .hero-style-three .slider-title > span { font-weight: bold; margin: 0 0 0.7em; } .hero-style-two .slider-title p, .hero-style-three .slider-title p { color: #d3d5d9; margin: 0 0 2em; } @media screen and (min-width: 1200px) { .hero-style-two .slider-title p, .hero-style-three .slider-title p { padding-right: 165px; } } .hero-style-two .slider-title .theme-btn, .hero-style-three .slider-title .theme-btn { background-color: transparent; border: 2px solid #fff; padding: 18px 35px; @rounded-border (0); } @media (max-width: 767px) { .hero-style-two .slider-title .theme-btn, .hero-style-three .slider-title .theme-btn { padding: 15px 25px; } } .hero-style-two .slider-title .theme-btn:hover, .hero-style-three .slider-title .theme-btn:hover { background-color: #fb5e1c; border-color: #fb5e1c; } /*** caption animation ***/ .hero-style-two .owl-stage .active .slider-title > span { -webkit-animation: fadeInLeftSlow 1.5s 1.2s forwards; animation: fadeInLeftSlow 1.5s 1.2ss forwards; } .hero-style-two .owl-stage .active h1, .hero-style-three .owl-stage .active h1 { -webkit-animation: fadeInLeftSlow 1.5s 0.7s forwards; animation: fadeInLeftSlow 1.5s 0.7s forwards; } .hero-style-two .owl-stage .active p { -webkit-animation: fadeInLeftSlow 1.5s 1.7s forwards; animation: fadeInLeftSlow 1.5s 1.7s forwards; } .hero-style-two .owl-stage .active .btn { -webkit-animation: fadeInLeftSlow 1.5s 2s forwards; animation: fadeInLeftSlow 1.5s 2s forwards; } /*** hero style three ***/ @media screen and (min-width: 1200px) { .hero-style-three .slider-title { padding-right: 50px; } } .hero-style-three .slider-title h1 { margin: 0 0 0.57em !important; } .hero-style-three .slider-title p { margin: 0 0 1.9em !important; } @media screen and (min-width: 1200px) { .hero-style-three .slider-title p { padding-right: 100px; } } .hero-style-three .slider-title .theme-btn { padding: 17px 38px !important; border-radius: 5px !important; } @media (max-width: 767px) { .hero-style-three .slider-title .theme-btn { padding: 15px 25px !important; } } .hero-style-three .owl-stage .active p { -webkit-animation: fadeInLeftSlow 1.5s 1.5s forwards; animation: fadeInLeftSlow 1.5s 1.5s forwards; } .hero-style-three .owl-stage .active .btn { -webkit-animation: fadeInLeftSlow 1.5s 2s forwards; animation: fadeInLeftSlow 1.5s 2s forwards; } /*** hero style 4 ***/ .home-style-four .hero, .home-style-four .hero-inner { height: 100vh; } @media (max-width: 767px) { .home-style-four .hero, .home-style-four .hero-inner { min-height: 470px; } } .home-style-four .hero .container, .home-style-four .hero-inner .container { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .home-style-four .hero-inner { background: url("../images/banner.jpg") center center/cover no-repeat local; position: relative; } .home-style-four .hero-inner:before { content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } @media (max-width: 767px) { .home-style-four .hero-inner .container { width: 100%; } } .home-style-four .hero-title { text-align: center; } @media screen and (min-width: 1200px) { .home-style-four .hero-title { padding: 0 150px; } } .home-style-four .hero-title h1, .home-style-four .hero-title p, .home-style-four .hero-title .btn { opacity: 0; } .home-style-four .hero-title h1 { font-size: 48px; font-weight: bold; color: #fff; margin: 0 0 0.63em; text-transform: uppercase; } .home-style-four .hero-title h1 span { display: block; } @media (max-width: 991px) { .home-style-four .hero-title h1 { font-size: 33px; } } @media (max-width: 767px) { .home-style-four .hero-title h1 { font-size: 25px; } } .home-style-four .hero-title p { font-family: "Noto Sans", sans-serif; font-size: 18px; color: #fff; margin: 0 0 3.88em; } @media (max-width: 991px) { .home-style-four .hero-title p { font-size: 16px; } } .home-style-four .hero-title .theme-btn { font-size: 18px; font-weight: bold; padding: 19px 50px; text-transform: capitalize; } @media (max-width: 767px) { .home-style-four .hero-title .theme-btn { font-size: 15px; font-weight: bold; padding: 15px 40px; } } .home-style-four .hero .active-hero-title h1 { -webkit-animation: slideInUpSlow 1.5s 0.7s forwards; animation: slideInUpSlow 1.5s 0.7s forwards; } .home-style-four .hero .active-hero-title p { -webkit-animation: slideInUpSlow 1.5s 1.7s forwards; animation: slideInUpSlow 1.5s 1.7s forwards; } .home-style-four .hero .active-hero-title .btn { -webkit-animation: slideInUpSlow 1.5s 2s forwards; animation: slideInUpSlow 1.5s 2s forwards; } /*-------------------------------------------------------------- #0.5 footer --------------------------------------------------------------*/ footer { background-color: #15181d; } footer .upper-footer { padding: 90px 0 80px; } @media (max-width: 991px) { footer .upper-footer { padding-bottom: 5px; } } @media (max-width: 767px) { footer .upper-footer { padding: 60px 0 35px; } } footer .upper-footer a { color: #828791; } footer .upper-footer a:hover { text-decoration: none; color: #fb5e1c; } footer .upper-footer .widget h3 { font-size: 20px; color: #a9b0be; margin: 0.5em 0 2.3em; text-transform: uppercase; } @media (max-width: 991px) { footer .upper-footer .widget h3 { margin: 0.5em 0 1em; } } @media (max-width: 767px) { footer .upper-footer .widget h3 { font-size: 18px; } } footer .upper-footer .widget h3 + ul li { margin-bottom: 13px; } footer .upper-footer .widget h3 + ul li:last-child { margin-bottom: 0; } footer .upper-footer .about-widget { padding-right: 45px; } footer .upper-footer .about-widget p { line-height: 1.5em; } footer .upper-footer .about-widget .logo { margin-bottom: 15px; } footer .upper-footer .about-widget .logo img { display: inline-block; } footer .upper-footer .about-widget .details { padding-left: 70px; } @media (max-width: 991px) { footer .upper-footer .about-widget .details { padding-left: 0; } } footer .upper-footer .about-widget .copyright { margin: 1.8em 0 1.3em; } footer .upper-footer .about-widget .copyright span { display: block; } footer .upper-footer .about-widget .copyright a { color: #fb7035; } footer .upper-footer .about-widget .social-links li { margin-right: 10px; } footer .upper-footer .contact-widget input, footer .upper-footer .contact-widget textarea { background-color: #0a0c0e; width: 100%; border: 0; padding: 2px 15px 5px; font-size: 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } footer .upper-footer .contact-widget textarea { height: 110px; } footer .upper-footer .contact-widget input:focus, footer .upper-footer .contact-widget textarea:focus { -webkit-box-shadow: 0 0 5px 0 black; -moz-box-shadow: 0 0 5px 0 black; -o-box-shadow: 0 0 5px 0 black; -ms-box-shadow: 0 0 5px 0 black; box-shadow: 0 0 5px 0 black; } footer .upper-footer .contact-widget form > div { margin-bottom: 15px; } footer .upper-footer .contact-widget form > div:last-child { margin-bottom: 0; } footer .upper-footer .contact-widget .theme-btn { font-size: 16px; padding: 12px 33px; } @media (max-width: 767px) { footer .upper-footer .contact-widget .theme-btn { font-size: 14px; padding: 10px 20px; } } @media (max-width: 991px) { footer .upper-footer > .col { min-height: 305px; margin-bottom: 55px; } } @media (max-width: 767px) { footer .upper-footer > .col { width: 100%; min-height: auto; } } footer .lower-footer { background-color: #111317; padding: 10px 0; text-align: center; } footer .lower-footer p { color: #9da1a9; margin: 0; font-size: 13px; } footer .lower-footer p span, footer .lower-footer p a { color: #fb5e1c; } /*-------------------------------------------------------------- #0.6 popular-campaign --------------------------------------------------------------*/ .popular-campaign { position: relative; } @media screen and (min-width: 992px) { .popular-campaign .shadow { content: ""; width: 1170px; height: 500px; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); box-shadow: 10px 0 40px 0 #e8e8e8, -10px 0 40px 0 #e8e8e8; } .popular-campaign .shadow:after { background: #fff; content: ""; width: 1170px; height: 20px; position: absolute; bottom: -20px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media screen and (min-width: 992px) { .popular-campaign .content { padding: 0 45px; } } .popular-campaign .img-holder-donation { position: relative; z-index: 10; } .popular-campaign .img-holder-donation:before { content: ""; background-color: rgba(0, 0, 0, 0.2); width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .popular-campaign .img-holder img { -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .popular-campaign .donation-box { background-color: #fb5e1c; width: 70px; padding: 10px; position: absolute; left: 15px; top: 0; border-radius: 0 0 18px 18px; } .popular-campaign .donation-box p { color: #fff; margin: 0; font-size: 12px; line-height: 1.3em; } .popular-campaign .donation-box .dollar { font-size: 15px; font-weight: bold; position: relative; padding-left: 5px; } .popular-campaign .donation-box .dollar span { font-size: 12px; font-weight: normal; position: absolute; top: -5px; left: -5px; } .popular-campaign .donation-box .meter { position: relative; margin-top: 17px; } .popular-campaign .donation-box .meter span { font-size: 13px; color: #fff; position: absolute; left: 50%; top: 47%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .popular-campaign .donation-box .meter canvas:before { content: ""; background-color: red; width: 10px; height: 10px; position: absolute; left: 0; top: 0; } .popular-campaign .details { padding: 30px 20px 20px; border-radius: 0 0 10px 10px; position: relative; top: -10px; -webkit-box-shadow: 0 0 20px 0 #dbdbdb; -moz-box-shadow: 0 0 20px 0 #dbdbdb; -o-box-shadow: 0 0 20px 0 #dbdbdb; -ms-box-shadow: 0 0 20px 0 #dbdbdb; box-shadow: 0 0 20px 0 #dbdbdb; } .popular-campaign .details h3 { font-size: 18px; margin: 0; } .popular-campaign .details h3 a { color: #3d424b; } .popular-campaign .details h3 a:hover { color: #fb5e1c; text-decoration: none; } .popular-campaign .details span, .popular-campaign .details p { font-size: 14px; color: #999999; } .popular-campaign .details p { color: #fb5e1c; margin: 10px 0 0; } .popular-campaign .view-all { text-align: center; clear: both; padding-top: 80px; } .popular-campaign .view-all a { font-weight: bold; color: #3d424b; text-transform: uppercase; } .popular-campaign .view-all a:hover { text-decoration: none; color: #fb5e1c; } @media (max-width: 767px) { .popular-campaign .content > .col { width: 50%; float: left; margin-bottom: 50px; } .popular-campaign .content > .col:nth-child(3) { width: 50%; margin: 0 auto !important; float: none; clear: both; } } @media (max-width: 480px) { .popular-campaign .content > .col { width: 100% !important; float: none !important; margin-bottom: 50px; } } /*-------------------------------------------------------------- #0.7 help --------------------------------------------------------------*/ .help { background-color: #f1f4f6; } .help .help-item { position: relative; padding-left: 90px; margin-bottom: 60px; } @media (max-width: 767px) { .help .help-item { padding-left: 70px; } } .help .help-item:last-child { margin-bottom: 0; } @media (max-width: 991px) { .help .help-item:last-child { margin-bottom: 60px; } } .help .help-item .icon { background-color: #fb5e1c; width: 62px; height: 62px; display: inline-block; line-height: 62px; color: #fff; text-align: center; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; position: absolute; left: 0; top: 0; } .help .help-item .icon i:before { font-size: 28px; } @media (max-width: 767px) { .help .help-item .icon { width: 50px; height: 50px; line-height: 50px; } } .help .help-item h3 { font-size: 20px; margin: 0 0 0.6em; text-transform: uppercase; } @media (max-width: 767px) { .help .help-item h3 { font-size: 18px; } } .help .help-item p { font-family: "Noto Sans", sans-serif; color: gray; line-height: 1.6em; margin: 0; } .help .video { position: relative; } .help .video:before { content: ""; background-color: rgba(61, 66, 75, 0.6); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .help .video i { background-color: #fb5e1c; width: 70px; height: 70px; line-height: 70px; font-size: 26px; text-align: center; color: #fff; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } @media (max-width: 767px) { .help .video i { width: 55px; height: 55px; line-height: 55px; font-size: 20px; } } /*-------------------------------------------------------------- #0.8 cta --------------------------------------------------------------*/ .cta { background: #15181d url("../images/cta-bg.png") center center/auto no-repeat local; padding: 70px 0; } @media screen and (min-width: 992px) { .cta .cta-details { margin-top: 55px; } } @media (max-width: 767px) { .cta .cta-details { text-align: center; padding-top: 35px; } } .cta .cta-details h2 { color: #fff; font-size: 30px; margin: 0 0 1em; } @media (max-width: 991px) { .cta .cta-details h2 { font-size: 27px; } } @media (max-width: 767px) { .cta .cta-details h2 { font-size: 22px; } } .cta .cta-details p { font-size: 16px; color: #9da1a9; margin: 0 0 2.5em; } .cta .cta-details .theme-btn { font-size: 16px; font-weight: bold; padding: 19px 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 991px) { .cta .cta-details .theme-btn { font-size: 15px; padding: 19px 15px; } } @media (max-width: 767px) { .cta .cta-details .theme-btn { font-size: 14px; padding: 15px 15px; } } /*-------------------------------------------------------------- #0.9 latest-causes --------------------------------------------------------------*/ .latest-causes { padding-bottom: 60px; /*** style for progressbar ***/ } @media (max-width: 991px) { .latest-causes { padding-bottom: 30px; } } @media (max-width: 767px) { .latest-causes { padding-bottom: 20px; } } .latest-causes .content > .col { margin-bottom: 60px; } @media (max-width: 580px) { .latest-causes .content > .col { width: 100%; } } .latest-causes .title { margin-bottom: 23px; } .latest-causes .title ul, .latest-causes .donate-amount ul { position: relative; overflow: hidden; } .latest-causes .title ul li, .latest-causes .donate-amount ul li { float: left; } .latest-causes .title ul li:last-child, .latest-causes .donate-amount ul li:last-child { float: right; font-size: 14px; color: gray; } .latest-causes .title ul li:last-child i, .latest-causes .donate-amount ul li:last-child i { color: #fb5e1c; } .latest-causes .title ul h3 { font-size: 18px; margin: 0; } @media (max-width: 767px) { .latest-causes .title ul h3 { font-size: 14px; } } .latest-causes .title ul span { font-size: 14px; position: absolute; right: 0; top: 0; } .latest-causes .img-progress { position: relative; } .latest-causes .img-progress .progress { background-color: #3d424b; border-radius: 0; height: 8px; overflow: visible; box-shadow: none; } .latest-causes .img-progress .progress .progress-bar { background-color: #fb5e1c; width: 0; line-height: 8px; font-size: 10px; text-align: left; padding-left: 10px; position: relative; box-shadow: none; -webkit-transition: all 1.8s; -moz-transition: all 1.8s; -o-transition: all 1.8s; -ms-transition: all 1.8s; transition: all 1.8s; } .latest-causes .img-progress .progress span { background: #fb5e1c; padding: 6px 4px; font-size: 10px; position: absolute; right: 0; top: -32px; } .latest-causes .img-progress .progress span:before { content: ""; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 7px solid #fb5e1c; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .latest-causes .img-holder { position: relative; border-radius: 10px 10px 0 0; } .latest-causes .img-holder:before { content: ""; background-color: rgba(61, 66, 75, 0.3); width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 10px 10px 0 0; } .latest-causes .img-holder img { border-radius: 10px 10px 0 0; } .latest-causes .donate-amount { margin: 20px 0 15px; } .latest-causes .donate-amount ul li:first-child { font-size: 17px; } @media (max-width: 767px) { .latest-causes .donate-amount ul li:first-child { font-size: 14px; font-weight: 600; } } .latest-causes .donate-amount ul li:first-child span { color: #fb5e1c; } .latest-causes .text p { font-family: "Noto Sans", sans-serif; font-size: 16px; margin: 0 0 1.2em; } .latest-causes .text .theme-btn { -webkit-box-shadow: 0 5px 5px 0px #cccccc; -moz-box-shadow: 0 5px 5px 0px #cccccc; -o-box-shadow: 0 5px 5px 0px #cccccc; -ms-box-shadow: 0 5px 5px 0px #cccccc; box-shadow: 0 5px 5px 0px #cccccc; } /*-------------------------------------------------------------- #1.0 cta-2 --------------------------------------------------------------*/ .cta-2 { background-color: #15181d; } .cta-2 .join-us { background: url("../images/join-us-bg.jpg") center center/cover no-repeat local; position: relative; } @media (max-width: 767px) { .cta-2 .join-us { height: 200px !important; } } .cta-2 .join-us:before { content: ""; background-color: rgba(251, 94, 28, 0.8); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .cta-2 .join-us span { background: url("../images/join-us-bg.jpg") center center/cover no-repeat local; width: 100%; height: 100%; font-size: 55px; text-align: center; text-transform: uppercase; font-weight: bold; position: absolute; left: 0; top: 0; -webkit-text-fill-color: transparent; -moz-text-fill-color: transparent; text-fill-color: transparent; -webkit-background-clip: text; -moz-background-clip: text; background-clip: text; } @media screen and (min-width: 768px) { .cta-2 .join-us span { padding-top: 3.5em; } } @media (max-width: 767px) { .cta-2 .join-us span { font-size: 45px; padding-top: 1.5em; } } @media screen and (min-width: 1200px) { .cta-2 .sing-up { width: 585px; padding: 85px 0 85px 140px; } } @media screen and (min-width: 768px) { .cta-2 .sing-up { padding: 85px 25px 85px 100px; } } @media (max-width: 767px) { .cta-2 .sing-up { padding: 55px 15px 55px 70px; } } .cta-2 .sing-up h3 { color: #fff; margin: 0 0 0.4em; position: relative; } .cta-2 .sing-up h3 span { position: absolute; left: -48px; } @media (max-width: 767px) { .cta-2 .sing-up h3 { font-size: 20px; } } .cta-2 .sing-up span { color: #484e59; font-weight: bold; display: block; margin-bottom: 1.44em; } @media screen and (min-width: 768px) { .cta-2 .sing-up span { font-size: 17px; } } .cta-2 .sing-up p { margin: 0 0 1.83em; color: #6b7483; } @media screen and (min-width: 768px) { .cta-2 .sing-up p { font-size: 16px; } } .cta-2 .sing-up .theme-btn { background-color: transparent; font-size: 16px; color: #fb5e1c; padding: 18px 38px; border: 2px solid #fb5e1c; text-transform: uppercase; } @media (max-width: 767px) { .cta-2 .sing-up .theme-btn { font-size: 14px; padding: 15px 25px; } } .cta-2 .sing-up .theme-btn:hover { background-color: #fb5e1c; color: #fff; } /*-------------------------------------------------------------- #1.1 volunteers --------------------------------------------------------------*/ .volunteers { padding-bottom: 95px; } @media (max-width: 991px) { .volunteers { padding-bottom: 60px; } } @media (max-width: 767px) { .volunteers { padding-bottom: 50px; } } .volunteers .volunteers-grid > .col { margin-bottom: 30px; } /*-------------------------------------------------------------- #1.2 events --------------------------------------------------------------*/ .events { background-color: #f1f4f6; /*** event slider navigation ***/ } .events .section-title { margin-bottom: 125px; } .events .events-slider .owl-stage-outer { overflow: visible !important; } .events .events-slider .item { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .events .events-slider .item .details { -webkit-transform: scale3d(0, 0, 0); -moz-transform: scale3d(0, 0, 0); -o-transform: scale3d(0, 0, 0); -ms-transform: scale3d(0, 0, 0); transform: scale3d(0, 0, 0); } .events .events-slider .item img { -webkit-filter: grayscale(100%); filter: grayscale(100%); } .events .events-slider .details { background-color: #fb5e1c; padding: 22px; border-radius: 0 0 5px 5px; } .events .events-slider .details h3 { font-size: 20px; margin: 0 0 0.5em; } @media (max-width: 1199px) { .events .events-slider .details h3 { font-size: 15px; } } .events .events-slider .details h3 a { color: #fff; } .events .events-slider .details ul li { font-size: 14px; color: #fff; font-weight: normal; padding-left: 20px; position: relative; } @media (max-width: 1199px) { .events .events-slider .details ul li { font-size: 12px; } } .events .events-slider .details ul li i { color: #4d4d4d; position: absolute; left: 0; top: 3px; } .events .events-slider .owl-item.center .item { -webkit-transform: scale3d(1.1, 1.1, 1.15); -moz-transform: scale3d(1.1, 1.1, 1.15); -o-transform: scale3d(1.1, 1.1, 1.15); -ms-transform: scale3d(1.1, 1.1, 1.15); transform: scale3d(1.1, 1.1, 1.15); z-index: 100; position: relative; top: -11px; } .events .events-slider .owl-item.center .item img { -webkit-filter: grayscale(0); filter: grayscale(0); } .events .events-slider .owl-item.center .item .details { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .events .events-slider { position: relative; } .events .events-slider .owl-controls { width: 100%; margin: 0; position: absolute; top: 30%; } .events .events-slider .owl-controls .owl-nav > div { background: #fb5e1c; width: 70px; height: 50px; line-height: 44px; font-size: 22px; text-align: center; margin: 0; padding: 0; position: absolute; } .events .events-slider .owl-controls .owl-nav > div i { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .events .events-slider .owl-controls .owl-nav > div:first-child { left: 15px; } .events .events-slider .owl-controls .owl-nav > div:last-child { right: 15px; } .events .events-slider .owl-controls .owl-nav > div:hover { background: #f94d04 !important; } @media (max-width: 767px) { .events .events-slider .owl-controls .owl-nav > div { width: 40px; height: 30px; line-height: 30px; font-size: 15px; } } /*-------------------------------------------------------------- #1.3 cta-3 --------------------------------------------------------------*/ .cta-3 { background-color: #000; background: #000 url("../images/cta-3-children.jpg") 20% bottom/auto no-repeat local; } @media (max-width: 767px) { .cta-3 { background-size: 220px; background-image: none !important; } } .cta-3 h2 { font-size: 30px; color: #fff; font-weight: normal; margin: 0 0 0.67em; } @media (max-width: 767px) { .cta-3 h2 { font-size: 22px; } } .cta-3 .details-text { padding: 115px 15px; } @media (max-width: 991px) { .cta-3 .details-text { text-align: center; padding: 90px 15px; } } @media (max-width: 767px) { .cta-3 .details-text { padding: 60px 15px; } } .cta-3 .details-text p { color: #9da1a9; margin-bottom: 2.6em; } @media screen and (min-width: 992px) { .cta-3 .details-text p { font-size: 16px; } } @media (max-width: 767px) { .cta-3 .details-text p { color: #b8bbc1; } } .cta-3 .details-text .theme-btn { font-size: 18px; padding: 15px 38px; text-transform: capitalize; } @media (max-width: 767px) { .cta-3 .details-text .theme-btn { font-size: 14px; padding: 12px 25px; } } /*-------------------------------------------------------------- #1.4 latest news --------------------------------------------------------------*/ .latest-news { padding-bottom: 110px; } @media (max-width: 991px) { .latest-news { padding-bottom: 90px; } } @media (max-width: 767px) { .latest-news { padding-bottom: 60px; } } .latest-news .latest-news-slider .post { padding: 0 15px 15px; } .latest-news .latest-news-slider .owl-controls { margin-top: 50px; } .latest-news .latest-news-slider .owl-controls .owl-dots span { width: 13px; height: 13px; } .latest-news .latest-news-slider .owl-controls .owl-dots .active span, .latest-news .latest-news-slider .owl-controls .owl-dots .owl-dot:hover span { background: #fb5e1c; } /*-------------------------------------------------------------- #1.5 news letter --------------------------------------------------------------*/ .newsletter { background-color: #ebeff2; } .newsletter .children-holder { background: url("../images/newsletter-children.jpg") center center/cover no-repeat local; } @media (max-width: 991px) { .newsletter .children-holder { height: 260px !important; } } .newsletter .subscribe { padding: 70px 15px 70px 70px; } @media screen and (min-width: 1200px) { .newsletter .subscribe { width: 682px; } } @media (max-width: 991px) { .newsletter .subscribe { padding: 70px 45px; } } @media (max-width: 767px) { .newsletter .subscribe { height: auto !important; padding: 50px 45px 50px; } } @media (max-width: 500px) { .newsletter .subscribe { padding: 50px 15px; } } .newsletter .subscribe h3 { font-size: 30px; margin: 0; } @media (max-width: 767px) { .newsletter .subscribe h3 { font-size: 25px; } } .newsletter .subscribe p { color: #3d424b; font-weight: bold; margin: 0 0 2em; } .newsletter .subscribe p span { color: #fb5e1c; } .newsletter .subscribe form { position: relative; } @media screen and (min-width: 1200px) { .newsletter .subscribe form { width: 550px; } } @media screen and (min-width: 992px) { .newsletter .subscribe form { width: 450px; } } .newsletter .subscribe form input { height: auto; font-size: 16px; padding: 9px 20px; border: 1px solid #fb5e1c; padding-right: 120px !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 767px) { .newsletter .subscribe form input { padding: 8px 20px; } } .newsletter .subscribe form button { padding: 16px 15px; position: absolute; right: 0; top: 0; } .newsletter .subscribe .pluses { color: #fb5e1c; font-size: 32px; position: absolute; right: 0; top: 35px; } @media (max-width: 1199px) { .newsletter .subscribe .pluses { right: 20px; } } @media (max-width: 767px) { .newsletter .subscribe .pluses { font-size: 20px; top: 45px; } } /*-------------------------------------------------------------- Causes Grid page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #2.0 page-title --------------------------------------------------------------*/ .causes-grid-page .page-title-bg { background: url("../images/page-title-bg/causes-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- causes list page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #3.0 page-title --------------------------------------------------------------*/ .causes-list-page .page-title-bg { background: url("../images/page-title-bg/causes-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #3.1 causes list section --------------------------------------------------------------*/ .causes-list-section .causes-list-box { margin-bottom: 35px; } .causes-list-section .causes-list-box:last-child { margin-bottom: 0; } .causes-list-section .sidebar-wrapper { padding-left: 45px; padding-right: 20px; } @media (max-width: 1199px) { .causes-list-section .sidebar-wrapper { padding-left: 45px; padding-right: 10px; } } @media (max-width: 991px) { .causes-list-section .sidebar-wrapper { padding-left: 15px; margin-top: 100px; } } @media (max-width: 767px) { .causes-list-section .sidebar-wrapper { margin-top: 60px; } } /*-------------------------------------------------------------- #3.2 urgent donation --------------------------------------------------------------*/ .urgent-donation { position: relative; padding-bottom: 160px; /*** urgent box ***/ } @media (max-width: 767px) { .urgent-donation { padding-bottom: 110px; } } .urgent-donation .section-bg { background: url("../images/urgent-donation-bg.jpg") center center/cover no-repeat local; width: 100%; height: 50%; position: absolute; left: 0; top: 0; } .urgent-donation .section-bg:before { content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } @media (max-width: 991px) { .urgent-donation .section-bg { height: 40%; } } .urgent-donation .urgent-inner { padding-top: 100px; } @media (max-width: 767px) { .urgent-donation .urgent-inner { padding-top: 50px; } } .urgent-donation .urgent-slider { /*** owl controls ***/ } .urgent-donation .urgent-slider img { width: auto !important; } .urgent-donation .urgent-slider .owl-controls { position: relative; margin: 0; } @media (max-width: 767px) { .urgent-donation .urgent-slider .owl-controls { margin-top: 25px; } } .urgent-donation .urgent-slider .owl-controls .owl-nav { width: 100%; height: 0; position: absolute; left: 0; top: -175px; } @media (max-width: 1199px) { .urgent-donation .urgent-slider .owl-controls .owl-nav { display: none; } } .urgent-donation .urgent-slider .owl-controls .owl-nav > div { background-color: transparent; color: #3d424b; font-size: 17px; font-weight: bold; position: absolute; } .urgent-donation .urgent-slider .owl-controls .owl-nav .owl-prev { left: -95px; } .urgent-donation .urgent-slider .owl-controls .owl-nav .owl-next { right: -95px; } .urgent-donation .urgent-slider .owl-controls .owl-nav > div:hover { background-color: transparent; color: gray; } .urgent-donation .urgent-slider .owl-controls .owl-dots { width: 100px; padding-top: 50px; position: absolute; right: 28%; z-index: 999; } @media (max-width: 767px) { .urgent-donation .urgent-slider .owl-controls .owl-dots { margin-top: 25px; padding-top: 0; right: auto; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } .urgent-donation .urgent-slider .owl-controls .owl-dots span { background-color: #fff; border: 2px solid #000; margin: 3px; } .urgent-donation .urgent-slider .owl-controls .owl-dots .active span { width: 13px; height: 13px; border: 0; margin: 2px 3px; background-color: #fb5e1c; } .urgent-donation .urgent-box { background-color: #fff; overflow: hidden; } .urgent-donation .urgent-box > div { float: left; } .urgent-donation .urgent-box .img-holder { width: 40%; text-align: right; } .urgent-donation .urgent-box .img-holder img { display: inline-block; } @media (max-width: 767px) { .urgent-donation .urgent-box .img-holder { display: none; } } .urgent-donation .urgent-box .details { background-color: #fb5e1c; width: 60%; text-align: center; padding: 58px 90px 60px; } @media (max-width: 991px) { .urgent-donation .urgent-box .details { padding: 47px 20px 50px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details { width: 100%; float: none; } } .urgent-donation .urgent-box .details > span { background-color: #3d424b; font-size: 16px; font-weight: bold; color: #fff; display: inline-block; padding: 5px 25px; text-transform: uppercase; } @media (max-width: 991px) { .urgent-donation .urgent-box .details > span { font-size: 15px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details > span { font-size: 14px; padding: 4px 20px; } } .urgent-donation .urgent-box .details h2 { font-size: 27px; font-weight: bold; margin: 0.83em 0 0; text-transform: capitalize; } @media (max-width: 991px) { .urgent-donation .urgent-box .details h2 { font-size: 22px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details h2 { font-size: 18px; margin: 1.3em 0 0; } } .urgent-donation .urgent-box .details .remaing-date { color: #fff; margin: 0; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .remaing-date { font-size: 16px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details .remaing-date { font-size: 14px; } } .urgent-donation .urgent-box .details .progress-wrapper { margin-top: 80px; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .progress-wrapper { margin-top: 45px; } } .urgent-donation .urgent-box .details .progress { background-color: #3d424b; height: 15px; position: relative; overflow: visible; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } @media (max-width: 767px) { .urgent-donation .urgent-box .details .progress { height: 12px; } } .urgent-donation .urgent-box .details .progress .progress-bar { background-color: #fff; line-height: 15px; position: relative; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } @media (max-width: 767px) { .urgent-donation .urgent-box .details .progress .progress-bar { line-height: 12px; } } .urgent-donation .urgent-box .details .progress-bar span { background-color: #fff; font-size: 14px; padding: 5px 10px; color: #fb5e1c; position: absolute; right: -20px; top: -37px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .urgent-donation .urgent-box .details .progress-bar span:before { content: ""; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 7px solid #fff; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .urgent-donation .urgent-box .details .goal-raised { overflow: hidden; } .urgent-donation .urgent-box .details .goal-raised span { font-size: 14px; font-weight: bold; color: #fff; text-transform: uppercase; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .goal-raised span { font-size: 12px; } } .urgent-donation .urgent-box .details .goal-raised h4 { font-size: 24px; margin: 0; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .goal-raised h4 { font-size: 18px; } } .urgent-donation .urgent-box .details .goal-raised .goal { float: left; } .urgent-donation .urgent-box .details .goal-raised .raised { float: right; } .urgent-donation .urgent-box .details .form { margin-top: 45px; } .urgent-donation .urgent-box .details .form > div { display: inline-block; } @media (max-width: 767px) { .urgent-donation .urgent-box .details .form > div { display: block; } } @media screen and (min-width: 768px) { .urgent-donation .urgent-box .details .form > div:last-child { float: right; } } .urgent-donation .urgent-box .details .form input { height: auto; color: #fb5e1c; padding: 11px 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .form input { padding: 8px 15px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details .form input { margin-bottom: 10px; padding: 5px 15px; } } .urgent-donation .urgent-box .details .form .theme-btn { border: 2px solid #3d424b; color: #3d424b; font-size: 18px; padding: 15px 33px; text-transform: none; } @media (max-width: 991px) { .urgent-donation .urgent-box .details .form .theme-btn { font-size: 15px; padding: 13px 27px; } } @media (max-width: 767px) { .urgent-donation .urgent-box .details .form .theme-btn { font-size: 14px; padding: 12px 27px; } } .urgent-donation .urgent-box .details .form .theme-btn:hover { border-color: #fff; background-color: #fff; } .urgent-donation .urgent-box .details .form ::-webkit-input-placeholder { font-style: 16px; font-style: normal; color: #fb5e1c; } .urgent-donation .urgent-box .details .form :-moz-placeholder { font-style: 16px; font-style: normal; color: #fb5e1c; } .urgent-donation .urgent-box .details .form ::-moz-placeholder { font-style: 16px; font-style: normal; color: #fb5e1c; } .urgent-donation .urgent-box .details .form :-ms-input-placeholder { font-style: 16px; font-style: normal; color: #fb5e1c; } /*-------------------------------------------------------------- #3.3 newsletter --------------------------------------------------------------*/ .newsletter { background-color: #ebeff2; } .newsletter .children-holder-s2 { background: url("../images/newsletter-children2.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- causes single page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #4.1 page-title --------------------------------------------------------------*/ .causes-single-page .page-title-bg { background: url("../images/page-title-bg/causes-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #4.1 causes-single-wrapper --------------------------------------------------------------*/ .causes-single-wrapper { padding-bottom: 65px; /*** related causes ***/ } @media (max-width: 991px) { .causes-single-wrapper { padding-bottom: 5px; } } .causes-single-wrapper .causes-single { padding-bottom: 30px; border-bottom: 1px solid #cccccc; } @media (max-width: 991px) { .causes-single-wrapper .causes-single { margin-bottom: 80px; } } .causes-single-wrapper .causes-list-box { -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } @media (max-width: 767px) { .causes-single-wrapper .causes-list-box { padding: 15px 0; } } .causes-single-wrapper .title { width: 100%; float: none; padding: 32px 0; position: relative; } @media (max-width: 767px) { .causes-single-wrapper .title { padding: 20px 0 32px; } } .causes-single-wrapper .title h3 { font-size: 30px; } @media (max-width: 991px) { .causes-single-wrapper .title h3 { font-size: 30px; } } @media (max-width: 767px) { .causes-single-wrapper .title h3 { font-size: 25px; } } .causes-single-wrapper .title .theme-btn { position: absolute; right: 5px; top: 32px; } @media (max-width: 767px) { .causes-single-wrapper .title .theme-btn { position: static; padding: 12px 15px; } } .causes-single-wrapper .inner-details > p { color: #9da1a9; margin: 0 0 1.38em; } .causes-single-wrapper .inner-details > ul { margin-bottom: 50px; } .causes-single-wrapper .inner-details > ul li { color: #9da1a9; margin-bottom: 0.5em; } .causes-single-wrapper .inner-details > ul li i { color: #fb5e1c; } .causes-single-wrapper .inner-details > ul li:last-child { margin-bottom: 0; } .causes-single-wrapper .related-causes { padding-top: 90px; } .causes-single-wrapper .related-causes .side-section-title h2 { margin-bottom: 1.5em; } .causes-single-wrapper .related-causes .latest-causes .title { padding: 0; } .causes-single-wrapper .related-causes .latest-causes .donate-amount ul li { font-weight: bold; } .causes-single-wrapper .related-causes .latest-causes .donate-amount ul li:first-child { color: #3d424b; } @media (max-width: 991px) { .causes-single-wrapper .related-causes .latest-causes > .col { margin-bottom: 60px; } } @media (max-width: 580px) { .causes-single-wrapper .related-causes .latest-causes > .col { width: 100%; } } /*-------------------------------------------------------------- volunteers --------------------------------------------------------------*/ /*-------------------------------------------------------------- #5.0 page-title --------------------------------------------------------------*/ .volunteers-page .page-title-bg { background: url("../images/page-title-bg/volunteers-pagetitle-bg.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #5.1 cta-2 --------------------------------------------------------------*/ .volunteers-page .cta-2 { position: relative; } .volunteers-page .cta-2 .sing-up { border-left: 1px solid #000; } .volunteers-page .cta-2 .sing-up-border { content: ""; height: 100%; position: absolute; top: 0; background: transparent; border-top: 1px solid #000; border-right: 1px solid #000; border-bottom: 1px solid #000; } @media screen and (min-width: 992px) { .volunteers-page .cta-2 .sing-up-border { width: 58.34%; right: 0; } } @media (max-width: 991px) { .volunteers-page .cta-2 .sing-up-border { width: 66.67%; right: 0; } } @media (max-width: 767px) { .volunteers-page .cta-2 .sing-up-border { width: 100%; right: 0; } } @media (max-width: 991px) { .volunteers-page .volunteers { padding-bottom: 90px; } } @media (max-width: 767px) { .volunteers-page .volunteers { padding-bottom: 60px; } } .volunteers-page .pagination-wrapper { margin-top: 50px; } @media (max-width: 991px) { .volunteers-page .pagination-wrapper { margin-top: 20px; } } @media (max-width: 767px) { .volunteers-page .pagination-wrapper { margin-top: 10px; } } /*-------------------------------------------------------------- volunteer single page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #6.0 page-title --------------------------------------------------------------*/ .volunteer-single .page-title-bg { background: url("../images/page-title-bg/volunteers-pagetitle-bg.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #6.1 Volunteer single section --------------------------------------------------------------*/ .volunteer-single-section { background-color: #f2f6f9; /*** volunteer profile title ***/ /*** volunteer-content ***/ } .volunteer-single-section .volunteer-profile-title { background-color: #fff; text-align: center; padding: 80px 15px 35px; border-bottom: 2px solid #cccccc; } @media (max-width: 767px) { .volunteer-single-section .volunteer-profile-title { padding: 50px 15px 15px; } } .volunteer-single-section .volunteer-profile-title .img-holder { position: absolute; left: 50%; top: -95px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 100; } @media (max-width: 767px) { .volunteer-single-section .volunteer-profile-title .img-holder { width: 80px; height: 80px; top: -42px; } } .volunteer-single-section .volunteer-profile-title img { display: inline-block; border: 2px solid #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .volunteer-single-section .volunteer-profile-title h3 { font-size: 30px; text-transform: capitalize; margin: 0; } @media (max-width: 767px) { .volunteer-single-section .volunteer-profile-title h3 { font-size: 20px; } } .volunteer-single-section .volunteer-profile-title p { text-transform: capitalize; } .volunteer-single-section .volunteer-profile-title p span { color: #fb5e1c; } .volunteer-single-section .volunteer-content { padding: 30px 0 125px; /*** info ***/ /*** bio ***/ } @media (max-width: 991px) { .volunteer-single-section .volunteer-content { padding-bottom: 90px; } } @media (max-width: 767px) { .volunteer-single-section .volunteer-content { padding-bottom: 60px; } } .volunteer-single-section .volunteer-content .info, .volunteer-single-section .volunteer-content .bio, .volunteer-single-section .volunteer-content .similar-profile { background-color: #fff; border-bottom: 2px solid #cccccc; padding: 40px 60px; } @media (max-width: 767px) { .volunteer-single-section .volunteer-content .info, .volunteer-single-section .volunteer-content .bio, .volunteer-single-section .volunteer-content .similar-profile { padding: 30px; } } .volunteer-single-section .volunteer-content .box-title { margin-bottom: 30px; } .volunteer-single-section .volunteer-content .box-title h3 { font-size: 24px; margin: 0; padding-bottom: 1em; border-bottom: 1px solid #e6e6e6; } @media (max-width: 767px) { .volunteer-single-section .volunteer-content .box-title h3 { font-size: 20px; } } .volunteer-single-section .volunteer-content .box-title h3 i { color: #fb5e1c; } .volunteer-single-section .volunteer-content .info { padding: 40px 35px 79px; } @media (max-width: 991px) { .volunteer-single-section .volunteer-content .info { padding: 40px 35px; margin-bottom: 35px; } } @media (max-width: 767px) { .volunteer-single-section .volunteer-content .info { padding: 30px; } } .volunteer-single-section .volunteer-content .info-details span, .volunteer-single-section .volunteer-content .social span { display: block; } .volunteer-single-section .volunteer-content .info-details > li { font-size: 16px; font-weight: bold; margin-bottom: 35px; } @media (max-width: 767px) { .volunteer-single-section .volunteer-content .info-details > li { font-size: 15px; } } .volunteer-single-section .volunteer-content .info-details > li:last-child { margin-bottom: 0; } .volunteer-single-section .volunteer-content .info-details > li span:first-child, .volunteer-single-section .volunteer-content .social span { color: #bfbfbf; margin-bottom: 2px; font-weight: bold; } .volunteer-single-section .volunteer-content .social { margin-top: 40px; } .volunteer-single-section .volunteer-content .social ul { overflow: hidden; } .volunteer-single-section .volunteer-content .social ul li { float: left; margin-right: 15px; } .volunteer-single-section .volunteer-content .social ul li a { font-size: 18px; color: #00529c; } .volunteer-single-section .volunteer-content .social ul li:nth-child(2) a { color: #00acee; } .volunteer-single-section .volunteer-content .social ul li:nth-child(3) a { color: #d84d31; } .volunteer-single-section .volunteer-content .social ul li:nth-child(4) a { color: #0071ad; } .volunteer-single-section .volunteer-content .social ul li:last-child a { color: #ba6200; } .volunteer-single-section .volunteer-content .bio { margin-bottom: 35px; } .volunteer-single-section .volunteer-content .bio > p { line-height: 1.6em; margin-bottom: 1.5em; } .volunteer-single-section .volunteer-content .bio > p:last-child { margin-bottom: 0; } .volunteer-single-section .volunteer-content .similar-profile ul { overflow: hidden; } .volunteer-single-section .volunteer-content .similar-profile ul li { float: left; margin-right: 6px; margin-bottom: 5px; } .volunteer-single-section .volunteer-content .similar-profile ul li img { display: block; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; } .volunteer-single-section .volunteer-content .similar-profile ul li:last-child { margin-right: 0; } .volunteer-single-section .volunteer-content .similar-profile ul li:hover img { -webkit-filter: grayscale(100%); filter: grayscale(100%); } /*-------------------------------------------------------------- gallery 3 col --------------------------------------------------------------*/ /*-------------------------------------------------------------- #7.0 page-title --------------------------------------------------------------*/ .gallery-3col .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #7.1 gallery-3col-content --------------------------------------------------------------*/ .gallery-3col-content { padding-bottom: 100px; } @media (max-width: 767px) { .gallery-3col-content { padding-bottom: 80px; } } .gallery-3col-content .gallery-container { overflow: hidden; margin: 0 -13px; } @media (max-width: 991px) { .gallery-3col-content .gallery-container { margin: 0; } } .gallery-3col-content .gallery-container .box { width: 33.33%; float: left; padding: 0 13px 26px; } @media (max-width: 991px) { .gallery-3col-content .gallery-container .box { padding: 0; margin: -1px; } } @media (max-width: 500px) { .gallery-3col-content .gallery-container .box { width: 50%; } } /*-------------------------------------------------------------- gallery 4 col --------------------------------------------------------------*/ /*-------------------------------------------------------------- #8.0 page-title --------------------------------------------------------------*/ .gallery-4col .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #8.1 gallery-4col-content --------------------------------------------------------------*/ @media (max-width: 767px) { .gallery-4col-content, .gallery-fullwidth-content { padding-bottom: 80px; } } .gallery-4col-content .gallery-container .box, .gallery-fullwidth-content .gallery-container .box { width: 25%; float: left; } @media (max-width: 991px) { .gallery-4col-content .gallery-container .box, .gallery-fullwidth-content .gallery-container .box { width: 50%; } } /*-------------------------------------------------------------- gallery fullwidth page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #9.0 page-title --------------------------------------------------------------*/ .gallery-fullwidth .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #9.1 gallery-fullwidth-content --------------------------------------------------------------*/ .gallery-fullwidth-content .container-fluid { padding: 0; } @media (max-width: 991px) { .gallery-fullwidth-content .gallery-container .box { width: 25%; } } @media (max-width: 767px) { .gallery-fullwidth-content .gallery-container .box { width: 50%; } } @media screen and (min-width: 1367px) { .gallery-fullwidth-content .gallery-container .box img { width: 100%; } } /*-------------------------------------------------------------- event 2 col page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #10.0 page-title --------------------------------------------------------------*/ .event-2col .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #10.1 event-2col-section --------------------------------------------------------------*/ .event-2col .event-2col-section { padding-bottom: 95px; } @media (max-width: 767px) { .event-2col .event-2col-section { padding-bottom: 65px; } } .event-2col .event-2col-section .event-grid-wrapper { margin: 0 -15px; } .event-2col .event-2col-section .event-grid { width: 50%; float: left; padding: 5px 15px 30px; } @media (max-width: 600px) { .event-2col .event-2col-section .event-grid { width: 100%; float: none; } } @media (max-width: 991px) { .event-2col .event-2col-section .sidebar-wrapper { margin-top: 60px; } } /*-------------------------------------------------------------- event 3 col page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #11.0 page-title --------------------------------------------------------------*/ .event-3col .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #11.1 event-3col-section --------------------------------------------------------------*/ .event-3col { /** featured section ***/ } .event-3col .event-3col-section { padding-bottom: 95px; } @media (max-width: 991px) { .event-3col .event-3col-section { padding-bottom: 55px; } } @media (max-width: 767px) { .event-3col .event-3col-section { padding-bottom: 60px; } } .event-3col .event-3col-section .event-grid { width: 33.33%; float: left; padding: 5px 15px 30px; } @media (max-width: 991px) { .event-3col .event-3col-section .event-grid { width: 50%; } } @media (max-width: 600px) { .event-3col .event-3col-section .event-grid { width: 100%; float: none; padding: 5px 0 30px; } } .event-3col .featured { background-color: #15181d; border-bottom: 1px solid #000; } .event-3col .featured .featured-promo { background: url("../images/beat-cancer-bg.jpg") center center/cover no-repeat local; padding: 85px 15px; text-align: center; position: relative; } .event-3col .featured .featured-promo:before { content: ""; background-color: rgba(251, 94, 28, 0.85); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .event-3col .featured .featured-promo img { display: inline-block; position: relative; z-index: 10; } .event-3col .featured .countdown-wrapper { padding: 65px 15px 65px 75px; /*** colock style ***/ } @media screen and (min-width: 1200px) { .event-3col .featured .countdown-wrapper { width: 585px; } } @media (max-width: 1199px) { .event-3col .featured .countdown-wrapper { padding: 65px 15px 65px 45px; } } @media (max-width: 767px) { .event-3col .featured .countdown-wrapper { height: auto !important; padding: 65px 15px 65px 15px; } } .event-3col .featured .countdown-wrapper h3, .event-3col .featured .countdown-wrapper p { color: #a1a8b3; } .event-3col .featured .countdown-wrapper h3 { font-size: 28px; margin: 0 0 0.32em; } @media (max-width: 767px) { .event-3col .featured .countdown-wrapper h3 { font-size: 22px; } } .event-3col .featured .countdown-wrapper p { font-size: 14px; margin: 0 0 1.79em; } .event-3col .featured .countdown-wrapper h3 + ul { overflow: hidden; margin-bottom: 18px; } .event-3col .featured .countdown-wrapper h3 + ul li { font-size: 14px; color: #6b7483; float: left; margin-right: 20px; } .event-3col .featured .countdown-wrapper h3 + ul li:last-child { margin-right: 0; } .event-3col .featured .countdown-wrapper h3 + ul li i { color: #fb5e1c; } .event-3col .featured .countdown-wrapper #countdown { margin-left: -10px; } @media (max-width: 767px) { .event-3col .featured .countdown-wrapper #countdown { margin-left: 0; } } .event-3col .featured .countdown-wrapper .ClassyCountdown-value > div { font-size: 28px; font-weight: bold; color: #fb5e1c !important; } @media (max-width: 991px) { .event-3col .featured .countdown-wrapper .ClassyCountdown-value > div { font-size: 20px; } } @media (max-width: 400px) { .event-3col .featured .countdown-wrapper .ClassyCountdown-value > div { font-size: 15px; } } .event-3col .featured .countdown-wrapper .ClassyCountdown-value > span { font-size: 13px; font-weight: bold; color: #fff; } @media (max-width: 767px) { .event-3col .featured .countdown-wrapper .ClassyCountdown-value > span { font-size: 12px !important; } } @media (max-width: 991px) { .event-3col .featured .countdown-wrapper .ClassyCountdown-wrapper > div { margin: 5px; } } /*-------------------------------------------------------------- event 2 col page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #12.0 page-title --------------------------------------------------------------*/ .shop-page .page-title-bg { background: url("../images/page-title-bg/shop-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #12.0 shop-main-content --------------------------------------------------------------*/ @media screen and (min-width: 992px) { .shop-page .shop-main-content { padding-bottom: 110px; } } @media (max-width: 991px) { .shop-page .shop-main-content .shop-content { margin-bottom: 0; } } @media (max-width: 767px) { .shop-page .shop-main-content .shop-content { margin-bottom: 20px; } } @media screen and (min-width: 1200px) { .shop-page .shop-main-content .pagination-wrapper { margin-top: 45px; } } @media (max-width: 991px) { .shop-page .shop-main-content .pagination-wrapper { margin-bottom: 45px; } } /*-------------------------------------------------------------- shop details page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #13.0 page-title --------------------------------------------------------------*/ .shop-details-page .page-title-bg { background: url("../images/page-title-bg/shop-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #13.1 shop-details-main-content --------------------------------------------------------------*/ .shop-details-page .shop-details-main-content { /*** product slider ***/ /*** product info ***/ /*** upsell product **/ } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-for { border: 2px solid red; text-align: center; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-for img { display: inline-block; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav { padding: 0 25px; margin-top: 35px; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav > i { position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 100; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav > i:hover { cursor: pointer; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav .nav-btn-rt { left: auto; right: 0; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav .slick-slide { text-align: center; } .shop-details-page .shop-details-main-content .shop-single-slider-wrapper .slider-nav .slick-slide img { display: inline-block; } .shop-details-page .shop-details-main-content .product-details { background-color: #15181d; padding: 60px 30px 93px 30px; /*** product option ***/ /*** secend row ***/ /*** share **/ } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details { padding: 40px 30px 85px 30px; } } @media (max-width: 991px) { .shop-details-page .shop-details-main-content .product-details { margin-top: 45px; padding: 40px 30px; } } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-details { padding: 30px 20px; } } .shop-details-page .shop-details-main-content .product-details h2 { font-size: 27px; color: #fff; margin: 0 0 0.33em; text-transform: capitalize; } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details h2 { font-size: 25px; } } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-details h2 { font-size: 20px; } } .shop-details-page .shop-details-main-content .product-details .rating i { font-size: 13px; color: white; } .shop-details-page .shop-details-main-content .product-details .price { font-size: 20px; color: #fb5e1c; margin: 7px 0 14px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-details .price { font-size: 16px; } } .shop-details-page .shop-details-main-content .product-details .price .old { font-size: 15px; color: #b8bbc1; text-decoration: line-through; display: inline-block; margin-left: 5px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-details .price .old { font-size: 14px; } } .shop-details-page .shop-details-main-content .product-details p { font-size: 14px; margin: 0; } .shop-details-page .shop-details-main-content .product-details .product-option .form ::-webkit-input-placeholder { font-style: 12px; font-style: normal; color: #fc9367; } .shop-details-page .shop-details-main-content .product-details .product-option .form :-moz-placeholder { font-style: 12px; font-style: normal; color: #fc9367; } .shop-details-page .shop-details-main-content .product-details .product-option .form ::-moz-placeholder { font-style: 12px; font-style: normal; color: #fc9367; } .shop-details-page .shop-details-main-content .product-details .product-option .form :-ms-input-placeholder { font-style: 12px; font-style: normal; color: #fc9367; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row { padding: 24px 0; margin-top: 25px; border-top: 1px solid #4d4d4d; border-bottom: 1px solid #4d4d4d; overflow: hidden; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row > div { width: 40%; float: left; } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row > div { width: 37%; } } @media (max-width: 500px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row > div { width: 100% !important; float: none; margin-bottom: 15px; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row > div:last-child { width: 20%; } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row > div:last-child { width: 26%; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row input, .shop-details-page .shop-details-main-content .product-details .product-option .fst-row select { width: 60%; height: auto; color: #fb5e1c; font-size: 11px; font-style: normal; padding: 5px; border-color: #4d4d4d; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row input:focus, .shop-details-page .shop-details-main-content .product-details .product-option .fst-row select:focus { border-color: #4d4d4d; box-shadow: none; } @media (max-width: 500px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row input, .shop-details-page .shop-details-main-content .product-details .product-option .fst-row select { width: 100% !important; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row select option { color: #000; opacity: 1 !important; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row span { font-size: 12px; font-weight: bold; color: #fff; text-transform: uppercase; display: inline-block; padding-right: 5px; } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row span { font-size: 10px; } } @media (max-width: 500px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row span { margin-bottom: 3px; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty { overflow: hidden; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .form-control { background: transparent; display: inline-block; width: 100%; padding-left: 25px; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .btn { font-size: 12px; padding: 0 3px; background: transparent; color: #4d4d4d; line-height: 12px; border-color: #4d4d4d; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin { width: 65%; position: relative; float: right; } @media (max-width: 500px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin { width: 100% !important; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin .input-group-btn { position: absolute; top: 3px; padding-right: 0; line-height: auto !important; z-index: 100; } @media (max-width: 1199px) { .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin .input-group-btn { top: 5px; } } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin > span:first-child { left: 5px; } .shop-details-page .shop-details-main-content .product-details .product-option .fst-row .qty .bootstrap-touchspin > span:last-child { right: 17px !important; } .shop-details-page .shop-details-main-content .product-details .sec-row { padding: 24px 0; border-bottom: 1px solid #4d4d4d; } .shop-details-page .shop-details-main-content .product-details .sec-row > div { display: inline-block; } .shop-details-page .shop-details-main-content .product-details .sec-row > div .theme-btn { padding: 13px 15px; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; box-shadow: none; } .shop-details-page .shop-details-main-content .product-details .sec-row > div:last-child .btn { background: transparent; width: 35px; height: 35px; line-height: 35px; font-size: 18px; font-weight: normal; color: #4d4d4d; text-align: center; padding: 0; border: 1px solid #4d4d4d; } .shop-details-page .shop-details-main-content .product-details .sec-row > div:last-child .btn:hover { background-color: #fb5e1c; color: #fff; border-color: #fb5e1c; } .shop-details-page .shop-details-main-content .product-details .share { padding: 6px 0 0; } .shop-details-page .shop-details-main-content .product-details .share span { font-size: 14px; color: #fff; margin-right: 0; } .shop-details-page .shop-details-main-content .product-details .share ul li { background: transparent; margin-right: 10px; } .shop-details-page .shop-details-main-content .product-details .share ul li:last-child { margin-right: 0; } .shop-details-page .shop-details-main-content .product-details .share ul a { width: auto; height: auto; font-size: 15px; color: #cccccc; } .shop-details-page .shop-details-main-content .product-details .share ul a:hover { color: #fff; } .shop-details-page .shop-details-main-content .product-info { margin-top: 75px; /*** tabs ***/ /*** client review ***/ /*** review form ***/ } .shop-details-page .shop-details-main-content .product-info h4 { font-size: 15px; text-transform: uppercase; margin: 0; } .shop-details-page .shop-details-main-content .product-info p { font-size: 14px; } .shop-details-page .shop-details-main-content .product-info .nav-tabs { border: 0; margin-bottom: 30px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .nav-tabs { margin-bottom: 20px; } } .shop-details-page .shop-details-main-content .product-info .nav-tabs li { margin-right: 45px; } .shop-details-page .shop-details-main-content .product-info .nav-tabs li:last-child { margin-right: 0; } .shop-details-page .shop-details-main-content .product-info .nav-tabs a { font-size: 18px; color: #b3b3b3; border: 0; margin: 0; padding: 0; text-transform: uppercase; } .shop-details-page .shop-details-main-content .product-info .nav-tabs a:hover, .shop-details-page .shop-details-main-content .product-info .nav-tabs .active a { background: transparent; color: #fb5e1c; } .shop-details-page .shop-details-main-content .product-info .client-review { overflow: hidden; margin-bottom: 30px; } .shop-details-page .shop-details-main-content .product-info .client-review:last-child { margin-bottom: 0; } .shop-details-page .shop-details-main-content .product-info .client-review .client-pic { width: 14%; float: left; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .client-pic { width: 100%; float: none; margin-bottom: 10px; } } .shop-details-page .shop-details-main-content .product-info .client-review .details { width: 86%; float: right; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .details { width: 100%; float: none; } } .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time { border-bottom: 1px solid #e6e6e6; margin-top: -5px; } @media (max-width: 991px) { .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time { margin-top: 0; } } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time { padding-bottom: 3px; } } .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time > div, .shop-details-page .shop-details-main-content .product-info .client-review .name-rating > div { display: inline-block; font-size: 14px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time > div, .shop-details-page .shop-details-main-content .product-info .client-review .name-rating > div { font-size: 12px; display: block; } .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time > div h4, .shop-details-page .shop-details-main-content .product-info .client-review .name-rating > div h4 { font-size: 12px; } } .shop-details-page .shop-details-main-content .product-info .client-review .rating { font-size: 14px; padding-left: 10px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .rating { padding-left: 0; margin: 2px 0 7px; } } .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time .time { float: right; color: #b3b3b3; text-transform: uppercase; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .client-review .name-rating-time .time { float: none; } } .shop-details-page .shop-details-main-content .product-info .client-review .review-body { padding-top: 8px; } .shop-details-page .shop-details-main-content .product-info .client-review .review-body p { font-size: 14px; } @media screen and (min-width: 1200px) { .shop-details-page .shop-details-main-content .product-info .review-form-wrapper { padding-left: 45px; } } @media (max-width: 991px) { .shop-details-page .shop-details-main-content .product-info .review-form { margin-top: 45px; } } .shop-details-page .shop-details-main-content .product-info .review-form h4 { margin-bottom: 1.73em; } .shop-details-page .shop-details-main-content .product-info .review-form form input, .shop-details-page .shop-details-main-content .product-info .review-form form textarea { border-radius: 0; } .shop-details-page .shop-details-main-content .product-info .review-form form input:focus, .shop-details-page .shop-details-main-content .product-info .review-form form textarea:focus { box-shadow: none; outline: none; } .shop-details-page .shop-details-main-content .product-info .review-form form textarea { height: 130px; } .shop-details-page .shop-details-main-content .product-info .review-form form > div { margin-bottom: 27px; } .shop-details-page .shop-details-main-content .product-info .review-form form > div:last-child { margin-bottom: 0; } .shop-details-page .shop-details-main-content .product-info .review-form form .rating-post > div { display: inline-block; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .review-form form .rating-post > div { display: block; float: none !important; } } .shop-details-page .shop-details-main-content .product-info .review-form form .rating-post > div:last-child { float: right; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .review-form form .rating-post > div:last-child { margin-top: 20px; } } .shop-details-page .shop-details-main-content .product-info .review-form form .rating a { font-size: 14px; color: #cccccc; display: inline-block; margin-right: 10px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .product-info .review-form form .rating a { font-size: 12px; margin-right: 5px; } } .shop-details-page .shop-details-main-content .product-info .review-form form .rating a:last-child { margin: 0; } .shop-details-page .shop-details-main-content .product-info .review-form form .rating a:hover { color: #fb5e1c; } .shop-details-page .shop-details-main-content .product-info .review-form form .theme-btn { border-radius: 0; padding: 13px 15px; box-shadow: none; } .shop-details-page .shop-details-main-content .upsell-product { padding-top: 140px; } @media (max-width: 991px) { .shop-details-page .shop-details-main-content .upsell-product { padding-top: 90px; } } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .upsell-product { padding-top: 80px; } } .shop-details-page .shop-details-main-content .upsell-product .title { margin-bottom: 50px; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .upsell-product .title { margin-bottom: 20px; } } .shop-details-page .shop-details-main-content .upsell-product .title h2 { font-size: 36px; margin: 0; text-transform: capitalize; text-align: center; } @media (max-width: 767px) { .shop-details-page .shop-details-main-content .upsell-product .title h2 { font-size: 25px; } } .shop-details-page .shop-details-main-content .upsell-product .title h2 span { color: #fb5e1c; } .shop-details-page .shop-details-main-content .upsell-product-slider .grid { width: auto !important; } .shop-details-page .shop-details-main-content .upsell-product-slider .owl-controls { margin: 0; } .shop-details-page .shop-details-main-content .upsell-product-slider .owl-dots span { background-color: #fff; width: 12px; height: 12px; border: 2px solid #000; margin: 0 5px 0 0; } .shop-details-page .shop-details-main-content .upsell-product-slider .owl-dots .active span { background-color: #fb5e1c; width: 14px; height: 14px; border-color: #fb5e1c; } /*-------------------------------------------------------------- blog page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #14.0 page-title --------------------------------------------------------------*/ .blog-page .page-title-bg { background: url("../images/page-title-bg/shop-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #14.1 blog-main-content --------------------------------------------------------------*/ .blog-page .blog-main-content { padding-bottom: 70px; } @media (max-width: 991px) { .blog-page .blog-main-content { padding-bottom: 35px; } } @media (max-width: 767px) { .blog-page .blog-main-content { padding-bottom: 25px; } } .blog-page .blog-main-content .blog-grid > .col { margin-bottom: 55px; } @media (max-width: 500px) { .blog-page .blog-main-content .blog-grid > .col { width: 100%; } } /*-------------------------------------------------------------- blog single page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #15.0 page-title --------------------------------------------------------------*/ .blog-detail-page .page-title-bg { background: url("../images/page-title-bg/shop-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #15.1 blog-single-main-content --------------------------------------------------------------*/ .blog-detail-page .blog-single-main-content { background-color: #eeeeee; padding-bottom: 215px; } @media (max-width: 991px) { .blog-detail-page .blog-single-main-content { padding-bottom: 90px; } } @media (max-width: 767px) { .blog-detail-page .blog-single-main-content { padding-bottom: 75px; } } .blog-detail-page .blog-single-content { /*** post ***/ /*** tags ***/ /*** comments ***/ } @media (max-width: 991px) { .blog-detail-page .blog-single-content { margin-bottom: 100px; } } .blog-detail-page .blog-single-content h3 { font-size: 21px; color: #1a1a1a; margin: 0; } @media (max-width: 767px) { .blog-detail-page .blog-single-content h3 { font-size: 18px; } } .blog-detail-page .blog-single-content p { font-family: "Work Sans", sans-serif; font-size: 16px; margin-bottom: 15px; } @media (max-width: 767px) { .blog-detail-page .blog-single-content p { font-size: 14px; } } .blog-detail-page .blog-single-content .post, .blog-detail-page .blog-single-content .comments { background-color: #fff; } .blog-detail-page .blog-single-content .post { padding: 0 45px 125px 45px; } @media (max-width: 991px) { .blog-detail-page .blog-single-content .post { padding: 0 45px 45px; } } @media (max-width: 767px) { .blog-detail-page .blog-single-content .post { padding: 0 20px 45px 20px; } } .blog-detail-page .blog-single-content .post h3 { margin: 1.9em 0 0.9em; } .blog-detail-page .blog-single-content .post .media { margin: 0 -45px 48px; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .post .media { margin: 0 -20px 40px; } } .blog-detail-page .blog-single-content .post-title-meta .btn { font-size: 14px; padding: 7px 13px; border-radius: 0; box-shadow: none; text-transform: none; } .blog-detail-page .blog-single-content .post-title-meta h2 { font-size: 25px; margin: 0.57em 0 0.53em; color: #1a1a1a; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .post-title-meta h2 { font-size: 22px; } } .blog-detail-page .blog-single-content .post-title-meta ul { overflow: hidden; margin-bottom: 24px; } .blog-detail-page .blog-single-content .post-title-meta ul li { font-size: 14px; float: left; text-transform: uppercase; margin-right: 8px; padding-right: 8px; position: relative; } .blog-detail-page .blog-single-content .post-title-meta ul li:after { content: "/"; color: #999999; position: absolute; right: 0; } .blog-detail-page .blog-single-content .post-title-meta ul li:last-child:after { display: none; } .blog-detail-page .blog-single-content .post-title-meta ul li a { color: #999999; } .blog-detail-page .blog-single-content .post-title-meta ul li a:hover { color: #fb5e1c; } .blog-detail-page .blog-single-content .gallery-post { margin: 35px 0 0; } .blog-detail-page .blog-single-content .gallery-post .gallery { overflow: hidden; } .blog-detail-page .blog-single-content .gallery-post .gallery > div:first-child { width: 60%; float: left; } .blog-detail-page .blog-single-content .gallery-post .gallery > div:last-child { width: 38%; float: right; } .blog-detail-page .blog-single-content .tag-share { overflow: hidden; margin: 25px 0 15px; /*** share ***/ } @media (max-width: 767px) { .blog-detail-page .blog-single-content .tag-share { margin: 25px 0; } } .blog-detail-page .blog-single-content .tag-share > div { display: inline-block; float: left; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .tag-share > div { display: block; float: none !important; } } .blog-detail-page .blog-single-content .tag-share > div:last-child { float: right; } .blog-detail-page .blog-single-content .tag-share > div:first-child { padding-left: 20px; } .blog-detail-page .blog-single-content .tag-share > div:first-child span { font-size: 15px; font-weight: bold; color: #000; margin-right: 25px; position: relative; top: -11px; } @media (max-width: 991px) { .blog-detail-page .blog-single-content .tag-share > div:first-child { padding-left: 0; } .blog-detail-page .blog-single-content .tag-share > div:first-child span { font-size: 14px; margin-right: 15px; top: -20px; } } @media (max-width: 767px) { .blog-detail-page .blog-single-content .tag-share > div:first-child { padding-left: 0; } .blog-detail-page .blog-single-content .tag-share > div:first-child span { font-size: 14px; margin-right: 15px; top: 0; display: block; margin-bottom: 5px; } } .blog-detail-page .blog-single-content .tag-share ul { display: inline-block; overflow: hidden; } .blog-detail-page .blog-single-content .tag-share ul li { float: left; margin-right: 12px; } .blog-detail-page .blog-single-content .tag-share ul li:last-child { margin-right: 0; } .blog-detail-page .blog-single-content .tag-share .tag a { background-color: #fff; font-size: 14px; color: #333333; display: inline-block; text-align: center; padding: 7px 15px; text-transform: lowercase; } @media (max-width: 991px) { .blog-detail-page .blog-single-content .tag-share .tag a { padding: 5px 10px; margin-bottom: 10px; } } .blog-detail-page .blog-single-content .tag-share .tag a:hover { background-color: #fb5e1c; color: #fff; } .blog-detail-page .blog-single-content .tag-share .share { padding-bottom: 0; } .blog-detail-page .blog-single-content .tag-share .share li { opacity: 0.9; } .blog-detail-page .blog-single-content .tag-share .share li:hover { opacity: 1; } .blog-detail-page .blog-single-content .tag-share .share li:first-child { background-color: #00529c; } .blog-detail-page .blog-single-content .tag-share .share li:nth-child(2) { background-color: #00acee; } .blog-detail-page .blog-single-content .tag-share .share li:last-child { background-color: #0071ad; } .blog-detail-page .blog-single-content .tag-share .share a { font-size: 16px; color: #fff; display: inline-block; padding: 9px 15px; } @media (max-width: 991px) { .blog-detail-page .blog-single-content .tag-share .share a { font-size: 14px; padding: 5px 10px; } } .blog-detail-page .blog-single-content .tag-share .share a i { display: inline-block; padding-right: 4px; } .blog-detail-page .blog-single-content .comments { padding: 55px 45px 0; /*** .article ***/ } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments { padding: 40px 25px 0; } } .blog-detail-page .blog-single-content .comments .title { margin-bottom: 65px; } .blog-detail-page .blog-single-content .comments h3 { text-align: center; } .blog-detail-page .blog-single-content .comments > ol { padding-left: 0; } .blog-detail-page .blog-single-content .comments ol { list-style: none; } .blog-detail-page .blog-single-content .comments ol > li { margin-bottom: 35px; } .blog-detail-page .blog-single-content .comments ol > li:last-child { margin-bottom: 0; } .blog-detail-page .blog-single-content .comments ol > li > ol { margin-left: 28px; margin-top: 35px; padding: 0; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments ol > li > ol { margin: 30px 0 0 0; } } .blog-detail-page .blog-single-content .comments ol > li > ol > li { background-color: #fafafa; padding: 30px; margin-bottom: 35px !important; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments ol > li > ol > li { padding: 20px; } } .blog-detail-page .blog-single-content .comments ol > li > ol > li:last-child { margin-bottom: 0 !important; } .blog-detail-page .blog-single-content .comments .article { overflow: hidden; } .blog-detail-page .blog-single-content .comments .article h4 { font-size: 16px; margin: 0; text-transform: capitalize; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments .article h4 { font-size: 14px; } } .blog-detail-page .blog-single-content .comments .article p { font-size: 15px; margin-bottom: 5px; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments .article p { font-size: 14px; } } .blog-detail-page .blog-single-content .comments .article .replay button { background-color: transparent; font-size: 16px; font-weight: bold; color: #fb5e1c; padding: 0; border: 0; outline: 0; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments .article .replay button { font-size: 14px; } } .blog-detail-page .blog-single-content .comments .article .author-meta { overflow: hidden; margin-bottom: 5px; } .blog-detail-page .blog-single-content .comments .article .author-meta > div { display: inline-block; } .blog-detail-page .blog-single-content .comments .article .author-meta > div:last-child { font-size: 13px; color: gray; padding-left: 5px; } .blog-detail-page .blog-single-content .comments .article .author-pic { width: 10%; float: left; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments .article .author-pic { width: 100%; float: none; margin-bottom: 10px; } } .blog-detail-page .blog-single-content .comments .article .details { width: 90%; float: left; } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comments .article .details { width: 100%; float: none; } } .blog-detail-page .blog-single-content .comment-respond { margin-top: 75px; } .blog-detail-page .blog-single-content .comment-respond h3 { margin: 0 0 2em; } .blog-detail-page .blog-single-content .comment-respond form { margin: 0 -15px; position: relative; } .blog-detail-page .blog-single-content .comment-respond form input, .blog-detail-page .blog-single-content .comment-respond form textarea { border-radius: 0; border: 0; box-shadow: none; border-bottom: 1px solid #cccccc; } .blog-detail-page .blog-single-content .comment-respond form textarea { height: 110px; } .blog-detail-page .blog-single-content .comment-respond form > div { margin-bottom: 50px; } .blog-detail-page .blog-single-content .comment-respond form .theme-btn { font-size: 16px; text-transform: none; padding: 19px 45px; box-shadow: none; position: absolute; left: 50%; bottom: -100px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } @media (max-width: 991px) { .blog-detail-page .blog-single-content .comment-respond form .theme-btn { position: relative; bottom: 0; } } @media (max-width: 767px) { .blog-detail-page .blog-single-content .comment-respond form .theme-btn { font-size: 14px; padding: 14px 25px; } } /*** blog-sidebar ***/ .blog-detail-page .blog-sidebar .widget { margin-bottom: 75px; } @media (max-width: 991px) { .blog-detail-page .blog-sidebar .widget { margin-bottom: 60px; } } .blog-detail-page .blog-sidebar .widget:last-child { margin-bottom: 0; } .blog-detail-page .blog-sidebar h3 { font-size: 20px; color: #0d0d0d; margin: 0 0 1.25em; text-transform: uppercase; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar h3 { font-size: 17px; } } .blog-detail-page .blog-sidebar .category-widget ul li, .blog-detail-page .blog-sidebar .archive-widget ul li { border-bottom: 1px solid #fff; } .blog-detail-page .blog-sidebar .category-widget ul li > a, .blog-detail-page .blog-sidebar .archive-widget ul li > a { padding: 13px 0; } .blog-detail-page .blog-sidebar ul li { font-size: 15px; font-weight: bold; } .blog-detail-page .blog-sidebar ul li > a { display: block; color: #404040; position: relative; } .blog-detail-page .blog-sidebar ul li:first-child a { padding-top: 0; } .blog-detail-page .blog-sidebar ul li:last-child a { padding-bottom: 0; } .blog-detail-page .blog-sidebar ul li:last-child { border: 0; } .blog-detail-page .blog-sidebar ul li > a:hover { color: #fb5e1c; } .blog-detail-page .blog-sidebar ul li > a .badge { background-color: transparent; font-size: 15px; color: #404040; position: absolute; right: 5px; } .blog-detail-page .blog-sidebar ul li > a .badge:before, .blog-detail-page .blog-sidebar ul li > a .badge:after { font-size: 14px; position: absolute; top: 3px; } .blog-detail-page .blog-sidebar ul li > a .badge:before { content: "("; left: 0; } .blog-detail-page .blog-sidebar ul li > a .badge:after { content: ")"; right: 0; } .blog-detail-page .blog-sidebar .search-widget input { background-color: transparent; padding: 8px 12px; height: auto; } .blog-detail-page .blog-sidebar .search-widget input:focus { box-shadow: none; border-color: #fb5e1c; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .recent-post-widget ul { margin-left: -15px; } } .blog-detail-page .blog-sidebar .recent-post-widget ul li { border: 0; overflow: hidden; margin-bottom: 30px; position: relative; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .recent-post-widget ul li { padding: 0 0 40px 100px; overflow: visible; } } .blog-detail-page .blog-sidebar .recent-post-widget ul li:last-child { margin-bottom: 0; } .blog-detail-page .blog-sidebar .recent-post-widget .post-pic { width: 30%; float: left; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .recent-post-widget .post-pic { width: 70px; float: none; position: absolute; left: 15px; } } .blog-detail-page .blog-sidebar .recent-post-widget .details { width: 68%; float: right; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .recent-post-widget .details { width: 100%; float: none; } } .blog-detail-page .blog-sidebar .recent-post-widget .details > span { font-size: 12px; color: #666666; text-transform: uppercase; } .blog-detail-page .blog-sidebar .recent-post-widget .details h4 { font-size: 16px; margin: 0.5em 0; text-transform: capitalize; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .recent-post-widget .details h4 { font-size: 14px; padding-top: 10px; } } .blog-detail-page .blog-sidebar .recent-post-widget .details h4 a { color: #000; } .blog-detail-page .blog-sidebar .recent-post-widget .details h4 a:hover { color: #fb5e1c !important; } .blog-detail-page .blog-sidebar .tag-widget .all-tags { margin-left: -12px; } .blog-detail-page .blog-sidebar .tag-widget .all-tags a { font-size: 15px; font-weight: bold; color: gray; border: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .blog-detail-page .blog-sidebar .tag-widget .all-tags a:hover { color: #fb5e1c; -webkit-transform: scale3d(1.2, 1.2, 1); -moz-transform: scale3d(1.2, 1.2, 1); -o-transform: scale3d(1.2, 1.2, 1); -ms-transform: scale3d(1.2, 1.2, 1); transform: scale3d(1.2, 1.2, 1); } .blog-detail-page .blog-sidebar .instagram-widget ul { overflow: hidden; margin-right: -8px; } .blog-detail-page .blog-sidebar .instagram-widget ul li { width: 33.33%; float: left; padding: 0 8px 8px 0; } .blog-detail-page .blog-sidebar .instagram-widget ul li img { max-width: 100%; } @media (max-width: 767px) { .blog-detail-page .blog-sidebar .instagram-widget ul li img { width: 100%; } } /*-------------------------------------------------------------- contact page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #16.0 page-title --------------------------------------------------------------*/ .contact-page .page-title-bg { background: url("../images/page-title-bg/shop-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #16.1 contact-main-content --------------------------------------------------------------*/ .contact-page .contact-main-content { padding-bottom: 0; /*** contact info ***/ /*** map ***/ /*** contact-form ***/ } .contact-page .contact-main-content .contact-info { text-align: center; padding-bottom: 78px; } .contact-page .contact-main-content .contact-info .col > div { padding: 0 15px; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-info .col > div { padding: 0; } } @media (max-width: 767px) { .contact-page .contact-main-content .contact-info > .col { margin-bottom: 50px; } .contact-page .contact-main-content .contact-info > .col:last-child { margin-bottom: 0; } } .contact-page .contact-main-content .contact-info .icon { width: 70px; height: 70px; line-height: 63px; font-size: 25px; color: #fb5e1c; text-align: center; border: 3px solid #3d424b; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-info .icon { width: 70px; height: 70px; line-height: 63px; font-size: 20px; border: 3px solid #3d424b; } } .contact-page .contact-main-content .contact-info h3 { font-size: 22px; margin: 0.53em 0 1.07em; text-transform: uppercase; } @media (max-width: 1199px) { .contact-page .contact-main-content .contact-info h3 { font-size: 20px; } } @media (max-width: 991px) { .contact-page .contact-main-content .contact-info h3 { font-size: 18px; } } .contact-page .contact-main-content .contact-info p { font-size: 16px; color: #999999; margin: 0 0 5px; line-height: 1.33em; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-info p { font-size: 16px; } } @media (max-width: 767px) { .contact-page .contact-main-content .contact-info p { font-size: 15px; } } .contact-page .contact-main-content .map-concate-form { margin-bottom: 600px; position: relative; } @media (max-width: 991px) { .contact-page .contact-main-content .map-concate-form { margin-bottom: 550px; } } @media (max-width: 767px) { .contact-page .contact-main-content .map-concate-form { margin-bottom: 0; } } .contact-page .contact-main-content .map { height: 600px; } @media (max-width: 767px) { .contact-page .contact-main-content .map { height: 350px; } } .contact-page .contact-main-content .contact-form { width: 100%; position: absolute; top: 350px; } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form { position: static; } } .contact-page .contact-main-content .contact-form > .container > .row { background-color: #fff; -webkit-box-shadow: 0 0 10px 5px #cccccc; -moz-box-shadow: 0 0 10px 5px #cccccc; -o-box-shadow: 0 0 10px 5px #cccccc; -ms-box-shadow: 0 0 10px 5px #cccccc; box-shadow: 0 0 10px 5px #cccccc; } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form > .container > .row { box-shadow: none; } .contact-page .contact-main-content .contact-form > .container > .row > .col { clear: both; border-top: 5px solid #fb5e1c; } } .contact-page .contact-main-content .contact-form .form-inner { text-align: center; padding: 60px 15px 65px; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-form .form-inner { padding: 50px 45px 30px; } } .contact-page .contact-main-content .contact-form .form-inner h3 { font-size: 25px; border-bottom: 1px solid #cccccc; margin: 0; padding: 0 0 1.17em; text-transform: uppercase; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-form .form-inner h3 { font-size: 22px; } } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form .form-inner h3 { font-size: 20px; } } .contact-page .contact-main-content .contact-form .form { margin-top: 70px; } @media (max-width: 991px) { .contact-page .contact-main-content .contact-form .form { margin-top: 40px; } } .contact-page .contact-main-content .contact-form .form input, .contact-page .contact-main-content .contact-form .form textarea { background-color: #e6e6e6; height: auto; border: 0 !important; padding: 15px 25px; box-shadow: none; } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form .form input, .contact-page .contact-main-content .contact-form .form textarea { padding: 10px 15px; } } .contact-page .contact-main-content .contact-form .form textarea { height: 158px; } .contact-page .contact-main-content .contact-form .form > div { margin-bottom: 35px; } .contact-page .contact-main-content .contact-form .form > div:last-child { margin-bottom: 0; } .contact-page .contact-main-content .contact-form .form .theme-btn { padding: 20px 50px; box-shadow: none; } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form .form .theme-btn { padding: 15px 35px; } } .contact-page .contact-main-content .contact-form .form .error { display: block; font-size: 15px; font-weight: normal; color: red; text-align: left; margin-top: 5px; } .contact-page .contact-main-content .contact-form .form #loader { display: none; } .contact-page .contact-main-content .contact-form .form #success, .contact-page .contact-main-content .contact-form .form #error { color: #fff; padding: 5px 10px; font-size: 16px; display: none; } @media (max-width: 767px) { .contact-page .contact-main-content .contact-form .form #success, .contact-page .contact-main-content .contact-form .form #error { font-size: 15px; } } .contact-page .contact-main-content .contact-form .form #success { background-color: #009a00; border-left: 5px solid green; margin-bottom: 5px; } .contact-page .contact-main-content .contact-form .form #error { background-color: #ff1a1a; border-left: 5px solid red; } /*-------------------------------------------------------------- about page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #17.0 page-title --------------------------------------------------------------*/ .about-page .page-title-bg { background: url("../images/page-title-bg/causes-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #17.1 about-details --------------------------------------------------------------*/ /*** about details ***/ .about-us-st { background-color: #f7f7f7; /*** accordian ***/ /*** right col ***/ } .about-us-st h2 { font-size: 36px; margin: 0 0 100px; text-align: center; } @media (max-width: 767px) { .about-us-st h2 { font-size: 28px; margin: 0 0 40px; } } .about-us-st h2 span { color: #fb5e1c; } .about-us-st .company { margin-bottom: 25px; } .about-us-st .company h3 { font-size: 27px; margin: 0 0 0.2em; } .about-us-st .company h3 span { color: #fb5e1c; } @media (max-width: 767px) { .about-us-st .company h3 { font-size: 22px; } } .about-us-st .company > span { font-size: 16px; color: #bfbfbf; letter-spacing: 0.5px; } .about-us-st .company + p { margin-bottom: 1.67em; } .about-us-st #accordion .panel-default { border: 0; border-radius: 0; margin: 0 0 10px; -webkit-box-shadow: 0 0 10px 0 #cccccc; -moz-box-shadow: 0 0 10px 0 #cccccc; -o-box-shadow: 0 0 10px 0 #cccccc; -ms-box-shadow: 0 0 10px 0 #cccccc; box-shadow: 0 0 10px 0 #cccccc; } .about-us-st #accordion .panel-default:last-child { margin: 0; } .about-us-st #accordion .panel-heading { background-color: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; } .about-us-st #accordion .panel-heading:hover { background-color: #fb5e1c; } .about-us-st #accordion .panel-heading:hover a { color: #fff; } .about-us-st #accordion .panel-heading a { display: block; color: #828791; font-weight: bold; position: relative; } .about-us-st #accordion .panel-heading a i { position: absolute; right: 0; top: 4px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .about-us-st #accordion .current .panel-heading { background-color: #fb5e1c; } .about-us-st #accordion .current .panel-heading a { color: #fff; } .about-us-st #accordion .current .panel-heading i { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .about-us-st #accordion .panel-body { border: 0; padding: 25px 25px 15px 130px; position: relative; } @media (max-width: 991px) { .about-us-st #accordion .panel-body { padding-bottom: 40px; } } @media (max-width: 767px) { .about-us-st #accordion .panel-body { position: static; padding: 25px 15px 15px; } .about-us-st #accordion .panel-body .img-holder { margin-bottom: 10px; } } .about-us-st #accordion .panel-body .img-holder { width: 70px; position: absolute; left: 25px; } @media (max-width: 767px) { .about-us-st #accordion .panel-body .img-holder { position: static; } } .about-us-st #accordion .panel-body p { font-size: 16px; line-height: 1.6em; } .about-us-st .right-col { position: relative; margin-top: 20px; } @media (max-width: 991px) { .about-us-st .right-col { margin-top: 80px; } } @media (max-width: 767px) { .about-us-st .right-col { text-align: center; } } @media (max-width: 767px) { .about-us-st .right-col .video { display: inline-block; } } .about-us-st .right-col a { background-color: #fb5e1c; width: 80px; height: 80px; line-height: 80px; font-size: 35px; text-align: center; color: #fff; position: absolute; left: 50%; top: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 767px) { .about-us-st .right-col a { width: 50px; height: 50px; line-height: 50px; font-size: 25px; } } /*-------------------------------------------------------------- #17.2 cta-4 --------------------------------------------------------------*/ .cta-4 { padding: 115px 0; text-align: center; } @media (max-width: 991px) { .cta-4 { padding: 70px 0; } } @media (max-width: 991px) { .cta-4 .col { padding: 0 5px; } } @media (max-width: 767px) { .cta-4 .col { padding: 0 15px; margin-bottom: 50px; } .cta-4 .col:last-child { margin-bottom: 0; } } .cta-4 .col > div { padding: 0 15px; } @media (max-width: 991px) { .cta-4 .col > div { padding: 0; } } .cta-4 .icon i { color: #fb5e1c; } .cta-4 .icon i:before { font-size: 40px; } @media (max-width: 767px) { .cta-4 .icon i:before { font-size: 28px; } } .cta-4 h3 { font-size: 20px; margin: 0.5em 0 0.65em; text-transform: capitalize; } @media (max-width: 767px) { .cta-4 h3 { font-size: 18px; } } .cta-4 p { color: gray; margin: 0 0 1.28em; } .cta-4 .read-more { font-weight: bold; color: #fb5e1c; } /*-------------------------------------------------------------- event single page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #18.0 page-title --------------------------------------------------------------*/ .event-single-page .page-title-bg { background: url("../images/page-title-bg/gallery-3col-pagetitle.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #18.1 event-single-main-content --------------------------------------------------------------*/ .event-single-page .event-single-main-content { background: #f2f2f2; } /*** about-event-wrapper ***/ .about-event-wrapper { /*** sidebar ***/ /***about-event ***/ } @media screen and (min-width: 1200px) { .about-event-wrapper > .col { margin-left: 49px; } } .about-event-wrapper .big-photo { margin-bottom: 30px; } .about-event-wrapper .sidebar .event-info { background-color: #fff; padding: 25px 30px; border-bottom: 2px solid #e6e6e6; margin-bottom: 30px; } .about-event-wrapper .sidebar .event-info ul li { display: block; color: #333333; padding: 14px 0 14px 32px; border-bottom: 1px solid #e6e6e6; position: relative; } @media (max-width: 767px) { .about-event-wrapper .sidebar .event-info ul li { padding: 10px 0 10px 32px; } } .about-event-wrapper .sidebar .event-info ul li i { color: #fb5e1c; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .about-event-wrapper .sidebar .event-info ul li i:before { font-size: 17px; } .about-event-wrapper .sidebar .event-info ul li:last-child { border-bottom: 0; } .about-event-wrapper .sidebar .event-map { height: 270px; } .about-event-wrapper .sidebar .event-map iframe { width: 100%; height: 100%; border: 0; } .about-event-wrapper .about-event { background-color: #fff; border-bottom: 2px solid #e6e6e6; padding: 60px 70px; } @media (max-width: 991px) { .about-event-wrapper .about-event { margin-top: 100px; } } @media (max-width: 767px) { .about-event-wrapper .about-event { padding: 40px 25px; } } .about-event-wrapper .about-event h2 { width: 70%; font-size: 30px; color: #1f1f1f; margin: 0 0 0.72em; float: left; } @media (max-width: 767px) { .about-event-wrapper .about-event h2 { width: 100%; float: none; font-size: 25px; } } .about-event-wrapper .about-event .social { width: 30%; float: right; overflow: hidden; } @media (max-width: 767px) { .about-event-wrapper .about-event .social { width: 100%; float: none; } } .about-event-wrapper .about-event .social ul { float: right; } @media (max-width: 767px) { .about-event-wrapper .about-event .social ul { float: none; margin-bottom: 25px; } } .about-event-wrapper .about-event .social ul li { display: inline-block; font-size: 22px; margin-right: 3px; } @media (max-width: 767px) { .about-event-wrapper .about-event .social ul li { font-size: 18px; } } .about-event-wrapper .about-event .social ul li:last-child { margin-right: 0; } .about-event-wrapper .about-event .social ul li:first-child a { color: #00529c; } .about-event-wrapper .about-event .social ul li:nth-child(2) a { color: #00acee; } .about-event-wrapper .about-event .social ul li:nth-child(3) a { color: #d84d31; } .about-event-wrapper .about-event .social ul li:last-child a { color: #0071ad; } .about-event-wrapper .about-event .content { clear: both; } .about-event-wrapper .about-event .content p { line-height: 1.65em; margin-bottom: 1.5em; } .about-event-wrapper .about-event .para-with-img { position: relative; padding-right: 250px; } @media (max-width: 767px) { .about-event-wrapper .about-event .para-with-img { padding-right: 0; } } .about-event-wrapper .about-event .para-with-img > span { position: absolute; right: 0; top: 0; } @media (max-width: 767px) { .about-event-wrapper .about-event .para-with-img > span { position: static; } } .about-event-wrapper .about-event .para-with-img > span img { position: relative; z-index: 10; } .about-event-wrapper .about-event .para-with-img > span:before { content: ""; background-color: #fb5e1c; width: 100%; height: 90%; position: absolute; left: -8px; bottom: -8px; } @media (max-width: 767px) { .about-event-wrapper .about-event .para-with-img > span:before { display: none; } } .about-event-wrapper .about-event .theme-btn { padding: 15px 25px; text-transform: capitalize; font-size: 16px; box-shadow: none; font-weight: bold; margin-top: 13px; } @media (max-width: 767px) { .about-event-wrapper .about-event .theme-btn { font-size: 15px; padding: 12px 20px; margin-top: 30px; } } .about-event-wrapper .other-events { margin-top: 33px; overflow: hidden; } .about-event-wrapper .other-events a { display: block; background-color: #fff; width: 300px; height: 50px; line-height: 50px; text-align: center; color: #fb5e1c; font-size: 18px; font-weight: bold; padding: 0; border-bottom: 2px solid #e6e6e6; text-transform: capitalize; } @media (max-width: 767px) { .about-event-wrapper .other-events a { width: 120px; height: 40px; line-height: 40px; font-size: 15px; } } .about-event-wrapper .other-events a:hover { color: #e04504; } .about-event-wrapper .other-events > a:first-child { float: left; } .about-event-wrapper .other-events > a:last-child { float: right; } /*** sponsor ***/ .sponsor { background-color: #15181d; position: relative; } .sponsor:before { content: ""; width: 100%; height: 100%; position: absolute; right: 0; top: 0; border-bottom: 1px solid #000; } .sponsor .left-col { background: #fb5e1c url("../images/event-single/sponsor-bg.png") center center/cover no-repeat local; text-align: center; position: relative; } @media screen and (min-width: 1200px) { .sponsor .left-col { width: 487px; } } @media (max-width: 991px) { .sponsor .left-col { display: none; } } .sponsor .left-col h2 { font-size: 32px; color: #fff; margin: 0; padding: 2.7em 0 0; } @media (max-width: 991px) { .sponsor .left-col h2 { padding: 0; } } .sponsor .right-col { position: relative; padding: 0; } @media screen and (min-width: 1200px) { .sponsor .right-col { width: 682px; } } .sponsor .right-col:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-left: 1px solid #000; } .sponsor .sponsor-slider { text-align: center; } .sponsor .sponsor-slider img { width: auto !important; display: inline-block; -webkit-transform: scale3d(0.9, 0.9, 1); -moz-transform: scale3d(0.9, 0.9, 1); -o-transform: scale3d(0.9, 0.9, 1); -ms-transform: scale3d(0.9, 0.9, 1); transform: scale3d(0.9, 0.9, 1); } @media (max-width: 450px) { .sponsor .sponsor-slider img { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .sponsor .sponsor-slider .center img { -webkit-transform: scale3d(1.3, 1.3, 1); -moz-transform: scale3d(1.3, 1.3, 1); -o-transform: scale3d(1.3, 1.3, 1); -ms-transform: scale3d(1.3, 1.3, 1); transform: scale3d(1.3, 1.3, 1); } @media (max-width: 450px) { .sponsor .sponsor-slider .center img { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .sponsor .sponsor-slider .owl-stage { padding: 65px 0; } .sponsor .sponsor-slider .owl-controls { width: 100%; margin: 0; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .sponsor .sponsor-slider .owl-nav .owl-prev, .sponsor .sponsor-slider .owl-nav .owl-next { background-color: transparent; width: 25px; height: 25px; line-height: 25px; text-align: center; color: #fb5e1c; padding: 0; border: 1px solid #fb5e1c; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; position: absolute; left: 0; top: -13px; } .sponsor .sponsor-slider .owl-nav .owl-next { left: auto; right: 0; } .sponsor .sponsor-slider .owl-nav .owl-prev:hover, .sponsor .sponsor-slider .owl-nav .owl-next:hover { background-color: #fb5e1c; color: #fff; } /*-------------------------------------------------------------- error 404 page --------------------------------------------------------------*/ /*-------------------------------------------------------------- #19.0 error-404-content --------------------------------------------------------------*/ .error-404-page { text-align: center; } .error-404-content { padding: 140px 0; } @media (max-width: 991px) { .error-404-content { padding: 100px 0; } .error-404-content img { width: 150px; } } @media (max-width: 767px) { .error-404-content { padding: 80px 0; } .error-404-content img { width: 100px; } } .error-404-content h1 { font-size: 72px; font-weight: bold; color: #fb5e1c; margin: 0; } @media (max-width: 991px) { .error-404-content h1 { font-size: 55px; } } @media (max-width: 767px) { .error-404-content h1 { font-size: 45px; } } .error-404-content p { font-size: 24px; font-weight: bold; color: #333333; margin: 0 0 1em; } @media (max-width: 991px) { .error-404-content p { font-size: 18px; } } .error-404-content .theme-btn { font-size: 24px; font-weight: bold; padding: 18px 65px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } @media (max-width: 991px) { .error-404-content .theme-btn { font-size: 16px; padding: 15px 50px; } } @media (max-width: 767px) { .error-404-content .theme-btn { padding: 13px 35px; } } /*-------------------------------------------------------------- #19.1 search-something --------------------------------------------------------------*/ .search-something { background-color: #15181d; padding: 80px 0; } .search-something .form-control { background-color: transparent; font-size: 18px; color: #b8bbc1; padding: 14px 20px; height: auto; border-color: #fb5e1c; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } @media (max-width: 991px) { .search-something .form-control { font-size: 16px; padding: 10px 20px; } } .search-something .theme-btn { font-size: 18px; font-weight: bold; padding: 22px 50px; text-transform: uppercase; } @media (max-width: 991px) { .search-something .theme-btn { font-size: 16px; padding: 17px 30px; } } @media (max-width: 767px) { .search-something .theme-btn { margin-top: 20px; } } /*-------------------------------------------------------------- home page style two --------------------------------------------------------------*/ /*-------------------------------------------------------------- #20.0 urgent-donation --------------------------------------------------------------*/ .urgent-donation-s2 { background-color: #fb5e1c; } /*** donation detalis ***/ .urgent-donation-s2 .donation-details-wrapper { background: url("../images/home-2-urgent-donation.jpg") center center/cover no-repeat local; padding: 125px 0; position: relative; } @media (max-width: 991px) { .urgent-donation-s2 .donation-details-wrapper { border-top: 5px solid #fb5e1c; } } @media (max-width: 767px) { .urgent-donation-s2 .donation-details-wrapper { padding: 60px 0; } } .urgent-donation-s2 .donation-details-wrapper:before { content: ""; background-color: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .urgent-donation-s2 .donation-details-wrapper .donation-details { position: relative; z-index: 10; } @media screen and (min-width: 1200px) { .urgent-donation-s2 .donation-details-wrapper .donation-details { width: 600px; margin: 0 auto; } } @media (max-width: 1199px) { .urgent-donation-s2 .donation-details-wrapper .donation-details { padding: 0 45px; } } @media (max-width: 767px) { .urgent-donation-s2 .donation-details-wrapper .donation-details { padding: 0 15px; } } .urgent-donation-s2 .donation-details-wrapper h2 { font-size: 36px; color: #fff; margin: 0 0 0.28em; } @media (max-width: 767px) { .urgent-donation-s2 .donation-details-wrapper h2 { font-size: 25px; } } .urgent-donation-s2 .donation-details-wrapper h2 + span { color: #fb5e1c; font-weight: bold; display: block; margin-bottom: 1em; } .urgent-donation-s2 .donation-details-wrapper p { font-family: "Noto Sans", sans-serif; color: #fff; margin: 0 0 2.2em; } @media (max-width: 767px) { .urgent-donation-s2 .donation-details-wrapper .theme-btn-s2 { margin-bottom: 5px; } } /*** donation meter part ***/ .urgent-donation-s2 .donation-meter-wrapper { padding: 90px 0 0 70px; } @media screen and (min-width: 1200px) { .urgent-donation-s2 .donation-meter-wrapper { width: 485px; margin: 0 auto; } } @media (max-width: 1199px) { .urgent-donation-s2 .donation-meter-wrapper { padding: 90px 0 0 35px; } } @media (max-width: 991px) { .urgent-donation-s2 .donation-meter-wrapper { width: 485px; margin: 0 auto; padding: 90px 35px; } } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-wrapper { width: 400px; padding: 50px 15px; } } @media (max-width: 400px) { .urgent-donation-s2 .donation-meter-wrapper { width: 100%; } } /*** donation meter ***/ .urgent-donation-s2 .donation-meter-details > div { display: inline-block; text-align: center; } @media (max-width: 400px) { .urgent-donation-s2 .donation-meter-details > div { display: block; text-align: center; } } .urgent-donation-s2 .donation-meter-details .raised span, .urgent-donation-s2 .donation-meter-details .goal span { font-size: 14px; font-weight: bold; color: #fff; text-transform: uppercase; } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-details .raised span, .urgent-donation-s2 .donation-meter-details .goal span { font-size: 12px; } } .urgent-donation-s2 .donation-meter-details .raised h3, .urgent-donation-s2 .donation-meter-details .goal h3 { font-size: 24px; color: #000; margin: 0; } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-details .raised h3, .urgent-donation-s2 .donation-meter-details .goal h3 { font-size: 20px; } } .urgent-donation-s2 .donation-meter-details .meter2 { width: 60%; position: relative; } @media (max-width: 400px) { .urgent-donation-s2 .donation-meter-details .meter2 { width: 100%; margin: 25px 0; } } .urgent-donation-s2 .donation-meter-details .meter2 span { font-size: 36px; font-weight: bold; color: #000; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-details .meter2 span { font-size: 27px; } } .urgent-donation-s2 .donation-meter-details .meter2 p { font-size: 14px; color: #fff; position: absolute; top: 65%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-details .meter2 p { font-size: 12px; } } @media (max-width: 767px) { .urgent-donation-s2 .donation-meter-details .meter2 canvas { width: 70%; margin: 0 auto; } } @media (max-width: 400px) { .urgent-donation-s2 .donation-meter-details .meter2 canvas { width: 50%; } } .urgent-donation-s2 .donation-form { margin-top: 70px; } @media (max-width: 400px) { .urgent-donation-s2 .donation-form { margin-top: 40px; } } .urgent-donation-s2 .donation-form form { overflow: hidden; } .urgent-donation-s2 .donation-form form > div:first-child { width: 50%; float: left; text-align: right; } .urgent-donation-s2 .donation-form form > div:last-child { width: 45%; float: left; text-align: left; margin-left: 5px; } @media (max-width: 400px) { .urgent-donation-s2 .donation-form form > div { width: 100% !important; float: none !important; } } .urgent-donation-s2 .donation-form form input { height: auto; border: 0; padding: 10px 40px; font-weight: bold; box-shadow: none; } .urgent-donation-s2 .donation-form form .theme-btn-s2 { font-size: 14px; padding: 9px 35px; text-transform: uppercase; } .urgent-donation-s2 .donation-form form .theme-btn-s2:hover { background-color: #fff; border-color: white; } @media (max-width: 400px) { .urgent-donation-s2 .donation-form form .theme-btn-s2 { display: block; margin: 15px auto 0; } } /*-------------------------------------------------------------- #20.1 cta-4 --------------------------------------------------------------*/ .home-style-two .cta-4 { background-color: #ebebeb; padding: 110px 0; } @media (max-width: 991px) { .home-style-two .cta-4 { padding: 90px 0; } } @media (max-width: 767px) { .home-style-two .cta-4 { padding: 80px 0; } } /*-------------------------------------------------------------- #20.2 events-nearby --------------------------------------------------------------*/ .home-style-two .events-nearby, .home-style-three .events-nearby { padding: 120px 0; } @media (max-width: 991px) { .home-style-two .events-nearby, .home-style-three .events-nearby { padding: 80px 0; } } .home-style-two .events-nearby .section-title-s2 h2, .home-style-three .events-nearby .section-title-s2 h2 { margin: 0 0 0.64em; } .home-style-two .events-nearby .event-grid, .home-style-three .events-nearby .event-grid { padding: 5px 15px; } .home-style-two .events-nearby .event-grid-wrapper, .home-style-three .events-nearby .event-grid-wrapper { margin: 0 -15px; } @media (max-width: 991px) { .home-style-two .events-nearby .event-grid-wrapper, .home-style-three .events-nearby .event-grid-wrapper { margin: 0; } } .home-style-two .events-nearby .events-nearby-slider .owl-controls, .home-style-three .events-nearby .events-nearby-slider .owl-controls { margin: 50px 0 0; } @media (max-width: 991px) { .home-style-two .events-nearby .events-nearby-slider .owl-controls, .home-style-three .events-nearby .events-nearby-slider .owl-controls { margin: 40px 0 0; } } .home-style-two .events-nearby .owl-dots span, .home-style-three .events-nearby .owl-dots span { width: 12px; height: 12px; margin: 0 12px 0 0; } .home-style-two .events-nearby .owl-dots .active span, .home-style-two .events-nearby .owl-dots span:hover, .home-style-three .events-nearby .owl-dots .active span, .home-style-three .events-nearby .owl-dots span:hover { background-color: #fb5e1c; } /*** others ***/ .home-style-two .popular-campaign .theme-btn-s2 { border-color: #fb5e1c; color: #fb5e1c; } .home-style-two .popular-campaign .theme-btn-s2:hover { background-color: #fb5e1c; color: #fff; } .home-style-two .cta-2 .join-us:before { display: none; } /*-------------------------------------------------------------- home page style three --------------------------------------------------------------*/ /*-------------------------------------------------------------- #21.0 urgent-donation --------------------------------------------------------------*/ .home-style-three .urgent-donation { padding: 0; margin-top: -100px; } @media (max-width: 991px) { .home-style-three .urgent-donation { margin: 40px 0 0; } } .home-style-three .urgent-donation .urgent-inner { padding: 0; } .home-style-three .urgent-donation .urgent-inner .owl-controls { position: relative; margin: 0; height: 1px; } @media (max-width: 767px) { .home-style-three .urgent-donation .urgent-inner .owl-controls { margin-top: 25px; } } .home-style-three .urgent-donation .urgent-inner .owl-controls .owl-nav { top: -175px; } .home-style-three .urgent-donation .urgent-inner .owl-controls .owl-dots { margin: 0; padding-top: 0; } .home-style-three .urgent-donation .urgent-inner .owl-controls .owl-dots .active span { border: 2px solid #000; } .home-style-three .urgent-donation .urgent-box { background-color: transparent; } .home-style-three .urgent-donation .urgent-box .details { background-color: #15181d; } .home-style-three .urgent-donation .urgent-box .details > span { background-color: #fff; color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details h2 { color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details .remaing-date { color: #9da1a9; } .home-style-three .urgent-donation .urgent-box .details .progress .progress-bar { background-color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details .progress-bar span { background-color: #fb5e1c; color: #fff; } .home-style-three .urgent-donation .urgent-box .details .progress-bar span:before { border-top-color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details .goal-raised span { color: #9da1a9; } .home-style-three .urgent-donation .urgent-box .details .goal-raised h4 { color: #fff; } .home-style-three .urgent-donation .urgent-box .details .form input { background-color: #fb5e1c; color: #fff; border-color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details .form input:focus { box-shadow: none; } .home-style-three .urgent-donation .urgent-box .details .form .theme-btn { background-color: transparent; border-color: #fff; color: #fff; } .home-style-three .urgent-donation .urgent-box .details .form .theme-btn:hover { background-color: #fb5e1c; border-color: #fb5e1c; } .home-style-three .urgent-donation .urgent-box .details .form ::-webkit-input-placeholder { font-style: 14px; font-style: normal; color: #fff; } .home-style-three .urgent-donation .urgent-box .details .form :-moz-placeholder { font-style: 14px; font-style: normal; color: #fff; } .home-style-three .urgent-donation .urgent-box .details .form ::-moz-placeholder { font-style: 14px; font-style: normal; color: #fff; } .home-style-three .urgent-donation .urgent-box .details .form :-ms-input-placeholder { font-style: 14px; font-style: normal; color: #fff; } /*-------------------------------------------------------------- #21.1 cta-4 --------------------------------------------------------------*/ .home-style-three .cta-4 { background-color: #f2f2f2; margin-top: 80px; } .home-style-three .cta-4 .col > div { background-color: #fff; padding: 40px 35px; } .home-style-three .cta-2 .join-us:before { display: none; } .home-style-three .cta-2 .join-us { background: url("../images/join-us-bg-2.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #21.1 cta-4 --------------------------------------------------------------*/ .home-style-three .cta-3 { background: #000; position: relative; } .home-style-three .cta-3:before { content: ""; background: url("../images/cta-3-animal.jpg") center center/cover no-repeat local; width: 40%; height: 100%; position: absolute; left: 0; top: 0; } @media (max-width: 991px) { .home-style-three .cta-3:before { display: none; } } .home-style-three .cta h2 span { color: #fb5e1c; } /*-------------------------------------------------------------- #21.2 shop slider --------------------------------------------------------------*/ @media (max-width: 991px) { .home-style-three .shop-main-content { padding: 100px 0; } } @media (max-width: 767px) { .home-style-three .shop-main-content { padding: 70px 0; } } .home-style-three .latest-product-slider .grid { width: auto; float: none; } .home-style-three .latest-product-slider .owl-controls { margin: 0; } .home-style-three .latest-product-slider .owl-dots span { background-color: #fff; width: 12px; height: 12px; border: 2px solid #000; margin: 0 15px 0 0; } .home-style-three .latest-product-slider .owl-dot:hover span { background-color: #fb5e1c; } .home-style-three .latest-product-slider .owl-dots .active span { width: 15px; height: 15px; background-color: #fb5e1c; margin-bottom: -1px; } /*** news letter ***/ .home-style-three .newsletter .children-holder { background: url("../images/newsletter-elephant.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- home page style four --------------------------------------------------------------*/ /*-------------------------------------------------------------- #22.0 cta-4 --------------------------------------------------------------*/ .cta-5 { background: #f2f2f2 url("../images/home-4/mission/home-4-cta-4-bg.png") center 150px/100% no-repeat local; } .cta-5 .content > .col > div { padding: 55px 35px; position: relative; } .cta-5 .content > .col > div:before { content: ""; background-color: rgba(251, 94, 28, 0.9); width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 1199px) { .cta-5 .content > .col > div { padding: 45px 25px; } } .cta-5 .content > .col:hover > div:before { background-color: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .cta-5 .content > .col:first-child > div { background: url("../images/home-4/mission/img-1.jpg") center center/cover no-repeat local; } .cta-5 .content > .col:nth-child(2) > div { background: url("../images/home-4/mission/img-2.jpg") center center/cover no-repeat local; } .cta-5 .content > .col:last-child > div { background: url("../images/home-4/mission/img-3.jpg") center center/cover no-repeat local; } .cta-5 .content .col { text-align: center; } .cta-5 .content .col h3, .cta-5 .content .col p, .cta-5 .content .col i { color: #fff; position: relative; } .cta-5 .content .col h3 { font-size: 24px; margin: 0.54em 0 0.58em; padding-bottom: 0.54em; text-transform: uppercase; } @media (max-width: 767px) { .cta-5 .content .col h3 { font-size: 20px; } } .cta-5 .content .col h3:after { content: ""; background: #fff; width: 30px; height: 6px; position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } @media (max-width: 767px) { .cta-5 .content .col h3:after { height: 4px; } } .cta-5 .content .col p { font-size: 16px; margin: 0; } .cta-5 .content .col i:before { font-size: 80px; color: #fff; } @media (max-width: 1199px) { .cta-5 .content .col i:before { font-size: 60px; } } @media (max-width: 767px) { .cta-5 .content .col i:before { font-size: 40px; } } @media (max-width: 991px) { .cta-5 .content > .col { margin-bottom: 50px; } .cta-5 .content > .col:last-child { margin-bottom: 0; } } /*-------------------------------------------------------------- #22.1 important-causes --------------------------------------------------------------*/ .important-causes .more-causes { clear: both; text-align: center; padding-top: 40px; } .important-causes .more-causes .theme-btn { font-size: 18px; padding: 20px; text-transform: capitalize; } .important-causes-content > .col { margin-bottom: 30px; } @media (max-width: 600px) { .important-causes-content > .col { width: 100%; } } .important-causes-content > .col:first-child .grid { background: url("../images/important-causes/img-1.jpg") center center/cover no-repeat local; } .important-causes-content > .col:nth-child(2) .grid { background: url("../images/important-causes/img-2.jpg") center center/cover no-repeat local; } .important-causes-content > .col:nth-child(3) .grid { background: url("../images/important-causes/img-3.jpg") center center/cover no-repeat local; } .important-causes-content > .col:nth-child(4) .grid { background: url("../images/important-causes/img-4.jpg") center center/cover no-repeat local; } .important-causes-content > .col:nth-child(5) .grid { background: url("../images/important-causes/img-5.jpg") center center/cover no-repeat local; } .important-causes-content > .col:nth-child(6) .grid { background: url("../images/important-causes/img-6.jpg") center center/cover no-repeat local; } /*-------------------------------------------------------------- #22.2 next-event-section --------------------------------------------------------------*/ .next-event-section { background: url("../images/cta.jpg") center center/cover no-repeat local; } .next-event-section .content { background-color: rgba(0, 0, 0, 0.8); padding: 110px 135px 120px; } @media (max-width: 991px) { .next-event-section .content { padding: 90px 55px 100px; } } @media (max-width: 767px) { .next-event-section .content { padding: 70px 15px 80px; } } .next-event-section .event-info { text-align: center; } .next-event-section .event-info h2 { font-size: 40px; color: #fff; margin: 0 0 0.48em; } @media (max-width: 991px) { .next-event-section .event-info h2 { font-size: 30px; } } @media (max-width: 767px) { .next-event-section .event-info h2 { font-size: 25px; } } .next-event-section .event-info h2 span { color: #fb5e1c; } .next-event-section .event-info ul { overflow: hidden; display: inline-block; margin-bottom: 15px; } @media (max-width: 767px) { .next-event-section .event-info ul { margin-top: 10px; } } .next-event-section .event-info ul li { color: #9da1a9; float: left; margin-right: 43px; } .next-event-section .event-info ul li:last-child { margin-right: 0; } .next-event-section .event-info ul li i { color: #fb5e1c; } @media (max-width: 767px) { .next-event-section .event-info ul li { margin-right: 20px; } } .next-event-section .event-info p { margin: 0 0 3.33em; } .next-event-section .event-countdown { overflow: hidden; } @media screen and (min-width: 1200px) { .next-event-section .event-countdown { padding: 0 80px; } } @media (max-width: 767px) { .next-event-section .event-countdown { text-align: center; } } .next-event-section .event-countdown > div { display: inline-block; } @media (max-width: 767px) { .next-event-section .event-countdown > div { float: none !important; } } .next-event-section .event-countdown > div:first-child { float: left; } .next-event-section .event-countdown > div:last-child { float: right; } @media (max-width: 767px) { .next-event-section .event-countdown > div:last-child { display: block; margin-top: 30px; } } .next-event-section .event-countdown .join .theme-btn-s2 { font-size: 18 px; font-weight: normal; padding: 14px 40px; border-color: #fb5e1c; } @media (max-width: 767px) { .next-event-section .event-countdown .join .theme-btn-s2 { font-size: 16px; padding: 8px 20px; } } .next-event-section #event-clock .box { width: 65px; } .next-event-section #event-clock .box > div { background-color: #fb5e1c; padding: 15px 2px; } .next-event-section #event-clock .box span { background-color: #1a1a1a; font-size: 13px; font-weight: normal; display: block; padding: 4px 0; text-transform: uppercase; } /*-------------------------------------------------------------- #22.3 about style 2 --------------------------------------------------------------*/ .about-st2 .left-col .logo { margin-bottom: 27px; } .about-st2 .left-col > span { display: block; font-weight: bold; color: #000; margin-bottom: 30px; } .about-st2 .content { overflow: hidden; } @media (max-width: 767px) { .about-st2 .content > div { float: none !important; width: 100% !important; } } .about-st2 .content .left-col { width: 60%; float: left; } .about-st2 .content .right-col { width: 35%; float: right; } @media (max-width: 767px) { .about-st2 .content .right-col { width: 320px !important; height: 300px !important; margin: 50px auto 0; } } /*-------------------------------------------------------------- #22.4 recent news --------------------------------------------------------------*/ .home-style-four .recent-news, .home-style-five .recent-news { padding-bottom: 105px; } @media (max-width: 991px) { .home-style-four .recent-news, .home-style-five .recent-news { padding-bottom: 60px; } } @media (max-width: 767px) { .home-style-four .recent-news, .home-style-five .recent-news { padding-bottom: 40px; } } @media (max-width: 550px) { .home-style-four .recent-news .blog-grid > .col, .home-style-five .recent-news .blog-grid > .col { width: 100%; margin: 0 0 25px; } .home-style-four .recent-news .blog-grid > .col:last-child, .home-style-five .recent-news .blog-grid > .col:last-child { margin-bottom: 0; } } .home-style-four .recent-news .blog-grid > .col:hover .entry-body, .home-style-five .recent-news .blog-grid > .col:hover .entry-body { -webkit-box-shadow: 0 0 25px 0 #cccccc; -moz-box-shadow: 0 0 25px 0 #cccccc; -o-box-shadow: 0 0 25px 0 #cccccc; -ms-box-shadow: 0 0 25px 0 #cccccc; box-shadow: 0 0 25px 0 #cccccc; } .home-style-four .recent-news .section-title-s3, .home-style-four .recent-news .section-title-single-heading, .home-style-four .recent-news .section-title-s4, .home-style-five .recent-news .section-title-s3, .home-style-five .recent-news .section-title-single-heading, .home-style-five .recent-news .section-title-s4 { margin-bottom: 35px; } .home-style-four .recent-news .entry-media .img, .home-style-five .recent-news .entry-media .img { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } @media (max-width: 767px) { .home-style-four .recent-news .entry-media .img, .home-style-five .recent-news .entry-media .img { display: block; } } .home-style-four .recent-news .entry-body, .home-style-five .recent-news .entry-body { box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .home-style-four .recent-news h3, .home-style-five .recent-news h3 { font-size: 20px; line-height: 1.2em; margin: 0 0 1em; padding-bottom: 0.55em; position: relative; text-transform: capitalize; } @media (max-width: 991px) { .home-style-four .recent-news h3, .home-style-five .recent-news h3 { font-size: 16px; } } .home-style-four .recent-news h3:after, .home-style-five .recent-news h3:after { content: ""; background-color: #fb5e1c; width: 35px; height: 4px; position: absolute; left: 0; bottom: 0; } .home-style-four .recent-news h3 a, .home-style-five .recent-news h3 a { color: #000; } .home-style-four .recent-news h3 a:hover, .home-style-five .recent-news h3 a:hover { color: #fb5e1c; } @media (max-width: 767px) { .home-style-four .recent-news h3, .home-style-five .recent-news h3 { font-size: 17px; } } .home-style-four .recent-news .entry-date, .home-style-five .recent-news .entry-date { position: relative; } .home-style-four .recent-news .entry-date > div, .home-style-five .recent-news .entry-date > div { background-color: #fb5e1c; color: #fff; padding: 11px 13px; text-align: center; position: absolute; left: 17px; top: 0; } .home-style-four .recent-news .entry-date > div p, .home-style-four .recent-news .entry-date > div span, .home-style-five .recent-news .entry-date > div p, .home-style-five .recent-news .entry-date > div span { color: #fff; margin: 0; } .home-style-four .recent-news .entry-date > div p, .home-style-five .recent-news .entry-date > div p { font-size: 25px; font-weight: bold; line-height: 0.7em; } .home-style-four .recent-news .entry-date > div span, .home-style-five .recent-news .entry-date > div span { font-size: 9px; color: #fff; text-transform: uppercase; } /*-------------------------------------------------------------- #22.5 fun fact --------------------------------------------------------------*/ .fun-fact { background: #191919 url("../images/fun-fact-bg.png") right center/auto no-repeat local; position: relative; } @media (max-width: 767px) { .fun-fact { background-image: none; text-align: center; padding: 80px 0; } } @media (max-width: 450px) { .fun-fact { padding-bottom: 55px; } } .fun-fact:before { content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .fun-fact .top-part, .fun-fact .bottom-part { position: relative; } @media (max-width: 767px) { .fun-fact .top-part > .col { margin-bottom: 50px; } .fun-fact .top-part > .col:last-child { margin-bottom: 0; } } .fun-fact .top-part .icon i:before { font-size: 55px; color: #fb5e1c; } @media (max-width: 991px) { .fun-fact .top-part .icon i:before { font-size: 45px; } } @media (max-width: 767px) { .fun-fact .top-part .icon i:before { font-size: 35px; } } .fun-fact .top-part h3 { font-size: 27px; font-weight: normal; color: #fff; margin: 0 0 0.6em; } @media (max-width: 991px) { .fun-fact .top-part h3 { font-size: 22px; } } @media (max-width: 767px) { .fun-fact .top-part h3 { font-size: 18px; } } .fun-fact .top-part h3 span { font-weight: bold; } .fun-fact .top-part p { color: #fff; margin: 0; } .fun-fact .bottom-row { margin-top: 120px; } @media (max-width: 991px) { .fun-fact .bottom-row { margin-top: 100px; } } @media (max-width: 767px) { .fun-fact .bottom-row { margin-top: 60px; } } @media (max-width: 450px) { .fun-fact .bottom-row > .col { width: 50%; margin-bottom: 25px; } } .fun-fact .bottom-row h2 { font-size: 50px; color: #fff; margin: 0 0 0.33em; } @media (max-width: 991px) { .fun-fact .bottom-row h2 { font-size: 40px; } } @media (max-width: 767px) { .fun-fact .bottom-row h2 { font-size: 30px; } } .fun-fact .bottom-row span { font-size: 18px; color: #fff; text-transform: uppercase; } @media (max-width: 991px) { .fun-fact .bottom-row span { font-size: 16px; } } @media (max-width: 767px) { .fun-fact .bottom-row span { font-size: 14px; } } /*-------------------------------------------------------------- #22.6 gallery style 2 --------------------------------------------------------------*/ .gallery-st2 .section-title-s3, .gallery-st2 .section-title-single-heading, .gallery-st2 .section-title-s4 { margin-bottom: 0; } .gallery-st2 .gallery-filters li:after { display: none; } .gallery-st2 .gallery-filters { margin-top: 37px; } @media (max-width: 991px) { .gallery-st2 .gallery-filters { margin-top: 15px; } } @media (max-width: 550px) { .gallery-st2 .gallery-filters { margin-top: 0; } } .gallery-st2 .gallery-filters ul li { padding: 0; margin-right: 24px; } .gallery-st2 .gallery-filters ul li:last-child { margin-right: 0; } @media (max-width: 550px) { .gallery-st2 .gallery-filters ul li { float: none; margin: 0; padding: 5px 0 !important; border-bottom: 1px solid #b3b3b3; } } .gallery-st2 .gallery-filters ul li a { color: #000; } .gallery-st2 .gallery-container { margin-right: -9px; } .gallery-st2 .gallery-container .box { width: 25%; padding: 0 9px 9px 0; } @media (max-width: 991px) { .gallery-st2 .gallery-container .box { width: 50%; } } .gallery-st2 .gallery-container .box > a { position: relative; } .gallery-st2 .gallery-container .box > a:after, .gallery-st2 .gallery-container .box > a:before { display: none; } .gallery-st2 .gallery-container .box:hover .hover-text { top: 0; opacity: 1; visibility: visible; } .gallery-st2 .gallery-container .box .hover-text { background: rgba(251, 94, 28, 0.9); width: 100%; height: 100%; text-align: center; position: absolute; left: 0; top: 10%; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .gallery-st2 .gallery-container .box .hover-text:before { content: "+"; background-color: transparent; font-size: 45px; color: #fff; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .gallery-st2 .gallery-container .box .hover-text > div { width: 100%; position: absolute; bottom: 35px; } .gallery-st2 .gallery-container .box .hover-text h3 { font-size: 18px; font-weight: normal; color: #fff; margin: 0; text-transform: capitalize; } @media (max-width: 460px) { .gallery-st2 .gallery-container .box .hover-text h3 { display: none; } } .gallery-st2 .gallery-container .box .hover-text span { color: #fff; font-size: 12px; } @media (max-width: 460px) { .gallery-st2 .gallery-container .box .hover-text span { display: none; } } /*-------------------------------------------------------------- #22.7 testimonials --------------------------------------------------------------*/ .testimonials { background-color: whitesmoke; } .testimonials .client-testimonials img { width: auto; display: inline-block; } .testimonials .client-testimonials .box { padding: 40px 10px 10px; } .testimonials .client-testimonials .box-inner { background-color: #fff; text-align: center; padding: 70px 50px 40px; position: relative; -webkit-box-shadow: 0 0 25px 0 #b3b3b3; -moz-box-shadow: 0 0 25px 0 #b3b3b3; -o-box-shadow: 0 0 25px 0 #b3b3b3; -ms-box-shadow: 0 0 25px 0 #b3b3b3; box-shadow: 0 0 25px 0 #b3b3b3; } @media (max-width: 1199px) { .testimonials .client-testimonials .box-inner { padding: 60px 30px 30px; } } .testimonials .client-testimonials .box-inner .img-holder { position: absolute; left: 50%; top: -40px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .testimonials .client-testimonials .box-inner h3 { font-size: 20px; font-weight: normal; color: #000; margin: 0 0 0.2em; text-transform: capitalize; } @media (max-width: 767px) { .testimonials .client-testimonials .box-inner h3 { font-size: 17px; } } .testimonials .client-testimonials .box-inner > span { font-size: 15px; display: block; margin-bottom: 20px; } @media (max-width: 767px) { .testimonials .client-testimonials .box-inner > span { font-size: 14px; } } .testimonials .client-testimonials .box-inner p { margin: 0; color: #51555c; } .testimonials .testimonials-slider .owl-controls { margin-top: 60px; } @media (max-width: 767px) { .testimonials .testimonials-slider .owl-controls { margin-top: 40px; } } .testimonials .testimonials-slider .owl-controls .owl-dot span { background-color: #15181d; width: 15px; height: 5px; margin: 0 15px 0 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } @media (max-width: 767px) { .testimonials .testimonials-slider .owl-controls .owl-dot span { width: 10px; } } .testimonials .testimonials-slider .owl-controls .owl-dots .active span { background-color: #fb5e1c; width: 45px; } @media (max-width: 767px) { .testimonials .testimonials-slider .owl-controls .owl-dots .active span { width: 30px; } } /*-------------------------------------------------------------- #22.8 partner --------------------------------------------------------------*/ .partner { background-color: #15181d; padding: 45px 0; border-bottom: 1px solid #000; } .partner > .container { position: relative; } .partner .box { text-align: center; } .partner .box img { display: inline-block; width: auto; } .partner .partner-slider .owl-controls { width: 100%; position: absolute; top: 40%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .partner .partner-slider .owl-controls .owl-nav .owl-prev, .partner .partner-slider .owl-controls .owl-nav .owl-next { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .partner .partner-slider .owl-controls .owl-nav .owl-prev { left: 0; } .partner .partner-slider .owl-controls .owl-nav .owl-next { right: 0; } .partner .partner-slider .owl-controls .owl-nav > div { background: #fb5e1c; width: 38px; height: 33px; line-height: 33px; color: #fff; font-size: 16px; text-align: center; padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .partner .partner-slider .owl-controls .owl-nav > div:hover { background: #e04504; } .home-style-four p { font-family: "Noto Sans", sans-serif !important; } /*-------------------------------------------------------------- home page style five --------------------------------------------------------------*/ /*-------------------------------------------------------------- #23.0 urgent-causes --------------------------------------------------------------*/ .urgent-causes-wrapper .open-urgent-causes { position: relative; } .urgent-causes-wrapper .open-urgent-causes #toggle-causes { background-color: #fb5e1c; color: #fff; font-size: 17px; padding: 6px 8px; border: 0; outline: 0; box-shadow: none; position: absolute; right: 30px; top: 0; z-index: 10; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -o-border-radius: 0 0 5px 5px; -ms-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } @media (max-width: 991px) { .urgent-causes-wrapper .open-urgent-causes #toggle-causes { right: 20px; } } .urgent-causes-wrapper .open-urgent-causes #toggle-causes i { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; transition: all 0.5s; } .urgent-causes-wrapper .open-urgent-causes .open i { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .urgent-causes { padding: 63px 0; /*** progress bar ***/ /*** clock ***/ } @media (max-width: 767px) { .urgent-causes { padding: 30px 0; } } .urgent-causes .topic span { background-color: #fb5e1c; display: inline-block; font-size: 16px; color: #fff; text-transform: uppercase; padding: 7px 16px; } @media (max-width: 767px) { .urgent-causes .topic span { font-size: 14px; padding: 5px 15px; } } .urgent-causes .topic h2 { font-size: 30px; margin: 0.67em 0 0.73em; text-transform: capitalize; } @media (max-width: 767px) { .urgent-causes .topic h2 { font-size: 22px; } } .urgent-causes .topic > a { font-size: 16px; color: #fb5e1c; text-transform: uppercase; text-decoration: underline; } .urgent-causes .goal-raised { margin-bottom: 15px; } @media (max-width: 991px) { .urgent-causes .goal-raised { margin-top: 30px; } } .urgent-causes .goal-raised > p { display: inline-block; color: #333333; margin: 0; text-transform: uppercase; } .urgent-causes .goal-raised > p:last-child { float: right; } .urgent-causes .progress { background-color: #b3b3b3; height: 16px; margin-bottom: 32px; box-shadow: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .urgent-causes .progress-bar { background: #fb5e1c url("../images/meter-bg.png") 0 0/auto repeat-x local; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .urgent-causes .progress-bar span { display: none; } @media (max-width: 767px) { .urgent-causes .causes-clock { text-align: center; } } .urgent-causes .causes-clock > div { display: inline-block; float: left; } .urgent-causes .causes-clock > div:first-child { position: relative; top: 20px; } @media (max-width: 767px) { .urgent-causes .causes-clock > div:first-child { display: none; } } .urgent-causes .causes-clock > div:last-child { float: right; } @media (max-width: 767px) { .urgent-causes .causes-clock > div:last-child { float: none; width: 300px; margin: 0 auto; } } .urgent-causes .causes-clock > div:first-child { font-size: 18px; color: lighter(#000, 20%); text-transform: uppercase; padding-right: 25px; } @media (max-width: 1199px) { .urgent-causes .causes-clock > div:first-child { position: relative; top: 50px; } } @media (max-width: 991px) { .urgent-causes .causes-clock > div:first-child { top: 18px; } } .urgent-causes #causes-end-time > .box { background-color: #fb5e1c; width: 75px; height: 75px; float: left; font-size: 14px; color: #fff; text-align: center; text-transform: uppercase; margin-right: 20px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .urgent-causes #causes-end-time > .box:last-child { margin-right: 0; } @media (max-width: 767px) { .urgent-causes #causes-end-time > .box { width: 65px; height: 65px; margin-right: 10px; font-size: 12px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } } .urgent-causes #causes-end-time > .box > div { background-color: #1a1a1a; font-size: 25px; font-weight: bold; padding: 9px 0; color: #fb5e1c; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } @media (max-width: 767px) { .urgent-causes #causes-end-time > .box > div { font-size: 18px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } } /*-------------------------------------------------------------- #23.1 main-banar --------------------------------------------------------------*/ .main-banar { background: url("../images/home-5-banar.jpg") center center/cover no-repeat local; height: 600px; text-align: center; position: relative; } @media (max-width: 767px) { .main-banar { height: 420px; } } .main-banar:before { content: ""; background-color: rgba(44, 44, 44, 0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .main-banar .banar-inner { width: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 767px) { .main-banar .banar-inner > .container { padding: 0 10px; } } .main-banar .banar-title > span { font-size: 24px; color: #fb5e1c; font-style: italic; margin-bottom: 12px; display: block; } @media (max-width: 767px) { .main-banar .banar-title > span { font-size: 17px; } } .main-banar .banar-title h1 { font-size: 36px; color: #fff; margin: 0 0 1.11em; text-transform: uppercase; } @media (max-width: 767px) { .main-banar .banar-title h1 { font-size: 30px; } } .main-banar .banar-title h1, .main-banar .banar-title > span, .main-banar .banar-title .btn { opacity: 0; } .home-style-five .active-banar-title > span { -webkit-animation: slideInUpSlow 1.5s 0.5s forwards; animation: slideInUpSlow 1.5s 0.5s forwards; } .home-style-five .active-banar-title h1 { -webkit-animation: slideInUpSlow 1.5s 0.7s forwards; animation: slideInUpSlow 1.5s 0.7s forwards; } .home-style-five .active-banar-title .btn { -webkit-animation: slideInUpSlow 1.5s 1s forwards; animation: slideInUpSlow 1.5s 1s forwards; } /*-------------------------------------------------------------- #23.2 cta-5 --------------------------------------------------------------*/ .home-style-five .cta-5 { background-color: #f0f0f0; background-image: none; } .home-style-five .cta-5 .content > .col > div { background: none; padding: 0; } .home-style-five .cta-5 .content > .col > div:before { display: none; } .home-style-five .cta-5 .content .col h3 { color: #3d424b; } .home-style-five .cta-5 .content .col h3:after { background-color: #fb5e1c; } .home-style-five .cta-5 .content .col p { color: #828791; } .home-style-five .cta-5 .content .col i:before { color: #fb5e1c; } /*-------------------------------------------------------------- #23.3 important-causes --------------------------------------------------------------*/ .home-style-five .important-causes { /*** recent one ***/ } .home-style-five .important-causes .important-causes-content > .col:first-child .grid { background: url("../images/important-causes/img-2.jpg") center center/cover no-repeat local; } .home-style-five .important-causes .important-causes-content > .col:nth-child(2) .grid { background: url("../images/important-causes/img-3.jpg") center center/cover no-repeat local; } .home-style-five .important-causes .important-causes-content > .col:nth-child(3) .grid { background: url("../images/important-causes/img-5.jpg") center center/cover no-repeat local; } .home-style-five .important-causes .important-causes-content > .col:nth-child(4) .grid { background: url("../images/important-causes/img-6.jpg") center center/cover no-repeat local; } @media (max-width: 991px) { .home-style-five .important-causes .left-col { margin-bottom: 50px; } } .home-style-five .important-causes .recent-one .img-holder img, .home-style-five .important-causes .recent-one .img-holder, .home-style-five .important-causes .recent-one .img-holder:before { border-radius: 0 !important; } @media (max-width: 991px) { .home-style-five .important-causes .recent-one .img-progress { max-width: 370px; } } .home-style-five .important-causes .recent-one .progress { margin: 0; height: 12px; } .home-style-five .important-causes .recent-one .content-details { margin-top: 30px; } .home-style-five .important-causes .recent-one .content-details > span { background-color: #151515; color: #fff; font-size: 16px; padding: 8px 15px; } @media (max-width: 767px) { .home-style-five .important-causes .recent-one .content-details > span { font-size: 14px; padding: 5px 12px; } } .home-style-five .important-causes .recent-one .content-details h3 { font-size: 26px; color: #333333; margin: 0.73em 0 0.2em; } @media (max-width: 767px) { .home-style-five .important-causes .recent-one .content-details h3 { font-size: 20px; } } .home-style-five .important-causes .recent-one .content-details ul { margin-top: 18px; } .home-style-five .important-causes .recent-one .content-details ul li { display: inline-block; margin-right: 40px; } .home-style-five .important-causes .recent-one .content-details ul li:last-child { margin-right: 0; } @media (max-width: 767px) { .home-style-five .important-causes .recent-one .content-details ul li { margin-right: 20px; } } .home-style-five .important-causes .recent-one .content-details ul li h5 { font-size: 25px; color: #fb5e1c; margin: 0; } @media (max-width: 767px) { .home-style-five .important-causes .recent-one .content-details ul li h5 { font-size: 20px; } } .home-style-five .important-causes .recent-one .content-details ul li span { font-size: 15px; color: #828791; } @media (max-width: 767px) { .home-style-five .important-causes .recent-one .content-details ul li span { font-size: 14px; } } /*-------------------------------------------------------------- #23.4 events-nearby-s2 --------------------------------------------------------------*/ .events-nearby-s2 { position: relative; padding-bottom: 110px; /*** left-col ***/ /*** right-col ***/ /*** tab items ***/ /*** tab content ***/ /*** slider controls ***/ } @media (max-width: 991px) { .events-nearby-s2 { padding-bottom: 80px; } } @media (max-width: 767px) { .events-nearby-s2 { padding-bottom: 60px; } } .events-nearby-s2:before { content: ""; background-color: rgba(0, 0, 0, 0.8); width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .events-nearby-s2 > .container { position: relative; } .events-nearby-s2 .left-col { padding-top: 85px; } @media (max-width: 991px) { .events-nearby-s2 .left-col { padding-top: 0; margin-bottom: 50px; } } .events-nearby-s2 .left-col > i:before { font-size: 60px; color: #fb5e1c; } @media (max-width: 991px) { .events-nearby-s2 .left-col > i:before { font-size: 45px; } } @media (max-width: 767px) { .events-nearby-s2 .left-col > i:before { font-size: 30px; } } .events-nearby-s2 .left-col h2 { font-size: 36px; font-weight: normal; color: #fff; margin: 0.3em 0 0.28em; text-transform: capitalize; } @media (max-width: 991px) { .events-nearby-s2 .left-col h2 { font-size: 30px; } } @media (max-width: 767px) { .events-nearby-s2 .left-col h2 { font-size: 25px; } } .events-nearby-s2 .left-col p { color: #fff; margin: 0; } @media screen and (min-width: 1200px) { .events-nearby-s2 .right-col { padding-left: 70px; } } .events-nearby-s2 .right-col .nav-tabs { text-align: center; border-bottom: 2px solid #fb5e1c; margin-bottom: 45px; } .events-nearby-s2 .right-col .nav-tabs > li { float: none; display: inline-block; } .events-nearby-s2 .right-col .nav-tabs > li a { font-size: 18px; color: #fff; border: 0 !important; } @media (max-width: 767px) { .events-nearby-s2 .right-col .nav-tabs > li a { font-size: 16px; } } .events-nearby-s2 .right-col .nav-tabs .active a, .events-nearby-s2 .right-col .nav-tabs > li:hover a { background-color: #fb5e1c; } .events-nearby-s2 .right-col .tab-pane { overflow: hidden; } .events-nearby-s2 .right-col .tab-pane .box-wrapper { padding: 0 40px; } @media (max-width: 1199px) { .events-nearby-s2 .right-col .tab-pane .box-wrapper { padding: 0 20px; } } .events-nearby-s2 .right-col .tab-pane .box { background-color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .events-nearby-s2 .right-col .tab-pane .box:hover .events-header:before, .events-nearby-s2 .right-col .tab-pane .box:hover .theme-btn { visibility: visible; opacity: 1; top: 50%; } .events-nearby-s2 .right-col .tab-pane .box:hover .events-header:before { top: 0% !important; } .events-nearby-s2 .right-col .events-header { position: relative; overflow: hidden; margin-left: -1px; } .events-nearby-s2 .right-col .events-header:before { content: ""; visibility: hidden; opacity: 0; top: 20% !important; z-index: 10; background-color: rgba(128, 128, 128, 0.8); width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -o-border-radius: 5px 5px 0 0; -ms-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .events-nearby-s2 .right-col .events-header img { width: 100%; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -o-border-radius: 5px 5px 0 0; -ms-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; } .events-nearby-s2 .right-col .events-header .theme-btn { background-color: #fff; color: #fb5e1c; text-transform: capitalize; box-shadow: none; position: absolute; left: 50%; top: 20%; visibility: hidden; opacity: 0; z-index: 10; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .events-nearby-s2 .right-col .events-header .theme-btn:hover { background-color: #fb5e1c; color: #fff; } .events-nearby-s2 .right-col .events-content { padding: 25px 30px; } @media (max-width: 767px) { .events-nearby-s2 .right-col .events-content { padding: 20px; } } .events-nearby-s2 .right-col .events-content h3 { font-size: 22px; color: #262626; line-height: 1.3em; margin: 0 0 0.45em; } @media (max-width: 767px) { .events-nearby-s2 .right-col .events-content h3 { font-size: 18px; } } .events-nearby-s2 .right-col .events-content ul li { font-size: 14px; color: #666666; padding-left: 25px; position: relative; margin-bottom: 8px; } .events-nearby-s2 .right-col .events-content ul li:last-child { margin-bottom: 0; } .events-nearby-s2 .right-col .events-content ul li i { position: absolute; left: 0; } .events-nearby-s2 .right-col .events-content ul li i:before { font-size: 14px; } .events-nearby-s2 .right-col #volunteers h3 { font-size: 22px; color: #fff; text-transform: uppercase; line-height: 1.3em; margin: 0 0 0.45em; } .events-nearby-s2 .right-col #volunteers p { color: #fff; } .events-nearby-s2 .right-col .event-s2-slider .owl-controls { margin-top: 50px; } .events-nearby-s2 .right-col .event-s2-slider .owl-dot span { background-color: #fff; width: 10px; height: 10px; margin-right: 12px; } .events-nearby-s2 .right-col .event-s2-slider .owl-dots .active span { background-color: #fb5e1c; width: 40px; } /*-------------------------------------------------------------- #23.5 about-st3 --------------------------------------------------------------*/ /*** left col ***/ .about-st3 .left-col .logo { margin-bottom: 20px; } .about-st3 .left-col .logo + span { font-size: 17px; color: #000; display: block; margin-bottom: 55px; } .about-st3 .left-col .our-location { position: relative; } .about-st3 .left-col .our-location .location { position: absolute; } .about-st3 .left-col .our-location .location-one { left: 20%; top: 20%; } .about-st3 .left-col .our-location .location-two { right: 20%; top: 20%; } .about-st3 .left-col .our-location .location-three { right: 48%; top: 35%; } .about-st3 .left-col .our-location .location-four { left: 25%; top: 65%; } .about-st3 .left-col .our-location .location-five { left: 50%; top: 55%; } .about-st3 .left-col .location-btn { display: inline-block; cursor: pointer; } .about-st3 .left-col .location-btn i:before { font-size: 45px; color: #fb5e1c; } @media (max-width: 767px) { .about-st3 .left-col .location-btn i:before { font-size: 35px; padding: 10px 15px; } } .about-st3 .left-col .location:hover .location-info { opacity: 1; visibility: visible; top: -100%; } @media (max-width: 767px) { .about-st3 .left-col .location:hover .location-info { top: -150%; } } .about-st3 .left-col .location-info { background-color: #fff; width: 175px; border: 1px solid #fb5e1c; padding: 10px 10px 7px; position: absolute; top: -120%; left: 50%; visibility: hidden; opacity: 0; -webkit-box-shadow: 0 0 10px 0 #dbdbdb; -moz-box-shadow: 0 0 10px 0 #dbdbdb; -o-box-shadow: 0 0 10px 0 #dbdbdb; -ms-box-shadow: 0 0 10px 0 #dbdbdb; box-shadow: 0 0 10px 0 #dbdbdb; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .about-st3 .left-col .location-info h5 { font-size: 16px; font-weight: normal; text-transform: capitalize; margin: 0 0 0.3em; } .about-st3 .left-col .location-info ul { overflow: hidden; } .about-st3 .left-col .location-info ul li { float: left; font-size: 13px; color: #fb5e1c; position: relative; padding-left: 20px; margin-right: 10px; } .about-st3 .left-col .location-info ul li:last-child { margin-right: 0; } .about-st3 .left-col .location-info ul li i { position: absolute; left: 0; } .about-st3 .left-col .location-info ul li i:before { background-color: #fff !important; color: #000; font-size: 14px; } .about-st3 .left-col .location-info .map-link { font-size: 12px; color: #fb5e1c; text-transform: capitalize; text-decoration: underline; } /*** right col ***/ @media screen and (min-width: 992px) { .about-st3 .right-col { padding: 80px 0 0 35px; } } @media (max-width: 991px) { .about-st3 .right-col { margin-top: 80px; } } .about-st3 .right-col .panel-group .panel { border: 0; box-shadow: none; } .about-st3 .right-col .panel-group .panel + .panel { margin-top: 10px; } .about-st3 .right-col .panel-heading { background-color: #fff; padding: 0; -webkit-box-shadow: 0 0 10px 0 #dbdbdb; -moz-box-shadow: 0 0 10px 0 #dbdbdb; -o-box-shadow: 0 0 10px 0 #dbdbdb; -ms-box-shadow: 0 0 10px 0 #dbdbdb; box-shadow: 0 0 10px 0 #dbdbdb; } .about-st3 .right-col .panel-heading > a { font-size: 18px; color: #1a1a1a; display: block; padding: 20px 25px; position: relative; } .about-st3 .right-col .panel-heading > a:before { font-family: "FontAwesome"; content: "\f067"; position: absolute; right: 22px; } @media (max-width: 767px) { .about-st3 .right-col .panel-heading > a { font-size: 16px; padding: 10px 15px; } } .about-st3 .right-col .panel-body { border: 0; padding: 15px 25px; } .about-st3 .right-col .panel-group .current .panel-heading > a { color: #fb5e1c; } .about-st3 .right-col .panel-group .current .panel-heading > a:before { font-family: "FontAwesome"; content: "\f068"; } /*# sourceMappingURL=style.css.map */