/** chooseus-section **/ .chooseus-section{ position: relative; overflow: hidden; } .chooseus-section .bg-layer:before{ position: absolute; content: ''; width: 100%; height: 100%; left: 0px; top: 0px; opacity: 0.85; } .chooseus-section .sec-title .sub-title{ color: #fff; border-color: #fff !important; } .chooseus-block-one .inner-box{ position: relative; display: block; background: #fff; border-radius: 20px; margin-bottom: 30px; box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.05); padding: 40px 30px; border-top: solid; border-width: 5px; border-color: #7B0000; z-index: 1; transition: all 500ms ease; } .chooseus-block-one .inner-box:hover{ transform: translateY(-10px); } .chooseus-block-one .inner-box:before{ position: absolute; content: ''; background: #7B0000; width: 100%; height: 0%; left: 0px; bottom: 0px; opacity: 0; z-index: -1; transition: all 500ms ease; } .chooseus-block-one .inner-box:hover:before{ opacity: 0.05; height: 100%; top: 0px; } .chooseus-block-one .inner-box .icon-box{ position: relative; display: inline-block; width: 140px; height: 140px; line-height: 140px; text-align: center; border-radius: 50%; font-size: 80px; color: #fff; margin-bottom: 30px; transition: all 500ms ease; } .chooseus-block-one .inner-box h3{ display: block; font-size: 24px; line-height: 30px; margin-bottom: 13px; } .chooseus-block-one .inner-box h3 a{ display: inline-block; color: var(--title-color); } .chooseus-block-one .inner-box h3 a:hover{ } .chooseus-block-one .inner-box p{ margin-bottom: 35px; } .chooseus-block-one .inner-box .theme-btn{ background: transparent; padding: 9px 30px; } .chooseus-block-one .inner-box .theme-btn:hover{ } .chooseus-block-one .inner-box .theme-btn:before{ } /** chooseus-style-two **/ .chooseus-style-two{ position: relative; } .chooseus-block-two .inner-box{ position: relative; display: flex; align-items: center; justify-content: center; width: 300px; height: 300px; background: #fff; box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05); border-radius: 50%; overflow: hidden; margin: 0 auto; margin-bottom: 30px; border-top: 5px solid #640000; transition: all 500ms ease; } .chooseus-block-two .inner-box:hover{ } .chooseus-block:nth-child(2) .chooseus-block-two .inner-box{ border-color: #0B25B6; } .chooseus-block:nth-child(3) .chooseus-block-two .inner-box{ border-color: #06B502; } .chooseus-block:nth-child(4) .chooseus-block-two .inner-box{ border-color: #FF8A00; } .chooseus-block-two .inner-box .icon-box{ position: relative; display: inline-block; font-size: 60px; margin-bottom: 18px; } .chooseus-block:nth-child(2) .chooseus-block-two .inner-box .icon-box{ color: var(--secondary-color); } .chooseus-block:nth-child(3) .chooseus-block-two .inner-box .icon-box{ color: #06B502; } .chooseus-block:nth-child(4) .chooseus-block-two .inner-box .icon-box{ color: #FF8A00; } .chooseus-block-two .inner-box h3{ display: block; font-size: 24px; line-height: 30px; margin-bottom: 11px; } .chooseus-block-two .overlay-content{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 50%; z-index: 2; opacity: 0; transform: scaleX(0); transform-origin: left center; padding: 0px 35px; transition: all 500ms ease; } .chooseus-block-two .inner-box:hover .overlay-content{ transform: scaleX(1); opacity: 1; } .chooseus-block-two .overlay-content h3{ display: block; font-size: 24px; line-height: 30px; color: #fff; margin-bottom: 17px; } .chooseus-block-two .overlay-content p{ color: #fff; font-weight: 500; margin-bottom: 23px; } .chooseus-block-two .overlay-content a{ position: relative; display: inline-block; font-size: 24px; line-height: 30px; color: #fff; font-weight: 800; border-bottom: 1px solid #fff; } /** chooseus-style-three **/ .chooseus-style-three{ position: relative; } .chooseus-style-three .outer-container{ border-radius: 20px; overflow: hidden; background: var(--secondary-color); } .chooseus-style-three .sec-title.light .sub-title{ color: #fff; border-color: #fff !important; } .chooseus-block-three .inner-box{ position: relative; display: block; background: #fff; border-radius: 20px; overflow: hidden; border-top: solid; border-width: 5px; border-color: #7B0000; margin-bottom: 30px; padding: 35px 30px 41px 30px; z-index: 1; } .chooseus-block-three .inner-box:before{ position: absolute; content: ''; width: 100%; height: 0%; left: 0px; bottom: 0px; z-index: -1; transition: all 500ms ease; } .chooseus-block-three .inner-box:hover:before{ height: 100%; top: 0px; } .chooseus-block-three .inner-box .icon-box{ position: relative; display: inline-block; width: 80px; height: 80px; line-height: 80px; text-align: center; border-radius: 50%; font-size: 44px; color: #fff; margin-bottom: 39px; transition: all 500ms ease; } .chooseus-block-three .inner-box:hover .icon-box{ background: #fff; } .chooseus-block-three .inner-box h3{ display: block; font-size: 24px; line-height: 30px; margin-bottom: 11px; } .chooseus-block-three .inner-box h3 a{ display: inline-block; color: var(--title-color); } .chooseus-block-three .inner-box h3 a:hover{ text-decoration: underline; } .chooseus-block-three .inner-box:hover h3 a, .chooseus-block-three .inner-box:hover p, .chooseus-block-three .inner-box:hover .link a{ color: #fff; } .chooseus-block-three .inner-box p{ margin-bottom: 18px; transition: all 500ms ease; } .chooseus-block-three .inner-box .link a{ position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 16px; line-height: 30px; color: var(--title-color); font-weight: 600; } .chooseus-block-three .inner-box .link a i{ font-size: 12px; } /** rtl-css **/ /** responsive-css **/ @media only screen and (max-width: 1200px){ .chooseus-style-three{ padding: 0px; } } @media only screen and (max-width: 991px){ } @media only screen and (max-width: 767px){ .chooseus-section, .chooseus-style-two, .chooseus-style-three .outer-container{ padding: 70px 0px 40px 0px; } } @media only screen and (max-width: 599px){ } @media only screen and (max-width: 499px){ }