@charset "utf-8";
/* CSS Document */

body{
	font-family: 'Roboto', sans-serif;
	background-color: #F6F2EB;
}


.header{
	background-color: #F6F2EB;
	padding: 20px 150px;
}

.header-icon{
	float: right;
	padding: 20px 0;
	
}

.header-icon a{
	padding: 0 12px;
}


.navbar{
	background-color: #13473A;
	filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.39));
	
}

.navbar-list{
	display: flex;
	justify-content:center;
    align-items:center;
	list-style-type: none;
	margin: 0 auto;
	padding: 0 150px;
	overflow: hidden;
	
}

.navbar-list li{
	float: none;
	text-align: center;

}

.navbar-list li a{
	display: block;
	text-align: center;
	padding: 22px 44px;
	text-decoration: none;
	font-size: 19px;
	color: #FFFEFC;
	font-weight: 500;
	letter-spacing: 1.2px;
}

.navbar-list li a:hover{
	background-color: #609966;
	color: white;
}

.navbar-list li a:hover {
  transition-duration: 0.4s;

}


.hero-section{
	background-image: url('images/hero image.png');
	background-repeat: no-repeat;
	background-size: 100% auto;
	padding: 64px 0px 570px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.hero-section h1{
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.78px;
	text-transform: capitalize;
	color: #13473A;
}
.subhead {
	color: #13473A;
	text-align: center;
	font-size: 20px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 0.4px;
	margin-top: -5px;
}

.green-button{
	border-radius: 9px;
	background-color: #13473A;
	color: #FCD961;
	padding: 13px 18px;
	display: inline-block;
	font-weight:600;
	font-size: 18px;
	letter-spacing: 1px;
	margin-top: 30px;
	
}

.green-button {
  transition-duration: 0.4s;
}

.green-button:hover {
  background-color: #609966;
  color: white;
}

.about-us-background{
	background-color: white;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
}

.about-us{
	display: inline-flex;
	padding: 76px 76px 105px 76px;
	width: 60%;
	margin: 140px auto;
	border-radius: 20px;
	background: #E0EBE1;
	
	display: flex;
	width: 937px;
	align-items: center;
	gap: 85px;

}

.about-us-left{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
}

.about-us-left h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.about-us-left p{
	color: #585858;
	font-size: 18px;
	letter-spacing: 0.4px;
	margin-top: -30px
}

.yellow-button{
	border-radius: 9px;
	background-color: #FCD961;
	color: #13473A;
	padding: 13px 18px;
	display: inline-block;
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 0.9px;
	
}

.yellow-button {
  transition-duration: 0.4s;
}

.yellow-button:hover {
  background-color: #609966;
  color: white;
}

.blog{
	display: flex;
	width: 80%;
	margin: 120px auto;
	flex-direction: column;
	align-items: center;
	gap: 50px; 
}

.blog h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.blog-horizontal{
	display: flex;
	align-items: center;
	align-self: stretch;
	border-radius: 15px;
	background: #FFFEFC;
}

.blog-horizontal img{
	flex: 1 0 0;
	border-radius: 15px;
	object-fit: cover;
	align-self: stretch;
}

.blog-horizontal-right{
	display: flex;
	padding: 50px;
	flex-direction: column;
	align-items: flex-start;
	flex: 1 0 0;
}

.blog-horizontal-right h3{
	align-self: stretch;
	color: #13473A;
	font-size: 25px;
	font-weight: 600;
	letter-spacing: 1.3px;
	text-transform: capitalize;
}

.blog-horizontal-right p{
	align-self: stretch;
	color: #585858;
	line-height: 140.5%; /* 22.48px */
	letter-spacing: 0.48px;
	margin-bottom: 30px;
}

.underline-button{
	color: #13473A;
	font-weight: 700;
	letter-spacing: 0.8px;
	text-decoration-line: underline;
	text-transform: uppercase;
	padding-top: 10px;
}

.underline-button:hover{
	color:#609966
}

.underline-button {
  transition-duration: 0.4s;
}

.three-column{
	display: flex;
	align-items: flex-start;
	gap: 20px;
	align-self: stretch;
	
}

.column{
	display: flex;
	padding: 30px 30px 45px 30px;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	flex: 1 0 0;
	border-radius: 15px;
	background: #FFF;
}


.column img{
	flex: 1 0 0;
	align-self: stretch;
	object-fit: cover;
	border-radius: 11px;
}

.review-section h2{
	align-self: center;
	text-align: center;
}

.column h2{
	height: 60px;
	flex-shrink: 0;
	align-self: stretch;
	color: #13473A;
	font-size: 25px;
	font-weight: 600;
	letter-spacing: 1.1px;
	text-transform: capitalize;
}

.column p{
	align-self: stretch;
	color: #585858;
	font-size: 16px;
	font-weight: 400;
	line-height: 140.5%; /* 22.48px */
	letter-spacing: 0.48px;
}

.subscribe-section{
	display: flex;
	padding: 85px 115px;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	border-radius: 20px;
	background: #13473A;
	margin: 150px auto;
	width: 60%;
}

.subscribe-section h1{
	color: #FFFEFC;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.subscribe-section p{
	color: #FFFEFC;
	text-align: center;
	font-size: 22px;
	font-weight: 500;
	line-height: 140.5%; /* 30.91px */
	letter-spacing: 0.66px;
}


.textbox{
	background: #386358;
	width: 400px;
	display: flex;
	justify-content:center;
    align-items:center;
	height: 45px;
	border-radius: 9px;
}

#email{
	width: 70%;
	font-weight: 300;
	color:#848484;
}

