/* ------------------------------------------------------------------------------------- * Author : Stephen K * * Version : * * File Description : Main Css file of the website * *------------------------------------------------------------------------------------ */ /*********************** 1.BASIC * 2.HELPER * 3.NAVBAR * 4.HOME * 5.FEATURES 6.ABOUT US * 7.OUR DEPARTMENTS * 8.REVIEWS * 9.OUR TEAM * 10.PREMISES * 11.APPOINTMENT * 12.FAQ's * 13.FOOTER * 14.RESPONSIVE * ************************/ /*====================== 1.BASIC ========================*/ input { color: #d52c3e; } *{ font-family: "Lato", sans-serif; } body { font-family: "Lato", sans-serif; overflow-x: hidden; font-weight: 400; background-color: #fff; animation: pageAnimation ease .1s; animation-iteration-count: 1; animation-fill-mode: forwards; font-size: 10px; } html{ font-size: 10px; } @keyframes pageAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } h1, h2, h3, h4, h5, h6 { font-family: "Lato", sans-serif; font-weight: 700; text-align: left; } .sub-title { font-size: 20px; } h1 { font-size: 5rem; text-align: center; } h2{ font-size: 4rem; } h3{ font-size: 3rem; } h4{ font-size: 2rem; } h5 { } p { font-size: 15px; line-height: 1.6; } li{ font-size: 1.5rem; list-style: none; } a, a:hover, a:focus, button, button:focus { text-decoration: none !important; outline: none !important; box-shadow: none !important; } a { color: #d52c3e; } iframe{ height: 160px; } ::selection { background: rgba(166, 175, 189, 0.3); } ::-moz-selection { background: rgba(166, 175, 189, 0.3); } .back_top { border: none; text-align: center; position: fixed; background: none; bottom: 20px; right: 20px; height: none; width: none; display: none; transition: all 0.5s; border-radius: 20px !important; z-index: 99; } .back_top img { font-size: 30px; color: #d52c3e; line-height: 30px; display: block; } .mb-30 { margin-bottom: 30px; } .p0{ padding: 0; } .fl{ float: left; } ::-webkit-scrollbar { -webkit-appearance: none; } ::-webkit-scrollbar:vertical { width: 12px; } ::-webkit-scrollbar:horizontal { height: 12px; } ::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, .5); border-radius: 10px; border: 2px solid #ffffff; } ::-webkit-scrollbar-track { border-radius: 10px; background-color: #ffffff; } @media (max-width: 768px){ iframe{ height: 200px; } .col-sm-6{ width: 50%; } } @-webkit-keyframes BounceAnimation { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); } 40% { -webkit-transform: translateY(-20px); } 60% { -webkit-transform: translateY(-10px); } } @-moz-keyframes BounceAnimation { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); } 40% { -moz-transform: translateY(-20px); } 60% { -moz-transform: translateY(-10px); } } @keyframes BounceAnimation { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-20px); } 60% { transform: translateY(-10px); } } /*========================== 2.HELPER ============================*/ .font-white { color: #fff; } .section { padding-top: 50px; padding-bottom: 40px; background-color: #fff; position: relative; text-align: justify; } .cities-banner { padding-top: 40px; } .section-title h2 { position: relative; font-size: 50px; } section h1{ font-size: 50px; } section .p20{ font-size: 20px; } .section-subtitle { font-size: 15px; max-width: 550px; line-height: 1.5x; padding-top: 0; } .toppadding{ padding-top: 120px; } .z-index-9 { position: relative; z-index: 9; } .z-index { z-index: 2; } .inverse-bg { background-color: #ffffff; padding-bottom: 0px; position: sticky; } .btn { padding: 12px 28px; } .btn-sm { padding: 8px 15px; } .btn-rounded { -webkit-border-radius: 30px !important; -moz-border-radius: 30px !important; border-radius: 30px !important; } .btn-white { background-color: #fff; color: #000 !important; font-size: 14px; font-weight: 500; letter-spacing: 1px; min-width: 140px; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; transition: all 0.5s; text-transform: capitalize; -webkit-box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15); -moz-box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15); box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15); } .videoframe { width:100%; height:336px; } .btn { font-size: 14px; text-align: center; padding: 0; text-transform: uppercase; font-weight: 600; height: 32px; line-height: 36px; } .btn1 { font-size: 14px; text-align: center; padding: 0; text-transform: uppercase; font-weight: 600; height: 46px; line-height: 46px; } .btn-white:hover, .btn-white:focus, .btn-white:active, .btn-white.active, .btn-white.focus, .btn-white:active, .btn-white:focus, .btn-white:hover, .open > .dropdown-toggle.btn-white { color: #fff !important; } .owl-nav{ background: transparent; color: #0000009e; font-size: 120px; width: 100%; line-height: 0; margin: auto; padding: 0 100px; position: absolute; top: 400px; } .owl-carousel .owl-nav button.owl-prev{ left: 0; padding-left: 20px; } .owl-carousel .owl-nav button.owl-next{ right: 0; padding-right: 20px; float: right; } .kolkata-para { margin:30px 0px 30px 0px; } .youtube { background-color: #000; margin-bottom: 30px; position: relative; padding-top: 55%; overflow: hidden; cursor: pointer; } .youtube img { width: 100%; top: -18.3%; left: 0; opacity: 1; } .youtube .play-button { width: 90px; height: 60px; background-color: #333; box-shadow: 0 0 30px rgba( 0,0,0,0.6 ); z-index: 1; opacity: 0.8; border-radius: 6px; } .youtube .play-button:before { content: ""; border-style: solid; border-width: 15px 0 15px 26.0px; border-color: transparent transparent transparent #fff; } .youtube img, .youtube .play-button { cursor: pointer; } .youtube img, .youtube iframe, .youtube .play-button, .youtube .play-button:before { position: absolute; } .youtube .play-button, .youtube .play-button:before { top: 50%; left: 50%; transform: translate3d( -50%, -50%, 0 ); } .youtube iframe { height: 100%; width: 100%; top: 0; left: 0; } /*========================== 3.NAVBAR ============================*/ .custom-nav { background-color: #d52c3e; width: 100%; padding: 10px 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; margin-bottom: 0px; z-index: 999; border-bottom: 1px solid #ffffff1a; } .custom-nav .container-fluid { width: 90%; } .custom-nav.sticky-header { background-color: #fff; box-shadow: 0px 0px 18px 1px rgba(0, 0, 0, 0.1); } .custom-nav .navbar-nav li a { position: relative; color: rgb(255 255 255 / 60%); font-size: 16px; font-weight: 600; padding: 6px 16px !important; margin: 0 3px; } .custom-nav .navbar-nav li a::before, .custom-nav .navbar-nav li a::after { position: absolute; content: ''; width: 12px; height: 2px; background-color: #ffffff00; left: 50%; bottom: 0px; opacity: 0; -webkit-transition: all .3s ease-out 0s; -moz-transition: all .3s ease-out 0s; -o-transition: all .3s ease-out 0s; transition: all .3s ease-out 0s; } .custom-nav .navbar-nav li a::after { left: auto; right: 50%; } .custom-nav .navbar-nav li.active a::before, .custom-nav .navbar-nav li.active a::after, .custom-nav .navbar-nav li:hover a::before, .custom-nav .navbar-nav li:hover a::after { opacity: 1; } .navbar-toggler { color: #d52c3e; font-size: 28px; margin-top: 2px; margin-bottom: 0px; } .custom-nav.sticky-header .navbar-nav li a { color: rgba(0, 0, 0, 0.6) !important; } .custom-nav.sticky-header .navbar-nav li a::before, .custom-nav.sticky-header .navbar-nav li a::after {} .navbar-toggle { color: #ffffff; font-size: 24px; margin-top: 5px; margin-bottom: 0px; } .custom-nav .navbar-nav li.active a, .custom-nav .navbar-nav li:hover a, .custom-nav .navbar-nav li:active a { color: #ffffff; } .custom-nav.sticky-header .navbar-nav li.active a, .custom-nav.sticky-header .navbar-nav li:hover a, .custom-nav.sticky-header .navbar-nav li:active a { color: #d52c3e !important; } .nav .open > a, .nav .open > a:focus, .nav .open > a:hover { background-color: transparent; border-color: #0ebdca; } .dropdown-item:focus, .dropdown-item:hover { color: #16181b; text-decoration: none; background-color: #c71d2f00; } .brand-logo .logo-light { display: inline-block; } .sticky-header .brand-logo .logo-dark { display: inline-block; } .sticky-header .brand-logo .logo-light { display: inline-block; } .brand-logo .logo-dark { display: none; } .custom-nav .navbar-brand.brand-logo img { height: 30px; float: left; } .navbar-brand h2 { font-size: 28px; margin: 0 0px 0px 5px; float: left; color: #d52c3e; } .sticky-header .navbar-brand h2 { color: #d52c3e; } .navbar-brand :hover { color: #d52c3e; } .navbar a:hover { color: #d52c3e; } .sticky-header .dropdown-menu { background-color: #ffffff; } .dropdown-menu { background-color: #d52c3e; border: 0px solid rgba(0, 0, 0, .15); min-width: 7.5rem; } .custom-nav.sticky-header .dropdown-menu{ background-color: #ffffff } .dropdown-toggle:hover .dropdown-menu{ display: block; } @media all and (min-width: 992px) { .navbar .nav-item .dropdown-menu{ display: none; } .navbar .nav-item:hover .nav-link{ color: #ffffff; } .navbar .nav-item:hover .dropdown-menu{ display: block; } .navbar .nav-item .dropdown-menu{ margin-top:0; } } .contact_btn .btn-sm { background-color: #ffffff; border: 2px solid #fff; color: #d52c3e; font-size: 30px; width: 250px; text-transform: capitalize; font-weight: 600; min-width: 120px; height: 37px; border-radius: 40px; display: flex; justify-content: center; transition: none; align-items: center; letter-spacing: 1px; -webkit-box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15) !important; -moz-box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15) !important; box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15) !important; } .sticky-header .contact_btn .btn-sm { background: #d52c3e; border: 2px solid #d52c3e; color: #fff; } .contact_btn .btn-sm:hover { color: #d63042; background-color: #ffffff; border: 2px solid #d52c3f; } .helplinetextcolor { font-size: 20px; color: black; margin-top: 10px; font-weight: 600; margin-left: 2px; } @media (max-width: 991px){ .contact_btn .btn-sm{ background: #d52c3e; border: 2px solid #d52c3e; color: #fff; min-width: 70px; } } .custom-nav .neons li a { margin-top: -1px; text-align: center; display: flex; justify-content: center; align-items: center; } .custom-nav.sticky-header .navbar-nav .neons span{ font-size: 16px; text-align: center; /* font-weight: 600; font-family: "Codystar"; text-transform: lowercase; */ -webkit-animation: glow1 1s ease-in-out infinite alternate; -moz-animation: glow1 1s ease-in-out infinite alternate; animation: glow1 1s ease-in-out infinite alternate; } @-webkit-keyframes glow1 { from { color: #d52c3e; } to { color: #1d1d1d; } } .custom-nav .navbar-nav .neons span { font-size: 16px; text-align: center; /* font-weight: 600; font-family: "Codystar"; text-transform: lowercase; */ -webkit-animation: glow 1s ease-in-out infinite alternate; -moz-animation: glow 1s ease-in-out infinite alternate; animation: glow 1s ease-in-out infinite alternate; } @-webkit-keyframes glow { from { color: #ffffff; } to { color: #1d1d1d; } } } /*========================== waves ============================*/ .tabcontent { float: left; padding: 13px 12px; width: 50%; background-image:url(images/app/phoneframe.png); border-left: none; } .blog-height { margin-left: auto; margin-right: auto; display: block; width: 100%; margin-top: 10px; } .ocean { height: 100px; width: 100%; position: relative; bottom: 0px; left: 0; background: #ffffff; overflow: hidden; } .wave { background: url(../images/wave2.svg) repeat-x; position: absolute; top: 0; width: 6400px; height: 100%; animation: wave 3s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite; transform: translate3d(0, 0, 0); } .wave:nth-of-type(2) { top: 1px; animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite; opacity: 1; } @keyframes wave { 0% { margin-left: 0; } 100% { margin-left: -1600px; } } @keyframes swell { 0%, 100% { transform: translate3d(0,-25px,0); } 50% { transform: translate3d(0,5px,0); } } #section-heading { font-size: 50px; text-align: center; } .section-heading{ font-size: 50px; text-align: center; } .ambu-fleet-options .section-heading { font-size: 33px; } .tabstories { overflow: hidden; display: block; padding: 100px 0px 14px; margin: auto; width: 25%; } /* Style the buttons inside the tab */ .tabstories button { background-color: #d52c3e; float: left; border: none; color: white; outline: none; margin: 3px; border-radius: 7px; cursor: pointer; padding: 10px 16px; transition: 0.3s; font-size: 17px; } /* Change background color of buttons on hover */ .tabstories button:hover { background-color: #eee; color: #d52c3e; } /* Create an active/current tablink class */ .tabstories button.active { background: #fffffff6; color: #d52c3e; border-top: 3px solid #d52c3e; } /* Style the tab content */ .tabstoriescontent { display: none; padding: 6px 12px; border-top: none; } /*========================== HOME ============================*/ .owl-carousel .owl-item img { display: block; width: auto; float: none; margin: auto; } .apparea{ position: absolute; top: 100px; width: 100%; } .home-bg, .home-section { position: relative; } .brand-logo { height: 60px; width: 110px; background-image: url(../images/logo.png); background-position: center; background-size: contain; background-repeat: no-repeat; color: #ffffff; font-size: 1.5rem; } .sticky-header .brand-logo { background-image: url(../images/logo.png); } @media (max-width:789px){ .brand-logo { height: 36px; width: 150px; background-image: url(../images/logo.png); } } #emergencycontact{ } #emergencycontact a:hover .sidebaremergency{ right: 0px; opacity: 1; } /*-108 sidebar-*/ .sidebaremergency { background-color: #dc3549; display: block; position: fixed; top: 40%; z-index: 100; padding: 10px; border-radius: 20px 0 0 20px; box-shadow: 0px 0px 10px #0000009e; color: #ffffff; right: -415px; transition: .3s; opacity: .3; } .sidebaremergency :hover{ right: 0px; } .sidebaremergency h1 { font-size: 60px; margin: 0; line-height: 0; } .sidebaremergency h2 { font-size: 15px; margin: 0; } .mainsliderh{ } @media(max-width:768px) { .sidebaremergency { display: none; } .mainsliderh{ } } .home-slider { position: relative; z-index: 9; background: #d52c3e; } .home-bg::before { content: ""; top: 0; left: 0; right: 0; bottom: 0; position: absolute; opacity: 0.75; z-index: 1; } .home-bg .heading { color: #fff; font-size: 60px; line-height: 60px; margin-bottom: 15px; } .home-bg .para-sec { font-size: 20px; color: rgba(255, 255, 255, 0.85); margin-bottom: 20px; } .home-bg.waves-bg { margin: 0 0 0; padding: 8rem 0 0 0; } .hero-bg { background-image: url(../images/hero-bg.png); opacity: 1; top: 0; left: 0; height: 100%; width: 100%; } @media (max-width:768px){ .home-slider { top: 60px; } } .bg-gradient { background-color: #d52c3e; /*background-image: url(../images/hero-bg.png);*/ } @keyframes owl-content-fadeInUp { from { transform: translate3d(0, 40px, 0); } to { transform: translate3d(0, 0, 0); opacity: 1; } } @-webkit-keyframes owl-content-fadeInUp { from { transform: translate3d(0, 40px, 0); } to { transform: translate3d(0, 0, 0); opacity: 1; } } @keyframes owl-img-fadeInRight { from { transform: translateX(40px); } to { transform: translateX(0); opacity: 1; } } @-webkit-keyframes owl-img-fadeInRight { from { transform: translateX(40px); } to { transform: translateX(0); opacity: 1; } } .owl-item.active .content-fadeInUp { animation-duration: .1s; animation-fill-mode: both; -webkit-animation-duration: .1s; -webkit-animation-fill-mode: both; opacity: 0; animation-name: owl-content-fadeInUp; -webkit-animation-name: owl-content-fadeInUp; } .owl-item.active .img-fadeInRight { animation-duration: .1s; animation-fill-mode: both; -webkit-animation-duration: .1s; -webkit-animation-fill-mode: both; opacity: 0; animation-name: owl-img-fadeInRight; -webkit-animation-name: owl-img-fadeInRight; } .home-slider .owl-dots, .review-slider .owl-dots { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); } .home-slider .owl-dot, .review-slider .owl-dot { background: rgba(255, 255, 255, 0.4) !important; height: 10px; width: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin: 0 5px; } .home-slider .owl-dot.active, .review-slider .owl-dot.active { background: #fff !important; } .hero-waves { height: 120px; position: relative; margin-top: -80px; z-index: 10; } .hero-waves .wave { position: absolute; left: 0; right: 0; top: 0; z-index: 1; } .hero-waves .wave + .wave { z-index: 2; } @media (max-width:768px){ .hero-waves { margin-top: 0px; } } /*========================== Main Page ============================*/ /*-- Section promise --*/ .slider-trasnform-text { transform: translateX(9%); } #ourpromise { } .servicepromise{ padding: 30px; background: #d52c3e; color: #fff; } .servicepromise h1 { font-size: 50px; text-align: left; } .servicepromise p { padding-top: 20px; } .servicepromise a{ color: #fff; } .promiseimage{ padding: 0; } .promiseimage img{ width: 100%; min-height: 100%; } @media (max-width:768px){ .servicepromise{ background: #ffffff; color: #000000; } .servicepromise p { text-align: left; } .servicepromise a{ color: #d52c3e; } } /*------- booking steps -------*/ .basup{ background-size: cover; background-position: center; transition: .3s; } .basup :hover{ } .bookingambisteps{ padding: 160px 20px; transition: .3s; text-align: center; } .bookingambisteps p{ text-align: center; } .bookingambisteps i{ font-size: 60px; text-align: center; display: block; padding: 0px 0; } .bookingambisteps h3{ text-align: center; padding: 10px 0px 0px 0; } @media(max-width:991px){ .bookingambisteps{ text-align: center; } } /*-- Need Ambulance --*/ .videowriteup { background: #d52c3e; color: white; } .videowriteup iframe{ box-shadow: 0px 8px 10px 0px #0000003d; height:300px; } .videowriteup p{ padding: 20px; } .needambulancewriteup { padding: 60px 0; } .needambulancewriteup h2 { font-size: 50px; } .needambulancewriteup p { } @media (max-width:768px){ .videowriteup iframe{ height: 200px; } } /*------- booking steps -------*/ .ambalance-features{ background: #FFFFFF; padding: 33px 0; margin-top: -48px; margin-bottom: 41px; letter-spacing: 0.3px; -webkit-box-shadow: 0 0 8px 0 rgb(0 0 0 / 25%); box-shadow: 0 -3px 4px 2px rgb(0 0 0 / 25%); position: relative; z-index: 1; } .bookingbloodsteps{ padding: 100px 0; background-size: cover; background-position: center; background-color: #d8d8d8; color: #ffffff; text-align: center; } .bookingbloodsteps :hover{ } .bookingbloodsteps i{ font-size: 60px; text-align: center; padding: 0px 30px; display: block; } .bookingbloodsteps h3{ text-align: center; padding: 10px 0px 0px 0; } .bookingbloodsteps p{ text-align: center; } @media (max-width:768px){ .bookingbloodsteps { padding: 50px 20px; min-height: 300px; } .bookingbloodsteps h3{ text-align: center; padding: 10px 5px 0px 5px; font-size: 20px; } } /*-- main download --*/ .swiper-images-animation { width: 214px; border-radius: 20px; } .swiper-full-mobile .swiper-slide .screenshot{ padding: 100px 0; } .screenshot-slider{ position: relative; padding-top: 14px; max-width: 100%; margin: 0 auto; } .screenshot-phone { position: absolute; top: 4px; left: 49.6%; width: calc(21% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .screenshot-phone img{ width: 100%; } .screenshot-single p{ padding-top: 20px; position: relative; width: 140%; font-weight: 600; margin-left: -20%; text-align: center; font-size: 18px; color: #ffffff; line-height: 1.5em; opacity: 0; transition: all 0.5s; } .screenshot-slider .center .screenshot-single p{ opacity: 1; } .screenshot-single img{ border-radius: 16px; } .screenshot-slider .owl-nav{ text-align: center; padding-top: 30px; } .screenshot-slider .owl-dots{ text-align: center; margin: 70px 0px 30px; } .screenshot-slider .owl-dot{ display: inline-block; margin: 0 4px; } .screenshot-slider .owl-dot span{ display: block; width: 11px; height: 11px; border: 2px solid #ea959e; border-radius: 50%; } .screenshot-slider .owl-dot.active span{ background: #ffffff; } .appDmain{ width: 46%; float: left; padding: 50px 30px; margin: 2%; } .appDmain i{ line-height: 0; padding:0; } .appDmain h3{ top: 50%; display: block; position: relative; transform: translateY(50%); font-size: 30px; text-align: center; } .ambl-100 { width: 100%!important; padding: 10px; border-radius: 20px; background: #d0d0d0; } .bannertop{ } .media-margin { padding: 30px 0px 10px; } .bannertop-h3 { margin:55px 30px 0px 66px; font-size: 60px; text-align: left; } .bannertop-h4 { color: #333333; float:left; padding-bottom: 7px; margin-left: 8px; font-size: 20px; } .type-ambu { padding: 10px 0px 20px 0px; text-align: center; } .footer-address{ margin-left: 13px; } .footer-location { width: 50%; } #footer { position: sticky; } .fixed-btn{ position: fixed; bottom: 14%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #d52c3e; width: 260px; padding: 6px line-height: 45px; text-align: center; border-radius: 20px; box-shadow: 4px 4px 4px #d20000; cursor: pointer; } .fixed-btn a{ color: white } .fixed-btn p{ /* text-transform: uppercase; */ font-family: arial; font-weight: 700; margin: 6px 4px 3px 4px; font-size: 24px; color: #fff; } .fixed-btn:active{ box-shadow: 0 0; } .feedback:hover { width: 100px; } .ambulance-paragraph { text-align:center; } @media (max-width:768px){ .bannertop{ height: auto; } .bannertop-h3 { margin: 11px 0px 0px 20px; font-size: 27px; } .kolkata-para { margin: 16px 0px 14px 0px; } .bannertop-h4 { margin:0px 0px 0px 10px; font-size: 14px; } .type-ambu { text-align: center; } .btn-banner1 { background: linear-gradient(to bottom, #b84662 0%, #ca344a 100%); color: #ffffff; width: 128px; border-radius: 7px; } .btn-banner2 { background: linear-gradient(to bottom, #b84662 0%, #ca344a 100%); color: #ffffff; width: 128px; border-radius: 7px; } .btn1 { font-size: 11px; } .helplinetextcolor { font-size: 10px; color: black; margin-top:10px; margin-left: 2px; } } @media (max-width:1024px){ .appDmain h3{ font-size: 20px; } } /*========================== Services Ambulance ============================*/ #differentambi{ } #differentambi p{ } .differentambimg{ background-image: url(../images/slider-img/ambulance.jpg); background-size: cover; background-position: center; border-radius: 30px; } #differentambi ul{ padding: 5px; } #differentambi li{ background: #f8f8f8; border: 1px solid #eee; padding: 5px; margin: 5px; font-weight: 600; } /*========================== Services Blood ============================*/ .blooddonationimg{ background-image: url(../images/slider-img/donateblood.jpg); background-size: cover; background-position: center; border-radius: 30px; } .bloodrequest { box-shadow: 2px 3px 10px #0000001f; padding: 30px; } .bloodrequest h3 { padding-top: 20px; text-align: center; } .bloodrequest { padding-top: 20px; } .pargraph-section { width: 1088px; margin-left: 125px; } /*========================== Joinus ============================*/ /*-- Service Providers --*/ .btn-ambipalm { position: relative; border-radius: 7px; font-size: 18px; padding: 4px 15px; border: none; color: white; background: #dc3346; display: block; margin: -181px 99px auto auto; } .load-more-container { /*margin: 0px auto; */ margin-top: -81px; position: relative; } .load-more-container ul { list-style-type: none; padding: 0; } .load-more-container ul:after { content: ""; display: table; clear: both; } .load-more-container ul li { width: calc(25% - 10px); /* width: 100%; */ margin: 10px 5px 0; height: 163px; color: #fff; float: left; border-radius: 2px; } .load-more-container ul li:nth-child(1n + 9) { max-height: 0; opacity: 0; transition: 0.1s ease-in; } .load-more-container h4 { margin: auto; display: block; width: 20%; } .load-more-container .load-more-btn { width: 265px; float: right; height: 151px; border-radius: 20px; font-size: 18px; padding: 60px 0px; position: relative; line-height: 33px; border-radius: 5px; margin: -181px 7px auto auto; background: #ffffff69; display: block; color: #fff; cursor: pointer; text-align: center; } .load-more-container .load-more-btn .unloaded { background: #d52c3f; padding:5px 10px; border-radius: 10px; } .load-more-container .load-more-btn:hover { } .load-more-container .load-more-btn .loaded { display: none; } .load-more-container #load-more { display: none; } .load-more-container #load-more:checked ~ ul li:nth-child(1n + 9) { max-height: 999px; opacity: 1; transition: 0.2s ease-in; } .load-more-container #load-more:checked ~ .load-more-btn .loaded { display: block; } .load-more-container #load-more:checked ~ .load-more-btn { display: none; } .container .image-gallery:checked ~ .btn-ambipalm{ display: none; } .load-more-container1 { margin: 0px auto; position: relative; } .load-more-container1 ul { list-style-type: none; padding: 0; } .load-more-container1 ul:after { content: ""; display: table; clear: both; } .load-more-container1 ul li { width: calc(25% - 10px); /* width: 100%; */ margin: 10px 5px 0; height: 150px; color: #fff; background: white; float: left; border-radius: 26px; } .load-more-container1 ul li:nth-child(1n + 9) { max-height: 0; opacity: 0; transition: 0.1s ease-in; } .load-more-container1 .load-more-btn1 { width: 260px; float: right; height: 151px; border-radius: 30px; font-size: 18px; padding: 60px 0px; position: relative; line-height: 33px; margin: -160px 7px auto auto; background: #ffffff69; display: block; color: #fff; cursor: pointer; text-align: center; } .load-more-container1 .load-more-btn1 .unloaded1 { background: #d52c3f; padding:5px 10px; border-radius: 10px; } .load-more-container1 .load-more-btn1:hover { } .load-more-container1 .load-more-btn1 .loaded { display: none; } .load-more-container1 #load-more1 { display: none; } .load-more-container1 #load-more1:checked ~ ul li:nth-child(1n + 9) { max-height: 999px; opacity: 1; transition: 0.2s ease-in; } .load-more-container1 #load-more1:checked ~ .load-more-btn1 .loaded1 { display: block; } .load-more-container1 #load-more1:checked ~ .load-more-btn1 { display: none; } .animated.discount-lable { -webkit-animation-delay: 3s; -moz-animation-delay: 3s; animation-delay: 3s; } .swiper-container { width: 100%; height: 100%; } .swiper-full-mobile { position: relative; margin: 0px auto; } /*.swiper-full-mobile:before { content: ""; width: 235px; background: url(../images/phone.png); background-size: 100%; background-repeat: no-repeat; position: absolute; left: 0; right: 0; top: -32px; height: 406px; z-index: 2; margin: auto; }*/ .swiper-full-mobile .swiper-slide { height: 100%; } .swiper-full-mobile .swiper-slide img{ border-radius: 30px; object-fit: cover; } .swiper-slide.swiper-slide-active img { border-radius: 30px; } .numberofproviders { padding-top: 0px; padding-bottom: 60px; position: sticky; height: 100% } .numberofproviders h2 { line-height: 1; color: #000000; z-index: 10; font-size: 50px; width: 100%; } .numberofproviders h1 { z-index: 10; padding-top: 45vh; font-size: 340px;; text-align: left; line-height: 1; color: #d52c3e; } .providersimg { width: 100%; position: absolute; } .animationambulancestop { position: sticky; padding: 120px 0px 40px 0px; } .marvel-device.note8 { width: 252px; height: 502px; margin:auto; display: block; background: black; border-radius: 34px; padding: 10px 10px; } .marvel-device.note8 .header { background: #1c1c1c; border-bottom-left-radius: 13px; border-bottom-right-radius: 13px; height: 24px; left: 50%; margin-left: -82px; position: absolute; top: 10px; width: 164px; z-index: 199; } .marvel-device.note8 .header:before { content: ""; position: absolute; top: 0; left: -6px; width: 14px; height: 10px; background-size: 50% 100%; background-repeat: no-repeat; background-image: radial-gradient(circle at 0 100%, transparent 6px, #222 7px); } .marvel-device.note8 .header:after { content: ""; position: absolute; top: 0; left: 157px; width: 14px; height: 20px; background-size: 100% 50%; background-repeat: no-repeat; background-image: radial-gradient(circle at 100% 100%, transparent 6px, #222 7px); } .header:after { left: 100%; margin-right: corner-sizepx; } .marvel-device .top-bar, .marvel-device .bottom-bar { height: 3px; background: black; width: 100%; display: block; } .marvel-device.note8 .sleep { width: 2px; height: 89px; background: black; position: absolute; top: 128px; right: -2px; } .marvel-device.note8 .volume { width: 2px; height: 43px; background: black; position: absolute; top: 130px; left: -2px; } .marvel-device.note8 .volume:after { content: ''; top: -46px; width: 2px; position: absolute; left: 0; background: black; height: 22px; } .marvel-device.note8 .volume:before { content: ''; top: 56px; width: 2px; position: absolute; left: 0; background: black; height: 43px; } .marvel-device.note8 .camera { height: 18px; width: 18px; left: 86px; position: absolute; top: 18px; background: #212b36; z-index: 1; border-radius: 100%; } .marvel-device.note8 .camera:before { content: ''; height: 8px; width: 8px; left: -22px; position: absolute; top: 5px; background: #212b36; z-index: 1; border-radius: 100%; } .marvel-device.note8 .screen { border-radius: 29px; -webkit-box-shadow: none; box-shadow: none; } .marvel-device .screen { text-align: center; } .marvel-device { display: inline-block; position: relative; -webkit-box-sizing: content-box !important; box-sizing: content-box !important; } .marvel-device .screen { text-align: center; } .marvel-device .screen { width: 100%; /*position: relative; */ height: 100%; z-index: 3; background: white; overflow: hidden; display: block; border-radius: 1px; -webkit-box-shadow: 0 0 0 3px #111; box-shadow: 0 0 0 3px #111; } .marvel-device .screen { text-align: center; } .screen-container { height: 100%; } .mySlides { height: 100%; margin-left: auto; margin-right: auto; width: 725px; position: absolute; right: -66%; } .mySlides1{ width:162px; height: 162px; position: absolute; margin-top: -109px; padding: 50px 20px; border-radius: 50%; color:white; overflow: hidden; /* margin-right: 34px; */ text-align: center; /* float: right; */ margin-left: 371px; } .appdesignone { margin-left: 258px; } .appdesignslider { margin-left: 176px; font-size: 31px; margin-bottom: 0.01rem; } .appdesignheading{ text-align: center; margin-left: 113px; font-size: 31px; margin-top: -34px; } .appdesignappheader { font-size: 30px; font-weight: 900; text-align: center; margin: -56px -128px 0px 0px; position: relative; line-height: 170px; } .skewblood { width: calc(32%); margin:0px -2px; } .skewwrapper { margin-left:-69px; margin-right:-128px; } .skewblood { background: aqua; margin-left: 0px; -webkit-transform: skew( 12deg,0); transform: skew( 12deg,0); } .skewblood-top .skew-content:before { background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.25) 0%,rgba(255,255,255,0) 0%); transition: ease-in-out; -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .skew-content:before { background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.25) 0%,rgba(255,255,255,0) 0%); } .skewblood-top{ height: 560px; } .skewblood:hover:before { content: ""; z-index: 1; position: absolute; left: 0%; width: 100%; height: 100%; /* background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.25) 50%,rgba(255,255,255,0) 100%); */ -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; } .skewblood:after, .skewblood:before { content: ''; display: block; position: absolute; z-index: 3; left: 0; width: 100%; height: 10px; /*background-color: #ffffff17; */ -webkit-transition: height .13s; transition: height .13s; } .skewblood:hover .skewblood-top:after, .skewblood:hover .skewblood-top:before { height: 0; } .skewblood .skewblood-top:after { bottom: 0; } .skewblood .skewblood-top:after, .skewblood .skewblood-top:before { content: ''; width: calc(100% + 4px); height: 10px; background-color: #fff; display: block; position: absolute; left: 0px; -webkit-transition: height .13s; transition: height .13s; } .skewblood .skew_item-title { vertical-align: top; display: inline-block; text-align: center; } .skewblood .ambulance-services_img { width:257px; } .skewblood .free-blood-services_img { width:90px; } .skewblood .ambitales_img { width:255px; } .skewblood-top .skew-content { padding: 20px 30px; text-align: center; height: 100%; display: -ms-flexbox; display: flex; -ms-flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; transform: skew( 347deg, 0); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; } .skew-item { } .tt-item__btn a { color: #000000; } .tt-item__btn { margin-top: 14px; text-align: center; padding: 4px 15px; border-radius: 10px; background: white; font-size: 14px; animation: ripple 2.1s linear infinite; transition: all 0.1s ease; } .tt-item__btn:hover { transform: scale(1.1); } .tt-item__btn:focus { } @keyframes ripple { 0% { box-shadow: 1 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 -1px rgba(255, 255, 255, 0.3), 0 0 0 3px rgba(255, 255, 255, 0.3), 0 0 0 5px rgba(255, 255, 255, 0.3); } 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 3px rgba(255, 255, 255, 0.3), 0 0 0 8px rgba(255, 255, 255, 0), 0 0 0 10px rgba(255, 255, 255, 0); } } .wrapbutton{ margin: 0 auto; left: 0; right: 0; margin-top: 15px; display: flex; align-items: center; flex-direction: column; } .skewblood-top .skew-content h3 { color: white; font-size: 28px; } .counters .container { text-align: center; } .carousel-cell { width: 59%; background: #010101; } .carousel-cell-image { display: block; max-height: 100%; margin: 0 auto; max-width: 100%; opacity: 0; -webkit-transition: opacity 0.4s; transition: opacity 0.4s; } /* fade in lazy loaded image */ .carousel-cell-image.flickity-lazyloaded, .carousel-cell-image.flickity-lazyerror { opacity: 1; } .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 100%; } .flickity-slider { position: absolute; width: 100%; height: 100%; } /* draggable */ .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow:hidden; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing; } /* ---- flickity-button ---- */ .flickity-button { position: absolute; background: hsl(0deg 0% 100% / 8%); border: none; color: #333; } .flickity-button:hover { background: rgb(104 103 103 / 39%); cursor: pointer; } .flickity-button:focus { outline: none; box-shadow: 0 0 0 5px #19F; } .flickity-button:active { opacity: 0.6; } .flickity-button:disabled { opacity: 0.3; cursor: auto; /* prevent disabled button from capturing pointer up event. #716 */ pointer-events: none; } .flickity-button-icon { fill: currentColor; } /* ---- previous/next buttons ---- */ .flickity-prev-next-button { top: 50%; width: 44px; height: 44px; /* vertically center */ transform: translateY(-50%); } .flickity-prev-next-button.previous { left: -6px; width:21%; font-size: 20px; height: 100%; } .flickity-prev-next-button.next { right: -6px; width:21%; font-size: 20px; height: 100%; } /* right to left */ .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-prev-next-button .flickity-button-icon { position: absolute; left: 36%; top: 50%; color: aliceblue; width: 13%; height: 17%; } /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: 18px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 15px; height: 15px; margin: 0 2px; background: #eeeeee; border-radius: 50%; opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { opacity: 1; } .awards_item_header h3 { background-color: #d52c3e; text-align: center; color: white; padding: 10px; font-size: 25px; margin: auto; } /* Style the tab */ .ambulanceblood { position: absolute; margin-top:120px; top: 0%; left: 50%; transform: translate3d(-205%, 0%, 0); z-index: 99; } .ambulance-blood { width: 315px; box-shadow: 0 0 30px 0 rgb(27 68 163 / 47%); background: #fdf8f8; border-radius: 25px; height: 415px; } .tab-ambulance { overflow: hidden; border-top-left-radius: 25px; border-top-right-radius: 25px; } .ambulanceimages { display: block; margin-right: auto; margin-left: auto; width:73%; } .bloodimages { display: block; margin-left: auto; margin-right: auto; width: 66%; } /* Style the buttons inside the tab */ .tab-ambulance button { background-color: inherit; float: left; border: none; outline: none; color: white; background: #d52c3e; /* cursor: pointer; */ width: 100%; padding: 12px 2px; transition: 0.3s; font-size: 14px; } /* Create an active/current tablink class */ .tab-ambulance button.active { background-color: #ffffff; color: #d52c3e; } .ambulance-search{ border: none; width: 100%; background: #d52c3e; display: block; padding: 6px 10px; font-size: 14px; margin-top: 15px; margin-left: auto; margin-right: auto; color: aliceblue; border-radius: 6px; } .blood-search { border: none; width: 100%; background: #d52c3e; display: block; padding: 6px 10px; font-size: 14px; margin-left: auto; margin-right: auto; color: aliceblue; border-radius: 8px; } .pickup_ambulance { width: 100%; border: none; margin: 10px 0px; font-size: 14px; border-radius: 8px; box-shadow: 1px 3px 5px 0 #d8d8d8; padding: 15px; } /*-- Delivering Exceptional Service --*/ #DES{ background-color: #c42539; padding: 0; margin: 0px 0; } #DES .title{ position: relative; transform: translateY(-50%); top: 50%; } #DES h2{ font-size: 75px; color: #ffffff; } #DES h4{ font-weight: 300; color: #ffffff; } .desimg{ background-image: url(../images/slider-img/des3.jpg); background-size: cover; background-position: center; } .joinussection i{ font-size: 60px; float: left; display: block; position: relative; color: #ffffff; top: 50%; transform: translateY(-50%); } @media(max-width:991px){ #DES h4{ text-align: center; padding: 0px 20px 28px; } } /*-- Join AmbiPalm --*/ .joinusr { padding-left: 20px; color: #ffffff; float: left; width: 85%; } .joinusr h4 { font-size: 30px; padding: 0px; border-bottom: 0px solid #c3c3c3; color: #ffffff; } .joinusr p { padding-top: 0px; margin: 0; color: #ffffff; } .joinspanel{ padding: 20px 0px; color: #ffffff; /* min-height: 180px; */ } .joinspanel{ padding: 30px; color: #ffffff; min-height: 180px; } .center-img { color: #ffffff; border-radius: 20px; width:60px } .styled { border: 0; line-height: 2.5; padding: 0 20px; font-size: 1rem; text-align: center; color: #fff; text-shadow: 1px 1px 1px #000; border-radius: 10px; background-color: rgba(220, 0, 0, 1); background-image: linear-gradient(to top left, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 30%, rgba(0, 0, 0, 0)); box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6), inset -2px -2px 3px rgba(0, 0, 0, .6); } .styled:hover { background-color: rgba(255, 0, 0, 1); } .styled:active { box-shadow: inset -2px -2px 3px rgba(255, 255, 255, .6), inset 2px 2px 3px rgba(0, 0, 0, .6); } @media (max-width:768px){ .numberofproviders h1 { z-index: 10; padding-top: 16vh; font-size: 150px; line-height: 1; } .numberofproviders h2 { line-height: 1; color: #000000; z-index: 10; font-size: 31px; width: 100%; } .numberofproviders { padding-top: 0px; padding-bottom: 60px; position: sticky; } .providersimg { width: 200%; position: absolute; right: 0; } #DES h2{ transform: translateY(0); font-size: 50px; color: #ffffff; text-align: center; } .joinusr { width: 75%; } } .circle { height:none; width:none; border-radius:0%; background-color:none; -webkit-transition:height .25s ease, width .25s ease; transition:height .25s ease, width .25s ease; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } .circle img{ position:relative; } .circle:before, .circle:after { content:''; display:block; top:0; right:0; bottom:0; left:0; border-radius:0%; } .circle:before { -webkit-animation: ripplecircle 12s linear infinite; animation: ripplecircle 12s linear infinite; } .circle:after { -webkit-animation: ripplecircle 12s linear 10s infinite; animation: ripplecircle 12s linear 10s infinite; } .circle:hover:before, .circle:hover:after { -webkit-animation: none; animation: none; } @-webkit-keyframes ripplecircle{ 0% {-webkit-transform:scale(1); } 75% {-webkit-transform:scale(1.75); opacity:1;} 100% {-webkit-transform:scale(2); opacity:0;} } @keyframes ripplecircle{ 0% {transform:scale(1); } 75% {transform:scale(1.75); opacity:1;} 100% {transform:scale(2); opacity:0;} } .back_top { display: inline-block; width: none; height: none; position: fixed; bottom: 40px; right: 40px; z-index: 99; text-align: center; transition: all .4s ease; display: none; border-radius: 1%; } .back_top:after { -webkit-animation-delay: .6s; animation-delay: .6s; } @keyframes ripple1 { 0% { box-shadow: 0 0 0 .4rem #ffffff; } 100% { box-shadow: 0 0 0 3rem #ffffff; } } .back_top:after, .back_top:before { border-radius:1%; } .back_top:after, .back_top:before { border-radius: 112px; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; box-shadow: none; -webkit-animation: ripple1 3s infinite; animation: ripple1 3s infinite; transition: all .4s ease; } .back_top img{font-size:18px;line-height:45px;color:#111;position:relative;z-index:10} .ripple1 { margin: auto; margin-top: 3rem; background-color: none; width: 1rem; height: 1rem; border-radius: 50%; position:relative; animation: ripple1 3s linear infinite; } .ripple1::before, .ripple1::after{ content:""; top:0; left:0; right:0; bottom:0; border-radius: 1%; animation:inherit; animation-delay:3s; } .ripple1::after { animation-delay:2s; } @keyframes ripple1 { 0% { box-shadow: 0 0 0 .4rem #db263526; } 100% { box-shadow: 0 0 0 3rem #db263526; } } /* LIGHT BAR ESSENTIALS */ .lightbar { position: relative; padding: 4px 10px; margin: 0 auto; max-width: 945px; border-radius: 3px; } .lightbar:after { top: 0; left: 0; position: absolute; z-index: 10000; display: block; content: ""; width: 100%; height: 100%; border-radius: 3px; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.24) 1%, rgba(255, 255, 255, 0.14) 43%, rgba(255, 255, 255, 0) 58%, rgba(255, 255, 255, 0) 100%); } .light { position: relative; width: 10px; height: 15%; top: 19px; left: -32px; padding: 5px 10px 4px; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .inner-light { position: absolute; width: 100%; height: 100%; background-color: transparent; top: -28px; left: -1px; border-radius: 77px; border: 1px solid transparent; opacity: 0; } /* SPOTLIGHT */ .spotlight .bulb { background: #fff; box-shadow: 0px 0px 45px 10px #fff; } .spotlight .inner-light { border: 1px solid rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 240, 0.85); box-shadow: 0px 0px 100px 25px rgba(255, 255, 240, 0.85); opacity: 1; z-index: 9999; } /* ANIMATION BASICS */ .delay .bulb { -webkit-animation-delay: 400ms; animation-delay: 400ms; } .delay .inner-light { -webkit-animation-delay: 400ms; animation-delay: 400ms; } .strobe .bulb { -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: bulb-strobe; animation-name: bulb-strobe; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes bulb-strobe { 0%, 25% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 28%, 50% { background: white; box-shadow: 0px 0px 16px 7px #ffffff; } 52%, 55% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 57%, 69% { background: white; box-shadow: 0px 0px 13px 7px #ffffff; } 70%, 71% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 72%, 75% { background: white; box-shadow: 0px 0px 13px 7px #ff0000; } 77%, 100% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } } @keyframes bulb-strobe { 0%, 25% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 28%, 50% { background: white; box-shadow: 0px 0px 13px 7px #ffffff; } 52%, 55% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 57%, 69% { background: white; box-shadow: 0px 0px 13px 7px #ffffff; } 70%, 71% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } 72%, 75% { background: white; box-shadow: 0px 0px 13px 7px #ffffff; } 77%, 100% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ffffff; } } .light1 { position: relative; width: 10px; height: 15%; top: -10px; left: 19px; padding: 5px 14px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .inner-light1 { position: absolute; width: 100%; height: 100%; background-color: transparent; border-radius: 77px; border: 1px solid transparent; opacity: 0; } /* SPOTLIGHT */ .spotlight1 .bulb1 { background: #fff; box-shadow: 0px 0px 45px 10px #ff0000; } .spotlight1 .inner-light1 { border: 1px solid rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 240, 0.85); box-shadow: 0px 0px 100px 25px rgba(255, 255, 240, 0.85); opacity: 1; z-index: 9999; } /* ANIMATION BASICS */ .delay1 .bulb1 { -webkit-animation-delay: 400ms; animation-delay: 400ms; } .delay1 .inner-light1 { -webkit-animation-delay: 400ms; animation-delay: 400ms; } .strobe1 .bulb1 { -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: bulb-strobe1; animation-name: bulb-strobe1; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes bulb-strobe1 { 0%, 25% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 28%, 50% { background: #ff0000; box-shadow: 0px 0px 16px 7px #ff0000; } 52%, 55% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 57%, 69% { background: #ff0000; box-shadow: 0px 0px 13px 7px #ff0000; } 70%, 71% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 72%, 75% { background: #ff0000; box-shadow: 0px 0px 13px 7px #ff0000; } 77%, 100% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } } @keyframes bulb-strobe1 { 0%, 25% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 28%, 50% { background: #ff0000; box-shadow: 0px 0px 13px 7px #ff0000; } 52%, 55% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 57%, 69% { background: #ff0000; box-shadow: 0px 0px 13px 7px #ff0000; } 70%, 71% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } 72%, 75% { background: #ff0000; box-shadow: 0px 0px 13px 7px #ff0000; } 77%, 100% { background: linear-gradient(155deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.14) 25%, rgba(255, 255, 255, 0.18) 49%, rgba(0, 0, 0, 0) 78%, rgba(0, 0, 0, 0.8) 100%); box-shadow: 0px 0px 6px #ff0000; } } .warpper{ display:flex; flex-direction: column; align-items: center; width: 100%; } .tabmain{ cursor: pointer; padding: 10px 39px; margin: 0px 2px; font-size: 19px; background:#d52c3e; display:inline-block; color:#fff; border-radius:3px 3px 0px 0px; } .panels{ /* background:#fffffff6; */ border-radius:3px; overflow:hidden; padding:20px 10px 0px; } .panel{ display:none; animation: fadein .8s; } @keyframes fadein { from { opacity:0; } to { opacity:1; } } .panel-title{ font-size:1.5em; font-weight:bold } .radio{ display:none; } #one:checked ~ .panels #one-panel, #two:checked ~ .panels #two-panel, #three:checked ~ .panels #three-panel{ display:block } #one:checked ~ .tabs #one-tab, #two:checked ~ .tabs #two-tab, #three:checked ~ .tabs #three-tab{ background: #fffffff6; color: #d52c3e; border-top: 3px solid #d52c3e; } .featured-item { width:100%; border-radius: 10px; overflow: hidden; } .featured-item a { width:100%; display: inline-block; } .featured-item img { vertical-align: middle; border-style: none; border-radius: 16px; } .item-meta { list-style: none; margin-bottom: 5px; font-size: 13px; display: flex; flex-wrap: wrap; } .item-category a{ color: black; } .item-meta li { margin-right: 20px; } .item-title { font-size: 20px; line-height: 28px; margin-bottom: 17px; } .item-content { font-size: 14px; line-height: 24px; margin-bottom: 24px; } .item-readmore a{ font-size: 16px; } .header-content { margin: 50px auto 0 auto; color: #000; text-align: center; } .accordion-wrapper { display: flex; flex-flow: row wrap; margin: 0 auto; } .accordion-item { width: 100%; padding: 2em; } /* Accordion */ .accordion { list-style-type: none; margin: 0.5rem 0 1rem 0; padding-left: 0; } .accordion-header { background-color: #fff; border-bottom: 1px solid #ddd; cursor: pointer; min-height: 5rem; line-height: 5rem; color: aliceblue; margin: 0px 0px 3px; padding: 0 1rem; font-size: 20px; background: #6c6e74; background: -moz-linear-gradient(top, #6c6e74 0%, #4b4d51 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6c6e74), color-stop(100%,#4b4d51)); background: -webkit-linear-gradient(top, #000000 0%,#070707 100%); background: -o-linear-gradient(top, #6c6e74 0%,#4b4d51 100%); background: -ms-linear-gradient(top, #6c6e74 0%,#4b4d51 100%); background: linear-gradient(top, #6c6e74 0%,#4b4d51 100%); } .accordion-header:after { content: '\02795'; /* Unicode character for "plus" sign (+) */ font-size: 0.6rem; color: #777; float: right; } .accordion-header.active:after { content: "\2796"; /* Unicode character for "minus" sign (-) */ } .accordion-header .active { background: #a5cd4e; background: -webkit-linear-gradient(top, #000000 0%,#000000 100%); background: linear-gradient(top, #a5cd4e 0%,#6b8f1a 100%); } .accordion-body { display: none; color: #797979; background: #e5e5e5; padding: 2rem; border-bottom: 1px solid #ddd; } /*========================== 5.FEATURES ============================*/ .features .ftr-icon-box { padding: 50px 20px; margin-top: 32px; margin-bottom: 30px; text-align: center; height: 200px; position: relative; background: #fff; box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1); } .features .icon { position: absolute; top: -36px; left: calc(50% - 36px); transition: 0.2s; border-radius: 50%; border: 5px solid #fff; display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center; width: 70px; height: 70px; background: #d52c3e; } .features .icon i { color: #fff; font-size: 32px; } .features .title { font-weight: 700; margin-bottom: 15px; font-size: 18px; } .features .ftr-icon-box:hover .icon { background: #fff; border: 2px solid #d52c3e; } .features .ftr-icon-box:hover .icon i { color: #d52c3e; } .features .ftr-icon-box:hover .title a { color: #d52c3e; } .features .description { line-height: 24px; font-size: 15px; text-align: center; } /*====================== Download ========================*/ #download{ padding-top: 60px; } #download a:hover .appdownloadbutton{ background: #A82837; } #download .section-title{ padding: 50px 0; } #download h2{ font-size: 50px; text-align:center; } #download h3{ text-align:center; } #download img{ width: 100%; } .downloadlinks{ float: left; } .downloadlinks img{ padding:10px; } #download .downloadimg img{ width: 50%; float: left; } @media (max-width:768px){ .appdownloadbutton { width: 45%; } } /*====================== 6.ABOUT US ========================*/ .aboutparagrph-section { margin: auto; width: 1194px; border-radius: 20px; display: block; background: white; margin-top: -170px; padding: 20px 30px; } .aboutparagrph-section p { text-align: center; font-size: 16px; } .alignleft { text-align: left; } .aboutus .icon-boxes h4 { font-size: 18px; margin-bottom: 15px; } .aboutus .aboutus-icon-box { margin-top: 30px; width: 50%; padding: 0px 50px 0px 0; float: left; } .video-slider { margin: auto; display: block; width: 230px; } .aboutus .aboutus-icon-box .icon { border: 2px solid #d52c3e; border-radius: 50px; float: left; display: flex; align-items: center; justify-content: center; min-width: 64px; min-height: 64px; transition: 0.5s; background: #fff; } .aboutus .aboutus-icon-box .icon i { font-size: 32px; color: #d52c3e; } .aboutus .aboutus-icon-box:hover .icon { background: #d52c3e; border-color: #d52c3e; } .aboutus .aboutus-icon-box:hover .icon i { color: #fff; } .aboutus .aboutus-icon-box .title { font-weight: 700; margin-bottom: 10px; } .aboutus .aboutus-icon-box .description { line-height: 24px; font-size: 14px; text-align: left; margin-bottom: 0; } .racingtsaboutus { background-image: url(../images/image1.jpg); background-size: cover; background-position: center; height: 75vh; } .racingtsl{ background-image: url(../images/slider-img/ambulance1.jpg); background-size: cover; background-position: center; height: 95vh; } .racingts2{ background-image: url(../images/slider-img/BannerKolkata.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtshyd{ background-image: url(../images/slider-img/BannerHyderabad.jpeg); background-size: cover; background-position: center; height: 60vh; } .racingtsban{ background-image: url(../images/slider-img/BannerBangalore.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsmysore{ background-image: url(../images/slider-img/Banner-mysore.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsdurgapur{ background-image: url(../images/slider-img/Durgapur.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsdarjeeling{ background-image: url(../images/slider-img/Banner-Darjeeling.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsasansol{ background-image: url(../images/slider-img/Banner-Asansol.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtskanpur{ background-image: url(../images/slider-img/Banner-Kanpur.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsfaridabad{ background-image: url(../images/slider-img/Banner-Faridabad.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsgurgaon{ background-image: url(../images/slider-img/Banner-Gurgaon.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtsguntur{ background-image: url(../images/slider-img/Banner-Guntur.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtspune{ background-image: url(../images/slider-img/Banner-Pune.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtschennai{ background-image: url(../images/slider-img/Banner-Chennai.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtslucknow{ background-image: url(../images/slider-img/Banner-Lucknow.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtssiliguri{ background-image: url(../images/slider-img/Banner-Siliguri.jpg); background-size: cover; background-position: center; height: 60vh; } .racingtskarimnagar{ background-image: url(../images/slider-img/Bannerkarimnagar.jpg); background-size: cover; background-position: center; height: 60vh; } .racingts4 { background-image: url(../images/slider-img/.png); background-size: cover; background: antiquewhite; background-position: center; height: 60vh; } @-webkit-keyframes pulsate-btn { 0% { transform: scale(0.6, 0.6); opacity: 1; } 100% { transform: scale(1, 1); opacity: 0; } } @keyframes pulsate-btn { 0% { transform: scale(0.6, 0.6); opacity: 1; } 100% { transform: scale(1, 1); opacity: 0; } } @media (max-width:768px){ .racingtsl{ height: 30vh; } .racingts2{ height: 30vh; } .racingtshyd{ height: 30vh; } .racingtsban{ height: 30vh; } .racingtsmysore{ height: 30vh; } .racingtsdurgapur{ height: 30vh; } .racingtsdarjeeling{ height: 30vh; } .racingtsasansol{ height: 30vh; } .racingtskanpur { height: 30vh; } .racingtsfaridabad{ height: 30vh; } .racingtsgurgaon{ height: 30vh; } .racingtsguntur{ height: 30vh; } .racingtspune{ height: 30vh; } .racingtschennai{ height: 30vh; } .racingtslucknow{ height: 30vh; } .racingtssiliguri{ height: 30vh; } .racingtsaboutus { height: 20vh; } .racingtskarimnagar{ height: 20vh; } } /* ================== City ====================*/ #city{ padding-top: 100px; } #city a:hover .appdownloadbutton{ background: #A82837; } #city .city-title{ } .city-title h2{ text-align :right; font-size: 35px; margin-top: 50px; margin-bottom: 20px } .city-title h4{ text-align:right; margin:20px 0px; } .city-title p { text-align: right; } #city img{ width: 100%; } .downloadlinks{ float: left; } .downloadlinks img{ padding:10px; } #city .downloadimg img{ width: 50%; float: left; } .banner-head { margin-top: 100px; color: #ff013c; font-weight: 900; padding: 30px; padding-bottom: 0px; padding-right: 0px; font-size: 30px !important; line-height: 25px; text-align: right; } .city-topic-title { margin-top: 50px; margin-bottom: 60px; } .features-services { text-align: right; padding: 20px; } .features-services1 { text-align: left; padding: 20px; } .key-equipment { margin: 0; font-size: 16px; padding: 0; } .service-img { height: inherit; width: 100%; padding: 0; } .ambu-prefer{ margin: 0px 0px; } #ambu-pref { margin-right: -71px; } .button-banner-btn { margin-left: 50px; } .ambu-img { height: auto; width: 60%; margin-bottom: 10px; } .ambu-item>h6 { font-size: 14px; text-align: center; text-transform: uppercase; } .btn-banner { background: linear-gradient(to bottom, #b84662 0%, #ca344a 100%); color: #ffffff; /*float: left; width: 246px; */ margin: 2px 1px; border-radius: 7px; } .btn-banner1 { background: #d52c3e; /* background: linear-gradient(to bottom, #b84662 0%, #ca344a 100%); */ color: #ffffff; margin: 10px 49px 15px 7px; width: 262px; font-size: 17px; font-weight: 600; padding-top: 4px; height: 30px; line-height: 22px; text-align: center; border-radius: 7px; } .btn-banner2 { background: #d52c3e; /* background: linear-gradient(to bottom, #b84662 0%, #ca344a 100%); */ color: #ffffff; /* margin: 3px 49px 15px 9px; */ width: 256px; padding:4px; text-align: center; border-radius: 7px; } .btn1 { font-size: 14px; text-align: center; padding: 0; text-transform: uppercase; font-weight: 600; height: 30px; line-height: 30px; } .btn2 { font-size: 17px; text-align: center; padding: 0; text-transform: uppercase; font-weight: 600; height: 30px; line-height: 30px; } .btn-button { font-size: 21px; font-weight: 700; color: white; border-radius: 14px; padding: 7px; } @media (max-width:768px){ .appdownloadbutton { width: 45%; } } .err__succ__text { font-size: 14px; text-align: center; color: rgb(255, 255, 255); background: rgb(87, 87, 87, .6); padding: 10px; width: fit-content; border-radius: 20px; letter-spacing: 1px; display:none; } .ambu__grid{ position: relative; display: flex; margin: 0px 10px; justify-items: center; } #callback { border-radius: 10px 0px 0px 10px; height: 32px; text-align: center; font-size: 15px; margin-left: 0px; border-left: solid 1px #d52c3e ; border-top: solid 1px #d52c3e; border-bottom:solid 1px #d52c3e; border-right: solid 1px #d52c3e; margin-right: 0px; } .phn__ambu{ height: 32px; width: 70px; border-left: solid 1px #d52c3e; border-top: solid 1px #d52c3e; border-bottom: solid 1px #d52c3e; border-right: solid 1px #d52c3e; border-radius: 0px 10px 10px 0px; background-color: #fff; padding: 0rem .2rem; color: #d52c3e; background: #f5f5f5; font-size: 20px; } .phn__ambu i { transform: rotate(100deg); } .phn__ambu:hover{ background: antiquewhite; } .callback__cont{ display: flex; justify-content: center; align-items: center; flex-direction: column; } /*========================== 7.OUR DEPARTMENTS ============================*/ .dept-box { border-bottom: 0px solid #d52c3e; margin-bottom: 10px; padding: 13px; /* min-height: 540px; */ overflow: hidden; position: relative; box-shadow: 0 10px 10px #e2e2e2; } .dept-box .dept-details { /* background-color: #ffffff; */ padding: 20px 20px 2px 20px; position: relative; text-align: center; transition: all 0.3s ease; -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; width: 100%; } .dept-box .dept-details h4 { font-size: 20px; font-weight: 700; } .dept-details .round-style { background: #fbf7f800 none repeat scroll 0 0; border-radius: 50%; height: 70px; left: 0; margin: 0 auto; position: absolute; right: 0; top: -35px; width: 70px; } .dept-box:hover .dept-details { } .dept-box .dept-details .icon { color: #d52c3e; display: inline-block; font-size: 32px; position: relative; top: -15px; } .dept-box .dept-details .details { text-align: justify; } .dept-box .dept-details a.thm-btn { margin-top: 15px; background: #d52c3e; border-radius: 30px; display: inline-block; color: #fff; font-size: 14px; text-transform: uppercase; padding: 6px 15px; border: 2px solid transparent; transition: all .3s ease; } .dept-box .dept-details a.thm-btn:hover { background-color: #fff; border-color: #d52c3e; color: #d52c3e; } .dept-box .dept-details a.thm-btn.inverse { background-color: #fff; border-color: #d52c3e; color: #d52c3e; } .dept-box .dept-details a.thm-btn.inverse:hover { background-color: #d52c3e; border-color: #d52c3e; color: #fff; } @media (max-width:768px){ .dept-box { min-height: auto; height: auto; } } /*========================== blog ============================*/ /*PEN STYLES*/ .description h3 { font-size: 31px; padding: 35px 0px 8px; } .blog-image { width: 100%; } .blog-card { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; margin: 1rem auto; box-shadow: 3px 4px 10px 0px rgb(0 0 0 / 30%); margin-bottom: 1.6%; background: #fff; line-height: 1.4; font-family: "Lato",sans-serif; border-radius: 5px; overflow: hidden; z-index: 0; } .blog-card a { color: inherit; } .blog-card a:hover { color: #5ad67d; } .blog-card:hover .photo { } .blog-card .meta { position: relative; z-index: 0; height: 200px; } .blog-card .photo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s; } .blog-card .details, .blog-card .details ul { margin: auto; padding: 0; list-style: none; } .blog-section-image { height: 58vh; background-size: cover; background-position: center; } .blog-section .description a { color: black; } .blog-card .details { padding-top: 10px; } .blog-card .details a { -webkit-text-decoration: dotted underline; text-decoration: dotted underline; } .blog-card .details ul li { display: inline-block; } .blog-card .details .author:before { } .blog-card .details .date:before { } .blog-card .details .tags ul:before { font-family: FontAwesome; content: "\f02b"; margin-right: 10px; } .blog-card .details .tags li { margin-right: 2px; } .blog-card .details .tags li:first-child { margin-left: -4px; } .blog-card .description { padding: 1rem; background: #fff; position: relative; z-index: 1; } .blog-card .description h1, .blog-card .description h2 { } .blog-card .description h1 { line-height: 1; margin: 0; font-size: 2rem; text-align: left; } .blog-card .description h2 { font-size: 1.5rem; font-weight: 300; text-transform: uppercase; color: #000000; margin-top: 5px; } .blog-card .description span{ } .blog-card .description .read-more { text-align: right; } .blog-card .description .read-more a { color: #d52c3e; display: inline-block; position: relative; } .blog-card .description .read-more a:after { content: "\f061"; font-family: FontAwesome; margin-left: -10px; opacity: 0; vertical-align: middle; -webkit-transition: margin 0.3s, opacity 0.3s; transition: margin 0.3s, opacity 0.3s; } .blog-card .description .read-more a:hover:after { margin-left: 5px; opacity: 1; } .blog-card p { position: relative; margin: 1rem 0 0; line-height: 1.2; } .blog-card p:first-of-type { margin-top: 1rem; } .blog-card p:first-of-type:before { } .blog-card:hover .details { left: 0%; } .blog-section { height: 355px; margin-bottom: 29px; background: #FFFFFF; box-shadow: 0px 3px 6px #00000029; } .blog-section .description { padding: 9px 13px; } .blog-section .description h4 { margin: 4px 0px; font-size: 15px; height: 47px; } .blog-section .description .read-more { float: left; position: relative; border: 1px solid #CFCFCF; border-radius: 24px; width: 99px; height: 32px; display: flex; align-items: center; background: #d52c3e; justify-content: center; font: normal normal normal 14px/28px Poppins; letter-spacing: 0px; color: #413D3D; overflow: hidden; cursor: pointer; } .blog-section .description .read-more a { color:white; } .blog-section .description .social-blog { float: right; } .blog-section .description .social-blog a:hover{ color:#d52c3e; } .new3 { border-radius: 14px; width: 40px; position: relative; border: none; height: 3px; background: #d52c3e; } #blog .photo{ width: 100%; height: 100%; background-position: center; } #blog .bestapp{ width: 100%; height: 420px; background-position: center; } #blog .bestappt{ width: 100%; height: 500px; background-position: center; } #blog .description h3{ text-align: left; padding: 28px 0px 8px; } #blog .descrip h3{ margin-top: 120px; text-align: left; padding: 30px 0; } #blog .descript h3{ margin-top: 190px; text-align: left; padding: 30px 0; } .pagination { width: fit-content; margin: auto; } .page-link { color: #d52c3e; } @media (min-width: 640px) { .blog-card { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .blog-card .meta { flex-basis: 30%; height: auto; } .blog-card .description { flex-basis: 70%; } .blog-card .description:before { content: ""; background: #fff; width: 30px; position: absolute; left: -10px; top: 0; bottom: 0; z-index: -1; } } /*========================== LOGIN ============================*/ .login { height: 550px; } .login h1 { padding-top: 0; font-size: 40px; } .login img { width: 100px; margin: auto; position: relative; padding-top: 80px; display: block; } .new1 { border-radius: 14px; width: 89px; position: relative; /* top: 20px; */ border: none; height: 4px; background: #d52c3e; } .new2 { border-radius: 14px; width: 89px; position: relative; /* top: 20px; */ border: none; height: 4px; background: white; } .list-grid-footer { -ms-column-count: 3; -o-column-count: 3; -moz-column-count: 3; -khtml-column-count: 3; column-count: 3; padding-left: 0px; } /*========================== 8.REVIEWS ============================*/ .review-slider .item .user-txt { display: flex; align-items: center; padding: 1rem 0 2rem 0; padding-left: 0.25rem; } .review-slider .item .user-txt::after { display: block; clear: both; content: ""; } .review-slider .item .user-txt .user-pics { width: 60px; height: 60px; float: left; border-radius: 100%; margin-right: 1rem; overflow: hidden; } .review-slider .item .user-txt .user-pics img { width: 100%; max-width: 100%; height: auto; } .review-slider .item .user-txt .user-info { float: left; } .review-slider .item .user-txt .user-info .heading { line-height: 1; margin-bottom: 0.25rem; margin-top: 0.25rem; font-size: 15px; } .review-slider .item .user-txt .user-info .sub-heading { font-size: 15px; font-weight: 300; line-height: normal; margin-bottom: 0; } .review-slider .item .review-card { position: relative; background: #fff; padding: 1.5rem; border-radius: 0.5rem; overflow: visible; text-align: center; min-height: 175px; } .review-slider .item .review-card p { color: #414c5a; font-weight: 600; margin-bottom: 0; } .review-slider .item .review-card::before { content: ""; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIxLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6IzgwODlGRjt9Cjwvc3R5bGU+CjxnIGlkPSJRdW90ZW1hcmtzLWxlZnQiPgoJPHBhdGggY2xhc3M9InN0MCIgZD0iTTQwNSwyMDkuOGMtMS0xMS4xLTAuMi00MS41LDI4LjgtODMuNmMyLjItMy4yLDEuOC03LjUtMC45LTEwLjJjLTExLjgtMTEuOC0xOS4yLTE5LjMtMjQuMy0yNC41CgkJYy02LjgtNi45LTkuOC0xMC0xNC40LTE0LjFjLTMtMi43LTcuNi0yLjgtMTAuNi0wLjFjLTUwLjYsNDQtMTA2LjgsMTM1LTk4LjcsMjQ2LjVjNC44LDY1LjUsNTIuNSwxMTMsMTEzLjUsMTEzCgkJYzYyLjYsMCwxMTMuNS01MC45LDExMy41LTExMy41QzUxMiwyNjIuOCw0NjQuNiwyMTMuMiw0MDUsMjA5Ljh6Ii8+Cgk8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTIwLjksMjA5LjhjLTEtMTEuMS0wLjMtNDEuNCwyOC44LTgzLjZjMi4yLTMuMiwxLjgtNy41LTAuOS0xMC4yYy0xMS44LTExLjgtMTkuMS0xOS4zLTI0LjMtMjQuNQoJCWMtNi44LTYuOS05LjktMTAuMS0xNC40LTE0LjJjLTMtMi43LTcuNi0yLjctMTAuNi0wLjFjLTUwLjYsNDQtMTA2LjgsMTM1LTk4LjcsMjQ2LjV2MGM0LjgsNjUuNCw1Mi41LDExMywxMTMuNSwxMTMKCQljNjIuNiwwLDExMy41LTUwLjksMTEzLjUtMTEzLjVDMjI3LjksMjYyLjgsMTgwLjUsMjEzLjIsMTIwLjksMjA5Ljh6Ii8+CjwvZz4KPC9zdmc+Cg=="); background-size: cover; display: block; width: 40px; height: 40px; position: absolute; top: 0.75rem; left: 1rem; opacity: 0.2; } /*========================== 9.About ============================*/ .our-team { position: relative; } .our-team .team-box { position: relative; margin: 10px 0; } .our-team .team-box img { display: block; width: 100%; box-shadow: 0 0 10px #0000003b; } .our-team .team-box .title-box { } .our-team .team-box .title-box h3 { font-weight: 700; text-align: center; color: #ffffff; padding: 10px 0; background: #d52c3e; } .our-team .team-box .title-box p { color: #000000; text-align: justify; padding: 0 15px; border-left: 1px solid #eaeaea; } .our-team .team-box .get-apt { font-weight: 600; color: #d52c3e; text-transform: uppercase; font-size: 14px; } .our-team .team-box .get-apt:hover { color: #007b8a; } .morecontent span { display: none; transition:1s; } .morelink { display: block; transition:1s; color: #d52c3e; font-weight: 600; } /*extra added*/ /* gallery */ .logo-section-row{ flex: 0 0 20%; max-width: 20%; } .logo-section-row1{ flex: 0 0 12.5%; max-width: 12.5%; } .logo-section{ margin-top: 2px; } .logo-section img { margin: auto; width:192px; border-radius: 22px; display: block; float: left; margin-top: 16px; /* padding: 11px 12px; */ box-shadow: 2px 2px 2px 0px rgb(29 29 29 / 20%); /* background: #ffffff; */ display: table-cell; text-align: center; align-items: center; vertical-align: middle; } /* Slide */ .gallery a{ width: 24%; margin: 2px; overflow: hidden; } .gallery img{ width: 100%; border-radius: 11px; } .breakpoint { /* One column for smartphones */ max-width: 100%; display: inline-block; } .mediazoomeffect img:hover{ /* -webkit-transform: scale(1.1); */ -ms-transform: scale(1.1); transform: scale(1.01); } .seemoregallery { position: absolute; margin-top: -79px; font-size: 18px; border-radius: 12px; padding: 2px 10px; margin-left: 68px; background: #d52c3e; color: #ffffff; font-weight: 700; } .seemoregallery a { position:absolute; color:#000000; } @media (min-width: 599px) { /* Two columns for tablets */ .breakpoint { max-width: 100%; } } @media (min-width: 760px) { /* Four columns for large devices */ .breakpoint { max-width: 100%; } } div.gallery-1 { margin: 6px 0px; float: left; width: 266px; height: 143px; overflow: hidden; border-radius: 15px; } div.gallery-1:hover { border: 0px solid #777; } div.gallery-1 img { width: 100%; border-radius: 20px; height: auto; } /*========================== 10.PREMISES ============================*/ .premises-slider .owl-stage-outer { padding: 0 0 2rem 0; } .premises-slider .owl-item .premises-box { opacity: 0.75; filter: blur(0.5px); -webkit-transform: scale(0.85); transform: scale(0.85); transition: transform 0.35s ease-out, filter 0.35s ease-out, box-shadow 0.35s ease-out, opacity 0.35s ease-out; } .premises-slider .owl-item.center .premises-box { opacity: 1; filter: blur(0); box-shadow: 0 7px 15px rgba(0, 9, 128, 0.05), 0 12px 28px rgba(0, 9, 128, 0.075); -webkit-transform: scale(1); transform: scale(1); } .premises-slider .owl-dots { text-align: center; } .premises-slider .owl-dot { background: rgba(38, 91, 251, 0.4) !important; height: 10px; width: 10px; margin: 0 5px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .premises-slider .owl-dot.active { background: #d52c3e !important; } /*========================== 11.APPOINTMENT ============================*/ .p-t-2 { padding-bottom: 1.2rem; } .locations-section p{ margin-top: -9px; padding: 24px; background: white; box-shadow: 0px 0px 30px 0px rgb(227 228 228 / 98%); } .locations-section h3 { background: #d52c3e; color: white; padding: 10px; font-size: 22px; text-align: center; } #statistics { position: relative; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; text-align: center; color: #000000; padding-bottom: 20px; margin-bottom: 40px; } #statistics .overlay { opacity: 0.9; } #statistics .container { position: relative; z-index: 10; } #statistics h3, #statistics h4, #statistics h5, #statistics i, #statistics p { color: inherit; font-size: 18px; } #statistics i { -webkit-background-clip: text; border-radius: 100px; /* box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3); */ width: 100px; /* height: 100px; */ padding-top: 38px; font-size: 39px; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; 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; color: #d52c3e; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0 auto; } #statistics i:hover { /* box-shadow: 0 20px 20px rgba(0, 0, 0, 0.22); */ } .contact-icon { display: block; margin: auto; text-align: center; } .contact-icon i { font-size: 27px; background: #d52c3e; color: aliceblue; border-radius: 0px; padding: 10px; } .contact-section h4 { font-size: 24px; margin-top: 16px; text-align: center; } .contact-section p { font-size: 16px; line-height: 16px; text-align: center; } .contact-section ul { margin: auto; display: block; margin: 1px!important; text-align: center; } .contact_pg_address { position: absolute; top: 0px; z-index: 2; padding: 35px 14px 40px; background: #fff; box-shadow: 0px 0px 30px 0px rgb(227 228 228 / 98%); border-radius: 10px; } .contact_pg_address h3 { font-size: 32px; } .single_con_add p { margin-top: -10px; font-weight: bold; color: #1F1F1E; margin-bottom: 1px; font-size: 18px; } .contact_pg_address .single_con_add { overflow: hidden; margin-bottom: 0px; margin-top: 1px; padding: 10px 0px; } .contact_pg_address .single_con_add a { float: left; color: #515050; height: 70px; } .contact_pg_address .single_con_add a i { font-size: 27px; margin-top: -5px; color: #d52c3e; border: 1px solid #d52c3e; border-radius: 50%; margin-right: 15px; width: 50px; height: 50px; display: inline-block; text-align: center; line-height: 50px; } .contact_pg_address .single_con_add span { display: block; padding-left: 45px; font-size: 15px; } .contact_social { margin-left: 11px; } .contact_social a { font-size: 17px; background: #d52c3e; color: #fff; width: 35px; height: 35px; display: inline-block; line-height: 35px; text-align: center; border-radius: 5px; margin-right: 13px; } .contact_social a:hover { background: #f5f5f5; color: #000000; } .appointment-form { padding: 50px 20px; } .appointment .contant-number { background: url("../images/aboutus/about-doc-img.jpg") center center; background-size: cover; background-position: center center; height: 100%; position: relative; } .appointment .contant-number h3 { font-size: 30px; font-weight: bold; margin: 0; position: absolute; bottom: 100px; right: 0; background: rgba(0, 0, 0, 0.69); color: #ffffff; padding: 25px 20px; line-height: 0; } .appointment .appointment-form { max-width: 90%; padding: 60px; margin-top: ; /*background: #f1f1f1; margin: -213px auto 0px; */ } .appointment .appointment-form .title { font-size: 50px; color: #000000; margin-bottom: 30px; font-family: "Poppins", sans-serif; } .book-now-btn { background-color: #d52c3e; color: #ffffff; font-weight: bold; text-transform: uppercase; border-radius: 10px; padding: 0 15px; height: 40px; line-height: 40px; } .book-now-btn:hover { background-color: #000; color: #fff; } .form-control { font-size: 14px; padding: 10px; height: 50px; } /*========================== 12.FAQ's ============================*/ .faq-panel { margin-bottom: 2rem; } .question-box { margin-bottom: 1rem; backface-visibility: hidden; -webkit-backface-visibility: hidden; background: #fff; border: 1px solid #eee; border-radius: 4px; } .faq-header { border: none; } .question-box .btn-link { position: relative; background: #f8f8f8; text-align: left; margin-bottom: 0; margin-top: 0; padding: 1rem 1.5rem; font-size: 20px; font-weight: 700; cursor: pointer; transition: color 0.25s ease-out; width: 100%; border: none; } .question-box .faq-body { padding: 0.5rem 1rem; } .question-box .faq-body p { margin-bottom: 5px; } .question-box .btn-link.collapsed { color: #161e39; } .question-box .btn-link { display: flex; align-items: center; justify-content: space-between; color: #d52c3e; } .question-box.active h4::after { color: #d52c3e; top: 14px; -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } .caret-icon { display: flex; justify-content: center; align-items: center; font-size: 24px; line-height: 20px; width: 25px; } .question-box.active .btn-link .caret-icon { transform: rotateZ(-180deg); } /* -------awards--------*/ .jssorl-009-spin img { animation-name: jssorl-009-spin; animation-duration: 1.6s; animation-iteration-count: infinite; animation-timing-function: linear; } @keyframes jssorl-009-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .jssorb051 .i {position:absolute;cursor:pointer;} .jssorb051 .i .b {fill:#fff;fill-opacity:0.3;} .jssorb051 .i:hover .b {fill-opacity:.7;} .jssorb051 .iav .b {fill-opacity: 1;} .jssorb051 .i.idn {opacity:.3;} .jssora051 {display:block;position:absolute;cursor:pointer;} .jssora051 .a {fill:none;stroke:#fff;stroke-width:360;stroke-miterlimit:10;} .jssora051:hover {opacity:.8;} .jssora051.jssora051dn {opacity:.5;} .jssora051.jssora051ds {opacity:.3;pointer-events:none;} .multi-item-carousel { overflow: hidden; } .multi-item-carousel img { height: auto; width: 100%; } .item__third:first-child, .item__third:last-child { display: none; } .carousel-indicators .active { width: 15px; height: 15px; margin: 0; background-color: #fff; } .carousel-indicators { position: absolute; right: 0; bottom: 0; left: 0; z-index: 24; display: -ms-flexbox; display: flex; left: 0%; -ms-flex-pack: center; justify-content: center; padding-left: 0; margin-right: 0; margin-left: 0; list-style: none; } .carousel-indicators li { box-sizing: content-box; -ms-flex: 0 1 auto; flex: 0 1 auto; height: 15px; width: 15px; background-color: #bbb; border-radius: 50%; margin-right: 3px; margin-left: 3px; text-indent: -999px; cursor: pointer; background-color: #eeeeee; border: 0px solid #1a2f5f00; background-clip: padding-box; border-top: 0px solid transparent; border-bottom: 0px solid transparent; opacity: .5; transition: opacity .6s ease; } .awards_item_header h4 { background-color: #d52c3e; text-align: center; color: white; padding: 10px; font-size: 25px; margin: auto; } @media (min-width: 500px) { .multi-item-carousel .carousel-control.left, .multi-item-carousel .carousel-control.right { background: rgb(104 103 103 / 39%); width: 25%; } .multi-item-carousel .carousel-inner { width: 150%; left: -25%; } .carousel-inner > .item.next, .carousel-inner > .item.active.right { -webkit-transform: translate3d(33%, 0, 0); transform: translate3d(33%, 0, 0); } .carousel-inner > .item.prev, .carousel-inner > .item.active.left { -webkit-transform: translate3d(-33%, 0, 0); transform: translate3d(-33%, 0, 0); } .item__third { display: block !important; float: left; position: relative; width: 33.33333333%; } } /* -------------------ambulance moving-------*/ #videosswiping { height: 450px; } #c2 { padding: 0px 164px; margin-top: -35px; } .hero-animation{ height: 85vh; width: 100% ; background-image: url(../images/animations/sky.jpg); background-size: cover; background-position: center; position: relative; overflow: hidden; } .highway{ height: 169px; width: 500%; display: block; background-image: url(../images/animations/road.jpg); position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; background-repeat: repeat-x; animation: highway 5s linear infinite; } @keyframes highway { 100% { transform: translateX(-3400px); } } .city{ height: 259px; width: 500%; background-image: url(../images/animations/buildingss.png); position: absolute; bottom: 169px; left: 0; right: 0; display: block; z-index: 1; background-repeat: repeat-x; animation: city 20s linear infinite; } @keyframes city { 100%{ transform: translate(-1400px); } } .car{ width: 355px; left: 50%; bottom: 100px; transform: translate(-50%); position: absolute; z-index: 2; } .car img { width: 100%; animation: car 1s linear infinite; } @keyframes car{ 100%{ transform: translateY(-1px); } 50%{ transform: translateY(1px); } 0%{ transform: translateY(-1px); } } .wheel{ left: 50%; bottom: 138px; transform: translateX(-50%); position: absolute; z-index: 2; } .wheel img{ width: 55px; height: 55px; animation: wheel 1s linear infinite; } .back-wheel{ left: -116px; position: absolute; } .front-wheel{ left: 84px; position: absolute; } @keyframes wheel{ 100%{ transform: rotate(360deg); } } /* ----- Rotate world about us page ---*/ .rotate-tab { background-image: linear-gradient(to right, #d02b3d, #b02031, #b72334, #d42c3f); font-weight: bold; font-family: "Poppins", sans-serif; font-size: 100px; } .container-rotate { height: 137px; position: absolute; left: 50%; /* background: white; */ padding: 10px 18px; display: flex; margin-top: 131px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 1%; /* margin: 200px auto; */ border-radius: 8px; /* box-shadow: 0 20px 25px rgb(58 55 55 / 20%); */ } .container-rotate p { margin-left: 18px; margin-top: -5px; color: aliceblue; font-size: 100px; font-weight:900; } .rotate { overflow: hidden; } .rotate span { display: block; height: 100%; font-size: 100px; padding-left: 20px; color: #ffffff; font-weight:900; animation: spin_words 8s infinite; } @keyframes spin_words{ 10%{ transform: translateY(-112%); } 25%{ transform: translateY(-100%); } 35%{ transform: translateY(-212%); } 50%{ transform: translateY(-200%); } 60%{ transform: translateY(-312%); } 75%{ transform: translateY(-300%); } 85%{ transform: translateY(-412%); } 100%{ transform: translateY(-400%); } } .wrapper1{ text-align: center; margin: 51px auto; background: aliceblue; left: 50%; /* -webkit-transform: translateX(-50%); */ transform: translateX(-50%); position: absolute; /* left: 42%; */ color: #ca293b; padding: 0px 34px; font-size: 30px; font-weight: 900; border-radius: 19px; } .wrapper-emergency { text-align: center; position: absolute; font-size: 35px; margin: 80px auto; left: 15%; -webkit-transform: translateX(-50%); transform: translateX(-6%); color: #7a010e; font-weight: 900; } .crossfade > figure { animation: imageAnimation 4s linear infinite 0s; backface-visibility: hidden; background-size: cover; color: transparent; height: 100%; opacity: 0; width: 100%; z-index: 0; } .crossfade > figure:nth-child(2) { background-image: url('../images/aboutus/india.png'); animation-delay: 2s; width:450px; height:450px; margin: 0px 0px 35px 58px; } .crossfade > figure:nth-child(1) { background-image: url('../images/aboutus/world.png'); float:right; margin-top: 1px; width:630px; height:480px; } @keyframes imageAnimation { 0% { animation-timing-function: ease-in; opacity: 0; } 22% { animation-timing-function: ease-out; opacity: 10; } 37% { opacity: 10; } 55% { opacity: 0 } 100% { opacity: 0 } } .banner6 { background-image: linear-gradient(to right, #d02b3d, #b02031, #b72334, #d42c3f); height: 100%; padding: 0; margin: 0; box-sizing: border-box; font-family: "Poppins",sans-serif; font-size: 45px; font-weight: 500; } .wrapper-emergency { text-align: center; margin-top: 174px; font-size: 29px; color: #7a010e; letter-spacing: 2px; font-weight: 900; } .wrapper{ box-sizing: content-box; height: 70px; display: flex; justify-content: center; align-self: center; margin: auto; border-radius: 8px; position: relative; text-align: center; display: flex; } /*========================== terms and conditions ============================*/ .terms{ padding: 60px 20px; } .terms h1{ width: 100%; text-align: center; } .terms h2{ width: 100%; text-align: center; padding-top:20px; } .terms h3{ width: 100%; } .terms ul{ font-size: 15px; } .terms p{ font-size: 2rem; width: 100%;line-height: 1.2; } .table td, .table th { font-size: 2rem; } /* Style the tab */ .tab { overflow: hidden; background-color: #f1f1f1; } /* Style the buttons inside the tab */ .tab button { background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 14px 16px; transition: 0.3s; font-size: 17px; } /* Change background color of buttons on hover */ .tab button:hover { background-color: #ddd; } /* Create an active/current tablink class */ .tab button.active { background-color: #ccc; } /* Style the tab content */ .tabcontent { display: none; padding: 6px 12px; border-top: none; } .Optional-services { padding: 20px } /*========================== 13.FOOTER ============================*/ .footer { position: relative; overflow: hidden; background: #d52c3e; } .footer::after { content: ""; /*background: url(../images/waves2.svg) top no-repeat;*/ background-size: auto; background-size: contain; display: block; height: 100%; position: absolute; top: -5px; left: -1px; right: -4px; z-index: 1; } .footer-bottom, .footer-top { position: sticky; z-index: 2; } .footer .foot-logo img { height: 40px; float: left; margin: 17px 5px; } .footer .foot-logo h2 { color: #ffffff; } .footer .footer-menu li { margin-bottom: 10px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .footer .footer-menu li:hover { margin-left: 10px; } .footer h5 { color: #fff; } .footer p { color: #fff; } .footer .footer-menu li a, .footer .footer-menu li i { display: inline-block; font-size: 16px; color: #ddd !important; transition: all 0.5s; } .footer .footer-menu li a:hover, .footer .footer-menu li:hover i { color: #fff !important; } .footer .footer-menu1 li { margin-bottom: 10px; padding-left: 0px; } .footer .footer-menu1 li:hover { margin-left: 10px; } .footer .footer-menu1 li a, .footer .footer-menu1 li i { font-size: 16px; color: #ddd !important; } .footer .footer-menu1 li a:hover, .footer .footer-menu1 li:hover i { color: #fff !important; } .footer .footer-social .social-icon { display: block; background: #d52c3e; color: #ffffff; font-size: 17px; width: 26px; height: 26px; line-height: 28px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; transition: all 0.5s; } .footer .footer-social .social-icon:hover { color: #d52c3e !important; background-color: #ffffff; } .footer-desc { border-top: 1px solid rgba(255, 255, 255, 0.3); } .contact-menu-list li { display: flex; align-items: flex-start; line-height: normal; } .contact-menu-list i { font-size: 20px; margin-right: 10px; margin-top: 5px; } .footer .footer-newsletter { font-size: 15px; } .footer .footer-newsletter form { background: #fff; padding: 6px 10px; position: relative; border-radius: 50px; text-align: left; border: 1px solid #ddfbff; } .footer .footer-newsletter form input[type="email"] { border: 0; padding: 4px 8px; width: calc(100% - 100px); } .footer .footer-newsletter form input[type="submit"] { position: absolute; top: 0; right: 0; bottom: 0; border: 0; background: none; font-size: 16px; padding: 0 20px; background: #d52c3e; color: #fff; transition: 0.3s; border-radius: 50px; box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1); } .footer .footer-newsletter form input[type="submit"]:hover { background: #000; } .social-icon i { line-height: 28px; } .custom-nav .navbar-nav li.active a::before, .custom-nav .navbar-nav li.active a::after, .custom-nav .navbar-nav li:hover a::before, .custom-nav .navbar-nav li:hover a::after { opacity: 0; } @media (max-width:768px){ .footer .foot-logo img{ height: 40px; margin: auto; display: block; } .footer .foot-logo h2{ text-align: center; } .gallery a{ width: 50%; } .blog-section { height: 402px; margin-bottom: 29px; background: #FFFFFF; box-shadow: 0px 3px 6px #00000029; } .blog-section .description .read-more { float: left; position: relative; border: 1px solid #CFCFCF; border-radius: 24px; width: 68px; height: 19px; display: flex; align-items: center; background: #d52c3e; justify-content: center; font: normal normal normal 11px/20px Poppins; letter-spacing: 0px; color: #413D3D; overflow: hidden; cursor: pointer; } .description p{ text-align: justify; } } .image-swaping { height: auto; width: 100%; } .tablinks{ font-size: 16px; float: left; } .tollfreenumber { font-size: 40px; text-align: center; } .image-swaping-section { display:none; } #floating-button a { position: fixed; margin-top: 467px; left: -1%; height: 40px; transition: 0.3s; padding: 10px; width: 164px; text-decoration: none; font-size: 16px; color: white; border-radius: 0 5px 5px 0; } #floating-button a:hover { left: 0; } #book-ambulance-float { top: 20px; background-color: #d52c3e; } /*========================== 14.RESPONSIVE ============================*/ @media (max-width: 1697px) { .footer { padding-top: 0px; } .image-swaping-section { display:none; } } @media (max-width: 1545px) { .footer { padding-top: 0px; } .image-swaping-section { display:none; } .fixed-btn { position: fixed; bottom: 9%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #d52c3e; width: 260px; padding: 6px line-height: 45px; text-align: center; border-radius: 20px; box-shadow: 4px 4px 4px #d20000; cursor: pointer; } .fixed-btn p { /* text-transform: uppercase; */ font-family: arial; font-weight: 700; margin: 6px 4px 3px 4px; font-size: 24px; color: #fff; } .light1 { position: relative; width: 10px; height: 15%; top: -5px; left:22px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } } @media (max-width: 1480px) { .footer { padding-top: 0px; } .image-swaping-section { display:none; } .light1 { position: relative; width: 10px; height: 15%; top: -5px; left: 20px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } } @media (max-width: 1366px) { .home-bg.waves-bg { margin: 0 0 0; padding: 7rem 0 0 0; } .home-slider .owl-dots { position: absolute; left: 50%; bottom: 50px; transform: translateX(-50%); } .image-swaping-section { display: none; } .videoframe { width: 100%; height: 335px; } .light1 { position: relative; width: 10px; height: 15%; top: -5px; left: 22px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .skewblood { background: aqua; margin-left: 0px; -webkit-transform: skew( 0deg,0); transform: skew( 0deg,0); } .skewwrapper { margin-left: 0px; margin-right: 0px; } .skewblood-top .skew-content { padding: 20px 30px; text-align: center; height: 100%; display: -ms-flexbox; display: flex; -ms-flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; /* transform: skew( 347deg , 0); */ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; } .ambulanceblood { position: absolute; margin-top: 120px; top: 0%; left: 64%; transform: translate3d(-205%, 0%, 0); z-index: 99; } } @media (max-width: 1199px) { .container { max-width: 99%; } .image-swaping-section { display: none; } .light1 { position: relative; width: 10px; height: 15%; top: -5px; left: 4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .screenshot-phone { position: absolute; top: 8px; left: 50%; width: calc(30% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 191px; margin-left: -32px; /* margin: auto; */ margin-top: 13px; display: block; border-radius: 20px; } } @media (max-width: 1100px) { .footer { padding-top: 0px; } .image-swaping-section { display: none; } .screenshot-phone { position: absolute; top: 8px; left: 48%; width: calc(22% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } } @media (max-width: 768px) { .light { position: relative; width: 10px; height: 15%; top: 15px; left: 99px; padding: 5px 10px 4px; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .footer .footer-social .social-icon { display: block; background: #d52c3e; color: #ffffff; font-size: 14px; width: 26px; height: 26px; line-height: 28px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; transition: all 0.5s; } } @media (max-width: 991px) { .home-slider .owl-dots { bottom: 10px; } .contact_btn .btn-sm { background: #d52c3e; border: 2px solid #d52c3e; color: #fff; } .home-slider .owl-item img { display: table; margin: auto; max-width: 100%; } .home-slider .owl-item .actions { display: table; margin: 0 auto 20px; } .custom-nav .brand-logo .logo-dark { display: inline-block; } .custom-nav .brand-logo .logo-light { display: none; } .contact_btn { display: flex; } .custom-nav { background-color: #fff !important; margin-top: 0px; padding: 10px 0px !important; } .custom-nav .navbar-nav li a { color: #000; text-align: center; margin: 0 0px; padding: 6px 0; } .custom-nav .navbar-nav li.active a, .custom-nav .navbar-nav li:hover a { background-color: #fff; color: #d52c3e !important; border-radius: 0; } .custom-nav > .container { width: 90%; } .custom-nav .brand-logo { padding: 0px; } .custom-nav .navbar-brand.brand-logo img { height: 36px; } .navbar-collapse { background: #f8f8f8; border-top: 2px solid #eee; position: fixed; top: 61px; left: 0; width: 100%; padding: 0; } .navbar-nav { margin-top: 0px; } .section { padding-top: 30px; padding-bottom: 30px; } .ambulance-text-paragraph { display:none; } .gallery a { width: 47%; } .section-title h2, .section-subtitle { text-align: center; } .custom-nav { padding: 12px 0; } .container { max-width: 98%; } .m-text-center { text-align: center; } p { text-align: left; } .faq-body p { text-align: left; } .section-subtitle { max-width: 500px; font-size: 16px; padding-top: 0; display: table; margin: auto; } .foot-logo { display: grid; margin: auto; } .ftr-about { text-align: center !important; } .footer-social { text-align: left; } .m-box-0 { margin-bottom: 0; } .our-team .team-box .title-box h4 { text-align: center; } .btn { height: 35px !important; line-height: 35px; } .contact_btn .btn-sm { /*background-color: #ffffff; */ border: 2px solid #fff; /* color: #d52c3e; */ font-size: 10px; text-transform: capitalize; font-weight: 600; min-width: 84px; height: 40px; border-radius: 40px; display: flex; justify-content: center; transition: none; align-items: center; letter-spacing: 1px; -webkit-box-shadow: 0px 0px 15px 0px rgb(72 73 121 / 15%) !important; -moz-box-shadow: 0px 0px 15px 0px rgba(72, 73, 121, 0.15) !important; box-shadow: 0px 0px 15px 0px rgb(72 73 121 / 15%) !important; } .image-swaping-section { display: none; } .btn-banner2 { background: #d52c3e; color: #ffffff; width: 180px; font-size: 11px; padding: 1px; text-align: center; border-radius: 7px; } .button-banner-btn { margin-left:1px; } .videoframe { width:100%; height:193px; } .ambulance-paragraph { text-align:center; } .slider-img-items { position:relative; margin:0 auto; top:0px; left:0px; width:100%; height:280px; overflow:hidden; visibility:hidden; } .skewblood { background: aqua; margin-left: 0px; -webkit-transform: skew( 0deg,0); transform: skew( 0deg,0); } .skewwrapper { margin-left: 0px; margin-right: 0px; } .skewblood-top .skew-content { padding: 20px 30px; text-align: center; height: 100%; display: -ms-flexbox; display: flex; -ms-flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; /* transform: skew( 347deg , 0); */ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; } .light1 { position: relative; width: 10px; height: 15%; top: -5px; left: 4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .appdesignslider { margin-left: 12px; font-size: 31px; margin-bottom: 0.1rem; } .appdesignone { margin-left: 84px; } .mySlides1 { width: 162px; position: absolute; margin-top: -109px; padding: 47px 20px; border-radius: 50%; color: white; overflow: hidden; /* margin-right: 34px; */ text-align: center; /* float: right; */ margin-left: 205px; } .skew_item-title img { width: 85px; } .skewblood-top .skew-content h3 { color: white; font-size: 22px; } .logo-section-row img{ max-width: 95%; } .light { position: relative; width: 10px; height: 15%; top: 25px; left: 13px; padding: 5px 10px 4px; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .animationambulancestop { padding: 417px 0px 40px 0px; } .ambulance-blood { width: 314px; box-shadow: 0 0 30px 0 rgb(27 68 163 / 47%); background: #fdf8f8; border-radius: 25px; height: 415px; } .ambulanceblood { /* position: absolute; */ margin-top: 63px; top: 0; left: 50%; transform: translate3d(-50%, 0%, 0); /* z-index: 99; */ } .footer .footer-menu li a, .footer .footer-menu li i { display: inline-block; font-size: 14px; color: #ddd !important; transition: all 0.5s; } .aboutparagrph-section { margin: auto; width:auto; border-radius: 20px; display: block; background: white; margin-top: -34px; padding: 15px 10px; } .aboutparagrph-section p { text-align: center; font-size: 15px; } .screenshot-phone { position: absolute; top: 8px; left: 50%; width: calc(30% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .btn-ambipalm { position: relative; border-radius: 7px; font-size: 18px; padding: 4px 10px; border: none; color: white; background: #dc3346; display: block; margin: -142px 99px auto auto; } .load-more-container ul li { width: calc(48% - 10px); /* width: 100%; */ margin: 20px 7px 0; height: 93px; color: #fff; float: left; border-radius: 2px; } .load-more-container h4 { margin: auto; display: block; width: 100%; } .load-more-container .load-more-btn { width: 109px; float: inherit; border-radius: 20px; font-size: 18px; left: 34%; position: relative; line-height: 33px; border-radius: 5px; margin: 0px; height: 75px; padding: 0px; background: none; display: block; color: #fff; cursor: pointer; text-align: center; } .load-more-container1 ul li { width: calc(48% - 10px); /* width: 100%; */ margin: 3px 7px 0; height: 96px; color: #fff; /* padding: 5px; */ background: #ffffff; float: left; border-radius: 23px; } .load-more-container1 .load-more-btn1 { width: 109px; float: inherit; border-radius: 20px; font-size: 18px; left: 34%; height: 74px; padding: 0px; position: relative; line-height: 33px; border-radius: 5px; margin: 0px; background: none; display: block; color: #fff; cursor: pointer; text-align: center; } } @media (max-width: 768px) { .footer { padding-top: 0px; } .m-d-flex { display: flex; } .section { padding-top: 20px; padding-bottom: 20px; } .ambulance-text-paragraph { display:none; } .cities-banner { padding-top: 10px; } .section-subtitle { line-height: 1.6; } .m-al-c { display: flex; justify-content: center; } .appointment .contant-number { height: 360px; } .image-swaping-section { display: block; } .book-ambulance-online { display: none; } .ambalance-features { display: none; } .rounded-box { margin:10px 0px; } .tollfreenumber { font-size: 20px; text-align: center; margin:10px 0px 0px 0px; } .list-grid-footer { -ms-column-count: 2; -o-column-count: 2; -moz-column-count: 2; -khtml-column-count: 2; column-count: 2; padding-left: 0px; } .list-grid-footer1 { -ms-column-count: 2; -o-column-count: 2; -moz-column-count: 2; -khtml-column-count: 2; column-count: 2; padding-left: 0px; } .fixed-btn { position: fixed; bottom: 11%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #d52c3e; width: 223px; padding: 6px line-height: 45px; text-align: center; border-radius: 20px; box-shadow: 4px 4px 4px #d20000; cursor: pointer; } .fixed-btn p { /* text-transform: uppercase; */ font-family: arial; font-weight: 700; margin: 6px 4px 3px 12px; font-size: 24px; color: #fff; } .ambulance-paragraph { text-align:center; } .videoframe { width: 100%; height: 173px; } .skewblood-top { height: 370px; } .footer .footer-menu1 li a, .footer .footer-menu1 li i { font-size: 14px; color: #ddd !important; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .contact_pg_address { position: relative; top: 0px; z-index: 2; padding: 35px 14px 40px; background: #fff; box-shadow: 0px 0px 30px 0px rgb(227 228 228 / 98%); border-radius: 10px; } .pargraph-section { width: 1190px; margin-left: 0px; } .aboutparagrph-section { margin: auto; width:auto; border-radius: 20px; display: block; background: white; margin-top: -34px; padding: 15px 10px; } .aboutparagrph-section p { text-align: center; font-size: 15px; } .logo-section-row { flex: 0 0 100%; max-width: 25%; } .logo-section-row1 { flex: 0 0 100%; max-width: 100%; } .footer .footer-social .social-icon { display: block; background: #d52c3e; color: #ffffff; font-size: 14px; width: 26px; height: 26px; line-height: 28px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; transition: all 0.5s; } .blog-section-image{ height: 13vh; background-size: cover; background-position: center; margin: 50px 0px 0px; } .media-margin { padding: 0px 0px; margin-top: -86px; } .tabstories { display: flex; flex-direction: column; align-items: center; overflow: hidden; padding: 20px 0px 0px; /* display: block; */ margin: auto; width: 100%; } .screenshot-phone{ position: absolute; top: 8px; left: 50%; width: calc(30% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .owl-carousel .owl-item img { display: block; width: 130px; float: none; margin: auto; } .skew_item-title img { width: 100%; } #blood-img-home { width: 56% } #download .section-title { padding: 20px 0; } .hero-animation { height: 63vh; width: 100%; background-image: url(../images/animations/sky.jpg); background-size: cover; background-position: center; position: relative; overflow: hidden; } .ambu-fleet-options .section-heading { font-size: 29px; } #statistics { position: relative; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; text-align: center; color: #000000; padding-bottom: 20px; margin-bottom: 0px; } .carousel { padding: 0 5px; } section h1 { font-size: 40px; } #download { padding-top: 20px; } .blog-top-section { padding-top: 60px; } @media only screen and (max-width: 767px) { .home-slider .owl-item img { max-width: 100%; display: table; margin: auto; height: auto; } .home-slider .owl-dots { bottom: 0; } .home-bg .heading { font-size: 40px; line-height: 40px; text-align: center; } .container { max-width: 98%; } .section-title h2 { font-size: 30px; line-height: 1; text-align: center; } #section-heading { font-size: 30px; line-height: 1; text-align: center; } .description h3 { font-size: 21px; padding: 20px 0px 8px; } #download h2 { font-size: 30px; text-align: center; } .footer .footer-menu li:hover { margin-left: 0; } .our-team .team-box .title-box h4 { text-align: center; } .learn-more { margin: auto; display: table; } .sub-title { text-align: center; } .custom-nav .navbar-brand.brand-logo img { height: 24px; } .appointment .appointment-form { padding: 50px 0 50px 0px; } .appointment .appointment-form .title { text-align: center; } .image-swaping-section { display: block; } .tabcontent { float: left; padding: 3px 5px; width: 160px; border-left: none; } .book-ambulance-online { display: none; } .ambalance-features { display: none; } .rounded-box { margin:10px 0px; } .helplinetextcolor { font-size: 13px; color: black; margin-left: 2px; } .ambulance-paragraph { text-align:center; } #award-from-images { display: none; } .ambulance-text-paragraph { display:none; } .highway{ height: 169px; width: 1800%; display: block; background-image: url(../images/animations/road.jpg); position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; background-repeat: repeat-x; animation: highway 5s linear infinite; } .car { width: 309px; left: 50%; bottom: 100px; transform: translate(-50%); position: absolute; z-index: 2; } .wheel img { width: 52px; height: 52px; animation: wheel 1s linear infinite; } .back-wheel { left: -101px; position: absolute; } .front-wheel { left: 72px; position: absolute; } .wheel { left: 50%; bottom: 134px; transform: translateX(-50%); position: absolute; z-index: 2; } .ambulancetype { font-size: 30px; } .servicepromise h1 { font-size: 30px; text-align: left; } .section-heading{ font-size: 30px; text-align: center; } #videosswiping { height: 100%; } .videoswiping { width: 16%; padding: 0px 4px; } #c2 { padding: 0px 5px; margin-top: -35px; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .skewblood-top .skew-content { padding: 20px 30px; text-align: center; height: 100%; display: -ms-flexbox; display: flex; -ms-flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; transform: skew( 0deg, 0); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; } .skewblood-top { height: 370px; } .blog-image { width: 260px; } .logo-section-row { flex: 0 0 100%; max-width: 25%; } .footer .footer-social .social-icon { display: block; background: #d52c3e; color: #ffffff; font-size: 13px; width: 26px; height: 26px; line-height: 28px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; transition: all 0.5s; } .list-inline-item:not(:last-child) { margin-right: .0rem; width: 19px; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } .logo-section img { margin: auto; border-radius: 2px; display: block; float: inherit; margin-top: 16px; width: 95%; /* padding: 11px 12px; */ box-shadow: 2px 2px 2px 0px rgb(29 29 29 / 20%); /* background: #ffffff; */ display: table-cell; text-align: center; align-items: center; vertical-align: middle; } .blood-dona { padding: 40px 0px 0px; } @media (max-width: 599px) { .review-slider .user-txt { justify-content: center; padding: 1rem 0 2rem !important; } .review-slider .item .review-card::after { display: none; } .image-swaping-section { display: block; } .book-ambulance-online { display: none; } .ambalance-features { display: none; } .ambulance-paragraph { text-align:center; } .fixed-btn { position: fixed; bottom: 3%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background: #d52c3e; width: 200px; padding: 6px line-height: 45px; text-align: center; border-radius: 20px; box-shadow: 4px 4px 4px #d20000; cursor: pointer; } .fixed-btn p { /* text-transform: uppercase; */ font-family: arial; font-weight: 700; margin: 6px 4px 4px 14px; font-size: 18px; color: #fff; } .videoframe { width: 100%; height: 173px; } .ambulance-paragraph { text-align:center; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .container-rotate { height: 50px; position: absolute; padding: 10px 1px; display: flex; margin-top: 106px; top: 1%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); border-radius: 8px; } .rotate span { display: block; height: 100%; font-size: 20px; padding-left: 20px; color: #ffffff; font-weight: 900; animation: spin_words 8s infinite; } .container-rotate p { margin-left: 18px; margin-top: -2px; color: aliceblue; font-size: 20px; font-weight: 900; } .wrapper1 { text-align: center; margin: 17px auto; background: aliceblue; left: 50%; transform: translateX(-50%); position: absolute; color: #ca293b; padding: 1px 10px; font-size: 16px; font-weight: 700; border-radius: 46px; } .wrapper-emergency { text-align: center; font-size: 14px; margin-top: 47px; color: #7a010e; font-weight: 900; left: -37%; /* -webkit-transform: translateX(-50%); */ transform: translateX(18%); } .crossfade > figure:nth-child(2) { background-image: url(../images/slider-img/india.png); /* margin-left: 0px; */ animation-delay: 2s; align-items: center; width: 159px; margin: 25px 63px; /* margin: 39px 0px 10px 135px; */ height: 181px; } .crossfade > figure:nth-child(1) { background-image: url(../images/slider-img/world.png); float: right; margin-top: 28px; width: 326px; height: 161px; margin-right: 3px; } .marvel-device.note8 { width: 200px; height: 426px; background: black; border-radius: 34px; display: block; margin-left: auto; margin-right: auto; padding: 10px 10px; } .marvel-device.note8 .header { background: #1c1c1c; border-bottom-left-radius: 13px; border-bottom-right-radius: 13px; height: 16px; left: 50%; margin-left: -59px; position: absolute; top: 10px; width: 117px; z-index: 199; } .marvel-device.note8 .header:after { content: ""; position: absolute; top: 0; left: 108px; width: 14px; height: 20px; background-size: 100% 50%; background-repeat: no-repeat; background-image: radial-gradient(circle at 100% 100%, transparent 6px, #222 7px); } .awards_item_header h4 { background-color: #d52c3e; text-align: center; color: white; padding: 10px; font-size: 25px; height: 82px; margin: auto; } .awards_item_header h3 { background-color: #d52c3e; text-align: center; color: white; padding: 4px; font-size: 14px; height: 41px; margin: auto; } .appdesignslider { margin-left: 41px; font-size: 31px; margin-bottom: 3.1rem; } .appdesignappheader { font-size: 106px; font-weight: 900; margin: -32px -32px 0px 0px; } .appdesignheading { text-align: center; margin-left: 31px; font-size: 20px; margin-top: -13px; } .mySlides1 { width: 136px; height: auto; margin-top: -96px; margin-right: 0px; text-align: center; /* float: right; */ margin-left: 163px; position: absolute; overflow: hidden; padding:34px 0px; } .appdesignone { margin-left: 56px; } .seemoregallery { position: absolute; margin-top: -58px; font-size: 16px; margin-left: 15px; color: #ffffff; font-weight: 700; } .highway{ height: 169px; width: 1800%; display: block; background-image: url(../images/animations/road.jpg); position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; background-repeat: repeat-x; animation: highway 5s linear infinite; } .car { width: 309px; left: 50%; bottom: 100px; transform: translate(-50%); position: absolute; z-index: 2; } .wheel img { width: 52px; height: 52px; animation: wheel 1s linear infinite; } .back-wheel { left: -101px; position: absolute; } .front-wheel { left: 72px; position: absolute; } .wheel { left: 50%; bottom: 134px; transform: translateX(-50%); position: absolute; z-index: 2; } .skewblood { width: calc(100%); margin:0px 0px; } .skewblood-top { height: 370px; } .skewblood .skewblood-top:after, .skewblood .skewblood-top:before { content: ''; width: calc(100% + 4px); height: 0px; background-color: #fff; display: block; position: absolute; left: 0px; -webkit-transition: height .13s; transition: height .13s; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .blog-section { height: 452px; margin-bottom: 29px; background: #FFFFFF; box-shadow: 0px 3px 6px #00000029; } .screenshot-phone{ position: absolute; top: 8px; left: 50%; width: calc(60% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } div.gallery-1 { /* margin: 5px -10px; */ width: 100%; height: 100%; float: left; overflow: hidden; border-radius: 10px; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } @media (max-width: 575px) { .margin-top-sb-30 { margin-top: 30px; } .home-bg .heading { font-size: 40px; line-height: 40px; } .home-slider .owl-item img { max-width: 100%; display: table; margin: auto; height: auto; } .home-slider .owl-dots { bottom: -10px; } .footer-menu { display: none; margin-top: 10px !important; } .footer-title { position: relative; cursor: pointer; } .footer-title i { position: absolute; right: 0; margin-top: 1px; font-size: 18px; } .footer-title.active i { transform: rotateZ(-180deg); } .helplinetextcolor { font-size: 13px; color: black; margin-top:10px; margin-left: 2px; } .ambulance-paragraph { text-align:center; } .videoframe { width: 100%; height: 236px; } .breakpoint { max-width: 100%; } .gallery a { width: 48%; margin: 2px; } .light { position: relative; margin: auto; display: block; width: 10px; height: 15%; top: 15px; left: 0px; padding: 5px 10px 4px; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .light2 { position: relative; width: 10px; height: 15%; top: -5px; left:4px; padding: 5px 10px 4px;; border-radius: 6px; -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-name: light; animation-name: light; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; display: inline-block; } .skewblood-top { height: 370px; } .screenshot-phone{ position: absolute; top: 2px; left: 50%; width: calc(62% + 1%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } @media only screen and (max-width: 479px) { .footer { padding-top: 0px; } .brand-logo.navbar-brand { margin-right: 5px !important; background-image: url(../images/logo.png); } .custom-nav .navbar-brand.brand-logo img { height: 20px; } .helplinetextcolor { font-size: 13px; color: black; margin-left: 2px; } .tabcontent { float: left; padding: 3px 5px; width: 150px; border-left: none; } .ambulance-paragraph { text-align:center; } .videoframe { width: 100%; height: 200px; } .skewblood-top { height: 370px; } .blog-section { height: 442px; margin-bottom: 29px; background: #FFFFFF; box-shadow: 0px 3px 6px #00000029; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } @media only screen and (max-width: 411px) { .videoframe { width: 100%; height: 174px; } .skewblood-top { height: 370px; } .appdesignone { margin-left: 50px; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } @media only screen and (max-width: 366px) { .videoframe { width: 100%; height: 174px; } .skewblood-top { height: 370px; } .blog-section { height: 382px; margin-bottom: 29px; background: #FFFFFF; box-shadow: 0px 3px 6px #00000029; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } @media only screen and (max-width: 375px) { .appdesignone { margin-left: 56px; } .screenshot-phone{ position: absolute; top: 8px; left: 50%; width: calc(70% + 2%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } } @media only screen and (max-width: 667px) { @media only screen and (max-width: 379px) { .appdesignone { margin-left: 58px; } .screenshot-phone{ position: absolute; top: 2px; left: 50%; width: calc(67% + 2%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } } @media only screen and (max-width: 640px) { @media only screen and (max-width: 360px) { .appdesignone { margin-left: 58px; } .screenshot-phone{ position: absolute; top: 2px; left: 50%; width: calc(70% + 3%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } } @media only screen and (max-width: 659px) { @media only screen and (max-width: 299px) { .screenshot-phone{ position: absolute; top: 1px; left: 50%; width: calc(82% + 2%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } } } @media only screen and (max-width: 670px) { @media only screen and (max-width: 340px) { .screenshot-phone{ position: absolute; top: 1px; left: 50%; width: calc(82% + 2%); cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } } } @media only screen and (max-width: 568px) { @media only screen and (max-width: 320px) { .appdesignone { margin-left: 58px; } .screenshot-phone{ position: absolute; top: 1px; left: 50%; /* width: calc(93% + 2%);*/ cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } .swiper-images-animation { width: 204px; margin: auto; display: block; border-radius: 20px; } } } @media only screen and (max-width: 720px) { @media only screen and (max-width: 540px) { .screenshot-phone{ position: absolute; top: 1px; left: 50%; /* width: calc(45% + 2%); */ cursor: pointer; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); text-align: center; z-index: 100; } } } @media (max-width:567px){ h2.appdesignappheader { /* position: absolute; */ top: 0; /* margin-bottom: 100px; */ right: 13%; font-size: 26px; } .ambulance_image{ display: none; } .ambulanceblood { /* position: absolute; */ margin-top: 105px; top: 0; left: 50%; transform: translate3d(-50%, 0%, 0); /* z-index: 99; */ } .navbar-collapse { background: #f8f8f8; border-top: 2px solid #eee; position: fixed; top: 102px; left: 0; width: 100%; padding: 0; } }