@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap"); @import url("https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap"); @import url(https://site-assets.fontawesome.com/releases/v6.2.1/css/all.css); @import url(https://site-assets.fontawesome.com/releases/v6.2.1/css/sharp-solid.css); html{ overflow-x:hidden; } body { padding: 0; margin: 0; font-family: "Roboto", sans-serif; font-size: 15px; scroll-behavior: smooth; overflow-x:none; } :root { --pink: #e33067; --blue: #3f3d8d; --price-tag-background: rgba(0, 0, 0, 0.3); --price-tag-height: 2rem; } /* Scrollbar */ ::-webkit-scrollbar { width: 7px; } /* Handle */ ::-webkit-scrollbar-thumb { background: var(--pink); } /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { background: var(--blue); } .ptb-120 { padding-top: 120px; padding-bottom: 120px; } .ptb-30 { padding-top: 30px; padding-bottom: 30px; } .ml-30 { margin-left: 30px; } .bg-fffcfb { background-color: #fffcfb; } .bg-fff7f4 { background-color: #fff7f4; } .bg-ffeff4{ background-color:#ffeff4; } p { margin-bottom: 15px; color: #666666; font-size: 15px; line-height: 1.8; } p:last-child { margin-bottom: 0; } img { max-width: 100%; } button { outline: 0 !important; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: "Poppins", sans-serif; } a { display: block; text-decoration: none; -webkit-transition: 0.5s; transition: 0.5s; color: #323232; outline: 0; } a:hover { text-decoration: none; color: var(--pink); } .d-table { width: 100%; height: 100%; } .d-table-cell { vertical-align: middle; } .go-top i { padding-top: 11px; } /*btn*/ .btn { padding: 14px 28px; text-transform: uppercase; line-height: initial; border-radius: 0; -webkit-transition: 0.5s; transition: 0.5s; font-size: 15px; font-weight: 500; } .content-wrapper { background-color: #ffffff; } .btn.disabled, .btn:disabled { opacity: 1; } .btn-primary { color: #ffffff; background-color: var(--pink); border-color: var(--pink); } .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle { color: var(--pink); border-color: var(--pink); background-color: transparent; } .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus { -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); } .btn-primary.disabled, .btn-primary:disabled { color: #ffffff; background-color: var(--pink); border-color: var(--pink); } .btn-primary:hover, .btn-primary:focus { color: var(--pink); border-color: var(--pink); background-color: transparent; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); } .btn-secondary { background-color: transparent; color: var(--pink); border-color: var(--pink); -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.02); } .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle { background-color: var(--pink); color: #ffffff; border-color: var(--pink); } .btn-secondary.focus, .btn-secondary:focus { -webkit-box-shadow: unset; box-shadow: unset; } .btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus { -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); } .btn-secondary.disabled, .btn-secondary:disabled { background-color: transparent; color: var(--pink); border-color: var(--pink); -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.05), 0 10px 10px rgba(0, 0, 0, 0.02); } .btn-secondary:hover, .btn-secondary:focus { background-color: var(--pink); color: #ffffff; border-color: var(--pink); } .mtb-30 { margin-top: 30px; } section { /*margin-top: 30px;*/ } /*section-title*/ .section-title { position: relative; margin-bottom: 60px; } .section-title .btn { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .section-title span { display: block; color: var(--blue); text-transform: uppercase; margin-bottom: 12px; position: relative; padding-left: 15px; z-index: 1; padding-top: 3px; padding-bottom: 2px; font-size: 15px; font-weight: 400; } .section-title span::before { content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 50px; background: var(--blue); z-index: -1; opacity: .20; } .section-title span.bg-f59f00 { color: var(--blue); } .section-title span.bg-f59f00::before { background: var(--blue); } .section-title span.bg-0018ff { color: #0018ff; } .section-title span.bg-0018ff::before { background: #0018ff; } .section-title span.bg-ff5d24 { color: var(--pink); } .section-title span.bg-ff5d24::before { background: var(--pink); } .section-title h2, .section-title h3{ margin-bottom: 0; /*max-width: 640px;*/ font-weight: 700; font-size: 38px; } .section-title p { max-width: 580px; margin-bottom: 0; margin-top: 12px; } .section-title.text-center span { display: inline-block; } .section-title.text-center h2 { margin-left: auto; margin-right: auto; } .section-title.text-center p { max-width: 665px; margin-bottom: 0; margin-top: 15px; margin-left: auto; margin-right: auto; } /*form-control*/ .form-group { margin-bottom: 15px; } .form-control { height: 45px; padding: 10px; font-size: 14px; font-weight: 400; line-height: initial; color: #323232; background-color: transparent; border: 1px solid #eeeeee; border-radius: 0; -webkit-transition: 0.5s; transition: 0.5s; width: 100%; } .form-control:focus { -webkit-box-shadow: unset; box-shadow: unset; border-color: var(--pink); } .form-control::-webkit-input-placeholder { color: #5f5f5f; } .form-control:-ms-input-placeholder { color: #5f5f5f; } .form-control::-ms-input-placeholder { color: #5f5f5f; } .form-control::placeholder { color: #5f5f5f; } /*================================================ Preloader Area CSS =================================================*/ .preloader { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--pink); z-index: 9999999; text-align: center; } .preloader .loader { position: absolute; left: 0; right: 0; margin: 0 auto; -webkit-animation: load 1.2s infinite 0s ease-in-out; animation: load 1.2s infinite 0s ease-in-out; -webkit-animation-direction: alternate; animation-direction: alternate; color: #ffffff; top: 45%; -webkit-transform: translateY(-45%); transform: translateY(-45%); font-size: 30px; font-weight: 700; } @-webkit-keyframes load { 0% { opacity: 0.08; -webkit-filter: blur(5px); filter: blur(5px); letter-spacing: 3px; } } @keyframes load { 0% { opacity: 0.08; -webkit-filter: blur(5px); filter: blur(5px); letter-spacing: 3px; } } /*================================================ Navbar Area CSS =================================================*/ .labto-mobile-nav { display: none; } .labto-mobile-nav.mean-container .mean-nav ul li a.active { color: var(--pink); } .navbar-area { position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 999; } .logo img { height: 60px !important; } .navbar-area.is-sticky { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); background-color: #ffffff !important; -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; } .navbar-brand { padding-top: 0; padding-bottom: 0; } .labto-nav { background-color: transparent; padding-top: 15px; padding-bottom: 15px; } .labto-nav img { height: 60px; } .labto-nav .navbar { padding-right: 0; padding-top: 0; padding-left: 0; padding-bottom: 0; } .labto-nav .navbar ul { padding-left: 0; list-style-type: none; margin-bottom: 0; } .labto-nav .navbar .navbar-nav { margin-left: auto; } .labto-nav .navbar .navbar-nav .nav-item { position: relative; padding-top: 15px; padding-bottom: 15px; padding-left: 0; padding-right: 0; } .labto-nav .navbar .navbar-nav .nav-item a { font-size: 14px; font-weight: 600; color: #323232; text-transform: uppercase; -webkit-transition: 0.5s; transition: 0.5s; padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; margin-left: 5px; margin-right: 5px; } .labto-nav .navbar .navbar-nav .nav-item a:hover, .labto-nav .navbar .navbar-nav .nav-item a:focus, .labto-nav .navbar .navbar-nav .nav-item a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item a i { font-size: 11px; } .labto-nav .navbar .navbar-nav .nav-item:last-child a { margin-right: 0; } .labto-nav .navbar .navbar-nav .nav-item:first-child a { margin-left: 0; } .labto-nav .navbar .navbar-nav .nav-item:hover a, .labto-nav .navbar .navbar-nav .nav-item:focus a, .labto-nav .navbar .navbar-nav .nav-item.active a { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu { -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1); background: #ffffff; position: absolute; border: none; top: 80px; left: 0; width: max-content; z-index: 99; display: block; opacity: 0; visibility: hidden; border-radius: 0; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; padding-top: 20px; padding-left: 5px; padding-right: 5px; padding-bottom: 20px; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li { padding: 0; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li a { text-transform: capitalize; padding: 8px 15px; margin: 0; color: #323232; font-size: 15px; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:focus, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu { position: absolute; left: 100%; top: 0; opacity: 0; visibility: hidden; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a { color: #323232; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:hover, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a:focus, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu { left: 220px; top: 0; opacity: 0; visibility: hidden; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a { color: #323232; text-transform: capitalize; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu { left: -250px; top: 0; opacity: 0; visibility: hidden; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a { color: #323232; text-transform: capitalize; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:hover, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a:focus, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu .dropdown-menu { left: -250px; top: 0; opacity: 0; visibility: hidden; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu .dropdown-menu li a { color: #323232; text-transform: capitalize; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu .dropdown-menu li a:hover, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu .dropdown-menu li a:focus, .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu .dropdown-menu li a.active { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu.active a { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu:hover .dropdown-menu { opacity: 1; visibility: visible; top: -15px; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li.active a { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li .dropdown-menu li:hover .dropdown-menu { opacity: 1; visibility: visible; top: -15px; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li.active a { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li .dropdown-menu li:hover .dropdown-menu { opacity: 1; visibility: visible; top: -15px; } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li.active a { color: var(--pink); } .labto-nav .navbar .navbar-nav .nav-item .dropdown-menu li:hover .dropdown-menu { opacity: 1; visibility: visible; top: -15px; } .labto-nav .navbar .navbar-nav .nav-item:hover .dropdown-menu { opacity: 1; visibility: visible; top: 100%; } .labto-nav .others-options { display: flex; margin-left: 23px; } .labto-nav .others-options .cart-btn { top: 2px; display: inline-block; margin-right: 30px; position: relative; } .labto-nav .others-options .cart-btn i::before { font-size: 18px; } .labto-nav .others-options .cart-btn span { background-color: #323232; border-radius: 50%; width: 15px; height: 15px; line-height: 15px; display: inline-block; color: #ffffff; text-align: center; position: absolute; right: -10px; top: 0; font-size: 7px; font-weight: 500; } .labto-nav .others-options .languages-list { position: relative; top: 1px; display: inline-block; margin-right: 20px; } .labto-nav .others-options .languages-list .nice-select { border-radius: 0; border: none; float: unset; font-size: 14px; font-weight: 500; height: auto; line-height: initial; outline: none; text-transform: uppercase; padding-left: 0; padding-right: 10px; } .labto-nav .others-options .languages-list .nice-select .list { background-color: #ffffff; border: none; border-radius: 0; -webkit-box-shadow: unset; box-shadow: unset; margin-top: 5px; left: -24px; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .labto-nav .others-options .languages-list .nice-select .list .option { line-height: initial; min-height: unset; margin-top: 10px; padding-left: 25px; padding-right: 25px; } .labto-nav .others-options .languages-list .nice-select .list .option:hover, .labto-nav .others-options .languages-list .nice-select .list .option.focus, .labto-nav .others-options .languages-list .nice-select .list .option.selected.focus { background-color: transparent; } .labto-nav .others-options .languages-list .nice-select .list .option:last-child { margin-bottom: 10px; } .labto-nav .others-options .languages-list .nice-select:after { right: 0; } /*================================================ Main Banner Area CSS =================================================*/ .main-banner { position: relative; z-index: 1; padding-top: 90px; /*padding-bottom: 70px;*/ } .carousel-indicators button { background-color: var(--blue) !important; width: 50px !important; height: 10px !important; position: relative; top: 50px; } .carousel-item { position: relative; } .carousel-caption { top: 50%; transform: translateY(-50%); left: 5%; max-width: 50%; text-align: left; } .carousel-caption h1, .carousel-caption h2, .carousel-caption h3{ color: var(--blue); text-align: left; font-weight: 600; } .carousel-caption button { text-align: left; margin-top: 15px; } .carousel-caption a { color: white; } .carousel-caption button:hover a { color: var(--pink); } .carousel-control-next, .carousel-control-prev { width: 8% !important; } /* .carousel-item .shortcut{ position: absolute; bottom: 0px; right: 0px; z-index: 999; } */ .carousel-item .shortcut a { font-size: 14px !important; padding: 5px 15px !important; } .carousel-item .shortcut a:hover { background-color: var(--blue); color: white; border: 1px solid var(--blue); } .carousel-item .shortcut .appointment-btn { transform: rotate(90deg); position: absolute; top: 25%; right: -50px; z-index: 999; } .carousel-item .shortcut .call-btn { transform: rotate(90deg); position: absolute; top: 50%; right: -35px; z-index: 999; } .main-banner-content h1 { margin-bottom: 0; font-size: 57px; font-weight: 700; } .main-banner-content p { margin-top: 12px; margin-bottom: 0; } .main-banner-content .btn { margin-top: 20px; } .main-banner-content span { display: inline-block; color: var(--pink); background-color: #ffdfd3; font-weight: 600; padding: 9px 30px; border-radius: 30px; margin-bottom: 15px; } .banner-image { position: relative; z-index: 1; text-align: center; } .banner-image img:nth-child(2) { position: absolute; top: 30px; left: 0; right: 0; margin: 0 auto; z-index: -1; opacity: .40; -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; } .shape-img1 { position: absolute; left: 5%; top: 8%; z-index: -1; } .shape-img2 { position: absolute; left: 2%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: -1; -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; } .shape-img3 { position: absolute; left: 4%; bottom: 0; z-index: -1; } .shape-img4 { position: absolute; left: 25%; bottom: 5%; z-index: -1; } .shape-img5 { position: absolute; left: 25%; top: 12%; z-index: -1; -webkit-animation: rotate3d 4s linear infinite; animation: rotate3d 4s linear infinite; } .shape-img6 { position: absolute; left: 35%; top: 5%; z-index: -1; -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; } .shape-img7 { position: absolute; right: 7%; top: 10%; z-index: -1; -webkit-animation: movebounce 9s linear infinite; animation: movebounce 9s linear infinite; } .shape-img8 { position: absolute; right: 2%; bottom: 15%; z-index: -1; -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; } .rotateme { -webkit-animation-name: rotateme; animation-name: rotateme; -webkit-animation-duration: 20s; animation-duration: 20s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; } @-webkit-keyframes rotateme { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotateme { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes movebounce { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @keyframes movebounce { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @-webkit-keyframes rotate3d { 0% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } 100% { -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } @keyframes rotate3d { 0% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } 100% { -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } @-webkit-keyframes animationFramesOne { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @keyframes animationFramesOne { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } /*================================================ Boxes Area CSS =================================================*/ .boxes-area { position: relative; z-index: 1; } .boxes-area::before { content: ''; height: 150px; -webkit-box-shadow: 7px 5px 30px 0 rgba(72, 73, 121, 0.08); box-shadow: 7px 5px 30px 0 rgba(72, 73, 121, 0.08); position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 0; right: 0; background: #ffffff; margin-left: 140px; margin-right: 140px; } .single-box { text-align: center; position: relative; z-index: 1; background-color: var(--pink); padding: 25px; overflow: hidden; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); min-height: 240px; } .single-box .icon { color: #ffffff; } .single-box .icon i::before { font-size: 45px; } .single-box h3 { margin-top: 10px; margin-bottom: 0; color: #ffffff; font-size: 20px; font-weight: 700; } .single-box p { color: #ffffff; margin-top: 13px; margin-bottom: 0; } .single-box .learn-more-btn { margin-top: 17px; color: #ffffff; } .single-box .learn-more-btn::before { background: #ffffff; } .single-box .shape-box img:nth-child(1) { position: absolute; left: -60px; top: -60px; z-index: -1; } .single-box .shape-box img:nth-child(2) { position: absolute; right: 0; bottom: 0; z-index: -1; } .single-box.bg-43c784 { background-color: #43c784; } .single-box.bg-43c784 .shape-box img:nth-child(1) { left: auto; right: -60px; top: -60px; } .single-box.bg-43c784 .shape-box img:nth-child(2) { right: auto; bottom: 0; left: 0; } .single-box.bg-f59f00 { background-color: var(--blue); } .single-box.bg-f59f00 .shape-box img:nth-child(1) { left: auto; right: -60px; top: auto; bottom: -60px; } .single-box.bg-f59f00 .shape-box img:nth-child(2) { bottom: auto; left: -25px; top: -25px; -webkit-transform: rotate(180deg); transform: rotate(180deg); } /*================================================ About Area CSS =================================================*/ .about-area { position: relative; z-index: 1; } .about-content { padding-left: 30px; } .about-content span { display: block; color: var(--pink); text-transform: uppercase; margin-bottom: 12px; position: relative; z-index: 1; padding-left: 15px; padding-top: 3px; padding-bottom: 2px; font-size: 15px; font-weight: 400; } .about-content span::before { content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 50px; background: var(--pink); z-index: -1; opacity: .20; } .about-content h2 { margin-bottom: 0; font-weight: 700; font-size: 38px; } .about-content p { margin-top: 12px; margin-bottom: 0; } .about-content .about-features-list { margin-bottom: 0; padding-left: 0; list-style-type: none; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; margin-top: 10px; } .about-content .about-features-list li { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; font-weight: 500; color: #666666; padding-right: 15px; padding-left: 15px; padding-top: 10px; } .about-content .about-features-list li i { color: #ffb923; margin-right: 2px; } .about-content .btn-box { margin-top: 25px; } .about-content .video-btn { display: inline-block; width: 50px; height: 50px; line-height: 49px; text-align: center; border: 1px solid var(--pink); border-radius: 50%; position: relative; z-index: 1; top: 3.5px; margin-left: 25px; } .about-content .video-btn i::before { font-size: 20px; } .about-content .video-btn::after { z-index: -1; content: ''; position: absolute; left: 0; top: 0; width: 50px; height: 50px; -webkit-animation: ripple 1.6s ease-out infinite; animation: ripple 1.6s ease-out infinite; opacity: 0; border-radius: 50%; background: rgba(255, 93, 36, 0.3); } .about-content .video-btn:hover, .about-content .video-btn:focus { color: #ffffff; background-color: var(--pink); } .about-company-content span { display: block; color: var(--pink); text-transform: uppercase; margin-bottom: 12px; position: relative; z-index: 1; padding-left: 15px; padding-top: 3px; padding-bottom: 2px; font-size: 15px; font-weight: 400; } .about-company-content span::before { content: ''; position: absolute; left: 0; top: 0; height: 100%; width: 50px; background: var(--pink); z-index: -1; opacity: .20; } .about-company-content h2 { margin-bottom: 15px; font-weight: 700; font-size: 38px; } .about-our-company-inner { margin-top: 120px; z-index: 1; position: relative; background-color: #ffffff; } .about-our-company-inner::before { z-index: -1; left: 0; bottom: 0; width: 100%; height: 93%; content: ''; position: absolute; background: #fff7f4; } .about-inner-company-content h2 { margin-bottom: 18px; font-weight: 700; font-size: 38px; } .bg-shape1 { position: absolute; z-index: -1; left: 0; bottom: 25px; } .bg-shape1 img { max-width: 80%; } .shape-img9 { z-index: -1; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } @-webkit-keyframes ripple { 0%, 35% { -webkit-transform: scale(0); transform: scale(0); opacity: 1; } 50% { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0.8; } 100% { opacity: 0; -webkit-transform: scale(2); transform: scale(2); } } @keyframes ripple { 0%, 35% { -webkit-transform: scale(0); transform: scale(0); opacity: 1; } 50% { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0.8; } 100% { opacity: 0; -webkit-transform: scale(2); transform: scale(2); } } /*================================================ Services Area CSS =================================================*/ .services-area { padding-bottom: 90px; } .single-services-box { background-color: #ffffff; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); padding: 30px; border-radius: 3px; margin-bottom: 30px; -webkit-transition: 0.5s; transition: 0.5s; } .single-services-box .icon { display: inline-block; width: 80px; height: 80px; line-height: 80px; background: -webkit-gradient(linear, left top, left bottom, from(#ffdfd4), color-stop(#ffe6e0), color-stop(#ffeeeb), color-stop(#fff6f5), to(#fffefe)); background: linear-gradient(to bottom, #ffdfd4, #ffe6e0, #ffeeeb, #fff6f5, #fffefe); text-align: center; border-radius: 50%; color: var(--pink); -webkit-transition: 0.5s; transition: 0.5s; } .services-box .fas { position: relative; top: 10px; } .services-box:hover { background-color: var(--pink) !important; } .single-services-box .icon i::before { font-size: 38px; } .single-services-box .icon.bg-24b765 { color: #24b765; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .single-services-box .icon.bg-f59f00 { color: var(--blue); background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#fef0d7), color-stop(#fef4e1), color-stop(#fff8ec), to(#fffcf7)); background: linear-gradient(to bottom, #fdeccc, #fef0d7, #fef4e1, #fff8ec, #fffcf7); } .single-services-box .icon.bg-f7b232 { color: #f7b232; background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#feefd6), color-stop(#fff3df), color-stop(#fff6e9), to(#fffaf3)); background: linear-gradient(to bottom, #fdeccc, #feefd6, #fff3df, #fff6e9, #fffaf3); } .single-services-box .icon.bg-fe5d24 { color: #fe5d24; background: -webkit-gradient(linear, left top, left bottom, from(#feded2), color-stop(#fee5db), color-stop(#ffede5), color-stop(#fff4ef), to(#fffbf9)); background: linear-gradient(to bottom, #feded2, #fee5db, #ffede5, #fff4ef, #fffbf9); } .single-services-box .icon.bg-45c27c { color: #45c27c; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .single-services-box h3 { margin-top: 20px; margin-bottom: 0; font-size: 20px; font-weight: 700; } .single-services-box p { margin-top: 12px; margin-bottom: 0; } .single-services-box .learn-more-btn { margin-top: 15px; } .single-services-box:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); } .single-services-box:hover .icon { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .services-box { text-align: center; background-color: #ffffff; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); padding: 30px; border-radius: 3px; margin-bottom: 30px; -webkit-transition: 0.5s; transition: 0.5s; position: relative; z-index: 1; overflow: hidden; } .services-box1 { text-align: center; background-color: #ffffff; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); padding: 25px; border-radius: 3px; margin-bottom: 30px; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; position: relative; z-index: 1; overflow: hidden; box-sizing: border-box !important; min-height: 405px; min-width: 350px; } .services-box1 .adtocart { padding: 10px; } .services-box .icon { display: inline-block; width: 80px; height: 80px; line-height: 80px; background: -webkit-gradient(linear, left top, left bottom, from(#ffdfd4), color-stop(#ffe6e0), color-stop(#ffeeeb), color-stop(#fff6f5), to(#fffefe)); background: linear-gradient(to bottom, #ffdfd4, #ffe6e0, #ffeeeb, #fff6f5, #fffefe); text-align: center; border-radius: 50%; color: var(--pink); -webkit-transition: 0.5s; transition: 0.5s; } .services-box .icon i::before { font-size: 38px; } .services-box .icon.bg-24b765 { color: #24b765; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .services-box .icon.bg-f59f00 { color: var(--blue); background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#fef0d7), color-stop(#fef4e1), color-stop(#fff8ec), to(#fffcf7)); background: linear-gradient(to bottom, #fdeccc, #fef0d7, #fef4e1, #fff8ec, #fffcf7); } .services-box .icon.bg-f7b232 { color: #f7b232; background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#feefd6), color-stop(#fff3df), color-stop(#fff6e9), to(#fffaf3)); background: linear-gradient(to bottom, #fdeccc, #feefd6, #fff3df, #fff6e9, #fffaf3); } .services-box .icon.bg-fe5d24 { color: #fe5d24; background: -webkit-gradient(linear, left top, left bottom, from(#feded2), color-stop(#fee5db), color-stop(#ffede5), color-stop(#fff4ef), to(#fffbf9)); background: linear-gradient(to bottom, #feded2, #fee5db, #ffede5, #fff4ef, #fffbf9); } .services-box .icon.bg-45c27c { color: #45c27c; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .services-box h3 { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 20px; margin-bottom: 0; font-size: 20px; font-weight: 700; } .services-box1 h3 { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 20px; margin-bottom: 0; font-size: 20px; font-weight: 700; } .services-box p { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 12px; margin-bottom: 0; } .services-box1 p { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 12px; margin-bottom: 0; } .services-box .learn-more-btn { margin-top: 15px; } .services-box1 .learn-more-btn { margin-top: 15px; } .services-box img { position: absolute; right: -100px; top: -100px; z-index: -1; opacity: 0; visibility: hidden; -webkit-transition: 0.5s; transition: 0.5s; } .services-box1 img { height: auto; transition: all ease 0.5s; } .services-box1:hover img { transform: translateY(-10px); -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .services-box:hover .icon { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .services-box:hover h3 { color: #ffffff; } .services-box:hover p { color: #ffffff; } .services-box:hover .learn-more-btn { color: #ffffff; } .services-box:hover .learn-more-btn::before { background: #ffffff; } .services-box:hover img { opacity: 1; visibility: visible; right: -80px; top: -80px; } .learn-more-btn { display: inline-block; color: var(--pink); font-weight: 600; position: relative; z-index: 1; } .learn-more-btn i { margin-left: 3px; } .learn-more-btn i::before { font-size: 13px; } .learn-more-btn::before { width: 100%; height: 1px; background: var(--pink); content: ''; bottom: 1.5px; left: 0; position: absolute; -webkit-transition: 0.5s; transition: 0.5s; } .learn-more-btn:hover::before { left: auto; right: 0; width: 0; } /*================================================ Services Details Area CSS =================================================*/ .services-details h1 { color: var(--blue); font-size: 30px; font-weight: 600; } .services-details img { height: 300px; width: auto; } .services-details .services-details-desc { margin-top: 25px; } .services-details .services-details-desc h3 { margin-bottom: 15px; line-height: 1.5; font-size: 20px; font-weight: 700; } .services-details .services-details-desc h3:not(:first-child) { margin-top: 20px; } .services-details .services-details-desc .services-details-features-list { /* background-color: #ffffff; */ padding: 0px 40px; /* -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); margin-top: 30px; */ } .services-details .services-details-desc .services-details-features-list ul { padding-left: 0; list-style-type: none; /* display: -ms-flexbox; */ /* display: -webkit-box; */ /* display: flex; */ /* -ms-flex-wrap: wrap; */ /* flex-wrap: wrap; */ margin-bottom: 0; margin-left: -15px; margin-right: -15px; margin-top: -12px; } .services-details .services-details-desc .services-details-features-list ul li { margin-top: 12px; color: #666666; /* flex: 0 0 50%; */ /* max-width: 50%; */ padding-right: 15px; padding-left: 15px; } .services-details .services-details-desc .services-details-features-list ul li i { color: var(--pink); margin-right: 2px; } .services-details .services-details-desc .services-details-features-list ul li i::before { font-size: 13px; } .services-details .services-details-desc .services-details-features-list ul li:nth-child(1) i, .services-details .services-details-desc .services-details-features-list ul li:nth-child(6) i, .services-details .services-details-desc .services-details-features-list ul li:nth-child(10) i { color: var(--blue); } .services-details .services-details-desc .services-details-features-list ul li:nth-child(4) i, .services-details .services-details-desc .services-details-features-list ul li:nth-child(7) i { color: #f8c363; } .services-details .services-details-desc .services-details-features-list ul li:nth-child(3) i, .services-details .services-details-desc .services-details-features-list ul li:nth-child(9) i { color: #545454; } .services-details .services-details-desc .services-details-faq { margin-top: 25px; } .services-details .services-details-desc .services-details-faq .accordion { list-style-type: none; padding: 0; margin: 0; } .services-details .services-details-desc .services-details-faq .accordion .accordion-item { display: block; margin-bottom: 15px; border: none; } .services-details .services-details-desc .services-details-faq .accordion .accordion-item:last-child { margin-bottom: 0; } .services-details .services-details-desc .services-details-faq .accordion .accordion-item .accordion-title { color: #323232; position: relative; padding-left: 22px; font-size: 16px; font-weight: 600; } .services-details .services-details-desc .services-details-faq .accordion .accordion-item .accordion-title i { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-52%); transform: translateY(-52%); font-size: 14px; } .services-details .services-details-desc .services-details-faq .accordion .accordion-item .accordion-title:hover, .services-details .services-details-desc .services-details-faq .accordion .accordion-item .accordion-title.active { color: var(--pink); } .services-details .services-details-desc .services-details-faq .accordion .accordion-item .accordion-title.active i::before { content: "\f068"; } .services-details .services-details-desc .services-details-faq .accordion .accordion-content { display: none; margin-top: 8px; } .services-details .services-details-desc .services-details-faq .accordion .accordion-content.show { display: block; } .services-sidebar .services-list { -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); background-color: #ffffff; padding: 20px; margin-bottom: 20px; } .services-sidebar .services-list ul { padding-left: 0; list-style-type: none; margin-bottom: 0; } .services-sidebar .services-list ul li { margin-bottom: 7px; } .services-sidebar .services-list ul li a { font-weight: 500; padding: 10px 12px; background-color: #d0eedd; color: var(--blue); position: relative; } .services-sidebar .services-list ul li a i { position: absolute; right: 12px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .services-sidebar .services-list ul li a:hover, .services-sidebar .services-list ul li a.active { background-color: var(--blue); color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .services-sidebar .services-list ul li:nth-child(2) a, .services-sidebar .services-list ul li:nth-child(4) a, .services-sidebar .services-list ul li:nth-child(7) a { color: var(--pink); background-color: #fddcd1; } .services-sidebar .services-list ul li:nth-child(2) a:hover, .services-sidebar .services-list ul li:nth-child(2) a.active, .services-sidebar .services-list ul li:nth-child(4) a:hover, .services-sidebar .services-list ul li:nth-child(4) a.active, .services-sidebar .services-list ul li:nth-child(7) a:hover, .services-sidebar .services-list ul li:nth-child(7) a.active { color: #ffffff; background-color: var(--pink); } .services-sidebar .services-list ul li:nth-child(3) a, .services-sidebar .services-list ul li:nth-child(5) a { color: var(--blue); background-color: #fbe9ca; } .services-sidebar .services-list ul li:nth-child(3) a:hover, .services-sidebar .services-list ul li:nth-child(3) a.active, .services-sidebar .services-list ul li:nth-child(5) a:hover, .services-sidebar .services-list ul li:nth-child(5) a.active { color: #ffffff; background-color: var(--blue); } .services-sidebar .services-download-list ul { padding-left: 0; margin-bottom: 0; list-style-type: none; } .services-sidebar .services-download-list ul li { margin-bottom: 10px; } .services-sidebar .services-download-list ul li a { background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); font-weight: 500; padding: 14px 15px; } .services-sidebar .services-download-list ul li a:hover { background-color: var(--blue); color: #ffffff; } .services-sidebar .services-download-list ul li a i { margin-right: 2px; } .services-sidebar .services-download-list ul li:last-child { margin-bottom: 0; } /*================================================ Appointment Area CSS =================================================*/ .appointment-inner-area { position: relative; background-image: url(../img/appointment-bg.jpg); background-position: center center; background-size: cover; background-repeat: no-repeat; z-index: 2; } /* .samplecollection { position: relative; background-image: url(../img/samplecollection-bg.png); background-position: left center !important; background-size: cover; background-repeat: no-repeat; z-index: 2; } */ /* .appointment-form::before { left: 0; right: 0; height: 20px; content: ''; position: absolute; background: #f4f4f4; bottom: -20px; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); border-radius: 0 0 5px 5px; margin-left: 15px; margin-right: 15px; } */ .appointment-form h3 { margin-bottom: 25px; text-transform: uppercase; font-size: 24px; font-weight: 700; } .appointment-form form .form-group textarea.form-control { height: 80px !important; } .appointment-form form .btn { display: block; width: 100%; /* margin-top: 20px; */ } /*.form-group select option{*/ /* overflow: scroll !important;*/ /*}*/ /*================================================ Partner Area CSS =================================================*/ .partner-area { padding-bottom: 20px; padding-top: 50px; } .partner-area.extra-pt { padding-top: 115px; } .partner-item { -ms-flex: 0 0 20%; -webkit-box-flex: 0; flex: 0 0 20%; max-width: 20%; width: 100%; position: relative; padding-right: 15px; padding-left: 15px; } .single-partner { text-align: center; margin-bottom: 30px; } .single-partner a img { -webkit-transition: 0.5s; transition: 0.5s; opacity: .40; } .single-partner:hover a img { opacity: 1; } /*================================================ Performance Area CSS =================================================*/ .performance-area { position: relative; z-index: 1; overflow: hidden; } .performance-content .section-title { margin-bottom: 40px; } .performance-content .performance-progress-list .single-progress { position: relative; margin-bottom: 55px; padding-left: 110px; } .performance-content .performance-progress-list .single-progress:last-child { margin-bottom: 0; } .performance-content .performance-progress-list .single-progress .progress-count { background-color: transparent; color: #323232; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .performance-content .performance-progress-list .single-progress .progress-content h3 { text-transform: uppercase; margin-bottom: 0; font-weight: 700; font-size: 18px; } .performance-content .performance-progress-list .single-progress .progress-content p { margin-bottom: 0; margin-top: 8px; } .bg-shape2 { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: -1; text-align: right; } .bg-shape2 img { max-width: 80%; } .shape-img10 { position: absolute; z-index: -1; left: -40px; bottom: 17%; -webkit-animation: movebounce 5s linear infinite; animation: movebounce 5s linear infinite; } .shape-img11 { position: absolute; z-index: -1; left: 0; top: 30%; } /*================================================ Our Progress Area CSS =================================================*/ .our-progress-area { padding-bottom: 90px; } .single-progress-box { text-align: center; margin-bottom: 30px; } .single-progress-box .progress-bar { background-color: transparent; display: inline-block; color: #323232; } .single-progress-box h3 { margin-bottom: 10px; margin-top: 15px; text-transform: uppercase; font-size: 18px; font-weight: 700; } /*================================================ Funfacts Area CSS =================================================*/ .funfacts-area { background-color: var(--pink); position: relative; overflow: hidden; z-index: 1; padding-top: 50px; padding-bottom: 50px; } .funfacts-area::before { content: ''; position: absolute; left: 0; top: 0; height: 100%; z-index: -1; background: var(--pink); /*width: 88%;*/ width: 100%; } .funfacts-area::after { content: ''; position: absolute; right: 0; top: 0; height: 100%; z-index: -1; background: #ffffff; /* width: 6%; */ } .single-funfacts { text-align: center; } .single-funfacts h3 { margin-bottom: 0; color: #ffffff; font-size: 54px; font-weight: 700; } .single-funfacts h3 .odometer-formatting-mark { display: none; } .single-funfacts p { line-height: initial; color: #ffffff; font-size: 16px; margin-bottom: 0; margin-top: 3px; } .map-box1 { position: absolute; z-index: -1; left: 0; top: 0; } /*================================================ Pricing Area CSS =================================================*/ .pricing-area { position: relative; z-index: 1; padding-top: 40px; } .pricing-area::before { content: ''; left: 0; bottom: 0; width: 100%; height: 25%; background: #ffffff; z-index: -1; position: absolute; } .pricing-area .section-title { margin-bottom: 30px; margin-top: 30px; } .single-pricing-box { text-align: center; padding: 20px 20px; background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); height: 310px; } .single-pricing-box .icon { display: inline-block; width: 70px; height: 70px; border-radius: 50%; background-color: #ffc6b2; color: var(--pink); line-height: 70px; -webkit-transition: 0.5s; transition: 0.5s; } .single-pricing-box .icon i::before { font-size: 45px; } .single-pricing-box .icon i.flaticon-health { padding-left: 9px; } .single-pricing-box h3 { margin-bottom: 0; margin-top: 20px; font-size: 14px; font-weight: 700; } .single-pricing-box .pricing-features-list { padding-left: 0; list-style-type: none; margin-top: 25px; margin-bottom: 0; margin-left: 15px; text-align: left; } .single-pricing-box .pricing-features-list li { color: #666666; margin-bottom: 5px; } .single-pricing-box .pricing-features-list li i { color: var(--pink); margin-right: 2px; } .single-pricing-box .pricing-features-list li:last-child { margin-bottom: 0; } .single-pricing-box .price { /*margin-top: 18px;*/ font-size: 18px; font-weight: 700; color: #4a4893; } .single-pricing-box .price span { font-size: 15px; font-weight: normal; display: inline-block; margin-left: -6px; color: #666666; } .single-pricing-box .default-btn { display: inline-block; position: relative; margin-top: 10px; z-index: 1; padding: 8px 15px 6px; color: var(--pink); text-transform: uppercase; font-weight: 500; font-size: 12px; } .single-pricing-box .default-btn::before { content: ''; position: absolute; left: 0; top: 0; background: #4a4893; opacity: .30; height: 100%; width: 100%; left: 0; z-index: -1; -webkit-transition: 0.5s; transition: 0.5s; } .single-pricing-box .default-btn:hover { color: #ffffff; } .single-pricing-box .default-btn:hover::before { opacity: 1; } .single-pricing-box.bg-3fc581 .icon { background-color: #beead1; color: #1E8A29; } .single-pricing-box.bg-3fc581 .pricing-features-list li i { color: #1E8A29; } .single-pricing-box.bg-3fc581 .default-btn { color: #1E8A29; } .single-pricing-box.bg-3fc581 .default-btn::before { background: #1E8A29; } .single-pricing-box.bg-3fc581:hover .icon { background-color: #1E8A29; color: #ffffff; } .single-pricing-box.bg-f59f00 .icon { background-color: #C5C3F0; color: var(--blue); } .single-pricing-box.bg-f59f00 .pricing-features-list li i { color: var(--blue); } .single-pricing-box.bg-f59f00 .default-btn { color: var(--blue); } .single-pricing-box.bg-f59f00 .default-btn::before { background: var(--blue); } .single-pricing-box.bg-f59f00:hover .icon { background-color: var(--blue); color: #ffffff; } .single-pricing-box:hover .icon { background-color: var(--pink); color: #ffffff; } .single-pricing-box:hover .default-btn { color: #ffffff; } .single-pricing-box:hover .default-btn::before { opacity: 1; } /*================================================ Team Area CSS =================================================*/ .team-area { position: relative; z-index: 1; padding-bottom: 90px; background-image: url(../img/team-shape-bg.png); background-position: center center; background-size: cover; background-repeat: no-repeat; } .single-team-member { text-align: center; margin-bottom: 30px; } .single-team-member .member-image { position: relative; border-radius: 50%; } .single-team-member .member-image img { border-radius: 50%; } .single-team-member .member-image::before { content: ''; position: absolute; left: 0; top: 0; border-radius: 50%; width: 100%; height: 100%; background: var(--pink); opacity: 0; -webkit-transition: 0.5s; transition: 0.5s; visibility: hidden; } .single-team-member .member-image .details-btn { position: absolute; left: 0; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; color: #ffffff; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #ffffff; margin: 0 auto; line-height: 38px; margin-top: 20px; opacity: 0; visibility: hidden; } .single-team-member .member-image .details-btn:hover { background-color: var(--blue); color: #ffffff; border-color: var(--blue); } .single-team-member .member-content { margin-top: 25px; } .single-team-member .member-content h3 { margin-bottom: 0; font-size: 21px; font-weight: 700; } .single-team-member .member-content h3 a { color: #323232; } .single-team-member .member-content span { display: block; color: var(--pink); margin-top: 8px; } .single-team-member:hover .member-image::before { opacity: .60; visibility: visible; } .single-team-member:hover .member-image .details-btn { opacity: 1; visibility: visible; margin-top: 0; } /*================================================ Team Details Area CSS =================================================*/ .team-details-sidebar .team-profile { background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .team-details-sidebar .team-profile .team-content { padding: 25px; } .team-details-sidebar .team-profile .team-content h3 { margin-bottom: 0; font-size: 20px; font-weight: 700; } .team-details-sidebar .team-profile .team-content p { margin-bottom: 0; margin-top: 12px; } .team-details-sidebar .team-profile .team-content span { display: block; color: var(--pink); margin-top: 10px; } .team-details-sidebar .social-box { margin-top: 25px; background-color: #ffffff; padding: 25px; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .team-details-sidebar .social-box h3 { margin-bottom: 0; font-size: 20px; font-weight: 700; } .team-details-sidebar .social-box ul { padding-left: 0; list-style-type: none; margin-bottom: 0; margin-top: 20px; } .team-details-sidebar .social-box ul li { margin-right: 4px; display: inline-block; } .team-details-sidebar .social-box ul li a { width: 35px; height: 35px; line-height: 35px; border: 1px solid #dadada; border-radius: 50%; color: #323232; font-size: 14px; text-align: center; } .team-details-sidebar .social-box ul li a:hover { background-color: var(--pink); color: #ffffff; border-color: var(--pink); } .team-details-sidebar .social-box ul li:last-child { margin-right: 0; } .team-details-sidebar .call-to-action-box { margin-top: 25px; } .team-details-sidebar .call-to-action-box a { background-color: var(--pink); color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(255, 93, 36, 0.4); box-shadow: 0 2px 28px 0 rgba(255, 93, 36, 0.4); padding: 25px; border-radius: 5px; position: relative; padding-left: 90px; } .team-details-sidebar .call-to-action-box a h3 { margin-bottom: 0; font-size: 20px; font-weight: 700; } .team-details-sidebar .call-to-action-box a i { position: absolute; left: 25px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 45px; } .team-details-sidebar .call-to-action-box a span { display: block; margin-top: 10px; font-size: 16px; } .team-details-desc { background-color: #ffffff; padding: 25px; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .team-details-desc h3 { margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #eeeeee; position: relative; font-size: 20px; font-weight: 700; } .team-details-desc h3::before { width: 50px; height: 1px; content: ''; position: absolute; left: 0; bottom: -1px; background: var(--pink); } .team-details-desc p { font-size: 14.5px; } .team-details-desc .team-info { padding-left: 0; list-style-type: none; margin-top: 20px; margin-bottom: 0; } .team-details-desc .team-info li { position: relative; padding-left: 170px; border-bottom: 1px solid #eeeeee; padding-bottom: 20px; margin-bottom: 20px; } .team-details-desc .team-info li span { font-weight: 700; color: #323232; position: absolute; left: 0; top: 0; } .team-details-desc .team-info li ul { padding-left: 0; margin-bottom: 0; list-style-type: none; } .team-details-desc .team-info li ul li { margin-bottom: 10px; color: #666666; font-size: 13.5px; padding-left: 17px; border-bottom: none; padding-bottom: 0; } .team-details-desc .team-info li ul li::before { content: "\f100"; position: absolute; left: 0; top: 3px; color: var(--blue); font-weight: 900; font-family: "Font Awesome 5 Free"; font-size: 10px; } .team-details-desc .team-info li ul li a { color: #666666; } .team-details-desc .team-info li ul li a:hover { color: var(--pink); } .team-details-desc .team-info li ul li:last-child { margin-bottom: 0; } .team-details-desc .team-info li ul li:nth-child(1)::before, .team-details-desc .team-info li ul li:nth-child(4)::before { color: var(--blue); } .team-details-desc .team-info li ul li:nth-child(2)::before, .team-details-desc .team-info li ul li:nth-child(5)::before { color: var(--pink); } .team-details-desc .team-info li ul li:nth-child(3)::before, .team-details-desc .team-info li ul li:nth-child(6)::before { color: var(--blue); } .team-details-desc .team-info li:last-child { margin-bottom: 0; } .team-details-contact { background-color: #ffffff; padding: 25px; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); margin-top: 25px; } .team-details-contact h3 { margin-bottom: 30px; padding-bottom: 10px; border-bottom: 1px solid #eeeeee; position: relative; font-size: 20px; font-weight: 700; } .team-details-contact h3::before { width: 50px; height: 1px; content: ''; position: absolute; left: 0; bottom: -1px; background: var(--pink); } /*================================================ Testimonial Area CSS =================================================*/ .testimonial-area { padding-bottom: 30px; } .testimonial-area .section-title { margin-bottom: 30px; } .single-testimonial-item { position: relative; background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); padding: 30px; z-index: 1; margin-bottom: 30px; margin-top: 30px; height: 350px !important; display: flex; flex-direction: column; justify-content: space-between; } .single-testimonial-item p { margin-bottom: 0; font-size: 16px; font-style: italic; } .single-testimonial-item .client-info { margin-top: 30px; position: relative; padding-left: 70px; } .single-testimonial-item .client-info img { width: 50px !important; height: 50px; border-radius: 50%; display: inline-block !important; position: absolute; left: 0; opacity: 0.5; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .single-testimonial-item .client-info h3 { margin-bottom: 0; font-size: 17px; font-weight: 700; } .single-testimonial-item .client-info span { display: block; color: #666666; font-size: 14px; margin-top: 7px; } .single-testimonial-item i { position: absolute; color: var(--blue) !important; opacity: .5; right: 15px; bottom: -20px; z-index: -1; -webkit-transition: 0.5s; transition: 0.5s; } .single-testimonial-item i::before { font-size: 100px; } .owl-item.active.center .single-testimonial-item i { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .owl-item.active.center .single-testimonial-item .client-info img { opacity: 1; } .testimonial-slides.owl-theme .owl-nav { margin-top: 0; line-height: initial; } .testimonial-slides.owl-theme .owl-nav [class*=owl-] { width: 50px; height: 50px; line-height: 50px; border: 1px solid #6a6a6a; border-radius: 50%; -webkit-transition: 0.5s; transition: 0.5s; background-color: transparent; margin: 0; color: #323232; position: absolute; left: 100px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; visibility: hidden; } .testimonial-slides.owl-theme .owl-nav [class*=owl-] i::before { font-size: 20px; } .testimonial-slides.owl-theme .owl-nav [class*=owl-].owl-next { left: auto; right: 100px; } .testimonial-slides.owl-theme .owl-nav [class*=owl-]:hover { background-color: var(--pink); color: #ffffff; border-color: var(--pink); } .testimonial-slides.owl-theme:hover .owl-nav [class*=owl-] { left: 155px; opacity: 1; visibility: visible; } .testimonial-slides.owl-theme:hover .owl-nav [class*=owl-].owl-next { left: auto; right: 155px; } /*================================================ Blog Area CSS =================================================*/ .blog-area { padding-bottom: 90px; } .blog-area .pagination-area { margin-bottom: 30px; margin-top: 40px; } .single-blog-post { margin-bottom: 10px; -webkit-transition: 0.5s; transition: 0.5s; } .single-blog-post .post-image { position: relative; overflow: hidden; } .single-blog-post .post-image a img { -webkit-transition: 0.5s; transition: 0.5s; } .single-blog-post .post-image .date { position: absolute; left: 0; bottom: 0; color: #ffffff; background-color: var(--pink); padding: 5px 12px; font-weight: 500; font-size: 14px; } .single-blog-post .post-content { height: 60px; background-color: var(--pink); display:flex; justify-content:center; align-items:center; } .single-blog-post .post-content span { color: #fff; display: block; } .single-blog-post .post-content span a { display: inline-block; color: #fff; } .single-blog-post .post-content h3 { line-height: 1; margin-bottom: 0; margin-top: 0px; font-size: 18px; font-weight: 700; color:#fff; } .single-blog-post .post-content h3 a{ color:#fff !important; } .single-blog-post .post-content p { margin-bottom: 0; margin-top: 10px; } .single-blog-post .post-content .learn-more-btn { margin-top: 12px; } .single-blog-post .post-image{ background-color:#fff; } .single-blog-post:hover .post-image a img { -webkit-transform:scale(0.9); transform:scale(0.9); } /*================================================ Blog Details Area CSS =================================================*/ .blog-details .article-image img { width: 100%; } .blog-details .article-content { margin-top: 30px; } .blog-details .article-content .entry-meta { margin-bottom: 17px; } .blog-details .article-content .entry-meta ul { padding-left: 0; margin-bottom: 0; list-style-type: none; } .blog-details .article-content .entry-meta ul li { margin: 0 10px; position: relative; display: inline-block; color: #666666; } .blog-details .article-content .entry-meta ul li a { display: inline-block; color: #666666; } .blog-details .article-content .entry-meta ul li a:hover { color: var(--pink); } .blog-details .article-content .entry-meta ul li i { color: var(--pink); font-size: 16px; margin-right: 2px; } .blog-details .article-content .entry-meta ul li::before { content: ''; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: -15px; width: 6px; height: 1px; background: #666666; } .blog-details .article-content .entry-meta ul li:last-child { margin-right: 0; } .blog-details .article-content .entry-meta ul li:last-child::before { display: none; } .blog-details .article-content .entry-meta ul li:first-child { margin-left: 0; } .blog-details .article-content h3 { margin-bottom: 18px; font-size: 24px; font-weight: 700; } .blog-details .article-content .wp-block-gallery.columns-3 { padding-left: 0; list-style-type: none; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; margin-bottom: 30px; margin-top: 30px; } .blog-details .article-content .wp-block-gallery.columns-3 li { -ms-flex: 0 0 33.3333%; -webkit-box-flex: 0; flex: 0 0 33.3333%; max-width: 33.3333%; padding-right: 15px; padding-left: 15px; } .blog-details .article-content .wp-block-gallery.columns-3 li figure { margin-bottom: 0; } .blog-details .article-content .article-features-list { padding-left: 0; list-style-type: none; margin-bottom: 15px; margin-left: 20px; } .blog-details .article-content .article-features-list li { margin-bottom: 12px; color: #666666; position: relative; padding-left: 15px; } .blog-details .article-content .article-features-list li::before { background: #323232; height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50%; position: absolute; } .blog-details .article-content .article-features-list li:last-child { margin-bottom: 0; } .blog-details .article-footer { display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 30px; } .blog-details .article-footer .article-tags { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .blog-details .article-footer .article-tags span { display: inline-block; color: #323232; font-size: 20px; margin-right: 5px; position: relative; top: 2px; } .blog-details .article-footer .article-tags a { display: inline-block; color: #666666; } .blog-details .article-footer .article-tags a:hover { color: var(--pink); } .blog-details .article-footer .article-share { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .blog-details .article-footer .article-share .social { padding-left: 0; list-style-type: none; text-align: right; margin-bottom: 0; } .blog-details .article-footer .article-share .social li { display: inline-block; } .blog-details .article-footer .article-share .social li a { position: relative; color: #ffffff; background-color: #959c98; width: 33px; height: 33px; line-height: 33px; text-align: center; border-radius: 50%; font-size: 13px; z-index: 1; } .blog-details .article-footer .article-share .social li a:hover { color: #ffffff; background-color: var(--pink); } .blog-details .post-navigation { margin-top: 30px; } .post-navigation { border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; padding-top: 20px; padding-bottom: 20px; } .post-navigation .navigation-links { display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .post-navigation .navigation-links .nav-previous { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .post-navigation .navigation-links .nav-previous a i { margin-right: 2px; } .post-navigation .navigation-links .nav-next { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; text-align: right; } .post-navigation .navigation-links .nav-next a i { margin-left: 2px; } .post-navigation .navigation-links div a { display: inline-block; font-size: 15px; font-weight: 500; } blockquote, .blockquote { overflow: hidden; background-color: #fafafa; padding: 50px !important; position: relative; text-align: center; z-index: 1; margin-bottom: 20px; margin-top: 20px; } blockquote p, .blockquote p { color: #666666; line-height: 1.6; margin-bottom: 0; font-style: italic; font-weight: 500; font-size: 20px; } blockquote cite, .blockquote cite { display: none; } blockquote::before, .blockquote::before { color: #efefef; content: "\f111"; position: absolute; left: 50px; top: -50px; z-index: -1; font-family: Flaticon; font-size: 140px; font-style: normal; } .comments-area { background-color: #f8f8f8; padding: 25px 20px; margin-top: 30px; } .comments-area .comments-title { position: relative; margin-bottom: 30px; line-height: initial; font-size: 20px; font-weight: 700; } .comments-area .comments-title::before { content: ''; height: 25px; width: 3px; left: -20px; position: absolute; background: var(--pink); top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .comments-area ol, .comments-area ul { padding: 0; margin: 0; list-style-type: none; } .comments-area .comment-list { padding: 0; margin: 0; list-style-type: none; } .comments-area .children { margin-left: 20px; } .comments-area .comment-body { border-bottom: 1px solid #eeeeee; padding-left: 65px; color: #323232; font-size: 14px; margin-bottom: 20px; padding-bottom: 20px; } .comments-area .comment-body .reply { margin-top: 15px; } .comments-area .comment-body .reply a { border: 1px solid #ded9d9; color: #323232; display: inline-block; padding: 5px 20px; border-radius: 30px; text-transform: uppercase; position: relative; z-index: 1; font-size: 12px; font-weight: 600; } .comments-area .comment-body .reply a:hover { color: #ffffff; background-color: var(--pink); border-color: var(--pink); } .comments-area .comment-meta { margin-bottom: .8em; } .comments-area .comment-author { font-size: 16px; margin-bottom: 0.4em; position: relative; z-index: 2; } .comments-area .comment-author .avatar { height: 50px; left: -65px; position: absolute; width: 50px; } .comments-area .comment-author .fn { font-weight: 600; } .comments-area .comment-author .says { display: none; } .comments-area .comment-metadata { color: #666666; letter-spacing: 0.01em; text-transform: uppercase; font-size: 11px; font-weight: 500; } .comments-area .comment-metadata a { color: #666666; } .comments-area .comment-metadata a:hover { color: var(--pink); } .comments-area .comment-content p { font-size: 14px; } .comments-area .comment-respond .comment-reply-title { margin: 0; position: relative; font-size: 20px; font-weight: 700; } .comments-area .comment-respond .comment-reply-title::before { content: ''; height: 25px; width: 3px; left: -20px; position: absolute; background: var(--pink); top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .comments-area .comment-respond .comment-reply-title #cancel-comment-reply-link { font-size: 15px; display: inline-block; } .comments-area .comment-respond .comment-form { overflow: hidden; } .comments-area .comment-respond .comment-notes { font-size: 15px; margin-bottom: 0; margin-top: 10px; } .comments-area .comment-respond .comment-notes .required { color: red; } .comments-area .comment-respond .comment-form-comment { margin-top: 15px; float: left; width: 100%; } .comments-area .comment-respond label { display: block; font-weight: 600; color: #323232; margin-bottom: 3px; } .comments-area .comment-respond input[type="date"], .comments-area .comment-respond input[type="time"], .comments-area .comment-respond input[type="datetime-local"], .comments-area .comment-respond input[type="week"], .comments-area .comment-respond input[type="month"], .comments-area .comment-respond input[type="text"], .comments-area .comment-respond input[type="email"], .comments-area .comment-respond input[type="url"], .comments-area .comment-respond input[type="password"], .comments-area .comment-respond input[type="search"], .comments-area .comment-respond input[type="tel"], .comments-area .comment-respond input[type="number"], .comments-area .comment-respond textarea { display: block; width: 100%; background-color: #ffffff; border: 1px solid #eeeeee; padding: 0.625em 0.7375em; outline: 0; -webkit-transition: 0.5s; transition: 0.5s; } .comments-area .comment-respond input[type="date"]:focus, .comments-area .comment-respond input[type="time"]:focus, .comments-area .comment-respond input[type="datetime-local"]:focus, .comments-area .comment-respond input[type="week"]:focus, .comments-area .comment-respond input[type="month"]:focus, .comments-area .comment-respond input[type="text"]:focus, .comments-area .comment-respond input[type="email"]:focus, .comments-area .comment-respond input[type="url"]:focus, .comments-area .comment-respond input[type="password"]:focus, .comments-area .comment-respond input[type="search"]:focus, .comments-area .comment-respond input[type="tel"]:focus, .comments-area .comment-respond input[type="number"]:focus, .comments-area .comment-respond textarea:focus { border-color: var(--pink); } .comments-area .comment-respond .comment-form-author { float: left; width: 50%; padding-right: 10px; margin-bottom: 20px; } .comments-area .comment-respond .comment-form-email { float: left; width: 50%; padding-left: 12px; margin-bottom: 20px; } .comments-area .comment-respond .comment-form-url { float: left; width: 100%; margin-bottom: 20px; } .comments-area .comment-respond .comment-form-cookies-consent { width: 100%; float: left; position: relative; padding-left: 20px; margin-bottom: 20px; } .comments-area .comment-respond .comment-form-cookies-consent input { position: absolute; left: 0; top: 6px; } .comments-area .comment-respond .comment-form-cookies-consent label { display: inline-block; margin: 0; color: #666666; font-weight: normal; } .comments-area .comment-respond .form-submit { float: left; width: 100%; } .comments-area .comment-respond .form-submit input { background: var(--pink); border: none; color: #ffffff; padding: 10px 30px; display: inline-block; cursor: pointer; outline: 0; border-radius: 0; text-transform: uppercase; -webkit-transition: 0.5s; transition: 0.5s; font-weight: 600; font-size: 14px; } .comments-area .comment-respond .form-submit input:hover, .comments-area .comment-respond .form-submit input:focus { color: #ffffff; background-color: var(--blue); } /*================================================ CTA Area CSS =================================================*/ .cta-area { /* background-color: var(--blue); */ position: relative; z-index: 1; background-image: url(../img/cta-bg.jpg); background-position: center center; background-size: contain; background-repeat: no-repeat; } .cta-content { padding-top: 35px; padding-bottom: 25px; text-align: center; max-width: 900px; margin-left: auto; margin-right: auto; } .cta-content h3 { font-size: 30px; font-weight: 700; margin-bottom: 0; color: #ffffff; } .cta-content p { color: #ffffff; opacity: .95; max-width: 820px; margin-bottom: 0; margin-top: 10px; margin-left: auto; margin-right: auto; } .cta-content h3 { margin-bottom: 0; margin-top: 15px; font-size: 38px; font-weight: 700; } .cta-content h3 a { color: #ffffff; } .cta-content .btn { margin-top: 20px; } .cta-content .btn-primary { color: var(--pink); background-color: #ffffff; border-color: #ffffff; } .cta-content .btn-primary:not(:disabled):not(.disabled).active, .cta-content .btn-primary:not(:disabled):not(.disabled):active, .show>.cta-content .btn-primary.dropdown-toggle { color: #ffffff; border-color: var(--blue); background-color: var(--blue); } .cta-content .btn-primary:hover, .cta-content .btn-primary:focus { color: #ffffff; border-color: var(--pink); background-color: var(--pink); } /*================================================ Page Title Area CSS =================================================*/ .page-title-area { margin-top: 60px; text-align: center; position: relative; z-index: 1; background-color: #ffffff; background-image: url(../img/breadcrumb.png); background-position: center center; background-size: cover; background-repeat: no-repeat; border-bottom: 1px solid #eeeeee; padding-top: 160px; padding-bottom: 90px; } .page-title-content h2, .page-title-content h1{ text-transform: uppercase; margin-bottom: 0; font-weight: 700; font-size: 30px; color: var(--blue); } .page-title-content ul { padding-left: 0; margin-bottom: 0; list-style-type: none; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); bottom: -15px; display: inline-block; background-color: #ffffff; padding: 5px 15px; } .page-title-content ul li { font-size: 16px; display: inline-block; margin-right: 20px; position: relative; color: #323232; } .page-title-content ul li:last-child { color: var(--pink); } .page-title-content ul li a { color: #323232; } .page-title-content ul li a:hover { color: var(--pink); } .page-title-content ul li::before { content: "\f054"; font-weight: 900; font-family: "Font Awesome 5 Free"; font-size: 10px; position: absolute; right: -15px; top: 50%; color: #323232; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .page-title-content ul li:last-child { margin-right: 0; } .page-title-content ul li:last-child::before { display: none; } /*================================================ Research Area CSS =================================================*/ .research-area { padding-bottom: 90px; } .single-research-box { margin-bottom: 30px; background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .single-research-box .research-image { overflow: hidden; } .single-research-box .research-image a img { -webkit-transition: 0.5s; transition: 0.5s; } .single-research-box .research-content { padding: 25px; } .single-research-box .research-content span { display: inline-block; background-color: #ffe7de; color: var(--pink); padding: 5px 15px; border-radius: 30px; font-size: 13px; } .single-research-box .research-content h3 { margin-bottom: 0; margin-top: 15px; font-size: 20px; font-weight: 700; } .single-research-box .research-content p { margin-bottom: 0; margin-top: 12px; } .single-research-box:hover .research-image a img { opacity: 0.7; } /*================================================ Research Details Area CSS =================================================*/ .research-details-info { -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); background-color: #ffffff; padding: 50px 40px; } .research-details-info h3 { margin-bottom: 25px; font-size: 20px; font-weight: 700; } .research-details-info ul { margin-bottom: 0; list-style-type: none; border-top: 1px solid #eeeeee; padding-left: 0; padding-top: 25px; } .research-details-info ul li { margin-bottom: 20px; color: #666666; position: relative; padding-left: 53px; } .research-details-info ul li span { display: block; text-transform: uppercase; color: #323232; margin-bottom: 4px; font-weight: 700; } .research-details-info ul li i { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; color: var(--pink); background-color: #ffdfd3; border-radius: 50%; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .research-details-info ul li:nth-child(2) i, .research-details-info ul li:nth-child(5) i { background-color: #d9f3e6; color: var(--blue); } .research-details-info ul li:nth-child(3) i, .research-details-info ul li:nth-child(6) i { background-color: #fdeccc; color: var(--blue); } .research-details-desc { margin-top: 50px; } .research-details-desc h3 { margin-bottom: 12px; font-size: 20px; font-weight: 700; } .research-details-desc h3:not(:first-child) { margin-top: 20px; } .research-details-features { margin-top: 50px; } .research-details-features .features-box { background-color: #ffffff; -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); padding: 30px; border-radius: 3px; -webkit-transition: 0.5s; transition: 0.5s; position: relative; z-index: 1; overflow: hidden; } .research-details-features .features-box .icon { display: inline-block; width: 80px; height: 80px; line-height: 80px; background: -webkit-gradient(linear, left top, left bottom, from(#ffdfd4), color-stop(#ffe6e0), color-stop(#ffeeeb), color-stop(#fff6f5), to(#fffefe)); background: linear-gradient(to bottom, #ffdfd4, #ffe6e0, #ffeeeb, #fff6f5, #fffefe); text-align: center; border-radius: 50%; color: var(--pink); -webkit-transition: 0.5s; transition: 0.5s; } .research-details-features .features-box .icon i::before { font-size: 38px; } .research-details-features .features-box .icon.bg-24b765 { color: #24b765; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .research-details-features .features-box .icon.bg-f59f00 { color: var(--blue); background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#fef0d7), color-stop(#fef4e1), color-stop(#fff8ec), to(#fffcf7)); background: linear-gradient(to bottom, #fdeccc, #fef0d7, #fef4e1, #fff8ec, #fffcf7); } .research-details-features .features-box .icon.bg-f7b232 { color: #f7b232; background: -webkit-gradient(linear, left top, left bottom, from(#fdeccc), color-stop(#feefd6), color-stop(#fff3df), color-stop(#fff6e9), to(#fffaf3)); background: linear-gradient(to bottom, #fdeccc, #feefd6, #fff3df, #fff6e9, #fffaf3); } .research-details-features .features-box .icon.bg-fe5d24 { color: #fe5d24; background: -webkit-gradient(linear, left top, left bottom, from(#feded2), color-stop(#fee5db), color-stop(#ffede5), color-stop(#fff4ef), to(#fffbf9)); background: linear-gradient(to bottom, #feded2, #fee5db, #ffede5, #fff4ef, #fffbf9); } .research-details-features .features-box .icon.bg-45c27c { color: #45c27c; background: -webkit-gradient(linear, left top, left bottom, from(#beead1), color-stop(#c9f0e1), color-stop(#d9f5ee), color-stop(#eaf9f8), to(#fdfefe)); background: linear-gradient(to bottom, #beead1, #c9f0e1, #d9f5ee, #eaf9f8, #fdfefe); } .research-details-features .features-box h3 { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 20px; margin-bottom: 0; font-size: 20px; font-weight: 700; } .research-details-features .features-box p { -webkit-transition: 0.5s; transition: 0.5s; margin-top: 12px; margin-bottom: 0; } .research-details-features .features-box img { position: absolute; right: -100px; top: -100px; z-index: -1; opacity: 0; visibility: hidden; -webkit-transition: 0.5s; transition: 0.5s; } .research-details-features .features-box:hover { background-color: var(--pink); -webkit-transform: translateY(-5px); transform: translateY(-5px); } .research-details-features .features-box:hover .icon { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .research-details-features .features-box:hover h3 { color: #ffffff; } .research-details-features .features-box:hover p { color: #ffffff; } .research-details-features .features-box:hover .learn-more-btn { color: #ffffff; } .research-details-features .features-box:hover .learn-more-btn::before { background: #ffffff; } .research-details-features .features-box:hover img { opacity: 1; visibility: visible; right: -80px; top: -80px; } .research-details-desc-footer { display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 50px; margin-bottom: 50px; } .research-details-desc-footer .article-tags { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .research-details-desc-footer .article-tags span { display: inline-block; color: #323232; font-size: 20px; margin-right: 5px; position: relative; top: 2px; } .research-details-desc-footer .article-tags a { display: inline-block; background-color: #f8f8f8; color: #323232; padding: 5px 15px; font-size: 13px; font-weight: 500; } .research-details-desc-footer .article-tags a:hover { background-color: var(--pink); color: #ffffff; } .research-details-desc-footer .article-share { -ms-flex: 0 0 50%; -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50%; } .research-details-desc-footer .article-share .social { padding-left: 0; list-style-type: none; text-align: right; margin-bottom: 0; } .research-details-desc-footer .article-share .social li { display: inline-block; } .research-details-desc-footer .article-share .social li a { position: relative; color: #ffffff; background-color: #959c98; width: 33px; height: 33px; line-height: 33px; text-align: center; border-radius: 50%; font-size: 13px; z-index: 1; } .research-details-desc-footer .article-share .social li a:hover { color: #ffffff; background-color: var(--pink); } .related-project { margin-top: 80px; } .related-project .section-title { margin-bottom: 20px; } .related-project .single-research-box { margin-bottom: 0; margin-top: 30px; } /*================================================ Pagination Area CSS =================================================*/ .pagination-area { margin-top: 30px; text-align: center; } .pagination-area .page-numbers { width: 40px; height: 40px; margin: 0 3px; display: inline-block; background-color: #ffffff; line-height: 40px; color: #323232; -webkit-box-shadow: 0 2px 10px 0 #d8dde6; box-shadow: 0 2px 10px 0 #d8dde6; font-size: 17px; font-weight: 600; } .pagination-area .page-numbers.current, .pagination-area .page-numbers:hover, .pagination-area .page-numbers:focus { background: var(--pink); color: #ffffff; -webkit-box-shadow: unset; box-shadow: unset; } /*================================================ Sidebar Area CSS =================================================*/ .widget-area { padding-left: 15px; } .widget-area .widget { margin-top: 35px; } .widget-area .widget:first-child { margin-top: 0; } .widget-area .widget .widget-title { border-bottom: 1px solid #eeeeee; padding-bottom: 10px; margin-bottom: 20px; text-transform: capitalize; position: relative; font-weight: 700; font-size: 20px; } .widget-area .widget .widget-title::before { content: ''; position: absolute; background: var(--pink); bottom: -1px; left: 0; width: 50px; height: 1px; } .widget-area .widget.widget_tag_cloud .widget-title { margin-bottom: 12px; } .widget-area .widget_search { -webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); background-color: #ffffff; padding: 15px; } .widget-area .widget_search form { position: relative; } .widget-area .widget_search form label { display: block; margin-bottom: 0; } .widget-area .widget_search form .screen-reader-text { display: none; } .widget-area .widget_search form .search-field { background-color: transparent; height: 50px; padding: 6px 15px; border: 1px solid #eeeeee; width: 100%; display: block; outline: 0; -webkit-transition: 0.5s; transition: 0.5s; } .widget-area .widget_search form .search-field:focus { border-color: var(--pink); } .widget-area .widget_search form button { position: absolute; right: 0; outline: 0; bottom: 0; height: 50px; width: 50px; border: none; color: #ffffff; background-color: var(--pink); -webkit-transition: 0.5s; transition: 0.5s; } .widget-area .widget_search form button:hover { color: #ffffff; background-color: var(--blue); } .widget-area .widget_labto_posts_thumb { position: relative; overflow: hidden; } .widget-area .widget_labto_posts_thumb .item { overflow: hidden; margin-bottom: 20px; } .widget-area .widget_labto_posts_thumb .item:last-child { margin-bottom: 0; } .widget-area .widget_labto_posts_thumb .item .thumb { float: left; height: 80px; overflow: hidden; position: relative; width: 80px; margin-right: 15px; } .widget-area .widget_labto_posts_thumb .item .thumb .fullimage { width: 80px; height: 80px; display: inline-block; background-size: cover !important; background-repeat: no-repeat; background-position: center center !important; } .widget-area .widget_labto_posts_thumb .item .thumb .fullimage.bg1 { background-image: url(../img/blog-img1.jpg); } .widget-area .widget_labto_posts_thumb .item .thumb .fullimage.bg2 { background-image: url(../img/blog-img2.jpg); } .widget-area .widget_labto_posts_thumb .item .thumb .fullimage.bg3 { background-image: url(../img/blog-img3.jpg); } .widget-area .widget_labto_posts_thumb .item .info { overflow: hidden; } .widget-area .widget_labto_posts_thumb .item .info time { display: block; color: #666666; text-transform: uppercase; margin-top: 5px; margin-bottom: 5px; font-size: 12px; font-weight: 500; } .widget-area .widget_labto_posts_thumb .item .info .title { margin-bottom: 0; line-height: 1.5; font-size: 18px; font-weight: 600; } .widget-area .widget_recent_entries ul { padding: 0; margin: 0; list-style-type: none; } .widget-area .widget_recent_entries ul li { position: relative; margin-bottom: 12px; color: #666666; padding-left: 15px; line-height: 1.5; font-weight: 500; } .widget-area .widget_recent_entries ul li:last-child { margin-bottom: 0; } .widget-area .widget_recent_entries ul li::before { background: var(--pink); position: absolute; height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .widget-area .widget_recent_entries ul li .post-date { display: block; font-size: 13px; color: #666666; margin-top: 4px; } .widget-area .widget_recent_comments ul { padding: 0; margin: 0; list-style-type: none; } .widget-area .widget_recent_comments ul li { position: relative; margin-bottom: 12px; color: #666666; padding-left: 15px; line-height: 1.5; font-weight: 500; } .widget-area .widget_recent_comments ul li:last-child { margin-bottom: 0; } .widget-area .widget_recent_comments ul li::before { background: var(--pink); height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; } .widget-area .widget_recent_comments ul li span { display: inline-block; } .widget-area .widget_recent_comments ul li a { display: inline-block; } .widget-area .widget_archive ul { padding: 0; margin: 0; list-style-type: none; } .widget-area .widget_archive ul li { position: relative; margin-bottom: 12px; padding-left: 15px; font-weight: 500; } .widget-area .widget_archive ul li:last-child { margin-bottom: 0; } .widget-area .widget_archive ul li::before { background: var(--pink); height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; } .widget-area .widget_categories ul { padding: 0; margin: 0; list-style-type: none; } .widget-area .widget_categories ul li { position: relative; margin-bottom: 12px; color: #666666; padding-left: 15px; font-weight: 500; } .widget-area .widget_categories ul li:last-child { margin-bottom: 0; } .widget-area .widget_categories ul li::before { background: var(--pink); height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); position: absolute; } .widget-area .widget_categories ul li a { display: inline-block; } .widget-area .widget_categories ul li .post-count { float: right; } .widget-area .widget_meta ul { padding: 0; margin: 0; list-style-type: none; } .widget-area .widget_meta ul li { position: relative; margin-bottom: 12px; color: #666666; padding-left: 15px; font-size: 15px; font-weight: 500; } .widget-area .widget_meta ul li:last-child { margin-bottom: 0; } .widget-area .widget_meta ul li::before { background: var(--pink); position: absolute; height: 7px; width: 7px; content: ''; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .widget-area .tagcloud a { display: inline-block; font-weight: 500; font-size: 14px !important; padding: 7px 10px; border: 1px solid #eeeeee; margin-top: 8px; margin-right: 4px; } .widget-area .tagcloud a:hover, .widget-area .tagcloud a:focus { background-color: var(--pink); color: #ffffff; border-color: var(--pink); } /*================================================ FAQ Area CSS =================================================*/ .faq-accordion .accordion { list-style-type: none; padding: 0; margin: 0; } .faq-accordion .accordion .accordion-item { display: block; margin-bottom: 15px; border: none; } .faq-accordion .accordion .accordion-item:last-child { margin-bottom: 0; } .faq-accordion .accordion .accordion-item .accordion-title { color: #323232; position: relative; padding-left: 22px; font-size: 16px; font-weight: 600; } .faq-accordion .accordion .accordion-item .accordion-title i { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-52%); transform: translateY(-52%); font-size: 14px; } .faq-accordion .accordion .accordion-item .accordion-title:hover, .faq-accordion .accordion .accordion-item .accordion-title.active { color: var(--pink); } .faq-accordion .accordion .accordion-item .accordion-title.active i::before { content: "\f068"; } .faq-accordion .accordion .accordion-content { display: none; margin-top: 8px; } .faq-accordion .accordion .accordion-content.show { display: block; } /*================================================ Contact Area CSS =================================================*/ #contactForm { max-width: 950px; text-align: center; margin-left: auto; margin-right: auto; } #contactForm .form-control { background-color: #f9f9f9; height: 50px; text-align: left; padding-left: 15px; } #contactForm .form-control::-webkit-input-placeholder { color: #909090; } #contactForm .form-control:-ms-input-placeholder { color: #909090; } #contactForm .form-control::-ms-input-placeholder { color: #909090; } #contactForm .form-control::placeholder { color: #909090; } #contactForm textarea.form-control { height: auto; padding-top: 15px; padding-left: 15px; } #contactForm .btn { margin-top: 15px; } #contactForm .help-block { text-align: left; } #contactForm .help-block ul { padding-left: 0; list-style-type: none; margin-bottom: 0; margin-top: 5px; } #contactForm .help-block ul li { color: red; } #contactForm #msgSubmit { text-align: center; margin-bottom: 0; } #contactForm #msgSubmit.text-danger, #contactForm #msgSubmit.text-success { margin-top: 15px; font-size: 20px; } .contact-info { text-align: center; margin-top: 50px; } .contact-info .section-title { margin-bottom: 30px; } .contact-info .section-title h2, .contact-info .section-title h3{ margin-top: 0; } .contact-info .contact-info-content h3 { margin-bottom: 12px; font-size: 20px; font-weight: 700; } .contact-info .contact-info-content h2 { margin-bottom: 0; font-size: 40px; font-weight: 700; } .contact-info-content h5 a { color: var(--blue); } .contact-info .contact-info-content h2 a { color: var(--blue); display: inline-block; } .contact-info .contact-info-content .social { padding-left: 0; list-style-type: none; margin-bottom: 0; margin-top: 15px; } .contact-info .contact-info-content .social li { display: inline-block; margin: 0 2px; } .contact-info .contact-info-content .social li a { width: 35px; height: 35px; line-height: 35px; border: 1px solid #dadada; border-radius: 50%; color: #aba5a5; } .contact-info .contact-info-content .social li a i { font-size: 14px; } .contact-info .contact-info-content .social li a:hover { color: #ffffff; border-color: var(--blue); background-color: var(--blue); } #map iframe { width: 100%; height: 500px; border: none; margin-bottom: -10px; } /*================================================ 404 Error Area CSS =================================================*/ .error-area { height: 100vh; } .error-content { text-align: center; margin: 0 auto; max-width: 700px; } .error-content h3 { font-size: 35px; font-weight: 700; margin-top: 30px; margin-bottom: 17px; } .error-content p { max-width: 520px; margin: 0 auto 20px; } /*================================================ Shop Area CSS =================================================*/ .woocommerce-topbar { margin-bottom: 40px; } .woocommerce-topbar .woocommerce-result-count h3 { margin-bottom: 0; font-size: 20px; font-weight: 700; } .woocommerce-topbar .woocommerce-result-count p { margin-bottom: 0; margin-top: 5px; font-size: 14px; } .woocommerce-topbar .woocommerce-topbar-ordering { text-align: right; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select { background-color: #ffffff; color: #666666; border-radius: 0; border: none; -webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); float: unset; height: unset; line-height: initial; padding: 18px 35px 18px 20px; font-size: 15px; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select .list { background-color: #ffffff; -webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); border-radius: 0; margin-top: 0; width: 100%; padding-top: 10px; padding-bottom: 10px; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select .list .option { -webkit-transition: 0.5s; transition: 0.5s; padding-left: 20px; padding-right: 20px; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select .list .option:hover { background-color: var(--pink) !important; color: #ffffff; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select .list .option.selected { background-color: transparent; } .woocommerce-topbar .woocommerce-topbar-ordering .nice-select:after { right: 20px; border-bottom: 2px solid var(--pink); border-right: 2px solid var(--pink); width: 8px; height: 8px; } .single-product-box { margin-bottom: 30px; text-align: center; background-color: #ffffff; -webkit-box-shadow: 0 0 29px 0 rgba(102, 102, 102, 0.08); box-shadow: 0 0 29px 0 rgba(102, 102, 102, 0.08); -webkit-transition: 0.5s; transition: 0.5s; } .single-product-box .product-image { position: relative; } .single-product-box .product-image .sale-btn { position: absolute; left: 15px; top: 15px; font-size: 14px; font-weight: 500; display: inline-block; background-color: var(--pink); color: #ffffff; padding: 4px 20px; } .single-product-box .product-content { padding: 25px; } .single-product-box .product-content h3 { margin-bottom: 0; font-size: 20px; font-weight: 700; } .single-product-box .product-content .rating { margin-top: 10px; margin-bottom: 10px; } .single-product-box .product-content .rating i { font-size: 14px; color: #fd5d24; } .single-product-box .product-content .price { display: block; color: #666666; } .single-product-box .product-content .btn { margin-top: 15px; } .single-product-box .product-content .btn-secondary { background-color: #ffffff; } .single-product-box .product-content .btn-secondary:hover, .single-product-box .product-content .btn-secondary:focus { background-color: var(--pink); } .single-product-box:hover .btn-secondary { background-color: var(--pink); color: #ffffff; } /*================================================ Product Details Area CSS =================================================*/ .product-details-area .col-lg-6 { /* height: 400px; */ } .product-details-desc { display: flex; flex-direction: column; justify-content: space-between; } .product-details-desc h1, .product-details-desc h2{ margin-bottom: 13px; font-size: 25px; font-weight: 700; color: var(--blue); text-transform: capitalize; } .product-details-desc p { margin-bottom: 0; } .product-details-desc .price { margin-bottom: 15px; } .product-details-desc .price .new-price { font-size: 22px; font-weight: 800; color: var(--pink); } .product-details-desc .price span { color: #666666; } .product-details-desc .price span.old-price { text-decoration: line-through; color: #c1bdbd; } .product-details-desc .product-review { margin-bottom: 15px; } .product-details-desc .product-review .rating { display: inline-block; padding-right: 5px; font-size: 14px; } .product-details-desc .product-review .rating i { color: #ffba0a; } .product-details-desc .product-review .rating-count { display: inline-block; color: #323232; border-bottom: 1px solid #323232; line-height: initial; } .product-details-desc .product-review .rating-count:hover { color: var(--pink); border-color: var(--pink); } .product-details-desc .product-add-to-cart { margin-top: 20px; } .product-details-desc .product-add-to-cart .input-counter { max-width: 130px; min-width: 130px; margin-right: 10px; text-align: center; display: inline-block; position: relative; } .product-details-desc .product-add-to-cart .input-counter span { position: absolute; top: 0; background-color: transparent; cursor: pointer; color: #d0d0d0; width: 40px; height: 100%; line-height: 48px; -webkit-transition: 0.5s; transition: 0.5s; } .product-details-desc .product-add-to-cart .input-counter span.minus-btn { left: 0; } .product-details-desc .product-add-to-cart .input-counter span.plus-btn { right: 0; } .product-details-desc .product-add-to-cart .input-counter span:hover { color: var(--pink); } .product-details-desc .product-add-to-cart .input-counter input { height: 45px; color: #323232; outline: 0; display: block; border: none; background-color: #f8f8f8; text-align: center; width: 100%; font-size: 17px; font-weight: 600; } .product-details-desc .product-add-to-cart .input-counter input::-webkit-input-placeholder { color: #323232; } .product-details-desc .product-add-to-cart .input-counter input:-ms-input-placeholder { color: #323232; } .product-details-desc .product-add-to-cart .input-counter input::-ms-input-placeholder { color: #323232; } .product-details-desc .product-add-to-cart .input-counter input::placeholder { color: #323232; } .product-details-desc .product-add-to-cart .btn { height: 45px; top: -2px; position: relative; } .product-details-desc .product-add-to-cart .btn i { margin-right: 2px; } .buy-checkbox-btn { margin-top: 20px; display: flex; /* position:absolute; */ } .buy-checkbox-btn .bookbtn { margin-left: 15px; } .product-details-desc .buy-checkbox-btn input { display: none; } .product-details-desc .buy-checkbox-btn .cbx { margin: auto; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } .product-details-desc .buy-checkbox-btn .cbx span { display: inline-block; vertical-align: middle; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .product-details-desc .buy-checkbox-btn .cbx span:first-child { position: relative; width: 18px; height: 18px; border-radius: 3px; -webkit-transform: scale(1); transform: scale(1); vertical-align: middle; border: 1px solid #ebebeb; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transition: 0.5s; transition: 0.5s; } .product-details-desc .buy-checkbox-btn .cbx span:first-child svg { position: absolute; top: 3px; left: 2px; fill: none; stroke: #ffffff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 16px; stroke-dashoffset: 16px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: 0.5s; transition: 0.5s; } .product-details-desc .buy-checkbox-btn .cbx span:first-child:before { content: ""; width: 100%; height: 100%; background: #323232; display: block; -webkit-transform: scale(0); transform: scale(0); opacity: 1; border-radius: 50%; -webkit-transition: 0.5s; transition: 0.5s; } .product-details-desc .buy-checkbox-btn .cbx span:last-child { padding-left: 4px; color: #666666; } .product-details-desc .buy-checkbox-btn .cbx:hover span:first-child { border-color: #323232; } .product-details-desc .buy-checkbox-btn .inp-cbx:checked+.cbx span:first-child { background: #323232; border-color: #323232; -webkit-animation: wave 0.4s ease; animation: wave 0.4s ease; } .product-details-desc .buy-checkbox-btn .inp-cbx:checked+.cbx span:first-child svg { stroke-dashoffset: 0; } .product-details-desc .buy-checkbox-btn .inp-cbx:checked+.cbx span:first-child:before { -webkit-transform: scale(3.5); transform: scale(3.5); opacity: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease; } .product-details-desc .buy-checkbox-btn .item:not(:first-child) { margin-top: 15px; } .product-details-desc .buy-checkbox-btn .btn { display: block; } .product-details-desc .custom-payment-options { margin-top: 20px; } .product-details-desc .custom-payment-options span { display: block; color: #666666; margin-bottom: 8px; } .product-details-desc .custom-payment-options .payment-methods a { display: inline-block; } .product-details-desc .custom-payment-options .payment-methods a img { width: 40px; } .tab .tabs_item { display: none; } .tab .tabs_item:first-child { display: block; } .products-details-tab { margin-top: 50px; } .products-details-tab .tabs { list-style-type: none; margin-bottom: -1px; padding-left: 0; } .products-details-tab .tabs li { display: inline-block; line-height: initial; margin-right: 5px; } .products-details-tab .tabs li a { display: inline-block; position: relative; text-transform: uppercase; color: #666666; border: 1px dashed #eeeeee; padding-top: 15px; padding-bottom: 15px; padding-right: 30px; padding-left: 48px; font-weight: 700; font-size: 14px; } .products-details-tab .tabs li a .dot { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 30px; width: 12px; height: 12px; border: 1px solid #666666; -webkit-transition: 0.5s; transition: 0.5s; } .products-details-tab .tabs li a .dot::before { position: absolute; top: 0; content: ''; left: 0; right: 0; bottom: 0; background: #666666; margin: 1px; -webkit-transition: 0.5s; transition: 0.5s; } .products-details-tab .tabs li a:hover, .products-details-tab .tabs li a:focus { color: #ffffff; background-color: var(--blue); border-color: var(--blue); } .products-details-tab .tabs li a:hover .dot, .products-details-tab .tabs li a:focus .dot { border-color: #ffffff; } .products-details-tab .tabs li a:hover .dot::before, .products-details-tab .tabs li a:focus .dot::before { background: #ffffff; } .products-details-tab .tabs li.current a { color: #ffffff; background-color: var(--blue); border-color: var(--blue); } .products-details-tab .tabs li.current a .dot { border-color: #ffffff; } .products-details-tab .tabs li.current a .dot::before { background: #ffffff; } .products-details-tab .tabs li:last-child { margin-right: 0; } .products-details-tab .tab_content { border: 1px dashed #eeeeee; padding: 30px; } .products-details-tab-content ul { list-style: none; } .products-details-tab-content ul li i { color: var(--blue); margin-right: 10px; } .products-details-tab-content ul li:before { content: "\f00c"; /* FontAwesome Unicode */ font-family: FontAwesome; color: var(--blue); display: inline-block; margin-right: 10px; /* same as padding-left set on li */ width: 18px; /* same as padding-left set on li */ } .products-details-tab .tab_content .tabs_item .products-details-tab-content p { margin-bottom: 20px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content p:last-child { margin-bottom: 0; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .additional-information { padding-left: 0; margin-bottom: 0; list-style-type: none; text-align: left; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .additional-information li { border: 1px solid #eeeeee; border-bottom: none; padding: 10px 15px; color: #666666; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .additional-information li:last-child { border-bottom: 1px solid #eeeeee; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .additional-information li span { display: inline-block; width: 30%; font-weight: 600; color: #323232; } .products-details-tab .tab_content .tabs_item .products-details-tab-content h3 { margin-bottom: 15px; font-size: 20px; font-weight: 700; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title { position: relative; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title .rating { display: inline-block; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title .rating .fas.fa-star { color: #ffba0a; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title .rating i { color: #ebebeb; font-size: 14px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title p { margin-bottom: 0; display: inline-block; padding-left: 5px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-title .btn { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments { margin-top: 35px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item { margin-top: 30px; position: relative; padding-right: 200px; border-top: 1px dashed #eeeeee; padding-top: 30px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item .rating .fas.fa-star { color: #ffba0a; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item .rating i { font-size: 14px; color: #ebebeb; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item h3 { font-size: 17px; margin-top: 10px; margin-bottom: 10px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item span { margin-bottom: 10px; font-size: 13px; display: block; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item span strong { font-weight: 600; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item p { margin-bottom: 0; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item .review-report-link { position: absolute; right: 0; color: #666666; top: 40px; text-decoration: underline; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-comments .review-item .review-report-link:hover { color: var(--pink); } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form { margin-top: 30px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .form-group { margin-bottom: 20px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .form-group label { margin-bottom: 10px; font-size: 14px; font-weight: 500; color: #666666; text-transform: uppercase; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .form-group textarea { padding-top: 15px; height: 120px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .btn { margin-top: 0; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating { margin-bottom: 1rem; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating p { margin-bottom: 5px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-source { width: 0; height: 0; margin-top: 5px; visibility: hidden; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-source svg { width: 1.5rem; height: 1.5rem; padding: 0 0.15rem; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 105px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating label { cursor: pointer; margin-bottom: 0; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating label .star { color: transparent; -webkit-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating label:hover~label .star, .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating svg.star:hover, .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating input[name="star"]:focus~label .star, .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating input[name="star"]:checked~label .star { color: #f2b01e; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating svg { width: 1.5rem; height: 1.5rem; padding: 0 0.15rem; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating input[name="star"] { display: inline-block; width: 0; opacity: 0; margin-left: -2px; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating input[name="star"]:checked+label { -webkit-animation: scaleup 1s; animation: scaleup 1s; } .products-details-tab .tab_content .tabs_item .products-details-tab-content .product-review-form .review-form form .review-rating .star-rating input[name="star"]:checked+label .star { -webkit-animation: starred 0.5s; animation: starred 0.5s; } .related-products-area { margin-top: 50px; } .related-products-area .section-title { margin-bottom: 30px; color: var(--blue); } .related-products-area .single-product-box { margin-bottom: 0; margin-top: 30px; } /*================================================ Cart CSS =================================================*/ .cart-table table { margin-bottom: 0; } .cart-table table thead tr th { border-bottom-width: 0px; vertical-align: middle; padding: 15px 0 15px; text-transform: uppercase; border: none; font-weight: 700; } .cart-table table tbody tr td { vertical-align: middle; color: #666666; padding-left: 0; padding-right: 0; font-size: 14px; border-color: #eaedff; border-left: none; border-right: none; } .cart-table table tbody tr td.product-thumbnail a { display: block; } .cart-table table tbody tr td.product-thumbnail a img { width: 80px; } .cart-table table tbody tr td.product-name a { color: #666666; font-weight: 600; display: inline-block; } .cart-table table tbody tr td.product-name a:hover { color: var(--pink); } .cart-table table tbody tr td.product-price span { font-weight: 500; } .cart-table table tbody tr td.product-subtotal .remove { color: red; float: right; position: relative; top: -1px; } .cart-table table tbody tr td.product-quantity .input-counter { max-width: 130px; min-width: 130px; text-align: center; display: inline-block; position: relative; } .cart-table table tbody tr td.product-quantity .input-counter span { position: absolute; top: 0; background-color: transparent; cursor: pointer; color: #d0d0d0; width: 40px; height: 100%; line-height: 48px; -webkit-transition: 0.5s; transition: 0.5s; } .cart-table table tbody tr td.product-quantity .input-counter span.minus-btn { left: 0; } .cart-table table tbody tr td.product-quantity .input-counter span.plus-btn { right: 0; } .cart-table table tbody tr td.product-quantity .input-counter span:hover { color: var(--pink); } .cart-table table tbody tr td.product-quantity .input-counter input { height: 45px; color: #323232; outline: 0; display: block; border: none; background-color: #f8f8f8; text-align: center; width: 100%; font-size: 17px; font-weight: 600; } .cart-table table tbody tr td.product-quantity .input-counter input::-webkit-input-placeholder { color: #323232; } .cart-table table tbody tr td.product-quantity .input-counter input:-ms-input-placeholder { color: #323232; } .cart-table table tbody tr td.product-quantity .input-counter input::-ms-input-placeholder { color: #323232; } .cart-table table tbody tr td.product-quantity .input-counter input::placeholder { color: #323232; } .cart-table table tbody tr td.product-subtotal { overflow: hidden; } .cart-table table tbody tr td.product-subtotal span { font-weight: 500; } .cart-buttons { margin-top: 30px; } .cart-totals { background: #ffffff; padding: 40px; max-width: 800px; -webkit-box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08); border-radius: 5px; margin-left: auto; margin-top: 50px; } .cart-totals h3 { margin-bottom: 25px; font-size: 20px; font-weight: 700; } .cart-totals ul { padding: 0; margin: 0 0 25px; list-style-type: none; } .cart-totals ul li { border: 1px solid #eaedff; padding: 10px 15px; color: #323232; overflow: hidden; font-weight: 700; } .cart-totals ul li:first-child { border-bottom: none; } .cart-totals ul li:last-child { border-top: none; } .cart-totals ul li span { float: right; color: #666666; font-weight: normal; } /*================================================ Checkout CSS =================================================*/ .user-actions { -webkit-box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08); background: #ffffff; padding: 18px 20px 15px; margin-bottom: 65px; border-top: 3px solid var(--pink); position: relative; } .user-actions::before { content: ''; position: absolute; right: 0; bottom: -35px; width: 100%; height: 1px; background: #eeeeee; } .user-actions i { color: var(--pink); margin-right: 2px; } .user-actions span { display: inline-block; font-weight: 500; color: var(--pink); } .user-actions span a { display: inline-block; color: #323232; font-size: 14px; } .user-actions span a:hover, .user-actions span a:focus { color: var(--pink); } .checkout-area .title { margin-bottom: 25px; font-size: 20px; font-weight: 700; } .billing-details .form-group { margin-bottom: 20px; } .billing-details .form-group label { display: block; color: #666666; margin-bottom: 10px; font-size: 14px; font-weight: 500; } .billing-details .form-group label .required { color: red; } .billing-details .form-group .nice-select { float: unset; line-height: 45px; color: #666666; padding-top: 0; padding-bottom: 0; } .billing-details .form-group .nice-select .list { background-color: #ffffff; -webkit-box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); box-shadow: 0px 0px 29px 0px rgba(102, 102, 102, 0.1); border-radius: 0; margin-top: 0; width: 100%; padding-top: 10px; padding-bottom: 10px; } .billing-details .form-group .nice-select .list .option { -webkit-transition: 0.5s; transition: 0.5s; padding-left: 20px; padding-right: 20px; } .billing-details .form-group .nice-select .list .option:hover { background-color: var(--pink) !important; color: #ffffff; } .billing-details .form-group .nice-select .list .option.selected { background-color: transparent; } .billing-details .form-group .nice-select:after { right: 20px; border-bottom: 2px solid var(--pink); border-right: 2px solid var(--pink); width: 8px; height: 8px; } .billing-details .form-group textarea { padding-top: 13px; height: 120px; } .billing-details .form-check { margin-bottom: 20px; } .billing-details .form-check .form-check-label { color: #666666; } .billing-details .form-check label { position: relative; top: 1px; font-size: 14px; font-weight: 500; } .billing-details .col-lg-12:last-child .form-group { margin-bottom: 0; } .order-details .order-table table { margin-bottom: 0; } .order-details .order-table table thead tr th { border-bottom-width: 0; vertical-align: middle; border-color: #eaedff; padding-left: 20px; padding-top: 15px; padding-right: 20px; padding-bottom: 15px; font-weight: 700; } .order-details .order-table table tbody tr td { vertical-align: middle; color: #666666; border-color: #eaedff; font-size: 14px; padding-left: 20px; padding-right: 20px; } .order-details .order-table table tbody tr td.product-name a { color: #666666; display: inline-block; font-weight: 500; } .order-details .order-table table tbody tr td.product-name a:hover { color: var(--pink); } .order-details .order-table table tbody tr td.order-subtotal span, .order-details .order-table table tbody tr td.order-shipping span, .order-details .order-table table tbody tr td.total-price span { color: #323232; font-weight: 600; } .order-details .order-table table tbody tr td.shipping-price, .order-details .order-table table tbody tr td.order-subtotal-price, .order-details .order-table table tbody tr td.product-subtotal { font-weight: 600; } .order-details .payment-box { background-color: #ffffff; -webkit-box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); margin-top: 30px; padding: 30px; } .order-details .payment-box .payment-method p { font-size: 14px; } .order-details .payment-box .payment-method p [type="radio"]:checked, .order-details .payment-box .payment-method p [type="radio"]:not(:checked) { display: none; } .order-details .payment-box .payment-method p [type="radio"]:checked+label, .order-details .payment-box .payment-method p [type="radio"]:not(:checked)+label { padding-left: 27px; cursor: pointer; display: block; font-weight: 600; color: #323232; position: relative; margin-bottom: 8px; } .order-details .payment-box .payment-method p [type="radio"]:checked+label::before, .order-details .payment-box .payment-method p [type="radio"]:not(:checked)+label::before { content: ''; position: absolute; left: 0; top: 3px; width: 18px; height: 18px; border: 1px solid #dddddd; border-radius: 50%; background: #ffffff; } .order-details .payment-box .payment-method p [type="radio"]:checked+label::after, .order-details .payment-box .payment-method p [type="radio"]:not(:checked)+label::after { content: ''; width: 12px; height: 12px; background: var(--pink); position: absolute; top: 6px; left: 3px; border-radius: 50%; -webkit-transition: 0.5s; transition: 0.5s; } .order-details .payment-box .payment-method p [type="radio"]:not(:checked)+label::after { opacity: 0; visibility: hidden; -webkit-transform: scale(0); transform: scale(0); } .order-details .payment-box .payment-method p [type="radio"]:checked+label::after { opacity: 1; visibility: visible; -webkit-transform: scale(1); transform: scale(1); } .order-details .payment-box .btn.order-btn { display: block; margin-top: 25px; } /*================================================ Coming Soon Area CSS =================================================*/ .coming-soon-area { position: relative; z-index: 1; } .coming-soon-area .coming-soon-content { height: 100vh; position: relative; padding-left: 100px; padding-right: 100px; } .coming-soon-area .coming-soon-content .logo { position: absolute; left: 100px; top: 30px; } .coming-soon-area .coming-soon-content h3 { margin-bottom: 25px; line-height: 1.4; font-size: 32px; font-weight: 700; } .coming-soon-area .coming-soon-content form { max-width: 520px; } .coming-soon-area .coming-soon-content form .form-control { height: 52px; border-color: #e6e6e6; padding-left: 15px; font-weight: 500; border-radius: 5px; } .coming-soon-area .coming-soon-content form .form-control::-webkit-input-placeholder { color: #999999; } .coming-soon-area .coming-soon-content form .form-control:-ms-input-placeholder { color: #999999; } .coming-soon-area .coming-soon-content form .form-control::-ms-input-placeholder { color: #999999; } .coming-soon-area .coming-soon-content form .form-control::placeholder { color: #999999; } .coming-soon-area .coming-soon-content form .form-control:focus { border-color: var(--pink); } .coming-soon-area .coming-soon-content form .btn { display: block; width: 100%; padding: 15px 28px; border-radius: 5px; } .coming-soon-area .coming-soon-content form p { margin-bottom: 0; margin-top: 15px; } .coming-soon-area .coming-soon-content .social { position: absolute; left: 100px; bottom: 30px; text-align: center; } .coming-soon-area .coming-soon-content .social ul { padding-left: 0; margin-bottom: 0; list-style-type: none; } .coming-soon-area .coming-soon-content .social ul li { display: inline-block; margin: 0 2px; } .coming-soon-area .coming-soon-content .social ul li a { width: 35px; height: 35px; line-height: 37px; border-radius: 50%; background-color: #dddddd; color: #323232; font-size: 14px; } .coming-soon-area .coming-soon-content .social ul li a.twitter { background-color: #1da1f2; color: #ffffff; } .coming-soon-area .coming-soon-content .social ul li a.youtube { background-color: #ff0000; color: #ffffff; } .coming-soon-area .coming-soon-content .social ul li a.facebook { background-color: #3b5998; color: #ffffff; } .coming-soon-area .coming-soon-content .social ul li a.linkedin { background-color: #0077b5; color: #ffffff; } .coming-soon-area .coming-soon-content .social ul li a.instagram { background-color: #c13584; color: #ffffff; } .coming-soon-area .coming-soon-content .social ul li a:hover { background-color: #323232; color: #ffffff; } .coming-soon-area .coming-soon-time { width: 100%; height: 100%; position: relative; text-align: center; z-index: 1; background-image: url(../img/coming-soon-bg.jpg); background-position: center center; background-size: cover; background-repeat: no-repeat; } .coming-soon-area .coming-soon-time img { display: none; } .coming-soon-area .coming-soon-time #timer { position: absolute; left: 0; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; max-width: 420px; margin-left: auto; margin-right: auto; } .coming-soon-area .coming-soon-time #timer div { width: 155px; height: 155px; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; display: inline-block; color: #ffffff; line-height: initial; padding-top: 40px; margin-right: 15px; margin-left: 15px; margin-bottom: 15px; margin-top: 15px; font-size: 45px; font-weight: 700; } .coming-soon-area .coming-soon-time #timer div span { text-transform: uppercase; display: block; margin-top: 5px; font-size: 14px; font-weight: 600; } .coming-soon-area .coming-soon-time::before { content: ""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #000000; opacity: .6; z-index: -1; } /*================================================ Footer Area CSS =================================================*/ .footer-area { /*padding-top: 100px;*/ } .single-footer-widget { margin-bottom: 30px; } .single-footer-widget .logo a { display: inline-block; } .single-footer-widget .logo p { font-size: 14px; margin-bottom: 0; margin-top: 17px; } .single-footer-widget h3 { text-transform: uppercase; margin-bottom: 23px; font-size: 17px; font-weight: 700; } .single-footer-widget .useful-links-list { padding-left: 0; margin-bottom: 0; list-style-type: none; } .single-footer-widget .useful-links-list li { margin-bottom: 11px; font-size: 14px; } .single-footer-widget .useful-links-list li:last-child { margin-bottom: 0; } .single-footer-widget .useful-links-list li a { display: inline-block; color: #666666; } .single-footer-widget .useful-links-list li a:hover { color: var(--pink); } .single-footer-widget .widget-services-list { padding-left: 0; margin-bottom: 0; list-style-type: none; } .single-footer-widget .widget-services-list li { margin-bottom: 11px; font-size: 14px; } .single-footer-widget .widget-services-list li:last-child { margin-bottom: 0; } .single-footer-widget .widget-services-list li a { display: inline-block; color: #666666; } .single-footer-widget .widget-services-list li a:hover { color: var(--pink); } .single-footer-widget .footer-contact-info { padding-left: 0; margin-bottom: 0; list-style-type: none; } .single-footer-widget .footer-contact-info li { color: #666666; position: relative; margin-bottom: 15px; font-size: 14px; padding-left: 22px; } .single-footer-widget .footer-contact-info li i { position: absolute; left: 0; top: 0; color: #323232; } .single-footer-widget .footer-contact-info li a { display: inline-block; color: #666666; } .single-footer-widget .footer-contact-info li a:hover { color: var(--pink); } .single-footer-widget .footer-contact-info li:last-child { margin-bottom: 0; } .single-footer-widget .newsletter-box { margin-top: 20px; } .single-footer-widget .newsletter-box h4 { margin-bottom: 12px; font-size: 17px; font-weight: 700; } .single-footer-widget .newsletter-box .newsletter-form { position: relative; } .single-footer-widget .newsletter-box .newsletter-form button { position: absolute; right: 0; top: 0; height: 45px; width: 50px; border: none; background-color: var(--pink); color: #ffffff; -webkit-transition: 0.5s; transition: 0.5s; } .single-footer-widget .newsletter-box .newsletter-form button i::before { font-size: 20px; } .single-footer-widget .newsletter-box .newsletter-form button:hover { background-color: var(--blue); color: #ffffff; } .single-footer-widget .newsletter-box .newsletter-form .validation-danger { color: red; font-size: 13px; margin-top: 5px; } .single-footer-widget .newsletter-box .newsletter-form .validation-success { margin-top: 5px; font-size: 13px; } .copyright-area { margin-top: 30px; border-top: 1px solid #eeeeee; padding-top: 25px; padding-bottom: 50px; } .copyright-area p a { display: inline-block; color: #666666; } .copyright-area p a:hover { color: var(--pink); } .copyright-area ul { padding-left: 0; margin-bottom: 0; text-align: right; list-style-type: none; } .copyright-area ul li { display: inline-block; margin-left: 13px; } .copyright-area ul li a { color: #696969; } .copyright-area ul li a:hover { color: var(--pink); } /*================================================ Go Top CSS =================================================*/ .go-top { position: fixed; cursor: pointer; bottom: 25px; right: 0; background-color: var(--blue); color: #ffffff; z-index: 4; width: 40px; text-align: center; height: 40px; line-height: 40px; opacity: 0; visibility: hidden; -webkit-transition: .9s; transition: .9s; } .go-top.active { right: 25px; opacity: 1; visibility: visible; } .go-top:hover, .go-top:focus { background-color: var(--pink); color: #ffffff; } .packagebtn { padding: 12px 30px 10px !important; } .btn-group { position: fixed; bottom: 0px; left: 50%; transform: translate(-50%, -00%); z-index: 9999; transition: all linear 0.5s; } .btn-group button a { color: white; } .btn-group button:hover { background-color: var(--blue); border: 1px solid var(--blue); color: white; transform: translateY(-2px); } .btn-group button:nth-child(1) { border-radius: 15px 15px 0 0; } .btn-group button:nth-child(3) { border-radius: 0 15px 0 0; } .btn-group button:nth-child(4) { border-radius: 0 15px 0 0; } .btn-group button:nth-child(2) { border-radius: 0 15px 0 0; } .helpline { position: fixed; top: 50%; right: -50px; z-index: 9999; transition: all linear 0.5s; transform: rotate(-90deg); } .helpline a { color: white; } .helpline:hover a { color: var(--pink); } .helpline:hover { background-color: white; } .helpline1 { position: fixed; top: 50%; left: -38px; z-index: 9999; transition: all linear 0.5s; transform: rotate(-90deg); } .helpline1 a { color: white; } .helpline1:hover a { color: var(--pink); } .helpline1:hover { background-color: white; } /* Popup Forms */ .popup { display: none; position: fixed; top: 0px; left: 0px; height: 100vh; width: 100vw; background: rgba(255, 255, 255, 0.8); z-index: 9999999; margin-top: 0px; transition: all linear 1s; } .samplecollection { padding: 50px; text-align: center; background-color: white; position: fixed; width: 70vw; height: 70vh; top: 50%; left: 50%; transform: translate(-50%, -50%); /* z-index: 99999; */ -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); transition: all linear 1s; } .samplecollection .bikeimg { animation: slidein 1s; } .samplecollection .apmtimg { animation: pulse 1s infinite ease-in-out; } .appointment-form { border-radius: 5px; background-color: #ffffff; /* -webkit-box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.02); */ /* max-width: 555px; */ /* margin-left: auto; */ padding: 10px 40px; position: relative; z-index: 1; } .close { position: absolute; right: -5px; top: -5px; } .close img { height: 30px; width: 30px; } /* Animation */ @keyframes slidein { from { transform: translateX(-500px); } to { transform: translateX(0px); } } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } /* Price Tag */ .price-tag { width: 100px; margin-left: 15px; margin-bottom: 15px; background: var(--pink); font-size: 22px; font-weight: 600; color: #fff; align-items: center; display: flex; justify-content: center; position: relative; height: var(--price-tag-height); padding: 0.25rem 0.5rem; cursor: pointer; transition: all ease 0.5s; } .price-tag:hover { background: var(--blue); } .price-tag::before { content: ''; border-color: transparent var(--pink) transparent transparent; border-style: solid; border-width: calc(var(--price-tag-height) / 2) calc(var(--price-tag-height) / 2) calc(var(--price-tag-height) / 2) 0rem; left: 0px; position: absolute; top: 0px; transform: translate(-100%, 0px); transition: all ease 0.5s; } .price-tag:hover::before { border-color: transparent var(--blue) transparent transparent; } /* The dot */ .price-tag::after { content: ''; /* Make it like a cirle */ background: #fff; border-radius: 9999rem; /* Position */ left: 0; position: absolute; top: 50%; transform: translate(-0.5rem, -50%); /* Size */ height: 0.5rem; width: 0.5rem; } .service-header h1 { font-weight: 600; color: var(--blue); text-align: center; margin-bottom: 50px; } .page-banner { padding-top: 80px; } .page-banner img { width: 100%; } .benifits { position: relative; top: -70px; -webkit-box-shadow: 5px 25px 28px 25px rgba(0, 0, 0, 0.06); box-shadow: 5px 2px 28px 25px rgba(0, 0, 0, 0.06); background-color: #ffffff; padding: 20px; border-radius: 15px; } .benifits h3 { text-align: left; color: var(--blue); margin-bottom: 25px; } .benifits-item { display: flex; margin-bottom: 35px; transition: all ease 0.5s; } .benifit-icon { width: 100px !important; padding-right: 15px; transition: all ease 0.5s; min-width: 25%; } .benifits-item:hover .benifit-icon { transform: translateX(-10px); } .benifit-text { text-align: left; } .benifit-text h5 { color: var(--pink); font-weight: 500; } .enroll-btn { width: 100%; text-align: center; } .enroll-btn .btn { width: 100%; } .enroll-btn .btn a { color: white; } .enroll-btn:hover a { color: var(--pink); } .btngroup a { width: 100%; } .single-testimonial-item1 .single-pricing-box { height: 600px; display: flex; flex-direction: column; justify-content: space-between; } .single-testimonial-item1 .single-pricing-box h3 { margin-top: 10px; } .single-testimonial-item1 .single-pricing-box .pricing-features-list { margin-top: 10px; } .single-testimonial-item1 .single-pricing-box .pricing-features-list li { margin-bottom: 1px; } .adcamp-banner { margin-top: 100px; height: 100vh; text-align: center; position: relative; z-index: 1; background-color: #ffffff; background-image: url(../img/test-banner-bg.webp); background-position: center center; background-size: cover; background-repeat: no-repeat; border-bottom: 1px solid #eeeeee; } .adcamp-banner .main-row { height: 100vh; justify-content: center; align-items: center; } .adcamp-banner .form { position: relative; z-index: 1; background: #FFFFFF; max-width: 360px; margin: 0 auto; padding: 45px; text-align: center; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24) } .adcamp-banner .form input, .adcamp-banner .form select { font-family: "Roboto", sans-serif; outline: 0; background: #f2f2f2; width: 100%; border: 0; margin: 0 0 15px; padding: 15px; box-sizing: border-box; font-size: 14px; } .adcamp-banner .form .submit { font-family: "Roboto", sans-serif; text-transform: uppercase; outline: 0; background: var(--pink); width: 100%; border: 0; padding: 15px; color: #FFFFFF; font-size: 15px; font-weight: 600; -webkit-transition: all 0.3 ease; transition: all 0.3 ease; cursor: pointer; } .healthpackage-banner-text .package-banner-title { font-size: 35px; line-height: 40px; font-weight: 800; margin-bottom: 25px; color: var(--blue); /* text-align: left; */ } .recomedation-list li { color: white; font-size: 20px; font-weight: 400; line-height: 30px; margin-left: 10px; } .recomedation-list li::before { font-family: fontAwesome; content: '\f772'; position: absolute; left: 0; color: var(--pink); } .recomedation-list li:nth-child(even)::before { color: var(--blue); } .healthpackage-banner-text { height: 500px; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; } .recomedation-list { list-style: none; position: relative; margin-top: 25px; } .recomedation-list li { color: var(--blue); font-size: 20px; font-weight: 400; line-height: 30px; margin-left: 10px; text-align: left; } .ask-price { text-align: left; } .ask-price a { background-color: transparent; color: var(--pink); border: 1px solid var(--pink); padding: 10px 15px; border-radius: 15px; font-size: 18px; font-weight: 600; text-align: left; } .test-description h3 { color: var(--blue); font-weight: 600; border-left: 5px solid var(--pink); line-height: 1; padding-left: 10px; margin-top: 40px; } .test-description .parameters { margin-left: 15px; list-style: none; } .test-description .parameters li { line-height: 2; } .test-description .parameters li i { color: var(--pink); font-size: 18px; } .test-description p a { display: inline; color: var(--pink); font-weight: 500; } .page-format { margin: 100px 0; } .page-format .page-wrap { background: rgba(255, 255, 255, 1); width: 100%; max-width: 100%; padding: 50px; margin: 0 auto; position: relative; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.15); } .page-format .page-wrap .date { text-align: right; line-height: 1.5; font-weight: 600; } .page-format h1 { margin-bottom: 30px; } .page-format p { text-align: justify; margin-bottom: 5px; } .page-format li { margin-bottom: 10px; } .page-format .page-wrap-is { padding: 20px 0; border-bottom: 1px solid #aaa; } .page-format .page-wrap-is:last-child { border-bottom: none; }