#email p{
	color: rgba(255, 254, 252, 0.60);
	text-align: left;
	padding: 25px;
	font-size: 17px;
}

#subscribe{
	width: 30%;
	height: 28px;
	
	padding: 8px 8px;
	background-color: #FCD961;
	display: inline-block;
	text-align: center;
	border-radius: 9px;
	
	display: flex;
	justify-content:center;
    align-items:center;
	
}

#subscribe a{
	color: #13473A;
	font-family: Roboto;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.6px;
	text-transform: capitalize;
	text-decoration: none;
	
}

.footer-section-top{
	display: inline-flex;
	padding: 100px 150px;
	align-items: flex-start;
	gap: 150px;
	background: #13473A;
}

.footer-left{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 62px;
}

.social-icon{
	display: flex;
	width: 247px;
	justify-content: space-between;
	align-items: center;
}

.footer-middle{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	width: 300px;
	line-height: 25px;
}

.footer-middle h3{
	color: #FFFEFC;
	font-size: 25px;
	font-weight: 600;
	letter-spacing: 1.25px;
}

.footer-middle a{
	color: #FFFEFC;
	font-size: 17px;
	font-style: normal;
	letter-spacing: 0.51px;
	text-decoration: none;
}


.footer-right{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
}

.footer-right-row{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	align-self: stretch;
}

.footer-right-row h3{
	color: #FFFEFC;
	font-size: 25px;
	font-weight: 600;
	letter-spacing: 1.25px;

}

.footer-right-row p{
	color: #FFFEFC;
	font-weight: 400;
	line-height: 127%; /* 20.32px */
	letter-spacing: 0.48px;
	
}

.footer-bottom{
	display: flex;
	padding: 24px;
	justify-content: center;
	align-items: center;
	gap: 4px;
	align-self: stretch;
}

.footer-bottom p{
	color: #13473A;
	text-align: center;
	font-family: Roboto;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 140.5%; /* 23.885px */
	letter-spacing: 0.51px;
	text-decoration: none;
}

.footer-bottom p a {
	color: #13473A;
	text-align: center;
	font-family: Roboto;
	font-size: 17px;
	font-style: normal;
	font-weight: 400;
	line-height: 140.5%; /* 23.885px */
	letter-spacing: 0.51px;
	text-decoration: none;
}

.request-section{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	width: 60%;
	margin: 50px auto;
}

.request-text{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.request-text h1{
	color: #13473A;
	text-align: center;
	font-family: Playfair Display;
	font-size: 59px;
	font-weight: 700;
	letter-spacing: 2.36px;
	text-transform: capitalize;
}

.request-text p{
	color: #585858;
	text-align: center;
	font-size: 20px;
	font-weight: 400;
	line-height: 140.5%; /* 28.1px */
	letter-spacing: 0.6px;
	margin-top: -15px;
}

.request-form{
	display: flex;
flex-direction: column;
align-items: flex-start;
gap: 20px;
width: 100%;
}

.form-row{
	display: flex;
align-items: flex-start;
gap: 20px;
align-self: stretch;
	width: 100%;
}

.form-field{
	display: flex;
	padding: 4px 30px;
	align-items: center;
	flex: 1 0 0;
	border-radius: 14px;
	border: 2px solid #13473A;
	width: 100%;
}

.form-field p{
	color: rgba(138, 138, 138, 0.97);
	text-align: center;
	font-size: 19px;
	font-weight: 400;
	letter-spacing: -0.19px;
	text-transform: capitalize;
}

.map-section{
	display: inline-flex;
flex-direction: column;
align-items: center;
	width: 100%;
	margin-top: 50px
}

.map-section h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}


