/** GLOBAL CSS **/
:root {
    --color-primary: #5ab4c4;
    --color-secondary: #1c2b31;
    --color-tertiary: #1c2b31;
	--background-transparent: transparent;

	--color-text-white: #fff;
	--color-text-dark: #000;
}

*:not(.carousel *):not(.ry-accordion *):not(#accordion *):not([data-aos-duration]):not(.slick-track):not(#ry-section-header *):not(.fancybox-slide *),
::before,
::after {
    transition: 0.3s ease-in-out all;
}
html, body {
	overflow-x: hidden !important;
	font-family: 'Poppins';
}
html {
    scroll-behavior: smooth;
}

/* //Removed excess margin on bottom on forms alert */
.alert li:last-child {
    margin-bottom: 0 !important;
}

/* //Add Underline on all hyperlink */
body.default #ry-pg-body a:not(.ry-btn):not(.fa):hover {
    text-decoration: underline !important;
}
a.full-link  {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    opacity: 0;
}
.ry-btn-wrap {
    margin-top: 1.5rem;
    display: flex;
	gap: 10px;
}
.ry-section-background, .ry-section-background img {
	position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
	object-fit: cover;
}
body .ry-headline h2 {
	font-size: clamp(1.875rem, 1.4767rem + 1.634vw, 3.4375rem)  !important;
	line-height: 1.1;
	text-transform: initial;
	color: var(--color-tertiary) !important;
	font-family: "Josefin Sans";
}
body .ry-headline h2 span {
	color: var(--color-primary) !important;
}
body .ry-headline p {
	font-size: 20px !important;
	letter-spacing: 4px;
	line-height: 1.1;
	text-transform: uppercase;
	color: var(--color-primary);
	font-family: "Josefin Sans" !important;
	margin-bottom: 20px;
}
#ry-carousel-landing .ry-btn {
	background: var(--color-primary) !important;
}
#ry-carousel-landing .ry-btn:hover {
	background: var(--color-tertiary) !important;
}
.ry-headline {
    margin-bottom: 1.5vw;
}
.landing-section {
	padding: 8rem 0;	
}
.ry-container-1280,
.ry-container-1449 {
	width: 90%;
	float: none;
	margin: 0 auto;
}
.ry-container-1280 {
	max-width: 1280px;
}
.ry-container-1449 {
	max-width: 1449px;
}
@media (max-width: 1080px) {
	.ry-btn-wrap {
		justify-content: center;
	}
}
@media (max-width: 560px) {
	.landing-section {
		padding: 4rem 0;
	}
}
/** END GLOBAL CSS **/

/** HERO **/
.ry-hero-headline h1 {
	font-size: clamp(1.875rem, 1.0784rem + 3.268vw, 5rem) !important;
	letter-spacing: 4px;
	color: var(--color-text-white);
	text-transform: capitalize !important;
	font-weight: 500 !important;
	line-height: 1.1 !important;
}
.ry-hero-headline h1 span {
	color: var(--color-primary);
}
.ry-hero-headline p {
	font-size: 20px !important;
	letter-spacing: 4px;
	text-transform: uppercase !important;
	color: var(--color-primary) !important;
	font-weight: 500 !important;
	font-family: "Josefin Sans";
}
#hero {
    background: var(--color-secondary);
}
#hero .ry-text p {
    color: var(--color-text-white);
}
.ry-hero-content {
    display: flex;
    gap: 9rem;
}
.ry-hero-content .ry-each.ry-img-wrap {
    max-width: 640px;
    width: 100%;
}
@media (max-width: 1080px) {
	.ry-hero-content {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 4rem;
	}
	.ry-hero-content .ry-each.ry-text-wrap * {
		text-align: center;
	}
}
@media (max-width: 560px) {
	section#hero {
		padding-top: 8rem;
	}
}

/** WELCOME **/
.ry-welcome-content {
    display: flex;
    gap: 8rem;
}
.ry-welcome-content .ry-each.ry-img-wrap {
    max-width: 640px;
    width: 100%;
}
@media (max-width: 1080px) {
	.ry-welcome-content {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 4rem;
	}
	.ry-welcome-content .ry-each.ry-text-wrap * {
		text-align: center;
	}
}

/** DRY EYE **/
#dry-eye .landing-grid {
    display: grid;
    gap: 35px;
    grid-template-columns: repeat(4, 1fr);
}
#dry-eye .landing-grid .ry-card {
    width: 100%;
    padding: 40px 30px;
    border-top: 6px solid var(--color-primary);
    background: #eef7f9;
}
#dry-eye .landing-grid .ry-card .ry-text h4 {
    font-size: 24px;
    color: var(--color-primary);
}
@media (max-width: 1080px) {
	#dry-eye .landing-grid {
        gap: 15px;
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
	#dry-eye .landing-grid {
        gap: 15px;
        grid-template-columns: repeat(1, 1fr);
    }
}

