input::-webkit-input-placeholder { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } input::placeholder { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } /*============================================= = footer = =============================================*/ .footer-logo-v5 { margin-bottom: 35px; } .footer-logo-v5--style2 { margin-bottom: 170px; } .footer-desc { color: #c7c7c7; max-width: 370px; font-family: "Poppins", sans-serif; font-size: 14px; line-height: 2.2; } .footer-widget__title { color: #fff; margin-bottom: 50px; font-size: 18px; } .footer-widget__title--black { color: #222; } .footer-widget__navigation { line-height: 1; } .footer-widget__navigation li { padding: 0; line-height: 1; } .footer-widget__navigation li:first-child { padding-top: 0; } .footer-widget__navigation li:last-child { padding-bottom: 0; } .footer-widget__navigation li a { font-size: 14px; color: #c7c7c7; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); line-height: 2; font-family: "Poppins", sans-serif; font-weight: 300; } .footer-widget__navigation li a:hover { color: #f0542d; } .footer-widget__content { color: #c7c7c7; font-size: 14px; font-family: "Poppins", sans-serif; font-weight: 300; line-height: 1.7; } .footer-widget__content .contact-details li span { margin-right: 10px; } .footer-copyright-wrapper { padding: 15px 0; color: #c7c7c7; border-top: 1px solid #4a4a4a; font-size: 12px; } /*===== End of footer ======*/ /*============================================= = Sidebar = =============================================*/ /*-- Sidebar --*/ .sidebar { margin-bottom: 50px; background-color: #f7f8f9; padding: 30px; } .sidebar.sidebar-two { padding: 0; background-color: transparent; } .sidebar:last-child { margin-bottom: 0; } /*-- Sidebar Title --*/ .sidebar-title { margin-bottom: 30px; margin-top: -4px; } /*-- Sidebar Search --*/ .sidebar-search form { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; border: 1px solid #e5e6e7; } .sidebar-search form input { -webkit-box-flex: 1; -webkit-flex: 1 0 calc(100% - 40px); -ms-flex: 1 0 calc(100% - 40px); flex: 1 0 calc(100% - 40px); max-width: calc(100% - 40px); height: 40px; border: none; background-color: transparent; padding: 0 15px; color: #1d1d25; } .sidebar-search form button { max-width: 40px; -webkit-box-flex: 1; -webkit-flex: 1 0 40px; -ms-flex: 1 0 40px; flex: 1 0 40px; height: 40px; border: none; background-color: transparent; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; padding: 0; } .sidebar-search form button i { font-size: 20px; } .sidebar-search form button:hover { color: #f0542d; } /*-- Sidebar List --*/ .sidebar-list li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #e5e6e7; } .sidebar-list li:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0 solid transparent; } .sidebar-list li a { font-size: 14px; font-weight: 600; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .sidebar-list li a img { width: 25px; margin-right: 15px; } .sidebar-list li a i { margin-right: 15px; font-size: 24px; } .sidebar-list li a:hover { color: #f0542d; } /*-- Sidebar Blog --*/ .sidebar-blog { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #e5e6e7; } .sidebar-blog:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; } .sidebar-blog .image { max-width: 80px; -webkit-box-flex: 1; -webkit-flex: 1 0 80px; -ms-flex: 1 0 80px; flex: 1 0 80px; } .sidebar-blog .image img { width: 100%; } .sidebar-blog .content { -webkit-box-flex: 1; -webkit-flex: 1 0 calc(100% - 80px); -ms-flex: 1 0 calc(100% - 80px); flex: 1 0 calc(100% - 80px); max-width: calc(100% - 80px); padding-left: 15px; } .sidebar-blog .content h5 { font-size: 16px; line-height: 1.5; } .sidebar-blog .content h5 a:hover { color: #f0542d; } .sidebar-blog .content span { font-size: 13px; display: block; line-height: 18px; } /*-- Sidebar Tags --*/ .sidebar-tag { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -5px; } .sidebar-tag li { padding: 5px; } .sidebar-tag li a { display: block; border: 1px solid #e5e6e7; padding: 3px 15px; font-size: 14px; } .sidebar-tag li a:hover { background-color: #f0542d; border-color: #f0542d; color: #ffffff; } /*===== End of Sidebar ======*/ /*============================================= = section title = =============================================*/ .section-title { display: inline-block; font-size: 36px; color: #f0542d; font-weight: 700; margin-top: -5px; } .title-icon { width: 4px; height: 20px; background-color: #f0542d; display: block; margin: 0 auto; margin-top: 15px; } /*===== End of section title ======*/ /*============================================= = blog = =============================================*/ .blog-grid-wrapper { margin-bottom: -40px; } .blog-post-slider__single-slide--grid-view { margin-bottom: 40px; } .blog-post-slider__single-slide--grid-view:hover .blog-post-slider__image a:before { background-color: rgba(0, 0, 0, 0.3); } .blog-post-slider__image a { position: relative; display: block; width: 100%; } .blog-post-slider__image a:hover:before { background-color: rgba(0, 0, 0, 0.3); } .blog-post-slider__image a img { width: 100%; } .blog-post-slider__image a:before { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); display: inline-block; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; } .blog-post-slider__content { line-height: 1; } .blog-post-slider__content .post-meta { margin-bottom: 15px; } .blog-post-slider__content .post-date { margin-bottom: 25px; font-weight: 700; font-size: 13px; color: #b5b5b5; letter-spacing: 1px; } .blog-post-slider__content .post-title { font-size: 24px; margin-bottom: 20px; } .blog-post-slider__content .post-title a { color: #222; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .blog-post-slider__content .post-title a:hover { color: #f0542d; } .blog-post-slider__content .post-excerpt { font-family: "Poppins", sans-serif; line-height: 1.8; color: #5a5a5a; } .blog-post-slider__content .post-category { display: inline-block; } .blog-post-slider__content .post-category a { font-size: 13px; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); font-weight: 700; color: #f0542d; letter-spacing: 1px; } .blog-post-slider__content .post-category a:hover { color: #222; } /*-- Blog --*/ /*-- Blog Details --*/ .blog-details .blog-inner .media { margin-bottom: 30px; } .blog-details .blog-inner .media .image { display: block; } .blog-details .blog-inner .media .image img { width: 100%; } .blog-details .blog-inner .content .meta { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 10px; } .blog-details .blog-inner .content .meta li { font-size: 14px; font-weight: 500; line-height: 18px; text-transform: capitalize; margin-bottom: 5px; } .blog-details .blog-inner .content .meta li::after { content: "-"; margin: 0 10px; } .blog-details .blog-inner .content .meta li:last-child::after { display: none; } .blog-details .blog-inner .content .meta li a { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .blog-details .blog-inner .content .meta li a:hover { color: #f0542d; } .blog-details .blog-inner .content .title { font-size: 30px; font-weight: 600; margin-bottom: 0; } .blog-details .blog-inner .content .title a { -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .blog-details .blog-inner .content .title a:hover { color: #f0542d; } .blog-details .blog-inner .content .desc { margin-top: 20px; } .blog-details .blog-inner .content .desc p { font-family: "Poppins", sans-serif; } .blog-details .blog-inner .content .tags { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .blog-details .blog-inner .content .tags li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; line-height: 24px; margin-right: 15px; } .blog-details .blog-inner .content .tags li::after { content: ","; margin-left: 3px; } .blog-details .blog-inner .content .tags li:first-child::after, .blog-details .blog-inner .content .tags li:last-child::after { display: none; } .blog-details .blog-inner .content .tags li i { font-size: 18px; line-height: 24px; } .blog-details .blog-inner .content .tags li a { display: block; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .blog-details .blog-inner .content .tags li a:hover { color: #f0542d; } .blog-gallery { position: relative; } .blog-gallery .ht-swiper-button-nav { width: 40px; height: 40px; line-height: 40px; background-color: #f0542d; border-color: #f0542d; color: #ffffff; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .blog-gallery .ht-swiper-button-prev { left: 30px; } .blog-gallery .ht-swiper-button-next { right: 30px; } .blog-gallery:hover .ht-swiper-button-nav { visibility: visible; opacity: 1; } .blog-gallery:hover .ht-swiper-button-prev { left: 20px; } .blog-gallery:hover .ht-swiper-button-next { right: 20px; } /*-- Comment Wrap --*/ .comment-wrapper h3 { margin-bottom: 30px; } /*-- Comment Form --*/ .comment-form input { width: 100%; height: 50px; border: 1px solid #eeeeee; padding: 5px 20px; } .comment-form textarea { width: 100%; height: 120px; border: 1px solid #eeeeee; padding: 10px 20px; resize: none; } .comment-form input[type="submit"], .comment-form button, .comment-form .submit { width: auto; height: 50px; border: none; padding: 5px 30px; background-color: #f0542d; color: #ffffff; text-transform: uppercase; font-weight: 700; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); margin-top: 15px; } .comment-form input[type="submit"]:hover, .comment-form button:hover, .comment-form .submit:hover { background-color: #1d1d25; } blockquote.blockquote { background-color: #f1f2f3; padding: 30px; position: relative; z-index: 1; overflow: hidden; } blockquote.blockquote::before { position: absolute; content: url(../img/icons/quote-left.png); left: -5px; top: -10px; z-index: -1; opacity: 0.07; } blockquote.blockquote p { font-size: 18px; font-style: italic; } blockquote.blockquote .author { font-size: 14px; display: block; line-height: 18px; } /*===== End of blog ======*/ /*============================================= = about = =============================================*/ .about-wrapper { margin-left: 0; margin-right: 0; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .about-wrapper>.col, .about-wrapper>[class*="col-"] { padding-left: 0; padding-right: 0; } /*-- About Image --*/ .about-image { position: relative; z-index: 1; } .about-image.about-image-1 { margin-bottom: -50px; } .about-image.about-image-2 { margin-top: -50px; } .about-image img { width: 100%; } /*-- About Content --*/ .about-content.about-content-1 { margin-bottom: 50px; padding-right: 70px; } .about-content.about-content-2 { margin-top: 50px; padding-left: 70px; } .about-content h1 { font-weight: 400; position: relative; margin-bottom: 30px; font-size: 36px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .about-content h1 span { font-size: 48px; line-height: 1; font-weight: 700; margin-right: 5px; } .about-content p { margin-bottom: 20px; font-family: "Poppins", sans-serif; } .about-content p:last-child { margin-bottom: 0; } .about-content .btn { margin-top: 10px; } /*-- About Image Two --*/ .about-image-two { position: relative; } .about-image-two img { width: 100%; } .about-image-two a { position: absolute; z-index: 3; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 80px; height: 80px; text-align: center; background-color: #ffffff; color: #1d1d25; border-radius: 50%; padding-left: 5px; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .about-image-two a i { font-size: 40px; line-height: 80px; } .about-image-two a:hover { -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15); box-shadow: 0 0 15px rgba(0, 0, 0, 0.15); -webkit-transform: translateX(-50%) translateY(-50%) scale(1.2); -ms-transform: translateX(-50%) translateY(-50%) scale(1.2); transform: translateX(-50%) translateY(-50%) scale(1.2); } /*-- About Content Two --*/ .about-content-two h1 { font-weight: 600; margin-bottom: 15px; font-size: 36px; } .about-content-two h4 { line-height: 1.5; margin-bottom: 25px; } .about-content-two p { margin-bottom: 20px; font-family: "Poppins", sans-serif; } .about-content-two p:last-child { margin-bottom: 0; } .about-content-two .btn { margin-top: 10px; } .feature-item-wrapper { margin-bottom: -30px; } .feature { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .feature .icon { min-width: 50px; width: 50px; margin-right: 20px; } .feature .icon img { width: 100%; } .feature .content h3 { font-size: 24px; font-weight: 600; } .feature .content p { max-width: 265px; font-family: "Poppins", sans-serif; } /*===== End of about ======*/ /*============================================= = Service = =============================================*/ .service-item-wrapper { margin-bottom: -30px; } /*-- Service --*/ .service-details .content p { font-family: "Poppins", sans-serif; } .service-gallery { position: relative; } .service-gallery .ht-swiper-button-nav { background-color: #f0542d; border-color: #f0542d; color: #ffffff; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); } .service-gallery .ht-swiper-button-prev { left: 70px; } .service-gallery .ht-swiper-button-next { right: 70px; } .service-gallery:hover .ht-swiper-button-nav { visibility: visible; opacity: 1; } .service-gallery:hover .ht-swiper-button-prev { left: 50px; } .service-gallery:hover .ht-swiper-button-next { right: 50px; } /*===== End of Service ======*/ /*============================================= = Project = =============================================*/ .project-item-wrapper { margin-bottom: -30px; } /*-- Project --*/ .project-details p { font-family: "Poppins", sans-serif; } /*-- Project Information --*/ .project-information { background-color: #1d1d25; padding: 30px 35px; } .project-information h3 { color: #ffffff; margin-bottom: 20px; } .project-information ul li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: #ffffff; font-size: 14px; } .project-information ul li:last-child { margin-bottom: 0; padding-bottom: 0; border: none; } .project-information ul li strong { width: 80px; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; } .gallery-item { position: relative; } .gallery-item::before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; background-color: #1d1d25; z-index: 1; opacity: 0; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .gallery-item img { width: 100%; } .gallery-item .plus { display: block; position: absolute; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); z-index: 3; opacity: 0; } .gallery-item .plus::before, .gallery-item .plus::after { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background-color: #ffffff; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .gallery-item .plus::before { width: 150px; height: 1px; } .gallery-item .plus::after { width: 1px; height: 150px; } .gallery-item:hover::before { opacity: 0.75; } .gallery-item:hover .plus { opacity: 1; } .gallery-item:hover .plus::before { width: 40px; } .gallery-item:hover .plus::after { height: 40px; } /*===== End of Project ======*/ .footer-widget { margin-bottom: 30px; }