.contact-three-column{
	display: flex;
	align-items: flex-start;
	background-color: #E0EBE1;
	padding: 50px 10%;
	margin: 0px auto;
}

.contact-three-column .column{
	background-color: #E0EBE1;
	padding: 0px;
	padding-left: 20px;
	width: auto;
	display: inline-block;
}

.contact-three-column .column p{
	color: #585858;
	font-family: Roboto;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 163.5%; /* 29.43px */
	letter-spacing: 0.54px;
	width: auto;
}

.contact-three-column .column h2{
	color: #13473A;
	font-family: Roboto;
	font-size: 25px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	letter-spacing: 1.25px;
	text-transform: capitalize;
}

.contact-three-column .column ul{
	padding-inline-start: 0px
}


.search-bar {
	display: flex;
	align-items: center;
	gap: 43px;
	width: 80%;
	margin: 100px auto;
}

#search-button {
	margin-top: auto;
}


.blog-header{
	display: inline-flex;
	align-items: center;
	gap: 15px;
}

.blog-header h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 45px;
	font-weight: 700;
	letter-spacing: 2.25px;
	text-transform: capitalize;
}

.recent{
	width: 80%;
	margin: 100px auto;
}

.popular{
	width: 80%;
	margin: 100px auto;
}

.review-section{
	background: #E0EBE1;
	padding: 50px 10%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.review-section h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.review-section h2{
	color: #13473A;
	font-size: 21px;
	letter-spacing: 0.8px;
	
	
	
}


.review-section .column{
	background: #E0EBE1;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.review-section .column p{
	color: #585858;
	text-align: center;
	font-family: Roboto;
	font-size: 19px;
	font-style: normal;
	font-weight: 400;
	line-height: 140.5%; /* 26.695px */
	letter-spacing: 0.57px;
}

.review-section .column img{
	align-self: auto;
}

.aboutus-section{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 70px 0px 90px;
}

.aboutus-section-left{
	display: flex;
	width: 658px;
	flex-direction: column;
	align-items: flex-start;
	padding-left: 10%;
	padding-right: 5%;
}

.aboutus-section h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-weight: 700;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.aboutus-section p{
	color: #585858;
	font-family: Roboto;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 25.65px */
	letter-spacing: 0.54px;
}

.team-section{

	background-color: white;
	padding: 60px 10%;
	margin: auto;
}

.team-section h2{
	color: #13473A
	
}


.four-column{
	display: flex;
	align-items: flex-start;
	gap: 20px;
	align-self: stretch;
	margin-top: 50px;
	margin-bottom: 80px;
}

.four-column .column{
	border-radius: 15px;
	border: 1px solid rgba(0, 0, 0, 0.20);
	background: #F6F2EB;
	
	display: flex;
	padding: 50px 24px;
	flex-direction: column;
	align-items: center;
	flex: 1 0 0;
}

.four-column .column p{
	color: #585858;
	text-align: center;
	font-family: Roboto;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 141.5%; /* 22.64px */
	letter-spacing: 0.48px;
}

.four-column .column img{
	margin: 0px auto;
}

#success-stories p {
	color: #FFFEFC;
	text-align: center;
	font-family: Roboto;
	font-size: 19px;
	font-style: normal;
	font-weight: 400;
	line-height: 150.5%; /* 28.595px */
	letter-spacing: 0.57px;
}

.what-section{
	display: flex;
	width: 80%;
	padding: 65px 10% 120px;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	background: #E0EBE1;
}

.what-content{
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-self: stretch;
}

.what-section h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.what-content p{
	color: #585858;
	font-family: Roboto;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 25.65px */
	letter-spacing: 0.54px;
	width: 50%;
	padding-right: 5%;
}

.what-buttons{
	display: flex;
	align-items: flex-end;
	gap: 20px;
}

