/*======================================================================== Template Name: Party Ideas, Venues and Event Professionals HTML Template ========================================================================*/ /*---------------------------------- Table of contents 01. Common 02. Header 03. Slider 04. Partner 05. Feature area 06. Category area 07. Subscribe area 08. Recently event box 09. How it work area 10. Testimonial 11. Blog 12. Footer 13. Inner page header 14. About area 15. Search results 16. Event details 17. Gallery 18. Video 19. Team 20. Faq 21. Comments block 22. Contact us 23. Login and Register 24. Error page 404 ----------------------------------*/ /* Theme Font Use */ @import url('css2-Montserratitalwght010002000300040005000600070008000900110012001300140015001600170018001900_swap.css'); /* font-family: 'Montserrat', sans-serif; */ @import url('css2-RobotoCondenseditalwght030004000700130014001700_swap.css'); /* font-family: 'Roboto Condensed', sans-serif; */ /* =================================== 01. Common =================================== */ ::selection { background-color: #e82953; color: #fff; } ::-moz-selection { background-color: #e82953; color: #fff; } img { max-width: 100%; } body { font-size: 12px; font-family: 'Montserrat', sans-serif; color: #333; letter-spacing: 1px; } p { line-height: 24px; font-size: 14px; color: #333; font-family: 'Montserrat', sans-serif; } h1, h2, h3, h4, h5, h6 { margin: 0px; color: #202020; padding: 0px; line-height: 1.2; letter-spacing: 1px; font-family: 'Montserrat', sans-serif; } h1 { font-size: 60px; font-weight: 700; } h2 { font-size: 36px; font-weight: 700; } h3 { font-size: 26px; font-weight: 700; } h4 { font-size: 24px; font-weight: 700; } h5 { font-size: 18px; font-weight: 700; } h6 { font-size: 16px; font-weight: 700; } ul, ol, li { margin: 0px; padding: 0px; list-style: none; } a { text-decoration: none; cursor: pointer; } a:hover { text-decoration: none; } .bg-theme-dark { background-color: #111; } /* --- Top Scroll --- */ .scroll-top { display: none; position: fixed; bottom: 2px; text-align: center; right: 2%; width: 40px; height: 40px; line-height: 40px; font-size: 12px; color: #fff; background-color: #333; text-decoration: none; border-radius: 100%; z-index: 9999; } .scroll-top:hover { color: #fff !important; text-decoration: none; background-color: #e82953; } /* --- Buttons --- */ .btn-style-1 { color: #fff; border: 0; border-bottom: 3px solid #bd1036; border-radius: 6px; position: relative; padding: 16px 30px; font-size: 14px; text-align: center; z-index: 0; text-transform: uppercase; font-weight: 600; line-height: 22px; overflow: hidden; text-decoration: none; display: inline-block; background-color: #e82953; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn-style-1:hover { color: #fff; text-decoration: none; background-color: #11101e; } .btn-style-1.btn-sm { font-size: 11px; padding: 8px 20px; } .btn-style-2 { color: #fff; border: 0; border-bottom: 3px solid #bd1036; border-radius: 6px; position: relative; padding: 16px 30px; font-size: 14px; text-align: center; z-index: 0; text-transform: uppercase; font-weight: 600; line-height: 22px; overflow: hidden; text-decoration: none; display: inline-block; background-color: #111; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn-style-2:hover { color: #fff; text-decoration: none; background-color: #e82953; } .btn-style-2.btn-sm { font-size: 11px; padding: 8px 20px; } /* --- Loading --- */ #preloader { position: fixed; left: 0; top: 0; z-index: 99999; width: 100%; text-align: center; height: 100%; vertical-align: middle; height: 100%; overflow: visible; background-color: #fff; } #preloader .spinner-grow { top: 50%; position: relative; } /* --- section title --- */ .section-title .small-title { font-size: 12px; color: #e82953; } .section-title h2 { position: relative; color: #000; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } .section-title span.dashed-border { border-bottom: 1px dashed rgba(0,0,0,0.2); width: 180px; position: relative; display: inline-block; } /* =================================== 02. Header =================================== */ .header-upper { z-index: 0; position: relative; background-image: url(../image/header-upper-bg.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; padding: 10px 0px; border-radius: 6px; overflow: hidden; } .header-upper:after { position: absolute; content: ""; background-color: rgba(0,0,0,0.7); width: 100%; height: 100%; top: 0px; left: 0px; z-index: -1; } /* header upper link */ .header-upper-link li { margin-right: 25px !important; } .header-upper-link li:last-child { margin-right: 0px !important; } .header-upper-link li:last-child a:after { display: none; } .header-upper-link a { color: #fff; font-size: 14px; display: inline-block; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header-upper-link a:after { position: absolute; content: ""; width: 6px; opacity: 0.3; height: 6px; border-radius: 100%; background-color: #fff; top: 50%; right: -18px; transform: translateY(-50%); } .header-upper-link a:hover { color: #e82953; } /* header search */ .header-search { position: relative; } .header-search input { padding: 0 20px; width: 100%; background-color: rgba(0,0,0,0.8); border: 0px; height: 40px; border-radius: 6px; font-size: 14px; color: #fff; } .header-search button { position: absolute; right: 20px; top: 50%; border: 0px; font-size: 12px; transform: translateY(-50%); padding: 0px; height: 100%; background-color: transparent; color: #fff; } /* header right btn */ .sign-in-btn { height: 40px; background-color: #e82953; padding: 0px 20px; display: inline-block; line-height: 40px; border-radius: 6px; color: #fff; font-weight: 600; font-size: 12px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sign-in-btn:hover { color: #fff; } .sign-up-btn { height: 40px; background-color: #000; padding: 0px 20px; display: inline-block; line-height: 40px; border-radius: 6px; color: #fff; font-weight: 600; font-size: 12px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sign-up-btn:hover { color: #e82953; } .header-lover .navbar-brand { padding: 0px; margin: 0px; } .header-lover { padding: 10px 0px; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header-lover .navbar { padding: 0px 0px; } .header-lover .navbar .nav-item .nav-link { font-size: 12px; color: #000; font-weight: 500; position: relative; padding: 6px 14px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header-lover .navbar .nav-item .nav-link:hover, .header-lover .navbar .nav-item.active .nav-link { color: #e82953; } .header-lover .navbar-toggler span { background: #000; } .header-lover .dropdown-menu { margin: 0px; padding: 0px; border: 0px; background-color: #e82953; } .header-lover .dropdown-menu .dropdown-item { border-bottom: 1px solid rgba(255,255,255,0.1) !important; position: relative; font-size: 12px; padding: 12px 12px; color: #fff; font-weight: 500; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header-lover .dropdown-menu li:last-child .dropdown-item { border-bottom: 0px !important; } .header-lover .dropdown-menu .dropdown-item:hover { color: #000; padding-left: 20px; background-color: transparent; } /* Navbar Toogle */ .navbar-toggler { border: none; padding: 10px 6px; background-color: #f5f5f5; outline: none !important; } .navbar-toggler span { display: block; width: 22px; height: 2px; border-radius: 1px; background: #333; } .navbar-toggler span + span { margin-top: 4px; width: 18px; } .navbar-toggler span + span + span { width: 10px; } /* header search */ .header-call a { color: #e82953 !important; border: 1px solid rgba(0,0,0,0.2); border-radius: 4px; text-transform: capitalize !important; } .header-call a:hover { color: #fff !important; background-color: #e82953; border-color: #e82953; } /* sticky */ .is-sticky { z-index: 9999; } .is-sticky .header-lover { z-index: 999 !important; background-color: #333 !important; box-shadow: 0 .5rem 1rem rgba(0,0,0,.15); } .is-sticky .header-lover .navbar .nav-item .nav-link { color: #ccc; } .is-sticky .nav-item.active .nav-link, .is-sticky .nav-pills .show > .nav-link { color: #e82953 !important; } .is-sticky .header-call a { border: 1px solid rgba(255,255,255,0.2); } @media screen and (min-width: 992px) { /* shows the dropdown menu on hover */ .navbar .dropdown:hover .dropdown-menu, .navbar .dropdown .dropdown-menu:hover { display: block !important; } } /* =================================== 03. Slider =================================== */ .slider { position: relative; z-index: 0; } .slider .carousel-item:before { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0; background-color: rgba(0,0,0,0.5); } .slider .carousel-item { background-position: center top; -webkit-background-size: cover; background-size: cover; height: 700px; position: relative; } .slider .carousel-item.slider-one { background-image: url("../image/1.jpg"); /*edit image*/ } .slider .carousel-item.slider-two { background-image: url("../image/2.jpg"); /*edit image*/ } .slider .carousel-item.slider-three { background-image: url("../image/3.jpg"); /*edit image*/ } .slider-overlay { position: absolute; top: 50%; transform: translateY(-50%); left: 0; z-index: 4; width: 100%; } .banner-caption h5 { font-weight: 500; margin-bottom: 16px; font-size: 50px; color: #fff; text-align: center; line-height: 55px; font-family: 'Roboto Condensed', sans-serif; } /* search form */ .search-form { background-color: rgba(255,255,255,0.6); padding: 30px 30px 20px 30px; border-radius: 6px; } .search-form input, .search-form select { background-color: #fff; border: 0px; border: 1px solid rgba(0,0,0,0.1); height: 55px; border-radius: 4px; font-size: 14px; color: #333; } /* =================================== 04. Partner =================================== */ .partner-area { background-color: #f5f5f5; } /* =================================== 05. Feature area =================================== */ .feature-box h3 { font-weight: 500; font-size: 20px; color: #000; font-family: 'Roboto Condensed', sans-serif; } .feature-box .icon { position: relative; display: inline-block; } .feature-box .icon:after { position: absolute; content: ""; width: 50px; height: 1px; background-color: rgba(0,0,0,0.2); right: -70px; top: 50%; transform: translateY(-50%); } .feature-box .icon img { width: 50px; } .feature-box p { margin-bottom: 0px; } /* =================================== 06. Category area =================================== */ .category-box { position: relative; } .category-box .category-box-img { position: relative; border-radius: 6px; overflow: hidden; } .category-box .category-box-img img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .category-box:hover .category-box-img img { transform: scale(1.1); } .category-box .category-box-img:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+90&0+0,0.8+74 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000', GradientType=0 ); /* IE6-9 */ } .category-box h3 { position: absolute; left: 15px; bottom: 15px; z-index: 3; line-height: 22px; } .category-box h3 a { color: #fff; font-weight: 500; position: relative; font-size: 20px; padding-left: 40px; font-family: 'Roboto Condensed', sans-serif; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .category-box h3:after { position: absolute; content: ""; width: 30px; height: 1px; background-color: rgba(255,255,255,0.2); left: 0px; top: 50%; transform: translateY(-50%); } .category-box:hover h3 a { color: #e82953; } .category-box .categories-numbers { position: absolute; right: 15px; top: 15px; background-color: #e82953; width: 35px; height: 35px; color: #fff; line-height: 35px; text-align: center; border-radius: 6px; font-size: 12px; z-index: 5; } /* =================================== 07. Subscribe area =================================== */ .subscribe-content h2 { font-weight: 500; font-size: 36px; color: #000; font-family: 'Roboto Condensed', sans-serif; } .subscribe-form input { height: 58px; border: 1px solid #e9e9e9; font-size: 14px; } /* =================================== 08. Recently event box =================================== */ .recently-event-box { border-radius: 6px; overflow: hidden; position: relative; background-color: rgba(0,0,0,0.1); border: 1px solid rgba(0,0,0,0.1); } .recently-event-box .recently-event-box-img { position: relative; border-radius: 6px; margin: 6px 6px 0px 6px; overflow: hidden; border: 1px solid rgba(255,255,255,0.1); } .recently-event-box .recently-event-box-img:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+90&0+0,0.8+74 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000', GradientType=0 ); /* IE6-9 */ } .recently-event-box .recently-event-box-img img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .recently-event-box:hover .recently-event-box-img img { transform: scale(1.1); } .recently-event-box .recently-event-des { padding: 15px; } .recently-event-box .recently-event-des .location { color: #333; font-size: 12px; } .recently-event-box .recently-event-box-img .posted-by { position: absolute; bottom: 10px; left: 10px; color: #fff; font-size: 12px; z-index: 4; } .recently-event-box h3 { line-height: 22px; margin-bottom: 6px; } .recently-event-box h3 a { color: #000; font-size: 18px; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .recently-event-box h3 a:hover { color: #e82953; } .recently-event-box .favorites-icon { position: absolute; right: 15px; top: 15px; background-color: rgba(255,255,255,0.6); width: 30px; height: 30px; color: #e82953; line-height: 32px; text-align: center; border-radius: 4px; font-size: 10px; z-index: 4; } .recently-event-box .favorites-icon:hover { color: #000; } .recently-event-box .recently-event-meta { display: flex; border-top: 1px solid rgba(255,255,255,0.1); align-items: center; background-color: #e82953; } .recently-event-box .recently-event-meta .meta-item:not(:last-child) { border-right: 1px solid rgba(255,255,255,0.1); } .recently-event-box .recently-event-meta .meta-item { padding: 10px 0px 10px 0px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; } .recently-event-box .recently-event-meta .meta-item .number, .recently-event-box .recently-event-meta .meta-item .name { font-size: 16px; color: #fff; font-weight: 400; } .recently-event-box .recently-event-meta .meta-item .name { font-size: 12px; display: block; color: #ccc; font-weight: 300; } .recently-event-box .recently-event-meta .meta-item .read-more { text-transform: capitalize; font-size: 11px; color: #fff; font-weight: 500; text-decoration: underline; } .recently-event-box .recently-event-meta .meta-item .read-more:hover { color: #000; } /* =================================== 09. How it work area =================================== */ .how-it-work-area { background-image: url(../image/how-it-work-bg.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; position: relative; z-index: 0; } .how-it-work-area:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgba(0,0,0,0.3); z-index: -1; } .how-it-work-box { border-radius: 6px; border: 1px solid rgba(255,255,255,0.2); background-color: rgba(0,0,0,0.7); padding: 25px; } .how-it-work-box .number { width: 40px; height: 40px; text-align: center; font-size: 16px; font-weight: 500; line-height: 40px; color: #fff; background-color: #e82953; border-radius: 4px; } .how-it-work-box h3 { color: #fff; font-size: 22px; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } .how-it-work-box p { color: #fff; } /* =================================== 10. Testimonial =================================== */ .testimonial-box { border-radius: 6px; background-color: #f5f5f5; padding: 25px; position: relative; margin-bottom: 8px; } .testimonial-box:after { position: absolute; content: ""; width: 96%; height: 100%; bottom: -8px; left: 0px; right: 0px; margin: auto; border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; z-index: -1; } .testimonial-box .author-img { margin-right: 10px; } .testimonial-box .author-img img { max-width: 70px; border: 4px solid rgba(0,0,0,0.1); border-radius: 100%; } .testimonial-box .profile-info { margin-bottom: 15px; position: relative; display: flex; align-items: center; } .testimonial-box .profile-info h3 { color: #000; padding-bottom: 6px; font-size: 18px; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } .testimonial-box p { color: #333; border-top: 1px dashed rgba(0,0,0,0.1); padding-top: 15px; margin-top: 15px; } .testimonial-box .star { font-size: 12px; color: #e82953; } .testimonial-box .profile-info span { color: #333; } .testimonial-box .profile-info .quote { position: absolute; top: 50%; right: 0px; color: #e82953; font-size: 50px; transform: translateY(-50%); } /* =================================== 11. Blog =================================== */ .blog-item { border: 1px solid rgba(0,0,0,0.1); overflow: hidden; border-radius: 6px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-item:hover { border: 1px solid #e82953; } .blog-item .blog-item-img { position: relative; } .blog-item .blog-item-img:before { position: absolute; content: ""; width: 94%; height: 94%; bottom: 0px; top: 0px; left: 0px; right: 0px; margin: auto; border: 1px solid rgba(255,255,255,0.3); border-radius: 6px; background-color: rgba(255,255,255,0.1); z-index: 2; } .blog-item .blog-item-img:after { position: absolute; content: ""; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; background-color: rgba(232,41,83,0.3); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-item .read-icon a { color: #fff; border: 0; border-radius: 0px; position: relative; padding: 8px 14px; font-size: 11px; text-align: center; z-index: 0; text-transform: uppercase; font-weight: 600; line-height: 22px; overflow: hidden; text-decoration: none; display: inline-block; background-color: #e82953; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-item .read-icon a:hover { color: #fff; text-decoration: none; background-color: #1a1a1a; } .blog-item-content { padding: 15px; position: relative; } .blog-item-content h6 { border-top: 1px dashed rgba(0,0,0,0.1); padding-top: 15px; margin-top: 15px; margin-bottom: 15px; } .blog-item-content h6 a { color: #000; font-size: 18px; font-weight: 500; line-height: 28px; font-family: 'Roboto Condensed', sans-serif; display: inline-block; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-item-content h6 a:hover { color: #e82953; } .blog-item-content ul li a { color: #333; font-size: 12px; font-weight: 400; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-item-content ul li a:hover { color: #e82953; } .blog-item:hover .blog-item-img:after, .blog-item:hover .blog-item-img .read-icon { opacity: 1; } /* sidebar widget */ .sidebar-widget { border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; overflow: hidden; } /* widget title */ .sidebar-widget .sidebar-widget-title { font-size: 18px; color: #fff; background-color: #e82953; position: relative; padding: 16px 20px; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } /* sidebar search */ .sidebar-search { position: relative; } .sidebar-search input { position: relative; display: block; background-color: rgba(255,255,255,0.1); border: 0px; color: #828282; font-size: 15px; font-weight: 400; height: 60px; width: 100%; border-radius: 6px; padding-left: 20px; padding-right: 65px; transition: all 500ms ease 0s; } .sidebar-search button { position: absolute; top: 50%; right: 0px; border: 0px; transform: translateY(-50%); font-size: 12px; height: 100%; width: 50px; text-align: center; line-height: 50px; color: #e82953; background-color: transparent; } /* recent post */ .sidebar-recent-post { padding: 15px; } .sidebar-recent-post li { display: block; border-bottom: 1px dashed rgba(0,0,0,0.1); margin: 0px 0px 15px 0px; padding: 0px 0px 15px 0px; display: flex; align-items: center; } .sidebar-recent-post li .recent-post-img { margin-right: 12px; float: left; } .sidebar-recent-post li .recent-post-img img { border-radius: 6px; } .sidebar-recent-post li:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .sidebar-recent-post li .post-date { color: #e82953; display: inline-block; font-size: 10px; } .sidebar-recent-post li .post-title { font-size: 14px; line-height: 20px; font-weight: 500; } .sidebar-recent-post li .post-title a { color: #000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sidebar-recent-post li .post-title a:hover { color: #e82953; } /* popular tag */ .popular-tag { padding: 15px; } .popular-tag li { display: inline-block; margin: 2px; } .popular-tag li a { display: inline-block; background-color: #f5f5f5; border-radius: 4px; padding: 4px 10px; color: #000; font-size: 12px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .popular-tag li a:hover { color: #fff; background-color: #e82953; } /* blog post */ .blog-post-img img { border-radius: 6px; } .blog-post-content h6 { color: #000; font-size: 26px; display: inline-block; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } .blog-post-feature li { margin-bottom: 12px; color: #ccc; font-size: 14px; text-transform: capitalize; } .blog-post-feature li:last-child { margin-bottom: 0px; } .blog-post-feature li i { font-size: 10px; color: #e82953; padding-right: 4px; } /* blog post meta */ .blog-post-content .heightlight-text { font-size: 18px; line-height: 28px; color: #333; } .blog-post-meta { position: relative; } .blog-post-meta li { position: relative; margin-right: 20px !important; } .blog-post-meta li:last-child { margin-right: 0px !important; } .blog-post-meta li a { color: #333; font-size: 12px; font-weight: 500; } .blog-post-meta li a:hover { color: #e82953; } .blog-post-meta li:after { position: absolute; content: "/"; border-radius: 100%; top: 50%; transform: translateY(-50%); right: -15px; font-size: 10px; } .blog-post-meta li:last-child:after { display: none; } /* single tag */ .blog-single-tag li:first-child { font-weight: 600; font-size: 14px; color: #e82953; } .blog-single-tag li a { color: #000; font-size: 14px; } .blog-single-tag li a:hover { color: #e82953; } .blog-single-social li:first-child { font-weight: 600; font-size: 14px; color: #e82953; } .blog-single-social li a { color: #000; font-size: 14px; } .blog-single-social li a:hover { color: #e82953; } /* comments block */ .blog-post-subtitle { color: #e82953; font-weight: 500; font-size: 24px; display: inline-block; } /* leave a comments block */ .leave-reply-form input { background-color: rgba(232,41,83,0.1); border: 1px solid rgba(0,0,0,0.1); height: 55px; border-radius: 6px; font-size: 14px; color: #000; } .leave-reply-form textarea { background-color: rgba(232,41,83,0.1); border: 1px solid rgba(0,0,0,0.1); padding: 20px; border-radius: 6px; font-size: 14px; color: #000; } .leave-reply-form input:focus, .leave-reply-form textarea:focus { background-color: rgba(232,41,83,0.1); border: 1px solid #e82953 !important; color: #000; box-shadow: none; } /* =================================== 12. Footer =================================== */ .footer-main { background-color: #eee; } /* footer title */ .footer-title { font-size: 22px; color: #000; margin-bottom: 15px; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } /* footer link */ .footer-link li { margin-bottom: 10px; } .footer-link li:last-child { margin-bottom: 0px; } .footer-link li a { color: #000; font-size: 14px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .footer-link li a:hover { color: #e82953; } .footer-link li i { margin-right: 6px; } /* footer address */ .footer-address li { margin-bottom: 10px; color: #000; font-size: 14px; } .footer-address li:last-child { margin-bottom: 0px; } .footer-address li a { color: #000; font-size: 14px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .footer-address li a:hover { color: #e82953; } .footer-address li i { margin-right: 6px; color: #e82953; } /* footer recent post */ .footer-recent-post li { border-bottom: 1px dashed rgba(0,0,0,0.1); margin: 0px 0px 10px 0px; padding: 0px 0px 10px 0px; } .footer-recent-post li:last-child { border-bottom: none; padding-bottom: 0px; margin-bottom: 0px; } .footer-recent-post li .post-date { color: #e82953; display: inline-block; font-size: 10px; } .footer-recent-post li .recent-post-des { margin-right: 12px; } .footer-recent-post li .post-title { font-size: 14px; line-height: 22px; font-weight: 500; margin-bottom: 4px; } .footer-recent-post li .post-title a { color: #000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .footer-recent-post li .post-title a:hover { color: #e82953; } /* footer social */ .footer-social a { display: inline-block; font-size: 12px; border-radius: 4px; height: 30px; line-height: 30px; position: relative; text-align: center; width: 30px; color: #fff; background-color: #000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .footer-social a:hover { background-color: #e82953; } /* footer copyright */ .footer-copyright { padding: 15px 0; position: relative; background-image: url(../image/footer-bg.jpg); background-repeat: no-repeat; background-position: center bottom; background-size: cover; z-index: 0; } .footer-copyright:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgba(232,41,83,0.8); z-index: -1; } .footer-copyright p { color: #fff; font-size: 14px; } /* =================================== 13. Inner page header =================================== */ .inner-page-header-bg { background-image: url(../image/inner-page-header-bg.jpg); background-position: center top; background-repeat: no-repeat; position: relative; z-index: 0; background-size: cover; text-align: center; } .inner-page-header-bg:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0px; top: 0px; background-color: rgba(0,0,0,0.6); z-index: -1; } .inner-page-title-c { display: inline-block; background-color: #fff; padding: 15px 25px; position: relative; margin: auto; } .inner-page-title-c:after { position: absolute; content: ""; width: 80px; height: 2px; left: 0px; right: 0px; margin: auto; top: 0px; background-color: #e82953; z-index: 0; } .inner-page-title { padding: 100px 0; } .inner-page-title h1 { color: #000; font-size: 40px; display: inline-block; position: relative; font-weight: 500; font-family: 'Roboto Condensed', sans-serif; } /* breadcrumb */ .breadcrumb-box { padding: 0; } .breadcrumb-box .breadcrumb { margin: auto; display: inline-block; } .breadcrumb-box .breadcrumb li { display: inline-block; color: #333; font-size: 14px; } .breadcrumb-box .breadcrumb li a { color: #e82953; } /* =================================== 14. About area =================================== */ .about-text h4 { color: #e82953; font-size: 12px; font-weight: 500; text-transform: uppercase; margin-bottom: 15px; } .about-text h2 { font-size: 40px; line-height: 50px; font-weight: 400; color: #000; } .heilight-text { border-top: 1px dashed rgba(0,0,0,0.2); border-bottom: 1px dashed rgba(0,0,0,0.2); padding: 15px 0px; font-style: italic; } .about-text ul li { margin-bottom: 12px; color: #333; font-size: 14px; text-transform: capitalize; } .about-text ul li:last-child { margin-bottom: 0px; } .about-text ul li i { font-size: 14px; color: #e82953; padding-right: 4px; } .about-img { border-radius: 6px; overflow: hidden; position: relative; } .about-img:before { position: absolute; content: ""; width: 94%; height: 94%; bottom: 0px; top: 0px; left: 0px; right: 0px; margin: auto; border: 1px solid rgba(255,255,255,0.3); border-radius: 6px; background-color: rgba(255,255,255,0.1); z-index: 2; } /* =================================== 15. Search results =================================== */ .sidebar-filter-box { background-color: #f5f5f5; border: 1px solid rgba(0,0,0,0.1); padding: 15px; border-radius: 6px; } .sidebar-filter-box .title { font-size: 20px; color: #000; margin-bottom: 10px; font-family: 'Roboto Condensed', sans-serif; font-weight: 500; } /* sidebar search */ .sidebar-search { position: relative; } .sidebar-search input { position: relative; display: block; background-color: #f5f5f5; border: 1px solid #e82953; color: #000; font-size: 15px; font-weight: 400; height: 60px; width: 100%; border-radius: 6px; padding-left: 20px; padding-right: 65px; } .sidebar-search button { position: absolute; top: 50%; right: 0px; border: 0px; transform: translateY(-50%); font-size: 12px; height: 100%; border-left: 1px solid rgba(0,0,0,0.1); width: 50px; text-align: center; line-height: 50px; color: #e82953; background-color: transparent; } /* sidebar categories */ .sidebar-categories { padding: 0px; } .sidebar-categories li { padding: 14px 12px; border-bottom: 1px dashed rgba(0,0,0,0.1); } .sidebar-categories li:last-child { border-bottom: 0px; } .sidebar-categories li a { color: #000; font-size: 12px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .sidebar-categories li a:hover, .sidebar-categories li.active a { color: #e82953; } .sidebar-categories li a i { padding-right: 4px; font-size: 12px; } /* sidebar location */ .sidebar-filter-box select { position: relative; display: block; font-size: 14px; font-weight: 400; height: 60px; width: 100%; border-radius: 6px; border: 0; padding-left: 20px; padding-right: 65px; } /* listing box */ .listing-box { position: relative; background-color: #f5f5f5; border: 1px solid rgba(0,0,0,0.1); margin-bottom: 20px; border-radius: 6px; padding: 10px 10px 0px 10px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .listing-box:hover { border: 1px solid #e82953; } .listing-box .listing-box-des h4 { font-weight: 500; margin-bottom: 10px; font-size: 22px; font-family: 'Roboto Condensed', sans-serif; } .listing-box .listing-box-des h4 a { color: #000; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .listing-box .listing-box-des h4 a:hover { color: #e82953; } .listing-box .listing-box-des .star-div { font-size: 12px; color: #e82953; } .listing-box .listing-box-des .star-div span { color: #fff; } .listing-box .listing-box-des .location { color: #333; font-size: 14px; } .listing-box .listing-box-des .location i { color: #e82953; } .listbox-img { position: relative; } .listbox-img img { border-radius: 6px; } .listbox-img .add-favorites-btn { position: absolute; top: 10px; left: 10px; color: #e82953; font-size: 16px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .listbox-img .add-favorites-btn:hover { color: #e82953; } /* request pricing Modal */ .request-pricing-form input[type=text], .request-pricing-form input[type=email], .request-pricing-form input[type=password], .request-pricing-form select, .request-pricing-form input[type=date], .request-pricing-form input[type=file], .request-pricing-form input[type=number], .request-pricing-form input[type=search], .request-pricing-form input[type=tel], .request-pricing-form input[type=time] { background-color: #f5f5f5; border: 1px solid #e9e9e9; height: 45px; font-size: 12px; } .request-pricing-form textarea { background-color: #f5f5f5; border: 1px solid #e9e9e9; font-size: 12px; } .request-pricing-form .form-label { color: #000; font-weight: 600; font-size: 12px; } /* pagination */ .pagination-box .page-item .page-link { color: #000; font-size: 13px; background-color: #f5f5f5; border: 1px solid rgba(0,0,0,0.1); } .pagination-box .page-item.active .page-link { z-index: 3; color: #fff; background-color: #e82953; } /* =================================== 16. Event details =================================== */ .details-page-bammer { position: relative; } .details-page-bammer-carousel .owl-item .item { position: relative; } .details-page-bammer-carousel .owl-item .item:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0px; top: 0px; background-color: rgba(0,0,0,0.7); z-index: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .details-page-bammer-carousel .owl-item.center .item:after { background-color: rgba(0,0,0,0.4); } /* details page bammer caption */ .details-page-bammer-caption { position: absolute; top: 50%; width: 100%; left: 0px; transform: translateY(-50%); z-index: 1; } .details-page-bammer-caption-c { text-align: center; background-color: rgba(0,0,0,0.6); padding: 20px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.3); } .details-page-bammer-caption-c h1 { color: #fff; font-size: 32px; font-family: 'Roboto Condensed', sans-serif; font-weight: 500; margin-bottom: 10px; } .details-page-bammer-caption-c .location { color: #fff; font-size: 12px; font-weight: 500; margin-bottom: 10px; } .details-page-bammer-caption-c .event-capacity, .details-page-bammer-caption-c .event-capacity a { color: #fff; font-size: 12px; font-weight: 500; } .details-page-bammer-caption-c .event-capacity a { color: #e82953; } /* details page btn */ .details-page-btn li { display: inline-block; } .details-page-btn li a { display: inline-block; background-color: #e6e3f4; padding: 8px 16px; font-size: 12px; color: #000; font-weight: 500; border-radius: 4px; margin-bottom: 6px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .details-page-btn li a:hover { background-color: #e82953; color: #fff; } /* details page content box */ .details-page-content-box h2 { font-family: 'Roboto Condensed', sans-serif; font-weight: 500; color: #e82953; font-size: 28px; margin-bottom: 15px; } .details-page-content-box ul.list li { margin-bottom: 12px; color: #333; font-size: 14px; text-transform: capitalize; } .details-page-content-box ul.list li:last-child { margin-bottom: 0px; } .details-page-content-box ul.list li i { font-size: 14px; color: #e82953; padding-right: 4px; } /* summary box */ .summary-box { padding: 20px; border-radius: 6px; overflow: hidden; background-image: url(../image/summary-box-bg.jpg); background-position: center top; background-repeat: no-repeat; position: relative; z-index: 0; background-size: cover; } .summary-box:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0px; top: 0px; background-color: rgba(0,0,0,0.8); z-index: -1; } .summary-box h4 { font-family: 'Roboto Condensed', sans-serif; color: #fff; font-size: 18px; line-height: 24px; font-weight: 500; } .summary-box ul li h5 { font-size: 12px; color: #e82953; } .summary-box ul li p { margin-bottom: 0px; color: #fff; } .summary-box ul li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dashed rgba(255,255,255,0.2); } /* destination place */ .destination-place { padding-bottom: 10px; margin-bottom: 10px; } /* best price */ .best-price { border-top: 1px solid rgba(0,0,0,0.1); padding-top: 10px; margin-top: 10px; } .side-price { color: #e82953; font-size: 24px; font-weight: 600; } .total-price { border-top: 1px solid rgba(0,0,0,0.1); padding-top: 10px; display: flex; align-items: center; margin-bottom: 0px !important; } .total-price h5 { color: #000 !important; font-size: 20px !important; } .total-price p { color: #98ce44 !important; font-weight: 600; font-size: 20px !important; } /* =================================== 17. Gallery =================================== */ .gallery-box { position: relative; } .gallery-box .gallery-box-img { position: relative; border-radius: 6px; overflow: hidden; } .gallery-box .gallery-box-img img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .gallery-box:hover .gallery-box-img img { transform: scale(1.1); } .gallery-box .gallery-box-img:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+90&0+0,0.8+74 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000', GradientType=0 ); /* IE6-9 */ } .gallery-box h3 { position: absolute; left: 15px; bottom: 15px; z-index: 3; font-family: 'Roboto Condensed', sans-serif; line-height: 22px; } .gallery-box h3 a { color: #fff; font-weight: 500; position: relative; font-size: 20px; padding-left: 20px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .gallery-box h3:after { position: absolute; font-family: bootstrap-icons; content: "\F52A"; font-size: 12px; color: #fff; left: 0px; top: 50%; transform: translateY(-50%); } .gallery-box:hover h3 a { color: #e82953; } .gallery-box .gallery-numbers { position: absolute; right: 15px; top: 15px; background-color: #e82953; width: 35px; height: 35px; color: #fff; line-height: 35px; text-align: center; border-radius: 6px; font-size: 12px; z-index: 5; } /* =================================== 18. Video =================================== */ .video-box { border-radius: 6px; overflow: hidden; position: relative; display: inline-block; } .video-box .icon { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); color: #fff; font-size: 40px; z-index: 2; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .video-box:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; background-color: rgba(0,0,0,0.4); z-index: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* =================================== 19. Team =================================== */ .team-item { overflow: hidden; position: relative; border-radius: 6px; } .team-item .image { overflow: hidden; position: relative; } .team-item .image img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-item:hover .image img { transform: scale(1.1); } .team-item .image:after { position: absolute; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; opacity: 0.5; z-index: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+90&0+0,0.8+74 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 74%, rgba(0,0,0,0.8) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000', GradientType=0 ); /* IE6-9 */ -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-item .team-item-caption { position: absolute; bottom: 15px; left: 15px; right: 15px; text-align: right; z-index: 2; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-item .team-item-caption p { color: #fff; font-size: 12px; } .team-item .team-item-caption h4 { font-size: 16px; letter-spacing: 1px; text-transform: capitalize; font-weight: 500; color: #fff; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-social { background-color: #e9eef3; opacity: 1; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-social li { display: inline-block; } .team-social li a { color: #333; padding: 14px 14px; display: block; text-align: center; width: 100%; font-size: 14px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .team-social li:last-child a { border-bottom: 0px; } .team-social li a:hover, .team-item:hover .team-item-caption h4 { color: #e82953; } .team-item:hover .overlay, .team-item:hover .team-social, .team-item:hover:after { opacity: 1; } /* =================================== 20. Faq =================================== */ .faq-box { border: 1px solid rgba(0,0,0,0.1); padding: 10px 30px 10px 30px; border-radius: 6px; } .faq-box .accordion-item .accordion-header .accordion-button { color: #e82953 !important; padding: 20px 0px !important; border-bottom: 0; font-size: 14px; border-radius: 0px; background-color: transparent; text-transform: capitalize; font-weight: 500; position: relative; text-align: left; box-shadow: none; } .faq-box .accordion-item .accordion-header .accordion-button span { margin-left: auto; font-weight: 600; } .faq-box .accordion-item .accordion-header .accordion-button.collapsed span { color: #e82953; font-weight: 600; } .faq-box .accordion-item .accordion-header .accordion-button.collapsed:after, .faq-box .accordion-item .accordion-header .accordion-button:after { display: none; } .faq-box .accordion-item .accordion-header .accordion-button { display: flex; } .faq-box .accordion-item .accordion-header .accordion-button i { font-size: 14px; margin-right: 10px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .faq-box .accordion-item .accordion-header .accordion-button[aria-expanded=true] i { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .faq-box .accordion-item .accordion-header .accordion-button:focus { border-color: transparent; box-shadow: none; } .faq-box .accordion-item .accordion-header { padding: 0px; border-bottom: 0; margin-bottom: 0px; background-color: transparent; } .faq-box .accordion-item .accordion-header .accordion-button.collapsed { color: #000 !important; padding: 20px 0px !important; font-size: 14px; background-color: transparent; text-transform: capitalize; font-weight: 500; } .faq-box .accordion-item { background-color: transparent; border-radius: 0px !important; border-bottom: 1px solid rgba(0,0,0,0.2); overflow: hidden; border-left: 0; border-right: 0; border-top: 0; } .faq-box .accordion-item:last-child { border-bottom: 0px; } .faq-box .accordion-item .accordion-body { line-height: 24px; padding: 20px; margin-bottom: 20px; color: #333; background-color: #f5f5f5; margin-top: 1px; border-left: 1px solid rgba(0,0,0,0.2); } /* =================================== 21. Comments block =================================== */ .comments-block ul li { width: 100%; margin-bottom: 30px; } .comments-block ul li:last-child { margin-bottom: 0px; padding-bottom: 0px; border-bottom: 0px; } .comments-block ul li ul { margin-top: 30px; margin-left: 30px; } .comments-block ul li .d-flex .flex-shrink-0 { position: relative; } .comments-block ul li .d-flex .flex-grow-1 { border-left: 2px solid #e82953; padding-left: 20px; } .comments-block ul li .d-flex .flex-shrink-0 img { border-radius: 6px; } .comments-block ul li ul li:last-child { margin-bottom: 0px !important; } .comments-block ul li h5 { font-size: 18px; color: #000; font-weight: 500; margin-bottom: 4px; } .comments-block ul li h5 small { font-size: 11px; color: #e82953; width: 100%; display: inline-block; } .comments-block ul li .d-flex .flex-shrink-0:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0px; border-radius: 6px; top: 0px; background-color: rgba(0,0,0,0.8); z-index: 0; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .comments-block ul li p { margin-bottom: 0px; } .comments-block ul li a.reply { position: absolute; top: 50%; left: 50%; transform: translate(-50%); color: #e82953; font-size: 12px; text-transform: uppercase; font-weight: 600; z-index: 2; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .comments-block ul li .d-flex:hover a.reply, .comments-block ul li .d-flex:hover .flex-shrink-0:after { opacity: 1; } /* =================================== 22. Contact us =================================== */ .contact-img img { border-radius: 6px; } .contact-box { margin-bottom: 22px; } .contact-box:last-child { margin-bottom: 0px; } .contact-box .icon { font-size: 20px; margin-bottom: 6px; color: #e82953; display: inline-block; } .contact-box h4 { line-height: 22px; color: #000; font-size: 18px; font-weight: 500; display: inline-block; margin-left: 10px; } .contact-box p { font-size: 14px; margin-bottom: 0px; color: #333; width: 100%; display: inline-block; } .contact-form-map { background-color: #111; } /* contact form */ .contact-form input { background-color: rgba(232,41,83,0.1); border: 1px solid rgba(0,0,0,0.1); height: 55px; border-radius: 6px; font-size: 14px; color: #000; } .contact-form textarea { background-color: rgba(232,41,83,0.1); border: 1px solid rgba(0,0,0,0.1); padding: 20px; border-radius: 6px; font-size: 14px; color: #000; } .contact-form input:focus, .contact-form textarea:focus { background-color: rgba(232,41,83,0.1); border: 1px solid #e82953 !important; color: #000; box-shadow: none; } .help-block ul { color: #842029; background-color: #f8d7da; border-color: #f5c2c7; padding: 10px; border-radius: 4px; } /* map */ .map-box iframe { width: 100%; border: 0px; height: 400px; border-radius: 6px; overflow: hidden; } /* =================================== 23. Login and Register =================================== */ .form-signin { padding: 30px; border-radius: 6px; overflow: hidden; background-image: url(../image/login-bg.jpg); background-position: center top; background-repeat: no-repeat; position: relative; z-index: 0; background-size: cover; } .form-signin:after { position: absolute; content: ""; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0,0,0,0.8); z-index: -1; } .form-signin input { background-color: rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.3); height: 55px; border-radius: 6px; font-size: 14px; color: #fff; } .form-signin input:focus { background-color: rgba(0,0,0,0.4); border: 1px solid #e82953 !important; color: #fff; box-shadow: none; } .form-signin label { font-size: 12px; color: #000; } .form-signin .form-check { margin-bottom: 0px; } .form-signin .form-check a { color: #fff; font-weight: 600; } .form-signin .form-check-input { width: 16px; height: 16px; } .form-signin .form-check-label { padding-left: 6px; font-size: 12px; color: #fff; } .form-signin .forgot-pass a { font-size: 14px; color: #fff; font-weight: 600; } .form-signin .no-account { font-size: 12px; } .form-signin .no-account a { color: #000; font-weight: 600; } .login-img img { border-radius: 6px; } /* =================================== 24. Error page 404 =================================== */ .error-page-item h2 { margin-bottom: 12px; font-weight: 500; font-size: 26px; color: #000; } .big-text { font-family: 'Roboto Condensed', sans-serif; font-size: 120px; color: #000; font-weight: 600; }