/** DOCTOR **/
#doctor {
    background: #f4fafb;
}
#doctor .ry-welcome-content {
    align-items: center;
    justify-content: center;
}
#doctor .ry-welcome-content .ry-each.ry-img-wrap {
	max-width: 449px;
}
#doctor .ry-welcome-content .ry-text {
    padding-left: 30px;
    border-left: 4px solid var(--color-primary);
}
.doc-quote h4 {
    color: var(--color-primary);
    font-size: clamp(1.5rem, 1.3088rem + 0.7843vw, 2.25rem) !important;
}
.doc-quote p {
    text-transform: uppercase;
}
.doc-quote {
    margin-top: 40px;
}
@media (max-width: 1080px) {
	#doctor .ry-welcome-content .ry-text {
	    padding-left: 0;
	    border-left: none;
	}
}

/** ADVANCED CARE **/
#advanced-care {
    background: var(--color-tertiary);
}
#advanced-care .ry-headline h2:not(span),
#advanced-care .ry-text p {
    color: #fff !important;
}
.ry-grid-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
	gap: 40px;
    margin-top: 40px;
}
.ry-grid-card .ry-each {
	width: 100%;
	display: flex;
	flex-direction: column;
}
.ry-grid-card .ry-each .ry-content-box {
    padding: 40px 30px;
    background: #2e444d;
	border-top: 4px solid var(--color-primary);
}
.ry-grid-card .ry-each .ry-content-box h4 {
    font-size: 24px;
    color: var(--color-primary);
}
.ry-grid-card .ry-each .ry-content-box p {
    color: #fff;
}
@media (max-width: 1080px) {
	section#advanced-care .ry-headline h2,
	section#advanced-care .ry-headline p,
	section#advanced-care .ry-text p {
		text-align: center
	}
	.ry-grid-card {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
		margin-top: 20px;
	}
}
@media (max-width: 768px) {
	.ry-grid-card {
		grid-template-columns: repeat(1, 1fr);
	}
}

/** LUXURY EYE CARE **/
.ry-gallery-grid {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    gap: 30px;
}
.ry-gallery-grid .ry-each {
    width: 100%;
}
.ry-gallery-grid .ry-each:first-child {
    grid-row: span 2 / span 2;
}
.ry-gallery-grid .ry-each:last-child {
    grid-column-start: 3;
}
.ry-gallery-grid .ry-each .ry-img-wrap, .ry-gallery-grid .ry-each .ry-img-wrap img {
    height: 100%;
	object-fit: cover;
}
@media (max-width: 768px) {
	.ry-gallery-grid .ry-each:first-child {
		grid-row: span 1 / span 1;
	}
	.ry-gallery-grid .ry-each:last-child {
		grid-column-start: 1;
	}
}

/** PATIENT STORIES **/
#patient-stories .ry-grid-card .ry-each {
	width: 100%;
	padding: 40px 30px;
	border-top: 6px solid var(--color-primary);
	background: #eef7f9;
}
#patient-stories .ry-stories-content p span:before {
	color: var(--color-primary);
	font-size: 24px;
	margin-right: 2px
}
#patient-stories .ry-stories-content p strong {
	color: var(--color-primary);
	text-transform: uppercase;
	font-weight: 500 !important
}

/** BOOK CONSULTATION **/
#book-consultation {
    background: var(--color-tertiary);
}
#book-consultation .ry-flex {
    gap: 80px;
}
#book-consultation .ry-headline h2 {
    color: #fff !important;
}
#book-consultation .ry-each.ry-text-wrap .ry-text  {
    margin-bottom: 30px;
}
#book-consultation .ry-each .ry-text.ry-border-bottom {
    padding-bottom: 30px;
    border-bottom: 1px solid #fff;
}
#book-consultation .ry-each.ry-text-wrap .ry-text h4 {
    font-size: clamp(1.375rem, 1.2475rem + 0.5229vw, 1.875rem);
    color: var(--color-primary)
}
#book-consultation .ry-each.ry-text-wrap .ry-text p {
    color: #fff
}
#book-consultation .ry-flex .ry-form {
    background: #fff;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#book-consultation .ry-flex .ry-form input.ry-btn.ry-btn-primary {
    width: 100%;
    max-width: 100%;
}
@media (max-width: 1080px) {
    #book-consultation .ry-flex {
        flex-direction: column;
        gap: 40px;
    }
    #book-consultation .ry-flex .ry-each.ry-text-wrap * {
        text-align: center;
    }
}