.what-buttons div{
	width: 100px;
	display: flex;
	padding: 14px 21px;
	justify-content: center;
	align-items: center;
}

.what-buttons a {
  text-decoration: none; /* Remove underline from anchor elements */
}

#quiz{
	border-radius: 9px;
	border: 3px solid #13473A;
	padding: 12px 19px;
	background: #E0EBE1;
	color: #13473A;
	text-decoration: none;
	transition-duration: 0.4s;
}

#quiz:hover{
	background-color:#609966;
	color:white;
}

.sign-section{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 80%;
	margin: 70px auto;
}

.sign-section h1{
	color: #13473A;
	text-align: center;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.symptom-group{
	display: flex;
	padding: 66px 75px;
	flex-direction: column;
	align-items: flex-start;
	gap: 58px;
	border-radius: 20px;
	background: #13473A;
	width: 89%;
	margin-bottom: 60px;
}

.symptom-row {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	gap:5%
}

.symptom-item{
	display: flex;
	padding: 45px 49px;
	justify-content: center;
	align-items: center;
	border-radius: 13px;
	background: #E0EBE1;
	width: 20%;
	height: 75px;
	
}

.symptom-item h2{
	color: #13473A;
text-align: center;
font-family: Roboto;
font-size: 27px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 1.25px;
text-transform: capitalize;
}

.type-section{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 80%;
	margin: 100px auto 140px;
}

.type-section h1{
	color: #13473A;
	text-align: center;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.type-section .three-column{
	width: 100%;
	justify-content: space-evenly;
}

.type-section .column{
	width: 30%;
}

.type-section h2{
	color: #13473A;
	font-family: Roboto;
	font-size: 25px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 1.25px;
	text-transform: capitalize;
}

.treatment{
	display: flex;
	width: 70%;
	padding: 90px 15% 110px;
	flex-direction: column;
	align-items: center;
	gap: 35px;
	background: #E0EBE1;
}

.treatment h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;
}

.treatment p{
	color: #585858;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 28.5px */
	letter-spacing: 0.6px;
	margin-top: -30px;
}

.treatment li{
	color: #585858;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 28.5px */
	letter-spacing: 0.6px;
}

.treatment h2{
	color: #13473A;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 0.6px;
	text-transform: capitalize;
	margin-bottom: -15px;
}

.counseling-section{
	display: flex;
	width: 80%;
	margin: 0px auto;
	padding-top: 100px;
	flex-direction: column;
	align-items: center;
	gap: 30px;

}

.counseling-section h1{
	color: #13473A;
	text-align: center;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.95px;
	text-transform: capitalize;	
}

.counseling-section p{
	color: #585858;
	font-family: Roboto;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 28.5px */
	letter-spacing: 0.6px;
	margin-top: 0px;
}

.counseling-content{
	display: flex;
	align-items: flex-start;
	gap: 60px;
	align-self: stretch;
}

.counseling-text{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	flex: 1 0 0;
}

#counseling-button{
	margin-top: 10px;
}

#medication-section{
	padding-bottom: 140px;
}

#medication-button{
	margin-top: 10px;
	
}

.anxiety-accordian{
	width: 80%;
	margin: 70px auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 35px;
}

.anxiety-accordian h1{
	color: #13473A;
	font-family: Playfair Display;
	font-size: 59px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 2.78px;
	text-transform: capitalize;
}


.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 20px 40px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
	background: #13473A;
	
	color: #FFFEFC;
	font-family: Roboto;
	font-size: 23px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	letter-spacing: 1.2px;
	text-transform: capitalize;
	
	
	
}

.accordion 

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #609966;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 0px 40px;
  background-color: #E0EBE1;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel p{
	color: #585858;
	font-family: Roboto;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 25.65px */
	letter-spacing: 0.54px;
}

.panel li{
	color: #585858;
	font-family: Roboto;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 142.5%; /* 25.65px */
	letter-spacing: 0.54px;
}

.panel-group{
	width: 100%;
}


.accordion:after {
  content: '\002B'; /* Unicode character for "plus" sign (+) */
  font-size: 27px;
  color: #FFFEFC;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\002D"; /* Unicode character for "minus" sign (-) */
}


