@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,300;1,400;1,700&display=swap');

    * {
    	margin: 0;
    	padding: 0;
    	box-sizing: border-box;
    }

    body {
    	font-family: 'Lato', sans-serif;
    	-webkit-font-smoothing: antialiased;
    	-moz-osx-font-smoothing: antialiased;
    	-font-smoothing: antialiased;
    	transition: all .1s ease;
    	color: #333;
    	background: #f5f7fd;
    	display: flex;
    	flex-direction: column;
    	min-height: 100vh;
    }

    img {
    	max-width: 100%;
    }

    ul {
    	padding: 0;
    }

    *:focus,
    a:focus,
    .btn.focus,
    .btn:focus,
    .page-link:focus {
    	outline: 0 !important;
    	box-shadow: none;
    }

    h2 {
    	font-size: 18px;
    	font-weight: 700;
    	margin: 0;
    }

    p {
    	font-size: 14px;
    }

    .p-0 {
    	padding: 0
    }

    .p-20 {
    	padding: 20px;
    }

    .mb-0 {
    	margin-bottom: 0;
    }

    .mb-10 {
    	margin-bottom: 10px;
    }

    .mb-5 {
    	margin-bottom: 5px;
    }

    .headerBorder {
    	height: 10px;
    	background: #009c71;
    	width: 100%;
    }

    header {
    	display: flex;
    	border-radius: 6px;
    	margin: 20px 0px 0px;
    	align-items: center;
    }

    .logo {
    	margin-top: 5px;
    }

    .logo img {
    	width: 250px;
    	object-fit: contain;
    	vertical-align: middle;
    }

    #appointmentForm {
    	flex: 1;
    	padding-bottom: 40px;
    }

    @media (min-width : 1200px) {
    	.container {
    		max-width: 1200px;
    		width: 100%;
    		padding-right: 15px;
    		padding-left: 15px;
    		margin-right: auto;
    		margin-left: auto;
    	}

    	.appointment-contact-section textArea {
    		width: 580px;
    		resize: none;
    	}

    	.appointment-contact-section input[type="text"] {
    		width: 276px;
    		height: 40px;
    	}


    	.btn-appointment {
    		width: 260px !important;
    	}
    }

    @media (min-width: 768px) and (max-width: 1159px) {
    	.appointment-contact-section textArea {
    		width: 480px;
    		resize: none;
    	}
    }

    @media (max-width : 767px) {

    	.appointment-selection .doctor-found-text,
    	.appointment-selection .doctor-available-dates {
    		text-align: center;
    	}

    	.reviewCont {
    		float: none !important;
    	}
    }

    .appointment-contact-section input {
    	padding-right: 40px;
    }

    .appointment-request {
    	align-self: start;
    	margin-top: 10px;

    	.appt-request {
    		font-weight: normal;
    		font-size: 16px;
    		color: #333333;
    	}

    	h1 {
    		color: #0C3178;
    		font-size: 24px;
    		font-weight: 700;
    		line-height: 33.6px;
    		margin-top: 5px;
    	}

    }

    .flex-shrink {
    	flex: inherit;
    }

    .office-details {
    	background: #fff;
    	padding-bottom: 20px;
    }

    .office-contact {
    	border-top: 1px solid rgba(151, 151, 151, 0.2);
    	padding-top: 20px;
    	margin-bottom: 12px;
    	margin: 0px 20px;

    	.address,
    	.phone,
    	.website-url {
    		font-size: 14px;
    		color: #333333;
    		font-weight: normal;
    		display: flex;
    		gap: 5px;
    	}

    }

    .textIcons svg {
    	top: 3px;
    	position: relative;
    }

    .appointment-details,
    .appointment-selection,
    .appointment-contact-section {
    	background: #fff;
    	margin-top: 20px;
    	padding: 20px;
    }

    .appointment-details .sub-text {
    	font-size: 12px;
    	font-weight: 600;
    	line-height: 12px;
    }

    .appointment-details button,
    .appointment-details button:hover,
    .appointment-details button:active {
    	background-color: #4D99F8;
    	border-color: #0d6efd;
    }

    .office-contact-details {
    	display: inline-block;
    }

    .reviewCont {
    	float: right;
    }

    .officeTime {
    	position: absolute;
    	right: 60px;
    	background: antiquewhite;
    	background: #fff;
    	box-shadow: 0px 1px 3px rgb(0 0 0/ 10%);
    	padding: 10px;
    	line-height: 26px;
    }

    .appointment-selection .appointment-selection-details-inner {
    	border-top: 1px solid rgba(151, 151, 151, 0.2);
    }

    .appointment-selection .inner {
    	padding: 10px 20px;
    }

    .appointment-selection .doctor-found-text {
    	font-size: 16px;
    	color: #333;
    	font-weight: 700;
    }

    .appointment-selection .doctor-available-dates-selected {
    	font-size: 16px;
    	color: #428FEB;
    	font-weight: 700;
    	margin-right: 10px;
    }


    .appointment-selection .sign {
    	cursor: pointer;
    	font-size: 20px;
    	background-color: #4D99F8;
    	border-color: #0d6efd;
    	color: #fff;
    	padding: 5px;
    	border-radius: 50;
    	padding: .375rem .75rem;
    	font-size: 1rem;
    	border-radius: .25rem;
    	margin-right: 10px;
    }

    .appointment-selection .sign.disabled-arrow {
    	pointer-events: none;
    	opacity: 0.4;
    }

    .appointment-selection .appointment-selection-details .doctor-img {
    	width: 60px;
    	height: 60px;
    	border-radius: 50%;
    }

    .appointment-selection .appointment-selection-details .title {
    	font-size: 18px;
    	color: #0C3178;
    	font-weight: 700;
    }

    .appointment-slot .appointment-slot-date {
    	color: #0C3178;
    	font-weight: 700;
    }

    .appointment-slot .slot-time {
    	background: #459A74;
    	padding: 6px 10px;
    	border-radius: 6px;
    	color: #ffffff;
    	cursor: pointer;
    }

    .appointment-slot .not-available {
    	background: #808080;
    	pointer-events: none;
    }

    .appointment-slot .slot-time.active {
    	background: #4D99F8;
    }

    .appointment-contact-section .contact-information {
    	font-size: 16px;
    	color: #333;
    	font-weight: 700;
    }

    .appointment-contact-section label {
    	margin-bottom: 0;
    }

    .appointment-contact-section svg {
    	position: relative;
    	top: -30px;
    	float: right;
    	right: 15px;
    }

    .btn-appointment,
    .btn-appointment:hover,
    .btn-appointment:active {
    	background: #4D99F8;
    	border: #4D99F8;
    	color: #ffffff;
    	width: 100%;
    }

    .btn-appointment-submit {
    	padding: 0 20px;
    }

    .flex-auto-0 {
    	flex: 0 0 auto;
    }

    .radio input[type=radio] {
    	position: absolute;
    	opacity: 0;
    }

    .radio input[type=radio]:checked+.radio-label:before {
    	background-color: #3197EE;
    	box-shadow: inset 0 0 0 4px #f4f4f4;
    }

    .radio input[type=radio]+.radio-label:before {
    	content: "";
    	border-radius: 100%;
    	border: 1px solid #000000;
    	display: inline-block;
    	width: 20px;
    	height: 20px;
    	position: relative;
    	top: -0.2em;
    	vertical-align: top;
    	cursor: pointer;
    	text-align: center;
    	transition: all 250ms ease;
    }

    #confirmModal .modal-dialog {
    	width: 360px;
    }

    #confirmModal .modal-title {
    	margin: 0 auto;
    	font-size: 18px;
    	color: #333333;
    	font-weight: 700;
    }

    #confirmModal .modal-body {
    	font-size: 16px;
    	color: #333333;
    	text-align: center;
    	margin: 0 auto;
    	padding: 16px;
    }

    .btn:disabled {
    	background: #C0C0C0;
    }

    #loadingContainer {
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	height: 50vh;
    	background: #ffffff;
    }




    .success-page h2 {
    	font-size: 18px;
    	font-weight: 700;
    	margin: 0;
    }

    .success-page p {
    	font-size: 14px;
    }

    .success-page .headerBorder {
    	height: 10px;
    	background: #009c71;
    	width: 100%;
    }

    .success-page header {
    	display: flex;
    	border-radius: 6px;
    	justify-content: space-between;
    	box-shadow: 0px 1px 3px rgb(0 0 0/ 10%);
    	margin: 30px 0 20px;
    	align-items: center;
    	background: #fff;
    }

    .success-page .logo {
    	margin: 0 30px;
    }

    .success-page .logo h1 {
    	font-size: 36px;
    	margin: 0;
    	font-family: 'Lato';
    	font-weight: bold;
    	white-space: nowrap;
    	border-bottom: 1px solid rgba(151, 151, 151, 0.2);
    	padding-bottom: 10px;
    	margin-bottom: 12px;
    }

    .success-page .success-page-logo {
    	display: flex;
    	align-items: center;
    }

    .success-page .logo img {
    	max-height: 100px;
    	max-width: 100px;
    	margin-right: 12px;
    }

    .success-page .success-page-logo h1 {
    	padding: 0;
    	margin: 0;
    	border: 0;
    	font-size: 28px;
    }

    .success-page .cBanner img {
    	max-height: 150px;
    }

    .success-page .appointment-request-wrapper {
    	background: #fff;
    	border-radius: 8px;
    	text-align: center;
    	width: 100%;
    	padding: 160px 0;
    }

    .success-page .appointment-success-msg {
    	padding: 22px 20px 0px;
    	color: #333;
    }

    .success-page .appointment-success-msg h2 {
    	font-size: 38px;
    	font-weight: bold;
    	margin-bottom: 18px;
    }

    .success-page .appointment-success-msg p {
    	font-size: 18px;
    	margin: 0 auto;
    	line-height: 26px;
    }

    .success-page .appointment-request-wrapper logo {
    	padding: 0;
    }

    .success-page .appointment-request-wrapper logo img {
    	max-height: 120px;
    }

    .success-page .dentalGroupCont {
    	background: #fff;
    	box-shadow: 0px 1px 3px rgb(0 0 0/ 10%);
    	padding: 24px 20px;
    	border-radius: 6px;
    }

    .success-page .dentalGroupCont h2 {
    	border-bottom: 1px solid rgba(84, 84, 84, 0.23);
    	padding-bottom: 10px;
    	display: inline-block;
    	padding-right: 24px;
    }

    .success-page .btnCustom {
    	border-radius: 4px;
    	border: 1px solid #e9e9e9;
    	background: none;
    	font-size: 16px;
    	font-weight: bold;
    	display: flex;
    	align-items: center;
    	margin-left: auto;
    }

    .success-page .btnCustom img {
    	margin-right: 8px
    }

    .success-page .patReview {
    	display: flex;
    	align-items: center;
    	border-bottom: 1px solid rgba(151, 151, 151, 0.2);
    }

    .success-page .detntalGroupLeft p {
    	display: flex;
    	align-items: center;
    	margin: 6px 0;
    	font-size: 14px;
    }

    .success-page .detntalGroupLeft p img {
    	margin-right: 4px
    }

    .success-page .patReview .btnCustom {
    	margin-left: 0;
    	margin-right: 8px;
    	border: 0;
    	border-right: 1px solid rgba(151, 151, 151, 0.2);
    	border-radius: 0;
    	margin-right: 8px;
    }

    .success-page .officeReviewCont {
    	display: flex;
    	margin: 15px 0;
    }

    .success-page .officeReviewFeedback,
    .officeHoursSec,
    .officeDirection {
    	background: #fff;
    	box-shadow: 0px 1px 3px rgb(0 0 0/ 10%);
    	border-radius: 6px;
    	float: left;
    	width: 100%;
    }

    .success-page .officeReviewLocation {
    	max-width: 320px;
    	width: 100%;
    }

    .success-page .reviewCont {
    	border-bottom: 1px solid rgba(151, 151, 151, 0.2);
    	padding: 16px 20px;
    }

    .success-page .reviewCont>p {
    	margin-bottom: 4px;
    }

    .success-page .oldFeedback {
    	color: #666;
    	width: 100%;
    	display: block;
    	font-size: 14px;
    }

    .success-page .fontSmall {
    	font-size: 12px;
    }

    .success-page .mrg-feedback {
    	margin: 4px 0 8px;
    }

    .success-page .patientName {
    	font-size: 15px;
    	font-weight: bold;
    	padding-right: 6px;
    }

    .success-page .textIcons img {
    	margin-right: 6px;
    }

    .success-page .reviewCont a {
    	color: #333;
    	padding-left: 24px;
    }

    .success-page .office-logo-sec {
    	align-items: center;
    }

    .success-page .office-logo-sec p {
    	font-size: 18px;
    }

    .success-page .reviewCont:last-child {
    	border: 0;
    }

    .success-page .officeReviewFeedback {
    	margin-right: 25px;
    }

    .success-page .officeHoursSec {
    	margin: 15px 0 24px;
    }

    .success-page .officeTime {
    	font-size: 16px;
    	line-height: 1.8;
    	padding-left: 20px;
    }

    ..success-page officeDirection .btn {
    	margin: 7px 14px 12px;
    	width: calc(100% - 28px);
    	background: linear-gradient(to bottom, rgba(0, 167, 255, 1) 0%,
    			rgba(73, 144, 255, 1) 100%);
    	border: 0;
    	padding: 10px 0;
    }

    .success-page .officeDirection iframe {
    	border: 0;
    	border-radius: 6px 6px 0 0;
    	box-shadow: 0px 0px 3px rgb(0 0 0/ 10%);
    }

    .success-page .appointment-con-info {
    	padding-left: 20px;
    }

    .success-page .custom-select {
    	background: url(../images/down_arrow.svg);
    	background-repeat: no-repeat;
    	background-position: right 14px top 14px;
    	background-size: 13px;
    }

    .success-page footer {
    	background: #696969;
    	padding: 14px 0;
    	color: #fff;
    	font-size: 16px;
    	margin-top: 47px;
    	font-weight: bold;
    }

    .success-page footer .container {
    	display: flex;
    	justify-content: space-between;
    	align-items: center;
    }

    .success-page footer p {
    	color: #fff;
    	font-size: 16px;
    	margin: 0;
    }


    .success-page .patReview .rateit-font {
    	font-size: 20px;
    	margin: 0 4px 0 0;
    }

    .success-page .form-heading-title {
    	font-size: 22px;
    	color: #333;
    	font-weight: bold;
    	margin: 8px 0 24px 0;
    }

    .success-page .new-appointment-request label {
    	font-size: 12px;
    	margin-bottom: 3px;
    }

    .success-page .new-appointment-request .form-control {
    	height: 40px;
    	border: 1px solid rgba(1, 1, 56, 0.1);
    	font-size: 16px;
    }

    .success-page .new-appointment-request .form-button {
    	text-align: right;
    	display: block;
    	padding: 22px 17px;
    }

    .success-page .new-appointment-request .form-button button {
    	background: linear-gradient(to bottom, rgba(0, 167, 255, 1) 0%,
    			rgba(73, 144, 255, 1) 100%);
    	border: 1px solid rgba(73, 144, 255, 1);
    	color: #fff;
    	height: 42px;
    	padding: 0px 60px;
    }

    .success-page .new-appointment-request .form-group {
    	margin-bottom: 24px;
    }

    .success-page .form-field {
    	position: relative;
    }

    .success-page .new-appointment-request .form-field .form-icon {
    	position: absolute;
    	right: 12px;
    	top: 12px;
    }

    .success-page .textIcons {
    	align-items: center;
    }

    .success-page .new-client-logo {
    	max-width: 60px;
    	max-height: 60px;
    	object-fit: contain;
    	margin-right: 10px;
    }

    .success-page .new-appointment-request .form-error {
    	color: red;
    	font-size: 12px;
    	margin-top: 8px;
    	display: block;
    }

    .success-page .form-heading-title {
    	font-size: 18px;
    }

    .success-page .new-appointment-request textarea {
    	width: 100%;
    	height: 131px !important;
    	resize: none;
    }

    .success-page .new-appointment-request .info-text {
    	margin-top: 10px;
    	font-size: 13px;
    }

    @media (max-width : 1024px) {
    	.success-page .container {
    		max-width: 90%;
    	}

    	.success-page .logo h1 {
    		font-size: 24px;
    		padding-bottom: 4px;
    		margin-bottom: 4px;
    	}
    }

    @media (min-width : 1200px) {
    	.success-page .container {
    		max-width: 1200px;
    		width: 100%;
    	}
    }

    @media only screen and (max-width: 767px) {
    	.success-page .container {
    		padding: 0;
    		max-width: 100%;
    	}

    	.success-page .new-appointment-request textarea {
    		height: 110px !important
    	}

    	.success-page .new-appointment-request .form-button {
    		text-align: center;
    	}

    	.success-page .logo {
    		margin: 0 10px;
    	}

    	.success-page header {
    		margin: 0px 0 10px;
    		border-radius: 0;
    	}

    	.success-page .cBanner {
    		;
    		display: none;
    	}

    	.success-page .logo h1 {
    		font-size: 24px;
    		border: 0;
    		margin: 0;
    		padding: 19px 0;
    		white-space: normal;
    	}

    	.success-page .logo img {
    		max-height: 80px;
    		max-width: 80px;
    	}

    	.success-page .success-page-logo h1 {
    		font-size: 16px;
    	}

    	.success-page .patReview .btnCustom {
    		margin-top: 0;
    	}

    	.success-page .btnCustom {
    		margin-left: 0;
    		margin-top: 10px;
    		font-size: 14px;
    		font-weight: normal;
    	}

    	.success-page .logo h2 {
    		font-size: 20px;
    		display: none;
    	}

    	.success-page .dentalGroupCont {
    		border-radius: 0;
    	}

    	.success-page .officeReviewFeedback {
    		margin-right: 0;
    	}

    	.success-page .officeReviewLocation {
    		max-width: 100%;
    		flex-basis: 100%;
    	}

    	.success-page .officeReviewFeedback {
    		order: 1;
    	}

    	.success-page .new-appointment-request textarea {
    		min-width: auto;
    	}

    	.success-page .officeReviewCont {
    		flex-wrap: wrap;
    	}

    	.success-page .appointment-request-wrapper {
    		padding: 86px 0;
    	}

    	.success-page .appointment-success-msg p {
    		font-size: 14px;
    		line-height: 20px;
    	}

    	.success-page .appointment-success-msg h2 {
    		margin-bottom: 12px;
    	}

    	.success-page footer {
    		margin-top: 18px;
    	}

    	.success-page footer .container {
    		justify-content: center;
    		flex-wrap: wrap;
    	}

    	.success-page .copyRightTxt {
    		font-size: 12px;
    		text-align: center;
    		margin-bottom: 12px;
    		padding: 0 34px;
    	}

    	.success-page footer p {
    		font-size: 14px;
    	}

    	.success-page .officeHoursSec {
    		margin: 5px 0 20px;
    	}

    	.success-page .dropdown-section {
    		display: none;
    	}

    	.success-page .office-logo-sec {
    		background: url(../images/down_arrow.svg);
    		background-repeat: no-repeat;
    		background-position: right 20px top 24px;
    		background-size: 16px;
    	}

    	.success-page .office-logo-sec.menu-down {
    		background: url(../images/up_arrow.svg);
    		background-repeat: no-repeat;
    		background-position: right 20px top 24px;
    		background-size: 16px;
    	}
    }

    .office-details-header {
    	margin: 0 auto;
    	padding-bottom: 5px;
    }

    footer {
    	text-align: center;
    	padding: 40px 20px 20px;
    	font-size: 16px;
    	background: transparent;
    	color: #333;
    	display: flex;
    	flex-direction: column;
    	gap: 5px;
    }

    .footer-text-office-name {
    	font-size: 16px;
    	color: #0C3178;
    	padding-bottom: 10px;
    	font-weight: 700;
    }

    .footer-logo img {
    	width: 100px;
    }