.hero-slider { height: 40vh; } .hero-slider .slider-item { height: 40vh; display: flex !important; justify-content: center; align-items: center; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; } .hero-slider .slider-item:focus { outline: 0; } .hero-slider .slider-item:before { position: absolute; background: rgba(1, 177, 105, 0.65); content: ""; top: 0; height: 100%; width: 100%; } .hero-slider .content { position: relative; z-index: 2; } .hero-slider .content.style h2 { font-size: 36px; } @media (max-width: 767px) { .hero-slider .content.style h2 { font-size: 30px; } } .hero-slider .content.style .offer-text { letter-spacing: 7px; font-size: 15px; margin-bottom: 5px; } .hero-slider .content.style .tag-text { font-size: 20px; font-weight: normal; } .hero-slider .content.style .btn-main { border-radius: 6px; padding: 10px 20px; font-weight: 700; } .hero-slider .content h2 { font-size: 35px; text-transform: capitalize; font-weight: 600; font-family: "Roboto", sans-serif; color: #fff; } .hero-slider .content p { font-size: 26px; color: #fff; } .hero-slider .content .btn-white { background: transparent; text-transform: uppercase; letter-spacing: 1px; color: #fff; border: 1px solid #fff; transition: all 0.3s ease; } .hero-slider .content .btn-white:hover { background: #fff; color: #000; } .hero-slider .slick-dots { bottom: 20px; } .hero-slider .slick-dots li { margin: 0 3px; } .hero-slider .slick-dots li button:before { font-size: 15px; } .hero-slider .slick-dots li.slick-active button:before { color: #fff; } .hero-slider .slick-prev { left: 20px; z-index: 100; } .hero-slider .slick-next { right: 20px; z-index: 100; } .slick-dotted.slick-slider { margin-bottom: 0 !important; } .service-section .items-container .item { margin: 0.5rem 1rem; } .service-section .inner-box .image-content h6 { font-size: 1.2rem; line-height: 1.8rem; padding-top: 6px; padding-bottom: 8px; text-transform: uppercase; } .service-section .inner-box { position: relative; border-radius: 5px 5px 0 0; box-shadow: 0 0 20px #f1f1f1; } .service-section .items-container .slick-next:before, .service-section .items-container .slick-prev:before { font-size: 25px; color: #f59c1a; } .product-section { position: relative; padding: 60px 0; background-repeat: repeat } .product-section:before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100% } .product-section .section-title h3 { position: relative; padding-bottom: 30px; color: #fff; text-transform: uppercase } .product-section .section-title h3 span { color: #f59c1a } .product-section .testimonial-carousel .slide-item { outline: 0 } .product-section .testimonial-carousel .slick-dots li button:before { font-size: 15px; color: #f59c1a } .product-section .inner-box { position: relative; padding: 30px 35px; background: #fff; margin-top: 50px; margin-bottom: 20px; margin-left: 15px; margin-right: 15px; border-radius: 10px; box-shadow: 0 0 10px -2px rgba(0,0,0,.2) } @media screen and (max-width: 525px) { .product-section .inner-box { margin-left:5px; margin-right: 5px } } .product-section .inner-box h6 { position: relative; font-size: 18px; line-height: 26px; font-weight: 600; color: #000; padding-bottom: 15px; text-transform: uppercase; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .product-section .inner-box p { font-size: 15px; line-height: 24px; font-weight: 400; color: #1a1a1a } .product-section .inner-box .image-box { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: #fff } .product-section .inner-box .image-box img { width: 180px; height: 180px } .fa-1 { font-size: calc(1.375rem + 1.5vw) !important; } .team-section { position: relative; z-index: 1; } .team-section .section-title h3 { position: relative; padding-bottom: 30px; } .team-section .section-title p { font-size: 15px; line-height: 26px; color: #777777; font-weight: 400; margin: 0 auto; max-width: 560px; } .team-section .team-member { margin-top: 30px; border-radius: 10px; overflow: hidden; box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.2); } .team-section .team-member img { width: 100%; } .team-section .team-member .contents { background: #fff; padding: 35px 10px; } .team-section .team-member .contents h4 { text-transform: uppercase; letter-spacing: 1px; margin-bottom: 20px; color: #000; position: relative; } .team-section .team-member .contents h4:before { position: absolute; content: ""; width: 30px; height: 1px; background: #777777; bottom: -8px; left: 50%; transform: translateX(-50%); } .team-section .team-member .contents .btn-main { background: #fff; text-transform: uppercase; color: #F5A418; padding: 10px 25px; border: 1px solid #F5A418; transition: all 0.2s ease-in; } .team-section .team-member .contents .btn-main:hover { background: #F5A418; color: #fff; } .team-members .team-person { margin-top: 30px; } .team-members .team-person img { border-radius: 5px; width: 100%; } .team-members .team-person h6 { margin-top: 20px; font-size: 20px; text-transform: uppercase; color: #000; } .team-members .team-person p { font-weight: bold; letter-spacing: 1px; text-transform: uppercase; font-size: 14px; font-family: "Source Sans Pro", sans-serif; } .contact-cont { width: 100%; padding: 3rem; background: rgba(1,177,105,.65) } .media-post-wrap .thumb { position: relative; border-radius: 5px } .media-post-wrap .thumb img { width: 100%; border-radius: 5px } @media (min-width: 992px) { .contact-cont { padding:3rem; margin: 2rem 0 } .img-container,.img-container-r { display: flex; align-items: center; justify-content: space-between } .img-container-r { flex-direction: row-reverse } } .contact-area form { margin-top: 60px } .contact-area .form-group { position: relative; margin-bottom: 20px } .contact-area input,.contact-area textarea { position: relative; width: 100%; height: 50px; color: #777; padding: 10px 25px; background: #f4f4f4; display: block; border: 1px solid #ececec } .contact-area .form-group select { -webkit-appearance: none; -ms-appearance: none; -moz-appearance: none; -o-appearance: none; height: 50px; width: 100%; padding: 10px 20px; border: 1px solid #ececec; background: #f4f4f4 url(../images/icons/icon-select.png) right center no-repeat; cursor: pointer } .contact-area .form-group option { font-weight: 400; display: block; white-space: pre; height: 50px; padding: 20px } .contact-area .form-group option:hover { background: #7b64cb } .contact-area textarea { height: 190px; resize: none; padding-top: 15px } .contact-area button { width: 100%; height: 50px } .contact-area .form-group i { position: absolute; top: 16px; right: 20px; font-size: 15px } .btn-style-one { font-size: 14px; font-weight: 600; color: #fff; line-height: 27px; padding: 8px 36px; background: #f59c1a; border: 1px solid #f59c1a; display: inline-block; text-transform: uppercase; font-family: "Source Sans Pro",sans-serif; transition: all .5s ease; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; border-radius: 0.375rem; } .btn-style-one:hover { color: #f59c1a; border: 1px solid #f59c1a; background: #fff; transition: all .5s ease; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease } .thumbnail-news { position: relative; overflow: hidden; max-height: 120px } .caption { position: absolute; top: 0; right: 0; background: rgba(245,156,26,.72); width: 100%; height: 100%; padding: 2%; display: none; text-align: center; color: #fff!important; z-index: 2 } .caption i { margin: 30% 4px; border: 2px solid #fff; color: #fff!important; cursor: pointer; font-size: 25px; border-radius: 50%; padding: 5px; transition: border .2s ease,font-size .2s ease } .heading-border-light { width: 30px; height: 5px; background-color: #f59c1a; margin: 0 0 20px 0 } .desc-news-cont { margin-bottom: 10px; box-shadow: 3px 3px 10px 1px rgb(158 158 158 / 68%); -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .desc-news-cont:hover { margin-bottom: 10px; border-bottom: 5px solid #f59c1a; margin-top: -5px; } .desc-news-cont h3 { padding: 10px 10px 0; font-size: 18px; text-transform: none } .desc-news-cont p { padding: 0 10px; font-size: 14px } .desc-news-cont .last { position: relative; height: 30px; line-height: 30px; padding: 0 10px } .desc-news-cont span { position: absolute; left: 10px } .desc-news-cont a { line-height: 30px } @media (min-width: 768px) and (max-width:991px) { .news-section { margin-left:10px } .news-section .col-md-3:first-child { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%!important } .news-section .col-md-3 { -ms-flex: 0 0 33%; flex: 0 0 33%; max-width: 33%!important } } @media (max-width: 767px) { .desc-news { margin-top:20px } .subbanner_main_search { top: 0 } } @media (max-width: 575px) { .news-section .col-sm-6 { -ms-flex:0 0 70%; flex: 0 0 70%; max-width: 70%!important } .desc-news { margin: 20px auto } .subbanner_main_search { top: 0 } } @media (max-width: 420px) { .news-section .col-sm-6 { -ms-flex:0 0 95%; flex: 0 0 95%; max-width: 95%!important } .subbanner_main_search { top: 0 } } @media (min-width: 1600px) { .desc-news-cont p { padding:0 10px; font-size: 16px } }