@media (max-width:390px) {
	.header{
	padding: 10px;
	}
	
	.header img{
		width: 200px;
		height: auto;
	}
	
	.header-icon{
		display: none;
	}
	
	.navbar-list{
		flex-direction: column;
		justify-content:center;
		padding: 0;
		margin: 0 auto;
	}
	
	.navbar-list li a{
		display: block;
		text-align: center;
		padding: 10px 29px;
		text-decoration: none;
		font-size: 16px;
	}
	
	h1 {
		font-size: 36px !important;
		letter-spacing: 1.4px !important;
	}
	
	p{
		font-size: 16px !important;
	}
	
	.hero-section{
	background-image: url('images/hero image.png');
	background-repeat: no-repeat;
	background-size: 300% auto;
	background-position: center;
	padding: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	}
	
	.about-us{
		margin: 0 auto;
		border-radius: 0px;
		padding: 15px 20px;
		display: block;
		width: 375px;
	}
	
	.about-us-left{
		width: 300px;
		margin-bottom: 40px;
		padding-right: 0px;
	}
	
	.anxiety-accordian{
		width: 95%;
		gap: 5px;
	}
	
	.accordion{
		padding: 10px 15px;
		font-size: 20px;
	}
	
	.panel{
		padding: 0px 15px;
	}
	
	.blog{
		width: 95%;
		gap:20px;
	}
	
	.blog-horizontal{
		display: block;
	}
	
	.blog-horizontal img{
		width: 100%;
		height: 300px;
	}
	
	.blog-horizontal-right{
		padding: 20px;
	}
	
	
	.three-column{
		display: block;
	}
	
	.column{
		margin-bottom: 20px;
	}
	
	.footer-section-top{
		padding: 40px 20px;
		display: block;
		
		
	}
	
	.footer-section-top img{
		width: 25px;
		height: auto;
	}
	
	#footer-logo{
		width: 150px;
		height: auto;
	}
	
	.footer-left{
		gap: 20px;
	}
	
	.footer-middle{
		gap: 10px;
		margin-top: 40px;
	}
	
	.footer-right{
		margin-top: 40px;
		gap: 40px;
	}
	
	.footer-section-top h3{
		margin: 2px 0px;
	}
	
	.textbox{
		width: 100%
	}
	
	.subscribe-section{
		margin: 20px auto;
		width: 300px;
		padding: 40px 20px;
		border-radius: 8px;
	}
	
	.subscribe-section p{
		text-align: left;
	}
	
	.subscribe-section h1{
		margin: 0px;
		font-size: 24px !important;
	}
	
	.aboutus-section img{
		display: none;
	}
	
	.four-column{
		display: block;
	}
	
	.what-section{
		width: 95%;
		padding: 20px;
		
	}
	
	.what-content{
		display: block;
	}
	
	.what-content p{
		width: 300px;
	}
	
	.what-content iframe{
		width: 90%;
	}
	
	.sign-section{
		width: 95%;
	}
	
	.symptom-group{
		padding: 20px;
		gap: 0px;
		margin-bottom: 20px;
	}
	
	.symptom-row{
		display: block;
	}
	
	.symptom-item{
		width: 80%;
		padding: 10px;
		margin: 0px auto;
		margin-bottom: 10px;
	}
	
	.symptom-item h2{
		font-size: 20px;
	}
	
	.type-section{
		width: 95%;
		margin: 30px auto;
		gap: 0px;
	}
	
	.type-section .column{
		width: 270px;
		margin: 20px auto;
	}
	
	.type-section img{
		width: 100%;
	}
	
	.treatment{
		width: 90%;
		padding: 20px;
	}
	
	.counseling-section{
		width: 95%;
	}
	
	.counseling-content{
		display: block;
	}
	
	.counseling-content img{
		width: 330px;
		height: auto;
		margin: 20px 0px;
	}
	
	.counseling-text{
		gap: 0px;
	}
	
	.search-bar{
		margin: 40px auto;
		gap: 15px;
		width: 90%;
	}
	
	.recent{
		width: 90%;
		
	}
	
	.popular{
		width: 90%;
		margin: 50px auto;
	}
	
	.request-section{
		width: 90%;
		gap: 0px;
	}
	
	.form-row{
		display: block;
	}
	
	.form-field{
		margin-bottom: 20px;
	}
	
	.request-form{
		gap: 0px;
	}
	
	.form-field{
		width: 250px;
	}
	
	.contact-three-column{
		display: block;
	}
	
}