/** solutions-section **/ .solutions-section{ padding: 90px 0px; } .solutions-section .content-box{ position: relative; display: block; } .solutions-section .progress-inner{ max-width: 550px; } @media only screen and (max-width: 768px) { .solutions-section .progress-inner{ max-width: none; } } .image_block_two .image-box{ position: relative; display: block; padding-bottom: 137px; padding-left: 140px; } .image_block_two .image-box img{ width: auto; border-radius: 20px; transition: all 500ms ease; } .image_block_two .image-box .image-1{ position: relative; display: block; border-radius: 20px; overflow: hidden; top: -164px; left: -12px; } .image_block_two .image-box .image-1-new{ position: relative; display: block; border-radius: 20px; overflow: hidden; } .image_block_two .image-box:hover .image-1 img{ transform: scale(1.1); } .image_block_two .image-box .image-2{ position: absolute; left: -21px; bottom: 0px; /* background: #fff; */ padding: 10px; border-radius: 20px; filter: drop-shadow(0px 2px 70px rgba(0, 0, 0, 0.1)); } .image_block_two .image-box .image-2-new{ position: absolute; left: -50px; bottom: 0px; /* background: #fff; */ padding: 10px; border-radius: 20px; filter: drop-shadow(0px 2px 70px rgba(0, 0, 0, 0.1)); } .image_block_two .image-box .icon-box{ position: absolute; display: inline-block; left: 65px; top: 145px; width: 150px; height: 150px; line-height: 150px; font-size: 70px; color: #fff; text-align: center; border-radius: 50%; background: var(--theme-color); } @media (max-width: 1200px) { .image_block_two .image-box .icon-box { left: 222px; top: 300px; } } @media (max-width: 425px) { .image_block_two .image-box .icon-box { top: 250px; left: 214px; position: absolute; } } /** RTL-CSS **/ /** RESPONSIVE-CSS **/ @media only screen and (max-width: 1200px){ .image_block_two .image-box .image-2{ left: 0px; } .image_block_two .image-box .image-2-new{ left: 0px; } } @media only screen and (max-width: 1024px){ .image_block_two .image-box .image-1-new{ position: relative; display: block; border-radius: 20px; overflow: hidden; top: 0px !important; } .image_block_two .image-box .image-2-new{ position: absolute; left: 14px !important; bottom: -86px !important; /* background: #fff; */ padding: 10px; border-radius: 20px; filter: drop-shadow(0px 2px 70px rgba(0, 0, 0, 0.1)); } .image_block_two .image-box .my-icon{ position: absolute; left: 300px; top: 97px; } .image-1-ho img{ position: relative; top: 24px; left: -17px; } .renderd-area img{ position: relative; top: -150px; left: -17px; } .image .image-1-ho .aligned-image img{ display: none !important; } .raw-image{ display: none; } .image-box .raw-image .image .raw img{ display: none !important; } } @media only screen and (max-width: 991px){ .solutions-section .content-box{ margin-bottom: 30px; } } @media only screen and (max-width: 768px){ .solutions-section{ padding: 70px 0px 70px 0px; } .image_block_two .image-box .image-1-new { position: relative; display: block; border-radius: 20px; overflow: hidden; top: 10px !important; } .image_block_two .image-box .image-2-new { position: absolute; left: 14px !important; bottom: -36px !important; /* background: #fff; */ padding: 10px; border-radius: 20px; filter: drop-shadow(0px 2px 70px rgba(0, 0, 0, 0.1)); } .image_block_two .image-box .cart-icon{ left: 302px; top: 412px; } .image_block_two .image-box .my-icon{ position: absolute; left: 300px; top: 180px; } .image-1-ho img{ position: relative; top: -23px; left: 49px; } } @media only screen and (max-width: 767px) { .solutions-section { padding: 30px 0; } } @media only screen and (max-width: 500px){ .image_block_two .image-box .image-2-new{ display: none; } .image_block_two .image-box .image-1-new{ left: -15px; } .image-1-ho img{ display: none; } .image_block_two .image-box .my-icon{ position: absolute; left: 250px; top: 290px; } } @media only screen and (max-width: 599px){ .image_block_two .image-box{ padding: 0px; } .image_block_two .image-box .image-2{ position: relative; margin-top: 30px; } .image_block_two .image-box .image-2-new{ position: relative; margin-top: 30px; } } @media only screen and (max-width: 500px){ .image_block_two .image-box .cart-icon{ /* left: 292px; top: 312px; */ display: none; } }