/* ----------------------------------------------------------------------------------- 01. General style 02. Preloader style 03. Selection style 04. Owl-Theme custom style 05. Section style 06. Navbar style 07. Header style 08. Slider style 09. Content Lines style 10. Page Header style 11. About style 12. Team style 13. Team Details style 14. Accordion Box (for Faqs) style 15. Position style 16. Projects style 17. Services style 18. Project Video style 19. Testimonials style 20. Gallery style 21. Blog style 22. Post style 23. Contact style 24. Buttons style 25. Footer style 26. toTop Button style 27. Error Page 404 style 28. Responsive (Media Query) 29. Overlay Effect Bg image ----------------------------------------------------------------------------------- */ /* ======= General style ======= */ html, body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; font-smoothing: antialiased; } * { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; outline: none; list-style: none; word-wrap: break-word; } body { font-family: 'Didact Gothic', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.75em; color: #999; overflow-x: hidden !important; background: #1e1e1e; } p { font-family: 'Didact Gothic', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.75em; color: #999; margin-bottom: 20px; letter-spacing: 0.25px; } h1, h2, h3, h4, h5, h6 { font-family: 'Oswald', sans-serif; font-weight: 400; line-height: 1.25em; margin: 0 0 20px 0; color: #fff; } h1 { font-size: 60px; } h2 { font-size: 55px } h3 { font-size: 50px; } h4 { font-size: 45px; } h5 { font-size: 30px; } h6 { font-size: 20px; } img { width: 100%; height: auto; } img { -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; color: #252525; } span, a, a:hover { display: inline-block; text-decoration: none; color: inherit; } b { font-weight: 400; color: #b19777; } .mb-15 { margin-bottom: 15px; } .mb-20 { margin-bottom: 20px; } .mb-30 { margin-bottom: 30px; } .mb-60 { margin-bottom: 60px; } .mb-90 { margin-bottom: 90px; } .mb-120 { margin-bottom: 120px; } .mt-20 { margin-top: 20px; } .mt-30 { margin-top: 30px; } .mt-60 { margin-top: 60px; } .mt-90 { margin-top: 90px; } .mt-120 { margin-top: 120px; } /* text field */ button, input, optgroup, select, textarea { font-family: 'Didact Gothic', sans-serif; } input[type="password"]:focus, input[type="email"]:focus, input[type="text"]:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus, textarea:focus { outline: none; } input[type="password"], input[type="email"], input[type="text"], input[type="file"], textarea { max-width: 100%; margin-bottom: 10px; padding: 10px 0; height: auto; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; border-width: 0 0 1px; border-style: solid; display: block; width: 100%; line-height: 1.5em; font-family: 'Didact Gothic', sans-serif; font-size: 15px; font-weight: 400; color: #999; background-image: none; border-bottom: 1px solid #252525; border-color: ease-in-out .15s, box-shadow ease-in-out .15s; } input:focus, textarea:focus { border-bottom-width: 1px; border-color: #b19777; } /* submit and alert success */ input[type="submit"], input[type="reset"], input[type="button"], button { text-shadow: none; -webkit-box-shadow: none; box-shadow: none; line-height: 1.75em; -webkit-transition: background-color .15s ease-out; transition: background-color .15s ease-out; background: #b19777; border: 1px solid transparent; } input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover { background-color: #323232; color: #fff; border: 1px solid transparent; } input[type="submit"] { font-weight: 300; font-family: 'Oswald', sans-serif; text-transform: uppercase; background: #b19777; color: #fff; padding: 8px 24px; margin: 0; position: relative; font-size: 15px; letter-spacing: 2px; } .alert-success { background: transparent; color: #999; border: 1px solid #b19777; border-radius: 0px; } select { padding: 10px; border-radius: 5px; } th, tr, td { padding: 10px 0; } input[type="radio"], input[type="checkbox"] { display: inline; } hr { margin: 0px; border: 0; border-top: 1px solid #252525; } /* placeholder */ ::-webkit-input-placeholder { color: #999; font-size: 15px; font-weight: 400; } :-moz-placeholder { color: #999; } ::-moz-placeholder { color: #999; opacity: 1; } :-ms-input-placeholder { color: #999; } /* important style */ .o-hidden { overflow: hidden; } .position-re { position: relative; } .full-width { width: 100%; } .bg-img { background-size: cover; background-repeat: no-repeat; background-position: center; } .bg-img2 { background-size: contain; background-repeat: no-repeat; background-position: left; } .bg-fixed { background-attachment: fixed; } .pattern { background-repeat: repeat; background-size: auto; } .bold { font-weight: 500; } .count { font-family: 'Didact Gothic', sans-serif; } .valign { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .v-middle { position: absolute; width: 100%; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); } .v-bottom { position: absolute; width: 100%; bottom: 5%; left: 0; -webkit-transform: translate(0%, -5%); transform: translate(0%, -5%); } .js .animate-box { opacity: 0; } :root { scroll-behavior: auto; } .line-vr-section { position: relative; margin: -37px auto; border: 0; border-left: 1px solid; border-color: #b19777; width: 2px; height: 75px; z-index: 10; } /* ======= Preloader style ======= */ .preloader-bg, #preloader { position: fixed; width: 100%; height: 100%; overflow: hidden; background: #1e1e1e; z-index: 999999; } #preloader { display: table; table-layout: fixed; } #preloader-status { display: table-cell; vertical-align: middle; } .preloader-position { position: relative; margin: 0 auto; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .loader { position: relative; width: 55px; height: 55px; left: 50%; top: auto; margin-left: -22px; margin-top: 2px; -webkit-animation: rotate 1s infinite linear; -moz-animation: rotate 1s infinite linear; -ms-animation: rotate 1s infinite linear; -o-animation: rotate 1s infinite linear; animation: rotate 1s infinite linear; border: 2px solid #252525; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .loader span { position: absolute; width: 55px; height: 55px; top: -2px; left: -2px; border: 2px solid transparent; border-top: 2px solid #b19777; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } @-webkit-keyframes rotate { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* ======= Selection style ======= */ ::-webkit-selection { color: #fff; background: rgba(102, 102, 102, 0.1); } ::-moz-selection { color: #fff; background: rgba(102, 102, 102, 0.1); } ::selection { color: #fff; background: rgba(102, 102, 102, 0.1); } /* ======= Owl-Theme custom style ======= */ .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 15px; line-height: .7; display: block; } .owl-theme .owl-dots .owl-dot span { width: 9px; height: 9px; margin: 0 3px; border-radius: 50%; background: transparent; border: 1px solid #444; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #b19777; border: 2px solid #b19777; } .owl-carousel .owl-nav button.owl-next,  .owl-carousel .owl-nav button.owl-prev,  .owl-carousel button.owl-dot {     outline: none; } /* ======= Section style ======= */ .section-padding { padding: 120px 0; } .section-padding2 { padding: 0 0 120px 0; position: relative; } .section-title { text-transform: uppercase; font-size: 45px; line-height: 1.25em; letter-spacing: 3px; font-family: 'Oswald', sans-serif; color: #fff; position: relative; margin-bottom: 20px; } .section-subtitle { color: #b19777; font-family: 'Oswald', sans-serif; font-weight: 300; margin-bottom: 5px; align-items: center; display: inline-flex; letter-spacing: 5px; font-size: 16px; text-transform: uppercase; } .section-number { font-family: 'Oswald', sans-serif; color: transparent; -webkit-text-stroke: 1px #333; opacity: .8; font-weight: 700; font-size: 85px; line-height: 80px; position: absolute; right: 20px; z-index: -1; text-transform: uppercase; } .banner-img:after { position: absolute; height: 100%; right: 0; left: 0; content: ""; background: -webkit-linear-gradient(bottom, rgba(30, 30, 30, 1) 0%, rgba(30, 30, 30, .8) 100%, rgba(30, 30, 30, 0.5) 100%); background: linear-gradient(to top, rgba(30, 30, 30, 1) 0%, rgba(30, 30, 30, 0.8) 100%, rgba(30, 30, 30, 0.5) 100%); object-fit: cover; } @media screen and (max-width: 767px) { .section-number { display: none; } } /* ======= Navbar style ======= */ .navbar { position: absolute; left: 0; top: 0; width: 100%; background: transparent; z-index: 99; padding-right: 0; padding-left: 0; padding-top: 0; padding-bottom: 0; height: 225px; border: none; border-bottom: 1px solid rgba(255, 255, 255, 0.05); } .navbar-toggler-icon { background-image: none; } .navbar .navbar-toggler-icon, .navbar .icon-bar { color: #FFF; } .navbar .navbar-nav .nav-link { font-size: 15px; font-weight: 300; letter-spacing: 3px; text-transform: uppercase; color: #fff; margin: 1px; -webkit-transition: all .4s; transition: all .4s; padding-right: 12px; padding-left: 12px; font-family: 'Oswald', sans-serif; } .navbar .navbar-nav .nav-link.nav-color { color: #fff; } .navbar .navbar-nav .nav-link:hover { color: #b19777; } .navbar .navbar-nav .active { color: #b19777 !important; } .navbar .navbar-nav .active i { color: #b19777; } .nav-scroll { background: #1e1e1e; padding: 0 0 0 0; position: static; top: -100px; left: 0; width: 100%; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; -webkit-transform: translateY(100px); transform: none; border: none; border-bottom: 1px solid #252525; height: 90px; } .nav-scroll .navbar-toggler-icon, .nav-scroll .icon-bar { color: #b19777; } .nav-scroll .navbar-nav .nav-link { color: #fff; } .nav-scroll .navbar-nav .active { color: #b19777 !important; } .nav-scroll .navbar-nav .logo { padding: 15px 0; color: #fff; } .nav-scroll .logo-img { width: 131px; height: 140px; } .nav-scroll .logo-img { margin-bottom: 5px; margin-top: 5px; } .nav-scroll .logo-wrapper .logo h2 { font-family: 'Oswald', sans-serif; font-size: 30px; font-weight: 500; display: block; width: 100%; position: relative; color: #fff; margin-bottom: 0; text-transform: uppercase; letter-spacing: 3px; } .nav-scroll .logo-wrapper .logo span { display: block; font-family: 'Oswald', sans-serif; font-size: 16px; color: #fff; font-weight: 300; letter-spacing: 7.4px; display: block; margin-top: 2px; line-height: 1.2em; text-transform: uppercase; } .nav-scroll .logo-wrapper {} .logo-wrapper { float: left; } .logo-wrapper .logo h2 { font-family: 'Oswald', sans-serif; font-size: 30px; font-weight: 500; display: block; width: 100%; position: relative; color: #fff; margin-bottom: 0; text-transform: uppercase; letter-spacing: 3px; } .logo-wrapper .logo h2 a i { color: #fff; font-size: 20px; vertical-align: super; } .logo-wrapper .logo span { display: block; font-family: 'Oswald', sans-serif; font-size: 16px; color: #fff; font-weight: 300; letter-spacing: 7.4px; display: block; margin-top: 2px; line-height: 1.2em; text-transform: uppercase; } .logo { padding-top: 10; } .logo-img { padding: 0px 0; width: 189px; height: 202px; text-align: center; } .dropdown .nav-link i { padding-left: 0px; font-size: 8px; color: rgba(255, 255, 255, 0.5); } .navbar .dropdown-menu .dropdown-item { padding: 8px 0; font-family: 'Didact Gothic', sans-serif; font-size: 15px; font-weight: 400; color: #fff; position: relative; -webkit-transition: all .4s; transition: all .4s; background-color: transparent; } .navbar .dropdown-menu .dropdown-item span { display: block; cursor: pointer; } .navbar .dropdown-menu .dropdown-item i { padding: 13px 0 0 5px; font-size: 8px; float: right; } .navbar .dropdown-menu .dropdown:hover > .dropdown-item, .navbar .dropdown-menu .dropdown-item.active, .navbar .dropdown-menu .dropdown-item:hover { color: #b19777; } .navbar .dropdown-toggle::after { display: none; } .navbar .dropdown-menu li { border-bottom: 1px solid rgba(255, 255, 255, 0.02); } .navbar .dropdown-menu li:last-child { border-bottom: none; } .navbar .dropdown-menu .dropdown-menu.pull-left { top: 0; left: auto; right: 100%; } /* Navbar Media Query */ @media screen and (min-width: 992px) { .navbar .dropdown-menu { display: block; opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); transform: translateY(20px); width: 199px; padding: 15px; border-radius: 0; border: 0; background-color: #1e1e1e; -webkit-transition: all .3s; transition: all .3s; } .navbar .dropdown-menu .dropdown-menu { left: calc(100% + 5px); top: -10px; right: auto; min-width: 199px; transform: translateY(0); } .navbar .dropdown:hover > .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); } } @media screen and (max-width: 991px) { .navbar { padding-left: 0px; padding-right: 0px; background: transparent; padding-top: 0px; padding-bottom: 0px; } .nav-scroll { background: #1e1e1e; } .logo-wrapper { float: left; padding: 31px 0 31px 15px; } .nav-scroll .logo-wrapper { padding: 26px 15px; background-color: transparent; } .nav-scroll .logo-img { width: 200px; } .navbar .logo { text-align: left; margin-left: 0px; } .nav-scroll .logo {} .logo-img { margin-bottom: 0px; width: 200px; padding: 0; } .navbar button { margin-right: 0px; outline: none !important; background: transparent; margin-top: 10px; border: none; } .navbar button:hover { background: transparent; } .navbar button:active, .navbar button:focus, .navbar button:hover { background: transparent; outline: none; color: transparent !important; } .navbar .container { max-width: 100%; padding: 0; background-color: #000000; } .navbar .nav-link { margin: 0px auto !important; } .navbar .navbar-nav .nav-link { color: #fff; } .nav-scroll .navbar-collapse .nav-link { color: #fff !important; } .nav-scroll .navbar-collapse .active { color: #b19777 !important; } .navbar .dropdown-menu .dropdown-item { padding: 0 15px; font-size: 15px; line-height: 40px; } .navbar .dropdown-menu .dropdown-item.dropdown-toggle { font-weight: 500; } .navbar .dropdown-submenu .dropdown-toggle::after { right: 15px; font-size: 13px; } .navbar .dropdown-submenu:hover > .dropdown-toggle::after { transform: rotate(0deg); } .navbar .dropdown-submenu .dropdown-toggle.show::after { transform: rotate(90deg); } .navbar .dropdown-menu { border: none; padding: 0; border-radius: 0; margin: 0; background: #1e1e1e; } .navbar .dropdown-submenu .dropdown-menu { margin: 0; padding: 0 0 0 20px; } .navbar .dropdown-menu li a { padding: 0 15px; } .navbar .navbar-nav .nav-link { padding-right: 0px; padding-left: 0px; } } @media screen and (max-width: 767px) { .navbar .navbar-collapse { max-height: 480px; overflow: auto; background: #1e1e1e; text-align: left; padding: 20px; } } /* ======= Header style ======= */ .header { min-height: 100vh; overflow: hidden; } .header .caption .o-hidden { display: inline-block; } .header .caption h2 { font-weight: 400; font-size: 30px; } .header .caption h6 { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 300; text-transform: uppercase; color: #fff; text-align: left; margin-bottom: 15px; -webkit-animation-delay: .3s; animation-delay: .3s; letter-spacing: 15px; align-items: center; display: inline-flex; } .header .caption h1 { position: relative; font-size: 90px; font-weight: 500; line-height: 1.25em; text-transform: uppercase; letter-spacing: 3px; -webkit-animation-delay: .5s; animation-delay: .5s; color: #fff; margin-bottom: 10px; } .header .caption h1 span { position: relative; margin-bottom: 0; font-family: 'Oswald', sans-serif; font-size: 90px; text-transform: uppercase; -webkit-animation-delay: .5s; animation-delay: .5s; font-weight: 500; letter-spacing: 3px; color: transparent; -webkit-text-stroke: 1px #ccc; opacity: .8; } .header .caption p { font-size: 18px; color: #fff; -webkit-animation-delay: .7s; animation-delay: .7s; } .header .caption p span { letter-spacing: 5px; margin: 0 5px; padding-right: 14px; position: relative; } .header .caption p span:last-child { padding: 0; } .header .caption p span:last-child:after { display: none; } .header .caption p span:after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #1e1e1e; position: absolute; top: 10px; right: 0; opacity: .5; } .header .caption .butn-dark { margin-top: 15px; margin-bottom: 15px; -webkit-animation-delay: .9s; animation-delay: .9s; color: #fff; } .header .social a { color: #eee; font-size: 20px; margin: 10px 15px; } /* ======= Slider style ======= */ .slider .owl-item, .slider-fade .owl-item { height: 100vh; position: relative; } .slider .item, .slider-fade .item { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-size: cover; background-position: center; } .slider .item .caption, .slider-fade .item .caption { z-index: 9; } .slider .owl-theme .owl-dots, .slider-fade .owl-theme .owl-dots { position: absolute; bottom: 6vh; width: 100%; } /* social icon */ .slider-fade .social-icon, .slider .social-icon { position: absolute; left: 12%; bottom: 40px; z-index: 8; } .slider-fade .social-icon a, .slider .social-icon a { width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 50%; background: transparent; border: 1px solid rgba(255, 255, 255, 0.2); color: #fff; font-size: 12px; transition: all 0.2s ease-in-out; transform: scale(1.0); margin: 5px 1px; } .slider-fade .social-icon a:hover, .slider .social-icon a:hover { transform: scale(0.9); background: #fff; border: 1px solid #fff; color: #252525; } @media screen and (max-width: 767px) { .slider-fade .social-icon, .slider .social-icon { display: none; } } /* owl-nav next and prev */ .owl-nav { position: absolute; bottom: 40px; right: 12%; } .owl-prev { float: left; } .owl-next { float: right; } .project-page .owl-theme .owl-nav [class*=owl-], .slider-fade .owl-theme .owl-nav [class*=owl-] { width: 40px; height: 40px; line-height: 34px; background: transparent; border-radius: 50%; color: #fff; font-size: 16px; margin-right: 2px; cursor: pointer; border: 1px solid rgba(255, 255, 255, 0.2); transition: all 0.2s ease-in-out; transform: scale(1.0); } .project-page .owl-theme .owl-nav [class*=owl-]:hover, .slider-fade .owl-theme .owl-nav [class*=owl-]:hover { transform: scale(0.9); background: #fff; border: 1px solid #fff; color: #252525; } @media screen and (max-width: 768px) { .owl-nav { display: none; } } /* ======= Content Lines style ======= */ .content-wrapper { position: relative; overflow: hidden; } .content-lines-wrapper { position: absolute; left: 0; width: 100%; height: 100%; overflow: hidden; } .content-lines-inner { position: absolute; width: 1140px; left: 50%; margin-left: -570px; top: 0; height: 100%; border-left: 1px solid rgba(255, 255, 255, 0.03); border-right: 1px solid rgba(255, 255, 255, 0.03); border-bottom: 1px solid rgba(255, 255, 255, 0.03); } .content-lines { position: absolute; left: 33.666666%; right: 33.666666%; height: 100%; border-left: 1px solid rgba(255, 255, 255, 0.03); border-right: 1px solid rgba(255, 255, 255, 0.03); } /* ======= Page Header style ======= */ .banner-header { height: 5vh; background-attachment: inherit; background-position: center; z-index: -3 !important; } .banner-header h6 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 15px; text-transform: uppercase; } .banner-header h6 a:hover { color: #b19777; } .banner-header h6 i { margin: 0 15px; font-size: 16px; } .banner-header h5 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 15px; margin-top: 15px; text-transform: uppercase; } .banner-header h5 a:hover { color: #b19777; } .banner-header h5 i { margin: 0 15px; font-size: 16px; } .banner-header h1 { position: relative; margin-bottom: 0; text-transform: uppercase; font-size: 45px; color: #fff; line-height: 1.25em; letter-spacing: 3px; } @media screen and (max-width: 767px) {} /* ======= About style ======= */ .about { position: relative; margin-bottom: 90px; } .about:last-child { margin-bottom: 0px; } .about figure { margin: 0; position: relative; width: 66.666667%; margin-left: auto; overflow: hidden; } .about.left figure { margin-left: 0; margin-right: auto; } .about figure img:hover { -webkit-transform: scale(1.05, 1.05); transform: scale(1.05); } .about figure img { transform: scale(1); transition: transform 500ms ease; } .about .caption { background: #1e1e1e; position: absolute; top: 50%; width: 50%; padding: 5% 4% 5% 0%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .about.left .caption { left: auto; right: 0; background: #1E1E1E; padding: 5% 0% 5% 4%; } .about.left .caption h4 { color: #fff; } .about .caption h4 { text-transform: uppercase; font-size: 45px; color: #fff; line-height: 1.25em; letter-spacing: 3px; } .about .caption h6 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 10px; text-transform: uppercase; } /* about list */ .about-list { position: relative; display: block; padding: 0; } .about-list li { position: relative; display: flex; align-items: center; } .about-list li+li { margin-top: 10px; } .about-list li .icon { display: flex; align-items: center; } .about-list li .icon span { color: #b19777; font-size: 12px; } .about-list li .text { margin-left: 12px; } .about-list li .text p { color: #999; font-weight: 400; margin: 0; } @media (max-width: 991.98px) { .about figure { width: auto; margin: 0; } .about.left .caption { padding: 30px 0px; } .about .caption { position: relative; top: 0; width: auto; padding: 30px 0px; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } } /* ======= Team style ======= */ .team .item { position: relative; overflow: hidden; margin-bottom: 30px; } .team .item:hover img { -webkit-filter: none; filter: none; -webkit-transform: scale(1.05, 1.05); transform: scale(1.05, 1.05); -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; } .team .item:hover .con { bottom: 0; } .team .item img { -webkit-transition: all .5s; transition: all .5s; -webkit-filter: brightness(100%); } .team .item .con { margin: -110px 20px 55px; padding: 20px; background-color: #252525 !important; border: 1px solid #252525; border-radius: 0; overflow: hidden; -webkit-transition: .2s cubic-bezier(.3, .58, .55, 1); transition: .2s cubic-bezier(.3, .58, .55, 1); bottom: -55px; position: relative; text-align: center; } .team .item .con h5, .team .item .con h5 a { color: #fff; font-size: 15px; font-family: 'Oswald', sans-serif; font-weight: 300; margin-bottom: 5px; letter-spacing: 3px; text-transform: uppercase; } .team .item .con h5:hover, .team .item .con h5 a:hover { color: #fff; } .team .item .con p { color: #999; font-size: 16px; margin-bottom: 0; } .team .item .con i { color: #999; font-size: 20px; } /* ======= Team Details style ======= */ .team-details { position: relative; color: #999; } .team-details h3 { font-size: 25px; margin-bottom: 0px; color: #fff; letter-spacing: 3px; font-weight: 400; text-transform: uppercase; } .team-details .content { background-color: #252525; } .team-details .text-content { position: relative; padding: 30px 15px; } .team-details .content .team-details-info { padding: 10px 0 30px 0; position: relative; } .team-details .content .info-list { margin: 0; padding: 0 } .team-details .content .info-list li { position: relative; font-size: 16px; line-height: 24px; display: block; float: left; list-style: square; padding: 5px 0; display: inline-block; width: calc(48% - 1px) } .team-details .content .info-list .list-title { font-family: 'Didact Gothic', sans-serif; text-indent: 0; width: auto; display: inline; margin-right: 3px; position: relative; color: #c5a47e; font-weight: 400; font-size: 16px; line-height: 26px } .team-details .content .info-list .list-description { display: inline } .team-details .content ul.social-icons { margin: 0; padding: 0 } .team-details .content .social-icons li { display: inline-block; border: none; z-index: 1; position: relative } .team-details .content .social-icons li { margin: 0 2px } .team-details .content .social-icons li:last-child { margin-right: 0 } .team-details .content .social-icons li a { display: block; min-width: 26px; text-align: center } .team-details .content .social-icons.circle li>a { border-width: 1px; border-style: solid; height: 33px; width: 33px; line-height: 33px; text-align: center; display: block; background-color: transparent; font-size: 16px; border-radius: 50% } .team-details .content .social-icons.square li { margin: 0 0 } .team-details .content .social-icons.square li a { font-size: 12px; width: 36px; height: 36px; line-height: 36px; color: inherit; margin-right: 8px; border: 1px solid #424242; color: #999; border-radius: 50%; } .team-details .content .social-icons.square li a:hover { border: 1px solid #c5a47e; } @media only screen and (max-width: 480px) { .team-details .content .info-list li { width: 100%; } } /* ======= Accordion Box (for Faqs) style ======= */ .faq { position: relative; } .accordion-box { position: relative; padding-left: 3px; } .accordion-box .block { position: relative; background: #252525; border-radius: 0px; overflow: hidden; margin-bottom: 15px; border: 1px solid #252525; } .accordion-box .block.active-block { background-color: #252525; } .accordion-box .block:last-child { margin-bottom: 0; } .accordion-box .block .acc-btn { position: relative; font-size: 15px; line-height: 27px; font-weight: 400; cursor: pointer; padding: 20px 40px; padding-right: 60px; color: #999; transition: all 500ms ease; } .accordion-box .block .acc-btn .count { color: #c5a47e; padding-right: 3px; } .accordion-box .block .acc-btn:before { position: absolute; right: 35px; top: 20px; height: 30px; font-size: 12px; font-weight: normal; color: #999; line-height: 30px; content: "\e64b"; font-family: "Themify"; transition: all 500ms ease; } .accordion-box .block .acc-btn.active { background-color: #252525; color: #c5a47e; } .accordion-box .block .acc-btn.active:before { color: "Themify"; content: "\e648"; color: #c5a47e; } .accordion-box .block .acc-content { position: relative; display: none; } .accordion-box .block .content { position: relative; padding: 0px 40px 30px; background-color: #252525; color: #999; } .accordion-box .block .acc-content.current { display: block; } .accordion-box .block .content .text { display: block; position: relative; top: 0px; display: block; } /* ======= Position style ======= */ .position { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: -1px; padding: 40px 45px 40px 50px; -webkit-transition: background-color .3s; transition: background-color .3s; border-top: 1px solid rgba(255, 255, 255, 0.03); border-bottom: 1px solid rgba(255, 255, 255, 0.03); background-color: transparent; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap } @media only screen and (max-width:991px) { .position { flex-direction: column; -webkit-box-pack: initial; -webkit-justify-content: initial; -ms-flex-pack: initial; justify-content: initial; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start } } .position-link { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100% } .position-category { -webkit-transition: color .3s; transition: color .3s; -webkit-flex-basis: 30%; -ms-flex-preferred-size: 30%; flex-basis: 30% } @media only screen and (max-width:991px) { .position-category { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100% } } .position-title { font-family: 'Oswald', sans-serif; font-size: 18px; font-weight: 300; text-transform: uppercase; letter-spacing: 3px; -webkit-transition: color .3s; transition: color .3s; color: #999; -webkit-flex-basis: 40%; -ms-flex-preferred-size: 40%; flex-basis: 40% } @media only screen and (max-width:991px) { .position-title { margin-top: 15px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100% } } .position-time { font-weight: 400; -webkit-transition: color .3s; transition: color .3s; color: #999; } @media only screen and (max-width:991px) { .position-time { margin-top: 15px; -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100% } } .position-icon { font-size: 16px; line-height: 1; color: #b19777; } @media only screen and (max-width:991px) { .position-icon { display: none } } .position-icon i { display: inline-block } .position:hover { background-color: #b19777; } .position:hover .position-category { color: #fff; } .position:hover .position-title, .position:hover .position-time { color: #fff } .position:hover .position-icon i { -webkit-animation: vlt_animate_icon_top_right .3s 150ms forwards; animation: vlt_animate_icon_top_right .3s 150ms forwards; color: #fff; } /* ======= Projects style ======= */ .projects {} .projects h4 { text-transform: uppercase; font-size: 45px; color: #fff; line-height: 1.25em; letter-spacing: 3px; } .projects h6 { color: #b19777; letter-spacing: 5px; font-size: 13px; font-weight: 300; margin-bottom: 10px; text-transform: uppercase; } .projects-carousel { position: relative; display: block; } .projects-carousel.owl-carousel .owl-stage-outer { overflow: visible; padding: 0px 0px 0px; } .projects-single { position: relative; display: block; margin-bottom: 15px; } .projects-img { position: relative; display: block; overflow: hidden; z-index: 1; } .projects-img img { width: 100%; transform: scale(1); transition: transform 500ms ease; } .projects-single:hover .projects-img img { transform: scale(1.05); } .projects-content { position: relative; display: block; background-color: #252525; padding: 30px; margin-top: -60px; margin-left: 30px; margin-right: 30px; overflow: hidden; transition: all 500ms ease; z-index: 2; } .projects-content:after { position: absolute; content: ""; top: 0; left: 0; right: 0; height: 100%; background-color: #b19777; box-shadow: 0px 10px 60px 0px rgb(0, 0, 0, .07); transition: all 500ms ease; opacity: 1; transform-origin: top; transform-style: preserve-3d; transform: scaleY(0); z-index: -1; } .projects-single:hover .projects-content:after { opacity: 1; transform: scaleY(1.0); } .projects-tagline { color: #b19777; font-family: 'Oswald', sans-serif; font-size: 13px; font-weight: 300; letter-spacing: 5px; text-transform: uppercase; margin-bottom: 5px; line-height: 27px; transition: all 500ms ease; } .projects-title, .projects-title a { font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 27px; font-weight: 400; line-height: 1.25em; color: #fff; transition: all 500ms ease; margin-bottom: 0; } .projects-arrow { position: absolute; top: 50%; right: 30px; transform: translateY(-50%); } .projects-arrow a { color: #999; font-size: 18px; height: 40px; width: 40px; display: flex; align-items: center; justify-content: center; transition: all 500ms ease; } .projects-single:hover .projects-tagline { color: #fff; } .projects-single:hover .projects-title a { color: #fff; } .projects-single:hover .projects-arrow a { color: #fff; } /* Projects prev/next */ .projects-prev-next { padding: 40px 0; border: none; border-top: 1px solid #252525; border-bottom: 1px solid #252525; position: inherit; } @media (max-width: 576px) { .projects-prev-next { text-align: center; } .projects-prev-next-left { margin-bottom: 10px; } .projects-arrow { display: none; } } .projects-prev-next a { display: inline-block; font-size: 15px; color: #999; line-height: 1em; } .projects-prev-next a i { font-size: 15px; } .projects-prev-next a:hover { color: #b19777; } .projects-prev-next .projects-prev-next-left a i { margin-right: 5px; font-size: 12px; } .projects-prev-next .projects-prev-next-right a i { font-size: 12px; margin-left: 0; margin-left: 5px; } .project-page p { margin-bottom: 0px; position: relative; } .project-bar { padding: 30px 45px 15px 45px; background-color: #252525; margin-top: -30px; margin-bottom: 30px; position: relative; z-index: 2; } .project-bar h5 { color: #fff; font-size: 15px; font-family: 'Oswald', sans-serif; font-weight: 300; margin-bottom: 5px; letter-spacing: 3px; text-transform: uppercase; } @media (max-width: 576px) { .project-bar { margin-top: 0px; } } /* ======= Projects 2 style ======= */ .projects2 { position: relative; margin-bottom: 90px; } .projects2:last-child { margin-bottom: 0px; } .projects2 figure { margin: 0; position: relative; width: 66.666667%; margin-left: auto; overflow: hidden; } .projects2.left figure { margin-left: 0; margin-right: auto; } .projects2 figure img:hover { -webkit-transform: scale(1.05, 1.05); transform: scale(1.05); } .projects2 figure img { transform: scale(1); transition: transform 500ms ease; } .projects2 .caption { background: #1e1e1e; position: absolute; top: 50%; width: 50%; padding: 5% 4% 5% 4%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .projects2.left .caption { left: auto; right: 0; background: #1e1e1e; padding: 5% 4% 5% 4%; } .projects2.left .caption h4 { color: #fff; } .projects2 .caption h4 { text-transform: uppercase; font-size: 32px; color: #fff; line-height: 1.25em; letter-spacing: 1px; } .projects2 .caption h6 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 10px; text-transform: uppercase; } /* about list */ .projects2-list { position: relative; display: block; } .projects2-list li { position: relative; display: flex; align-items: center; } .projects2-list li+li { margin-top: 10px; } .projects2-list li .icon { display: flex; align-items: center; } .projects2-list li .icon span { color: #b19777; font-size: 15px; } .projects2-list li .text { margin-left: 12px; } .projects2-list li .text p { color: #999; font-weight: 400; margin: 0; } @media (max-width: 991.98px) { .projects2 figure { width: auto; margin: 0; } .projects2.left .caption { padding: 30px 0px; } .projects2 .caption { position: relative; top: 0; width: auto; padding: 30px 0px; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } } /* ======= Services style ======== */ .services .item { padding: 40px 30px; position: relative; background-size: cover; background-position: 50% 0% !important; margin-bottom: 20px; } .services .item:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(30, 30, 30, 0.8); } .services .item:hover:after { opacity: 0; } .services .item:hover h5, .services .item:hover p, .services .item:hover h5 .services .item:hover span { color: #fff; } .services .item:hover .numb { -webkit-text-stroke: 1px #fff } .services .item:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #1e1e1e; z-index: 1; -webkit-transition: all .4s; transition: all .4s; } .services .item .con { position: relative; z-index: 7; text-align: center; } .services .item .con .icon-img { width: 100%; display: block; margin-bottom: 20px; } .services .item .con .icon-img img { width: 80px; margin: 0 auto; } .services .item h5 { font-size: 20px; font-weight: 300; margin-bottom: 20px; color: #fff; text-transform: uppercase; letter-spacing: 3px; } .services .item .numb { position: absolute; right: 15px; top: 18px; font-weight: 700; font-size: 70px; font-family: 'Oswald', sans-serif; color: transparent; -webkit-text-stroke: 1px #fff; opacity: .1; } .services .item p { font-size: 15px; } .services .bg-1 { background-image: url(../img/kitchen2.webp); } .services .bg-2 { background-image: url(../img/bedroom2.webp); } .services .bg-3 { background-image: url(../img/bathroom2.webp); } .services .bg-4 { background-image: url(../img/office2.webp); } .services .bg-5 { background-image: url(../img/garage2.webp); } .services .bg-6 { background-image: url(../img/projects/3.jpg); } /* ======= Project Video style ======= */ .project-video { position: relative; margin-bottom: 90px; } .project-video:last-child { margin-bottom: 0px; } .project-video figure { margin: 0; position: relative; width: 66.666667%; margin-left: auto; overflow: hidden; } .project-video.left figure { margin-left: 0; margin-right: auto; } .project-video figure img:hover { -webkit-transform: scale(1.05, 1.05); transform: scale(1.05); } .project-video figure img { transform: scale(1); transition: transform 500ms ease; } .project-video .caption { background: #1e1e1e; position: absolute; left: 0; top: 50%; width: 50%; padding: 5% 4% 5% 0%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .project-video.left .caption { left: auto; right: 0; background: #1E1E1E; padding: 5% 0% 5% 4%; } .project-video.left .caption h4 { color: #fff; } .project-video .caption h4 { text-transform: uppercase; font-size: 45px; color: #fff; line-height: 1.25em; letter-spacing: 3px; } .project-video .caption h6 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 10px; text-transform: uppercase; } @media (max-width: 991.98px) { .project-video figure { width: auto; margin: 0; } .project-video.left .caption { padding: 30px 0px; } .project-video .caption { position: relative; left: 0; top: 0; width: auto; padding: 30px 0px; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } } /* play button */ .vid-area { padding: 0 0 30px 0; } .vid-area h5 { font-size: 24px; line-height: 1.5em; font-weight: 400; color: #fff; } .play-button { position: relative; width: 85px; height: 85px; margin: auto; -webkit-transform: scale(1.3); -ms-transform: scale(1.3); transform: scale(1.3); z-index: 4; margin-left: 5px; } .play-button svg { position: absolute; width: 100%; height: 100%; } .circle-fill circle { opacity: 1; fill: #b19777; } .polygon { color: #fff; position: absolute; width: 100%; height: 100%; text-align: center; line-height: 85px; font-size: 30px; z-index: 2; padding-left: 0px; } .play-button svg.circle-fill { z-index: 1; stroke-dasharray: 322; stroke-dashoffset: 322; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .play-button:hover svg.circle-fill { stroke-dashoffset: 38.5; } .play-button svg.circle-track { z-index: 0; } .play-button.color { color: #b19777; } .play-button.color .circle-fill circle { fill: #b19777; } .vid-area .vid-icon { position: relative; } .vid-area:hover .vid-icon > img { transform: scale(1.05); } /* ======= Testimonials style ======= */ .testimonials { position: relative; margin-bottom: 90px; } .testimonials:last-child { margin-bottom: 0px; } .testimonials figure { margin: 0; position: relative; width: 66.666667%; margin-left: auto; overflow: hidden; } .testimonials.left figure { margin-left: 0; margin-right: auto; } .testimonials figure img:hover { -webkit-transform: scale(1.05, 1.05); transform: scale(1.05); } .testimonials figure img { transform: scale(1); transition: transform 500ms ease; } .testimonials .caption { background: #1e1e1e; position: absolute; left: 0; top: 50%; width: 50%; padding: 5% 4% 5% 0%; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .testimonials.left .caption { left: auto; right: 0; background: #1E1E1E; padding: 5% 0% 5% 4%; } .testimonials.left .caption h4 { color: #fff; } .testimonials .caption h4 { text-transform: uppercase; font-size: 45px; color: #fff; line-height: 1.25em; letter-spacing: 3px; } .testimonials .caption h6 { font-weight: 300; color: #b19777; letter-spacing: 5px; font-size: 13px; margin-bottom: 10px; text-transform: uppercase; } @media (max-width: 991.98px) { .testimonials figure { width: auto; margin: 0; } .testimonials figure img { display: none; } .testimonials.left .caption { padding: 30px 0px; } .testimonials .caption { position: relative; left: 0; top: 0; width: auto; padding: 30px 0px; -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } } .testimonials .item-box { margin-bottom: 15px; position: relative; } .testimonials .item-box .quote { position: absolute; right: 45px; bottom: 30px; width: 100px; margin: 0 auto 30px; opacity: .1; } .testimonials .item-box h5 { font-size: 18px; color: #fff; font-family: 'Didact Gothic', sans-serif; margin-bottom: 10px; } .testimonials .item-box p { font-size: 15px; color: #999; } .testimonials .item-box .info { text-align: left; margin: 30px 0 15px 0; } .testimonials .item-box .info .author-img { width: 60px; height: 60px; border-radius: 50%; float: left; overflow: hidden; } .testimonials .item-box .info .cont { margin-left: 75px; } .testimonials .item-box .info h6 { color: #fff; font-size: 15px; font-weight: 300; margin-bottom: 0px; padding-top: 10px; line-height: 1em; letter-spacing: 3px; } .testimonials .item-box .info span { font-size: 16px; font-weight: 400; color: #999; margin-right: 5px; } /* ======= Gallery Masonry style ======= */ .gallery-masonry-wrapper { width: 100%; position: relative; overflow: hidden; } .gallery-masonry-wrapper .gallery-masonry-item-img-link { display: block; position: relative; overflow: hidden; cursor: pointer; } .gallery-masonry-wrapper .gallery-masonry-item-img-link:hover .gallery-masonry-item-img { -webkit-transform: translateY(-40px); -ms-transform: translateY(-40px); transform: translateY(-40px); } .gallery-masonry-wrapper .gallery-masonry-item-img-link:hover .gallery-masonry-item-img:after { opacity: 0.3; } .gallery-masonry-wrapper .gallery-masonry-item-img-link:hover .gallery-masonry-item-content { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition-delay: .15s; -o-transition-delay: .15s; transition-delay: .15s; } .gallery-masonry-wrapper .gallery-masonry-item-content { position: absolute; left: 0; bottom: -11px; max-width: 80%; background-color: #1e1e1e; padding-top: 20px; padding-right: 40px; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform 0.5s linear; transition: -webkit-transform 0.5s linear; -o-transition: transform 0.5s linear; transition: transform 0.5s linear; transition: transform 0.5s linear, -webkit-transform 0.5s linear; -webkit-transition: -webkit-transform 0.45s cubic-bezier(0.4, 0, 0.2, 1); transition: -webkit-transform 0.45s cubic-bezier(0.4, 0, 0.2, 1); -o-transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.45s cubic-bezier(0.4, 0, 0.2, 1); } .gallery-masonry-wrapper .gallery-masonry-item-title { text-transform: none; margin-top: 0; margin-bottom: 0; font-size: 18px; color: #fff; text-transform: uppercase; letter-spacing: 3px; font-weight: 300; } .gallery-masonry-wrapper .gallery-masonry-item-category { font-size: 15px; line-height: 1.5em; color: #999; } @media only screen and (max-width: 991px) { .gallery-masonry-wrapper .gallery-masonry-item-content { padding-top: 15px; padding-right: 20px; } } @media only screen and (max-width: 767px) { .gallery-masonry-wrapper { margin-left: auto; margin-right: auto; } } @media only screen and (max-width: 400px) { .gallery-masonry-wrapper { margin-left: auto; margin-right: auto; } } /* ======= Blog style ======= */ .blog .item .post-img .img { overflow: hidden; } .blog .item .post-img:hover img { -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } .blog .item .post-img img { -webkit-transition: all .5s; transition: all .5s; } .blog .item .cont { position: relative; padding: 30px; width: 90%; margin-left: 5%; margin-top: 0px; -webkit-transition: all .4s; transition: all .4s; margin-top: -60px; background-color: #1e1e1e; } .blog .item .info { margin-bottom: 10px; position: relative; } .blog .item .info a { color: #999; font-size: 15px; } .blog .item .info a:last-of-type { margin-right: 0; color: #999; } .blog .item .info a i, .blog .item .info a span { margin-right: 10px; } .blog .item .info a span { color: #999; } .blog .item .info a span:after { content: ''; display: inline-block; width: 4px; height: 4px; flex-shrink: 0; color: #b19777; margin-inline-start: 1em; border-radius: 50em; background-color: currentColor; vertical-align: middle; opacity: .35; } .blog .item .info a span:hover { color: #b19777; } .blog .item h3 { color: #fff; font-size: 30px; font-weight: 300; font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 2px; line-height: 1.5em; margin-bottom: 10px; } .blog .item h5 { color: #fff; font-size: 24px; font-weight: 300; font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 1px; line-height: 1.5em; margin-bottom: 10px; } .blog .item .more { color: #999; font-size: 15px; font-weight: 400; border-bottom: 1px solid #ccc; } /* blog sidebar */ .blog-sidebar .widget { position: relative; background: #252525; padding: 30px; margin-bottom: 30px; overflow: hidden; } .blog-sidebar .widget ul { margin-bottom: 0; padding: 0; } .blog-sidebar .widget ul li { margin-bottom: 15px; color: #999; font-size: 15px; line-height: 1.5em; } .blog-sidebar .widget ul li a { color: #999; } .blog-sidebar .widget ul li a.active { color: #b19777; } .blog-sidebar .widget ul li a:hover { color: #b19777; } .blog-sidebar .widget ul li:last-child { margin-bottom: 0; } .blog-sidebar .widget ul li i { font-size: 9px; margin-right: 10px; } .blog-sidebar .widget .recent li { display: block; overflow: hidden; } .blog-sidebar .widget .recent .thum { width: 90px; overflow: hidden; float: left; } .blog-sidebar .widget .recent a { display: block; margin-left: 105px; } .blog-sidebar .widget-title { margin-bottom: 20px; } .blog-sidebar .widget-title h6 { padding-bottom: 15px; border-bottom: 1px solid rgba(255,255,255,0.05); font-family: 'Oswald', sans-serif; font-size: 24px; line-height: 1.25em; color: #fff; margin-bottom: 0px; font-weight: 300; letter-spacing: 2px; text-transform: uppercase; } .blog-sidebar .search form { position: relative; } .blog-sidebar .search form input { width: 100%; padding: 10px; border: 0; background: #1e1e1e; margin-bottom: 0; } .blog-sidebar .search form button { position: absolute; right: 0; top: 0; background-color: transparent; color: #999; border: 0; padding: 10px; cursor: pointer; outline: none; } .blog-sidebar .tags li { margin: 3px !important; padding: 7px 20px; background-color: #b19777; color: #fff !important; float: left; } .blog-sidebar ul.tags li a { font-size: 15px; color: #fff; } .blog-sidebar ul.tags li:hover, .blog-sidebar ul.tags li a:hover { background-color: #1e1e1e; color: #fff; } /* blog pagination */ .blog-pagination-wrap { padding: 0; margin: 0; text-align: center; } .blog-pagination-wrap li { display: inline-block; margin: 0 5px; } .blog-pagination-wrap li a { background: transparent; display: inline-block; width: 40px; height: 40px; line-height: 38px; text-align: center; color: #999; font-weight: 400; border: 1px solid #252525; font-size: 15px; border-radius: 50%; } .blog-pagination-wrap li a i { font-size: 11px; } .blog-pagination-wrap li a:hover { opacity: 1; text-decoration: none; background: transparent; border: 1px solid #b19777; color: #b19777; } .blog-pagination-wrap li a.active { background-color: transparent; border: 1px solid #b19777; color: #b19777; } @media screen and (max-width: 768px) { .blog-pagination-wrap { padding: 0; margin: 0; text-align: center; } } /* ======= Post style ======= */ .post-comment-section { padding-top: 60px; margin-bottom: 0px; } .post-comment-section h6 { font-size: 20px; color: #fff; font-weight: 300; text-transform: uppercase; letter-spacing: 2px; } .post-comment-section h6 span { font-size: 13px; color: #999; font-weight: 300; margin-left: 15px; } .post-comment-wrap { display: flex; margin-bottom: 60px; } .post-user-comment { margin-right: 30px; flex: 0 0 auto; } .post-user-comment img { border-radius: 100%; width: 100px; } .post-user-content { margin-right: 26px; } .post-repay { font-size: 15px; color: #b19777; margin: 0; font-weight: 400; } /* post prev/next */ .post-prev-next { padding: 40px 0; border: none; border-top: 1px solid #252525; border-bottom: 1px solid #252525; position: inherit; } @media (max-width: 576px) { .post-prev-next { text-align: center; } .post-prev-next-left { margin-bottom: 10px; } } .post-prev-next a { display: inline-block; font-size: 15px; color: #999; line-height: 1em; } .post-prev-next a i { font-size: 20px; } .post-prev-next a:hover { color: #b19777; } .post-prev-next .post-prev-next-left a i { margin-right: 5px; font-size: 12px; } .post-prev-next .post-prev-next-right a i { font-size: 12px; margin-left: 0; margin-left: 5px; } /* ======= Contact style ======= */ .contact h5 { color: #fff; font-size: 24px; font-weight: 300; letter-spacing: 3px; text-transform: uppercase; } .contact p { margin-bottom: 15px; } .contact p a { color: #b19777; } .contact-list { position: relative; display: block; } .contact-list li { position: relative; display: flex; align-items: center; } .contact-list li + li { margin-top: 5px; } .contact-list li .icon span { font-size: 15px; color: #b19777; } .contact-list li .text { margin-left: 20px; } .contact-list li .text p { margin: 0; font-size: 15px; color: #999; } .contact-list li .text p a { font-size: 15px; color: #999; transition: all 500ms ease; } .contact-list li .text p a:hover { color: #b19777; } /* ======= Buttons style ======= */ /* light */ .butn-light { position: relative; line-height: 1.2em; } .butn-light a { font-family: 'Didact Gothic', sans-serif; background: transparent; color: #fff; padding: 13px 24px; margin: 0; position: relative; font-size: 15px; border: 1px solid #fff; } .butn-light a:after { content: ''; width: 0; height: 100%; position: absolute; bottom: 0; left: 100%; z-index: 1; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; background: #fff; } .butn-light a span { position: relative; z-index: 2; } .butn-light a:hover:after { width: 100%; left: 0; -webkit-transition: width 0.3s ease; transition: width 0.3s ease; } .butn-light a:hover span { color: #252525; } .butn-light a span i { font-size: 12px; margin-left: 7px; } /* dark */ .butn-dark { position: relative; line-height: 1.2em; } .butn-dark a { font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 300; letter-spacing: 2px; background: #b19777; color: #fff; padding: 14px 24px; margin: 0; position: relative; font-size: 15px; } .butn-dark a:after { content: ''; width: 0; height: 100%; position: absolute; bottom: 0; left: 100%; z-index: 1; background: #323232; color: #fff; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .butn-dark a span { position: relative; z-index: 2; } .butn-dark a:hover:after { width: 100%; left: 0; -webkit-transition: width 0.3s ease; transition: width 0.3s ease; } .butn-dark a:hover span { color: #fff; } .butn-dark a span i { font-size: 12px; margin-left: 7px; } /* ======= Footer style ======= */ .main-footer { position: relative; z-index: 9; } .main-footer .bottom-footer { padding: 30px 0 10px 0; background-color: transparent; color: #999; border-top: 1px solid rgba(255,255,255,0.05); } .main-footer .bottom-footer .container { font-size: 16px; display: block; justify-content: space-between; text-align: center; } .main-footer .call-action { background-color: transparent; color: #fff; } .main-footer .call-action .contact-info { margin-top: 30px; } .main-footer .call-action .contact-info h6 { color: #fff; font-size: 16px; font-weight: 300; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 10px; } .main-footer .bottom-footer span { color: rgba(255,255,255,0.1); margin: 0 5px; } .main-footer .bottom-footer p { font-size: 16px; } .main-footer .bottom-footer p a:hover { color: #b19777; } /* footer social */ .main-footer .bottom-footer .container .social { margin: 0 0 20px 0; padding: 0; display: inline-flex; } .main-footer .bottom-footer .container .social li { list-style-type: none; margin: 0 3px; height: 40px; width: 40px; border: 1px solid rgba(255,255,255,0.05); text-align: center; font-size: 12px; line-height: 40px; border-radius: 50%; transition: all 0.2s ease-in-out; transform: scale(1.0); } .main-footer .bottom-footer .container .social li:hover { transform: scale(0.9); background-color: #b19777; } .main-footer .bottom-footer .container .social li a { color: #fff; } .main-footer .bottom-footer .container .social li a:hover { color: #fff; } /* footer background image */ .main-footer-bg { position: absolute; z-index: -2; top: 0; left: 0; width: 100%; } .main-footer-bg img { width: 100%; object-fit: cover; object-position: center; } .main-footer-bg .main-footer-bg-overlay { position: absolute; top: 0; left: 0; width: 100%; background-image: linear-gradient(0deg, #1e1e1e 1%, rgba(30, 30, 30, 0.9) 100%, rgba(30, 30, 30, 0.85) 100%); } .main-footer-bg.main-footer-bottom { height: 450px; top: auto; bottom: 0; } .main-footer-bg.main-footer-bottom img { height: 450px; } .main-footer-bg.main-footer-bottom .main-footer-bg-overlay { height: 450px; transform: rotate(180deg); } /* ======= toTop Button style ======= */ .progress-wrap { position: fixed; bottom: 30px; right: 30px; height: 40px; width: 40px; cursor: pointer; display: block; border-radius: 50px; -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); z-index: 100; opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); -webkit-transition: all 400ms linear; -o-transition: all 400ms linear; transition: all 400ms linear; } .progress-wrap.active-progress { opacity: 1; visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .progress-wrap::after { position: absolute; font-family: 'themify'; content: '\e648'; text-align: center; line-height: 40px; font-size: 12px; font-weight: 400; color: #b19777; left: 0; top: 0; height: 40px; width: 40px; cursor: pointer; display: block; z-index: 1; -webkit-transition: all 400ms linear; -o-transition: all 400ms linear; transition: all 400ms linear; } .progress-wrap svg path { fill: none; } .progress-wrap svg.progress-circle path { stroke: rgba(255, 255, 255, 0.1); stroke-width: 2; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 400ms linear; -o-transition: all 400ms linear; transition: all 400ms linear; } .progress-wrap { -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); } .progress-wrap::after { color: #b19777; } .progress-wrap svg.progress-circle path { stroke: #b19777; } /* ======= Error Page 404 style ======= */ .error-form { position: relative; max-width: 520px; margin: 50px auto 0; } .error-form form { position: relative; } .error-form .form-group { position: relative; margin: 0; } .error-form .form-group input[type="text"], .error-form .form-group input[type="search"], .error-form .form-group input[type="email"] { position: relative; width: 100%; line-height: 30px; padding: 14px 60px 15px 15px; height: 60px; display: block; font-family: 'Didact Gothic', sans-serif; font-size: 15px; background: #252525; color: #999; border-radius: 0px; border: 1px solid #252525; transition: all 300ms ease; } .error-form .form-group input[type="text"]:focus, .error-form .form-group input[type="email"]:focus, .error-form .form-group input[type="search"]:focus { border-color: #b19777; } .error-form .form-group input::-webkit-input-placeholder { color: #999; } .error-form .form-group .theme-btn { position: absolute; right: 0px; top: 0; width: 90px; height: 60px; line-height: 60px; font-size: 20px; background: none; color: #fff; background: #b19779; } .error-form .form-group .theme-btn span { vertical-align: middle; outline: none; } /* ======= Responsive style ======= */ @media (min-width: 1200px){ .container { max-width: 1140px !important; } } @media screen and (max-width: 991px) { .bg-fixed { background-attachment: scroll !important; } .header { background-attachment: scroll !important; background-position: 50% 0% !important; } .header .caption h1 { font-size: 70px; } .slider-services-box .slider-services-box-info { padding: 10px; } .slider-box-content.box-up { margin-top: 0px; } .slider-services-box-info h5 { font-size: 15px; } } @media screen and (max-width: 767px) { .header .caption h1 { font-size: 60px; margin-bottom: 15px; } .header .caption h1 span { font-size: 50px; } .parallax-header .caption h2 { margin-bottom: 0px; font-size: 70px; line-height: 1em; } .header .caption h6 { font-size: 16px; } .header .caption p { font-size: 15px; margin-right: 10px; } .header .caption .btn { margin-top: 30px; -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .post-comment-section h3 span { margin-left: 0px; } .main-footer .bottom-footer p.right { text-align: left; } .main-footer .abot .social-icon { text-align: left; margin-bottom: 15px; } .footer .logo { padding: 0; width: auto; margin: 0px 0; } } @media screen and (max-width: 480px) { .footer { padding: 60px 0; } } /* ======= Overlay Effect Bg image style ======= */ [data-overlay-dark], [data-overlay-darkgray], [data-overlay-light] { position: relative; } [data-overlay-dark] .container, [data-overlay-darkgray] .container, [data-overlay-light] .container { position: relative; z-index: 2; } [data-overlay-dark]:before, [data-overlay-darkgray]:before, [data-overlay-light]:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } [data-overlay-dark]:before { background: #000; } [data-overlay-darkgray]:before { background: #1e1e1e; } [data-overlay-light]:before { background: #fff; } [data-overlay-dark] h1, [data-overlay-dark] h2, [data-overlay-dark] h3, [data-overlay-dark] h4, [data-overlay-dark] h5, [data-overlay-dark] h6, [data-overlay-dark] span { color: #fff; } [data-overlay-darkgray] h1, [data-overlay-darkgray] h2, [data-overlay-darkgray] h3, [data-overlay-darkgray] h4, [data-overlay-darkgray] h5, [data-overlay-darkgray] h6, [data-overlay-darkgray] span { color: #fff; } [data-overlay-light] h1, [data-overlay-light] h2, [data-overlay-light] h3, [data-overlay-light] h4, [data-overlay-light] h5, [data-overlay-light] h6, [data-overlay-light] span { color: #999; } [data-overlay-dark] p { color: #fff; } [data-overlay-darkgray] p { color: #999; } [data-overlay-light] p { color: #999; } [data-overlay-dark="0"]:before, [data-overlay-darkgray="0"]:before, [data-overlay-light="0"]:before { opacity: 0; } [data-overlay-dark="1"]:before, [data-overlay-darkgray="1"]:before, [data-overlay-light="1"]:before { opacity: 0.1; } [data-overlay-dark="2"]:before, [data-overlay-darkgray="2"]:before, [data-overlay-light="2"]:before { opacity: 0.2; } [data-overlay-dark="3"]:before, [data-overlay-darkgray="3"]:before, [data-overlay-light="3"]:before { opacity: 0.3; } [data-overlay-dark="4"]:before, [data-overlay-darkgray="4"]:before, [data-overlay-light="4"]:before { opacity: 0.4; } [data-overlay-dark="5"]:before, [data-overlay-darkgray="5"]:before, [data-overlay-light="5"]:before { opacity: 0.5; } [data-overlay-dark="6"]:before, [data-overlay-darkgray="6"]:before, [data-overlay-light="6"]:before { opacity: 0.6; } [data-overlay-dark="7"]:before, [data-overlay-darkgray="7"]:before, [data-overlay-light="7"]:before { opacity: 0.7; } [data-overlay-dark="8"]:before, [data-overlay-darkgray="8"]:before, [data-overlay-light="8"]:before { opacity: 0.8; } [data-overlay-dark="9"]:before, [data-overlay-darkgray="9"]:before, [data-overlay-light="9"]:before { opacity: 0.9; } [data-overlay-dark="10"]:before, [data-overlay-darkgray="10"]:before, [data-overlay-light="10"]:before { opacity: 1; }