/*@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap");*/
@import url("/css/poppins.css?family=Poppins:wght@200;300;400;500;600;700&display=swap");

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
  --melocolor: rgb(254,80,0); /*this is the pantone 021*/
  --txtcolor: rgb(132, 128, 133);
  --linecolor: rgb(208,233,220);
  --placecolor: rgb(27, 136, 161);
  --fontsize: 1.2rem;
  --fontsizeh3: 1.4rem;
  --melobabes: rgb(193,217,209);
  --melobabes_color:rgb(250,103,194);
  --oncology: rgb(68,117,147);
  --melo24: rgb(244,130,33);
  --orthopaedics: rgb(61,163,164);
  --melohearts: rgb(136,208,200);
  --melominds: rgb(102,99,98);
  --renalcare: rgb(93,137,161);
  --melocares: rgb(255,81,0);
  --header_color:rgb(102, 102, 102);
} 


.avatar_iframe{
	width:100%;
	border:none;
	outline:none;
	height:150vh;
	-moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

iframe{
	position:relative;
	margin-top:0;
	width:100%;
	/*height:700px;*/
	height:calc(100vh - 60px);
	border:none;
    -moz-box-shadow: 0 40px 80px rgba(217, 243, 232, 0.4);
    -webkit-box-shadow: 0 40px 80px rgba(217, 243, 232, 0.4);
    box-shadow: 0 40px 80px rgba(217, 243, 232, 0.4);

}

.h1_trans{
	/*margin:50px 100px 20px 300px;*/
	display:block;
	position:absolute;
	z-index:10;
	top:120px;
	left:0px;
	background-color:rgba(0,0,0,5);

	padding:30px;
	font-size:2rem;
	color:whitesmoke;
	text-transform:uppercase;
	 text-shadow: 0 5px 10px rgba(94, 94, 94, 1);
	mix-blend-mode: overlay;
	font-weight:600;
	width:100%;
}

.input_container{
	display:flex;
	flex-direction:row;
	object-content:center;
	text-align:center;
	justify-content:center;
	position:absolute;
	top:480px;
	left: 0;
	z-index:10;
	width:100%;
	border:0px solid lime;
	flex-wrap: wrap;
	background-color:transparent;
}


.banner_overlay{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	/*height:calc(100vh + 25px);*/
	height:100vh;
	/*background-color:rgba(0, 0, 0, 0.5);*/
background: linear-gradient(to top,  rgba(255,255,255,0) 0%,rgba(0,0,0,.3) 100%);
/*background-color:black;*/
z-index:2;
}

.hospital_img{
	height:100vh;
	width:100%;
	object-fit:cover;
}

.banner_content{
	/*margin:50px 100px 20px 300px;*/
	display:flex;
	flex-direction:row;
	object-content:center;
	text-align:center;
	justify-content:center;
	gap:30px;
	position:absolute;
	top:550px;
	left: 0;

	z-index:10;
	width:100%;
	
	border:0px solid lime;
	flex-wrap: wrap;
}

.banner_header{
	position:absolute;
	top:180px;
	left:10%;
	color:white;
	letter-spacing:4px;
	font-size:2.8rem;
	font-weight:300;
	text-transform:uppercase;
	z-index:3;
}

.banner_header p{
		color:white;
	font-size:1rem;
	font-weight:300;
}


.banner_item{
	background-color:hsla(360, 100%, 100%, 0.15);
	border:1px solid whitesmoke;
	color:white;
	text-transform:uppercase;
	 text-shadow: 0 5px 10px rgba(94, 94, 94, 1);
	 width:300px;
	 height:150px;
	 border-radius:15px;
	 text-align:left;
	 padding:20px;
	 align-content: center;
	 position:relative;
	 transition:2s;

	 backdrop-filter: blur(10px) saturate(1);
}

.banner_txt_container{
	border:0px solid lime;
	display:inline;
	position:absolute;
	right:0;
	top:0;
	height:100%;
	padding:10px 15px;
	width:205px;
}

.banner_btn{
	position:absolute;
	right:10px;
	bottom:10px;
	border:1px solid whitesmoke;
	font-size:0.75rem;
	background-color:hsla(360, 100%, 100%, 0.15);
	color:white;
	backdrop-filter: blur(10px) saturate(1);
	text-decoration:none;
	padding:3px 5px;
	border-radius:15px;
	transition:1s;
}

.banner_btn:hover{
	background-color:var(--melocolor);
	border:none;
	backdrop-filter: blur(10px) saturate(1);
		border:1px solid whitesmoke;
}

.banner_txt{
    display: table-cell;
    vertical-align: middle;
	font-size:1.5rem;
}



.banner_icon{
	width:60px;
	height:60px;
	border:2px solid white;
	border-radius:50%;
	font-size:3rem;
	padding:3px;
	text-align: center;
	transition:1s;
	margin-left:0;
	margin-right:0;
}

.banner_p{
	font-size:0.85rem;
	color:white;
}

.banner_item:hover {
	background-color:hsla(212, 55%, 54%, 0.22);
	cursor:pointer;
}
.banner_icon:hover{transform: rotate(360deg);cursor:pointer;}










.emergency_container{
	position:absolute;
	top:20px;
	right:10px;
	display:flex;
	flex-direction:row;
	align-items: flex-start;
	justify-content: flex-start;
	gap:10px;
	width:300px;
	border:0px solid lime;
}

.emergency_tel{
	width:40px;
	height:40px;
	border:3px solid white;
	border-radius:50%;
	font-size:1.8rem;
	padding:0px 0 0px 3px;
}

.emergency_nr{
	font-size:1rem;
	text-transform:uppercase;
	width:200px;
}



/*
.logo{
	margin:50px 100px 20px 300px;
	position:absolute;
	width:250px;
	z-index:1;
	top:475px;
	left:80px;
}*/


.srch_container{
	position: relative;
	background-color:transparent;
	width:500px;
	height:3.3rem;
}

 .search_btn{
	position:absolute;
	right:5px;	
	top:4px;
	background-color:white;
	outline:none;
	border:1px solid lightgrey;
	border-radius:50%;
	width:2.5rem;
	height:2.5rem;
	z-index:15;
	cursor:pointer;
	transition:1s;
}

.search_btn:hover{
	color:white;
	background-color:rgb(236,229,220);
}


.input_search {
  width: 500px;
  height: 3rem;
  background: none;
  outline: none;
  border: 2px solid lightgrey;
  padding-left: 20px;
  font-size: 1.2rem;
  color: black;
  transition: 0.4s;
  border-radius: 25px;
  backdrop-filter: blur(10px) saturate(1);
	position:relative;
}
.input_search:focus{
	border-bottom:1px solid orangered;
}

.input_search_label{
		position:absolute;
		top:-30px;
		left:0;
		font-size:1rem;
		padding-left:15px;
}


.search_icon{
	font-size:1.6rem;
	color:lightgrey;
	transition:1s;
}
.search_icon:hover{
	color:white;
}



.beelogo{
	width:120px;
	filter: invert(100%);
}

.values{
	width:60%;
}

.yt_frame{
	border-radius:20px;
	width:50%;
}

.grid-container{
	display:grid;
	grid-template-columns: repeat(8, 1fr);
	/*grid-template-columns:repeat(auto-fit, minmax(8, 1fr));*/
	width: 100%;
	background-color: white;
	gap: 60px;
}

.grid-item1{
	background-color: white;

}

.grid-item-span3{
	grid-column: span 3;
	background:transparent;
	position:relative;

}

.grid-item-box{

	width:100%;
	background-color:grey;
	/*background-color:whitesmoke;*/
	border-radius:15px;
	padding:10px;
	color:white;
	font-size:2rem;
	object-fit:center;
	margin:auto;
}



.img_overlay{
border-image: linear-gradient(hsl(240 100% 20% / .6), hsl(0 100% 20% / .1)) fill 1;	
}

.grid-item-span6{
	grid-column: span 6;
	background:white;
}

.grid-item-span8{
	grid-column: span 8;
	position:relative;
	object-fit:center;
	text-align:center;
}



.grid-item-gradient{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	 background-image: linear-gradient(45deg, #d65db1,#ff6f91,#ff9671,#ffc75f,#f9f871);
	 background-size:300%;
	 height:500px;
	animation: bg-animation 5s infinite alternate;
	clip-path: polygon(0 0, 100% 0, 100% 30%, 0% 100%);
}

@keyframes bg-animation {
	0% {background-position:left}
	100% {background-position:right;}
}


.maincolor{
	color:var(--melocolor);
}

h1{
	color:white;
	letter-spacing:4px;
	font-size:2rem;
	font-weight:400;
	text-transform:uppercase;
	
}

h2{
	font-size:1.8rem;
	color:var(--header_color);
	text-transform:uppercase;
	letter-spacing:2px;
	text-align:center;
	font-weight:300;
}

.h2_left{
	font-size:1.8rem;
	color:var(--header_color);
	text-transform:uppercase;
	letter-spacing:2px;
	text-align:left;
	font-weight:300;
}

h3{
	font-size:1.6rem;
	color:var(--header_color);
	text-transform:uppercase;
}

p{
	color:var(--txtcolor);
	font-size:1rem;
	text-align: justify;
	font-weight:300;
}

.txtcolor{
	color:rgb(132, 128, 133);
	font-size:1.3rem;
	text-align: justify;
	font-weight:200;
  font-family: "Poppins", sans-serif;
}

.blackcolor{
	color:black;
}




.scrreveal{
	color:black;
	font-size:1.2rem;
	text-align: justify;
}

.scrreveal{
	animation: ScrollReveal ease-in-out both;
	animation-timeline: view();
	animation-range: entry 0 cover 80%;
}

@keyframes ScrollReveal{
	from{
		opacity: 1;
		transform: translate(100px);
	}
	to {
		opacity: 1;
		transform: translate(0);
	}
}


.images-container {
	display: inline-block;
	border: none;
	overflow: hidden;            /* clip the excess when child gets bigger than parent */
	border-radius:20px;
	animation: imageReveal ease-in-out both;
	animation-timeline: view();
	animation-range: entry 0 cover 50%;
	animation-direction: reverse;
}


.box{
  width:100%;
}

@keyframes imageReveal{
	from{
		transform: translate(0);
	}
	to {
		transform: translate(-100px);
	}
}

.images {
  object-fit: cover;
  width:100%;
  height:500px;
  border-radius:10px;
  transition: transform .4s;
  	box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.25); 
}

.images:hover {
  /*transform: scale(1.6);
  transform-origin: 50% 50%;*/
  cursor:pointer;
}




.melomag_container{
	  width: 100%;
	  position:relative;
}
.melomag{
	  width: 100%;
	  border-radius:15px;
	  position:relative;
}

.melo24{
	position:absolute;
	top:10px;
	left:10px;
	width:80px;
}

.careerbtn{
	position:absolute;
	bottom:30px;
	right:10px;
	text-decoration:none;
	background-color:var(--melocolor);
	font-size:1rem;
	color:white;
	width:200px;
	padding: 0.5rem 1rem;
	border-radius:10px;
	text-align:center;
}

.careerbtn:hover{
	transition-duration: 1s;
	background-color:orange;
	border-radius:20px;
	cursor:pointer;
}




.melobtn{
	text-decoration:none;
	border-radius:10px;
	background-color: var(--melocolor);
	padding:10px 6px;
	color:white;
}

.melobtn:hover{
	transition-duration: 1s;
	background-color: orange;
	border-radius:20px;
	cursor:pointer;
}

.testimonials-section {
  background: white;
  height: 600px;
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;

/*
  -webkit-box-shadow: 0 4px 8px 0 rgba(128, 126, 126, 0.2), 0 6px 20px 0 rgba(109, 108, 108, 0.19);
  -moz-box-shadow: 0 4px 8px 0 rgba(128, 126, 126, 0.2), 0 6px 20px 0 rgba(109, 108, 108, 0.19); 
 box-shadow: 0 4px 8px 0 rgba(128, 126, 126, 0.2), 0 6px 20px 0 rgba(109, 108, 108, 0.19);

*/
}
.slider__nav {
  width: 22px;
  height: 22px;
  border-radius:50%;
  margin: 60px 12px;
  border-radius: 50%;
  z-index: 10;
  outline: 6px solid var(--melocolor);
  outline-offset: -6px;
  box-shadow: 0 0 0 0 red, 0 0 0 0 var(--melocolor);
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  
}
.slider__nav:checked {
  -webkit-animation: check 0.4s linear forwards;
  animation: check 0.4s linear forwards;
}
.slider__nav:checked:nth-of-type(1) ~ .slider__inner {
  left: 0%;
}
.slider__nav:checked:nth-of-type(2) ~ .slider__inner {
  left: -100%;
}
.slider__nav:checked:nth-of-type(3) ~ .slider__inner {
  left: -200%;
}
.slider__nav:checked:nth-of-type(4) ~ .slider__inner {
  left: -300%;
}
.slider__nav:checked:nth-of-type(5) ~ .slider__inner {
  left: -400%;
}
.slider__inner {
  position: absolute;
  top: 80px;
  left: 0;
  width: 500%;
  height: auto;
  -webkit-transition: left 0.4s;
  transition: left 0.4s;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
}
.slider__contents {
  height: 100%;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-flex-flow: column nowrap;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.slider__caption {
  font-size: 14px;
  color: #111;
  opacity: .5;
  font-family: 'Roboto';
  font-weight: bold;
}


.slider__txt {
  font-size: 1.2rem;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  line-height: 1.7;
  color: #111;
  margin-top: -30px;
  margin-bottom: 20px;
  max-width: 750px;
 
}

quote {
  font-family: 'Arial';
  font-weight: bold;
  font-size: 100px;
  color: var(--melocolor);
  margin-bottom: 0;
}

@-webkit-keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 0 12px #333, 0 0 0 36px rgba(51, 51, 51, 0.2);
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0 0 #333, 0 0 0 0 rgba(51, 51, 51, 0);
  }
}

@keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 0 12px #333, 0 0 0 36px rgba(51, 51, 51, 0.2);
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0 0 #333, 0 0 0 0 rgba(51, 51, 51, 0);
  }
}


/*footer*/

.footer_container{
	display:grid;
	grid-template-columns: repeat(6, 1fr);
	max-width: 100%;
	gap: 10px;
	background: grey;
	padding-left:100px;
	padding-right:100px;
	text-align:left;
}

.footer_item{
	background-color:transparent;
	color:white;
	padding:30px 15px;
	width:100%;
}

.footer_item_span2{
	grid-column: span 2;
	padding:5px;

}

.footer_item_span3{
	grid-column: span 3;
	padding:5px;
	
}

.footer_item_span4{
	grid-column: span 4;
	padding:5px;
		
}

.footer_item_span6{
	grid-column: span 6;
	padding:10px;

}

.footer_logo{	
	margin:60px;
	width:150px;
	filter: drop-shadow(0 8px 5px white);	
}


.footer_logo:hover{ 
    animation: shake 1s;
  animation-iteration-count: infinite;
  cursor:pointer;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-2deg); }
  20% { transform: translate(-3px, 0px) rotate(2deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(2deg); }
  50% { transform: translate(-1px, 2px) rotate(-2deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-2deg); }
  80% { transform: translate(-1px, -1px) rotate(2deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-2deg); }
}

.footer_header{
	font-size:0.95rem;
	line-height:2;
}

.footer_menu a{
font-family: "Poppins", sans-serif;
color: white;
text-decoration:none;
font-size: 0.85rem;
}

.footer_menu a:hover{
color:	#e6e6e6;
}

.footer_icons{
	width:50px;
	height:50px;
	border:2px solid white;
	border-radius:50%;
	font-size:2rem;
	padding:6px 0;
	text-align: center;
	transition:1s;
	margin:0 10px;
	
}

.footer_icons:hover{
	 animation: shake 1s;
	animation-iteration-count: infinite;
	scale:1.2;
	transition:500ms;
	color: var(--melocolor);
	cursor:pointer;
	border:2px solid var(--melocolor);

	border-radius:10px;
}

.footer_follow{
	font-size:0.75rem;
	line-height:6; 
	padding-left:10px;
	letter-spacing:10px;
}

.beelogo{
	width:120px;
	filter: invert(100%);
}


.footer_address{
	font-size: 0.85rem;
	line-height:3;
}
/*footer end*/

.main_container{
	display:grid;
	grid-template-columns: repeat(8, 1fr);
	margin:auto;
	width:100%;
	gap:50px;
	
	border:0px solid lime;
}

.main_container_item{
	width:100%;
	background:white;
	text-align:left;
	padding:10px;
/* border:1px solid hotpink; */
}

.main_container_item_span2{
	grid-column: span 2;
	width:100%;
	background:white;
	padding:10px;
}

.main_container_item_span3{
	grid-column: span 3;
	width:100%;
	background:white;
	padding:10px;
	/* border:1px solid limegreen; */
}

.main_container_item_span4{
	grid-column: span 4;
	width:100%;
	background:white;
	padding:10px;
}

.main_container_item_span6{
	grid-column: span 6;
	width:100%;
	background:white;
	padding:10px;
}

.main_container_item_span8{
	grid-column: span 8;
	width:100%;
	background:transparent;
	padding:0px;
	border:0px solid lime;
}


button.back-to-top{
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
  height: 0px;
  width: 0px;
  overflow: hidden;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  color: transparent;
  clear: both;
  visibility: hidden;
  position: fixed;
  cursor: pointer;
  display: block;
  border: none;
  right: 50px;
  bottom: 75px;
  font-size: 0px;
  outline: 0 !important;
  z-index: 99;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}
button.back-to-top:hover,
button.back-to-top:active,
button.back-to-top:focus{
  outline: 0 !important;

}


button.back-to-top::before,
button.back-to-top::after {
  content: "";
    display: block;
    vertical-align: middle;
    border-bottom: solid 10px #EA5D5F;
    border-left: solid 10px transparent;
    line-height: 0;
    border-right: solid 10px transparent;
    height: 0;
    margin: 18px auto 0;
    width: 0;
	border-radius:20px;
	visibility: hidden;
}
button.back-to-top.show::after,
button.back-to-top.show::before{
  visibility: visible;
}
button.back-to-top::after {
  border-bottom-color:#fff;
      position: relative;
  top:-24px;
}


button.back-to-top.show {
  display: block;
  background: #fff;
  color: #00ab6c;
  font-size: 25px;
  right: 25px;
	bottom: 80px;
  height: 50px;
  width: 50px;
  visibility: visible;
	box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
}
button.back-to-top.show:active {
  box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.25);
}



/*ACCORDIAN HERE*/
.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding:18px 18px 6px 12px;
  width: 100%;
  border: none;
  border-bottom:2px solid whitesmoke;
  text-align: left;
  outline: none;
  font-size: 1rem;
  transition: 0.4s;
  border-radius:7px;
}

.acc_active, .accordion:hover {
  background-color: #ccc;
  
}

.accordion:after {
  content: '\002B';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
  font-size:1.5rem;
    transition: transform 0.4s; /* Add transition property */
}

.accordion:hover:after {
  transform: rotate(180deg); /* Rotate the character on hover */
}

.acc_active:after {
  content: "\2212";
  font-size:1.5rem;
}
.acc_active:hover:after {
  transform: none; /* Reset the transform on hover for the active state */
}

.panel {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel p{
	font-size:1rem;
	line-height:2;
}





/*ACCORDIAN HERE END*/


.pdfdwn{
font-size:1.2rem;
text-decoration:none;
color:black;	
line-height:2;
}

.pdfdwn:hover{
	color:var(--melocolor);
	transition:500ms;
}


/*SPECIAL GRID HERE*/

.lsp_rsp_container{
	display:grid;
	grid-template-columns: repeat(8, 1fr);
	margin:auto;
	width:100%;	
	gap:50px;
}

.lsp_rsp_item{
width:100%;
	
}

.lsp_rsp_item_span4{
	grid-column:span 4;
width:100%;

}

.lsp_rsp_item_span3{
	grid-column:span 3;
width:100%;

}

.lsp_rsp_item_span2{
	grid-column:span 2;
width:385px;
align-content: center;
text-align:center;
}

.lsp_rsp_item_span6{
	grid-column:span 6;
width:100%;

}

.lsp_rsp_item_span8{
	grid-column:span 8;
width:100%;

}

.lsp_container{
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(17, 1fr);
	gap:6px;
	background-color:whitesmoke;
	border:6px solid whitesmoke;
	width:100%;
	height:auto;
	box-shadow: 0px 12px 14px 1px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 0px 12px 14px 1px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0px 12px 14px 1px rgba(0, 0, 0, 0.25);
  
}

.lspitem_span1{
	grid-column: 1 / 2;
	grid-row: 1 / 13;

	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
	
}


.lspitem_span2{
	grid-column: 2;
	grid-row: span 6;
	
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
}

.lspitem_span3{
	grid-column: 3;
	grid-row: span 6;
	
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
}

.lspitem_span4{
	grid-column: 2;
	grid-row: 7 / 13;
height:100%;	
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
}

.lspitem_span5{
	grid-column: 3;
	grid-row: 7 / 18;

	
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
}


.lspitem_span6{
	grid-column: 1 / 3;
	grid-row: 13 / 19;
height:350px;
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	padding:10px;
}

.lsp_overlay{
/*border-image: linear-gradient(hsl(261 100% 0% / .6), hsl(261 100% 0% / .6)) fill 1;	*/
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 50%);
}


.rsp_container{
	display:grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	gap:25px;
	grid-row-gap: 30px;
	background-color:white;
	width:100%;
	box-shadow: 0px 12px 14px 1px steelblue;
	-webkit-box-shadow: 0px 12px 14px 1px steelblue;
	-moz-box-shadow: 0px 12px 14px 1px steelblue;
	padding:0 40px 40px 40px;

}

.rsp_item{
	text-align:center;
	font-size: 1.2em;
	color:whitesmoke;
	font-weight:bold;
	text-shadow: 0 0 3px #FF0000, 0 0 5px black;
	background-color:white;
	border-radius:20px;
	align-content: center;
	height:160px;
	width:298px;
	border:10px solid whitesmoke;


}

.rsp_img{
	width:100%;
	height:95px;
	object-fit:fill;
	border-radius:20px;
	background-color:white;	
}




/*SPECIAL GRID HERE END*/


/*SHINE IMAGE*/


.shine {
  position: relative;
  overflow: hidden;
}
.shine::before {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  content: "";
  display: block;
  height: 100%;
  left: -75%;
  position: absolute;
  top: 0;
  transform: skewX(-25deg);
  width: 50%;
  z-index: 2;
}
.shine:hover::before, .shine:focus::before {
  -webkit-animation: shine 2s;
          animation: shine 2s;
		  
}
@-webkit-keyframes shine {
  100% {
    left: 125%;
  }
}
@keyframes shine {
  100% {
    left: 125%;
  }
}

/*SHINE IMAGE END*/









/* hide contents */
.tab-content{
	display:none;
	}

.rdtab{
	/*
	hide the radios*/
	display:none;
}
.tab_label{
	font-size:1rem;
}
.tab_label:hover{
	color:var(--melocolor);
	cursor:pointer;
	transition:500ms ease-in-out;
}

/* display contents */
.tab1:checked ~ .content1,
.tab2:checked ~ .content2,
.tab3:checked ~ .content3,
.tab4:checked ~ .content4,
.tab5:checked ~ .content5,
.tab6:checked ~ .content6,
.tab7:checked ~ .content7,
.tab8:checked ~ .content8,
.tab9:checked ~ .content9,
.tab10:checked ~ .content10,
.tab11:checked ~ .content11,
.tab12:checked ~ .content12,
.tab13:checked ~ .content13,
.tab14:checked ~ .content14,
.tab15:checked ~ .content15,
.tab16:checked ~ .content16,
.tab17:checked ~ .content17,
.tab18:checked ~ .content18,
.tab19:checked ~ .content19,
.tab20:checked ~ .content20,
.tab21:checked ~ .content21,
.tab22:checked ~ .content22,
.tab23:checked ~ .content23,
.tab24:checked ~ .content24,
.tab25:checked ~ .content25,
.tab26:checked ~ .content26,
.tab27:checked ~ .content27,
.tab28:checked ~ .content28,
.tab29:checked ~ .content29,
.tab30:checked ~ .content30,
.tab31:checked ~ .content31,
.tab32:checked ~ .content32,
.tab33:checked ~ .content33,
.tab34:checked ~ .content34,
.tab35:checked ~ .content35,
.tab36:checked ~ .content36,
.tab37:checked ~ .content37,
.tab38:checked ~ .content38,
.tab39:checked ~ .content39,
.tab40:checked ~ .content40,
.tab41:checked ~ .content41,
.tab42:checked ~ .content42,
.tab43:checked ~ .content43,
.tab44:checked ~ .content44,
.tab45:checked ~ .content45,
.tab46:checked ~ .content46,
.tab47:checked ~ .content47,
.tab48:checked ~ .content48,
.tab49:checked ~ .content49,
.tab50:checked ~ .content50,
.tab51:checked ~ .content51 

{
  display: block;
}

/*
.tab1b:checked ~ .content1,
.tab2b:checked ~ .content2,
.tab3b:checked ~ .content3,
.tab4b:checked ~ .content4,
.tab5b:checked ~ .content5,
.tab6b:checked ~ .content6,
.tab7b:checked ~ .content7,
.tab8b:checked ~ .content8,
.tab9b:checked ~ .content9,
.tab10b:checked ~ .content10,
.tab11b:checked ~ .content11
{
  display: block;
}
*/

.tab1c:checked ~ .content1,
.tab2c:checked ~ .content2,
.tab3c:checked ~ .content3,
.tab4c:checked ~ .content4,
.tab5c:checked ~ .content5,
.tab6c:checked ~ .content6
{
  display: block;
}




/* CONTAINER FORM & INPUT */

.input-wrap {
  position: relative;
  height: 47px;
  margin-bottom: 0;

}

.input-field {
  position: relative;
  width: 100%;
  height: 47px;
  background: none;
  outline: none;
  border: 1px solid #f1f0f0;
  padding-left: 10px;
  font-size: 1.2rem;
  color: #151111;
  transition: 0.4s;
  border-radius: 10px;
}

.textarea-field {

  height: 120px;
}

.input_label {
  position: absolute;
  left: 0;
  top: 60%;
  transform: translateY(-70%);
  font-size: 1rem;
  color: rgb(27, 136, 161);
  pointer-events: none;
  transition: 0.4s;
  padding-left: 10px;
}




.input-field.active + .input_label {
  font-size: 1rem;
  top: -5px;
}

select option {
  font-size: 0.85rem;
}

select option:disabled {
  color: grey;
}


.form_grid{
	display:grid;
	grid-template-columns:auto;
	width:80%;
	margin-left:auto;
	margin-right:auto;
	box-shadow: 0px 6px 12px 5px whitesmoke;
	-webkit-box-shadow: 0px 6px 12px 5px whitesmoke;
	-moz-box-shadow: 0px 6px 12px 5px whitesmoke;
	border-radius:10px;
	background-color:white;
}

.form_grid_item{
	background-color:transparent;
text-align:center;
	width:100%;
	padding:20px;
}

  
  .form_btn{
	text-decoration:none;
	border-radius:10px;
	background-color: var(--melocolor);
	padding: 0.5rem 1rem;
	color:white;
	width:100%;
	border:none;
	height:47px;
	font-size: 1rem;
}

.form_btn:hover{
	transition-duration: 1s;
	background-color: orange;
	border-radius:20px;
	cursor:pointer;
}

.form_txtcolor{
	color:var(--txtcolor);
	font-size:1.2rem;
	text-align: left;
	font-weight:300;
	padding:10px;
}




.learnmore_img{
	object-fit: cover;
    width: 120px;
    /*border-radius:100vw;
    border:6px solid white;
	shape-outside: circle(50%);*/
	float:left;
	margin-right:10px;
	display:inline-block;
	transition:2s;
}

.learnmore_img:hover {
	border:none;
scale:1.1;
   cursor:pointer;
   }
   

   
   
h3{
	font-size:var(--fontsizeh3);
}

.learnmore_h3{
display:inline-block;
}

.learnmore_txt {
  font-size: 1.2rem;
  display:inline-block;

 
}



.anchors{
	color: var(--txtcolor);
	text-decoration:none;
	font-weight:600;
}
.anchors:hover{
color:var(--melocolor);
transition: 1s ease-in-out;
}




/*THIS FADES THE IMG IN AND OUT*/
.scroll_scale{
	scale: 0.9; 
	opacity:1;
	animation: fade-in linear forwards;
	animation-timeline: view();
	/*animation-range: entry 100px;*/
	animation-range: 100px 500px;
	transition:2s;
}   

@keyframes fade-in {
	to { scale:1; 
		opacity: 1;
		}
}

/*FADE THE TEXT ON EXIT*/
.scroll_txt{
	animation: fade-out linear;
	animation-timeline: view();
	animation-range:exit -200px;
}

@keyframes fade-out {
	to { opacity: 0;
		}
}


/*SLIDER HERE*/
.grid-item-slider{
	grid-column: span 8;
	object-fit:center;
	text-align:left;
	height:600px;
	background-color:white;
	position:relative;
	overflow:hidden;
	border:0px solid lime;
}


.grid-item-slider .list .item {
	position:absolute;
	inset: 0 0 0 0;
	/*overflow:hidden;*/
	opacity:0;
	transition: .5s;

}

.grid-item-slider .list .slider_img{
	width:100%;
	height:100%;
	object-fit: cover;
	
}

.grid-item-slider .list .item::after{
	content: '';
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
/*	background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 50%);
	background-image: linear-gradient(to top, #000 10%, transparent);*/
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,0,0,.5) 100%);
}

.grid-item-slider .list .item .content{
	position:absolute;
	left:10%;
	top:10%;
	width:800px;
	max-width:80%;
	z-index:1;
	color:white;
	

}

.grid-item-slider .list .item .content p:nth-child(1){
	color:var(--melocolor);
	letter-spacing:8px;
	font-size:1.2rem;
	font-weight:600;
	text-transform:uppercase;
	/*text-shadow: 0 5px 10px rgba(94, 94, 94, 1);*/
}

.grid-item-slider .list .item .content p:nth-child(3){
	color:white;
	font-size:1rem;
	font-weight:400;

}

.grid-item-slider .list .item .content h3{
	font-size:3rem;
	margin:0;
	
	/*text-shadow: 0 5px 10px rgba(94, 94, 94, 1);*/
}

.grid-item-slider .list .item.s_active{
	opacity:1;
	z-index:10;
}

@keyframes showContent{
	to{
		transform: translateY(0);
		filter: blur(0);
		opacity: 1;
	}
}

.grid-item-slider .list .item.s_active p:nth-child(1),
.grid-item-slider .list .item.s_active h3,
.grid-item-slider .list .item.s_active p:nth-child(3){
	transform: translateY(30px);
	filter: blur(20px);
	opacity: 0;
	animation: showContent .5s .7s ease-in-out 1 forwards;
	/*text-shadow: 0 5px 10px rgba(94, 94, 94, 1);*/
}

.grid-item-slider .list .item.s_active h3{
	animation-delay: 1s;
}
.grid-item-slider .list .item.s_active p:nth-child(3){
	animation-delay: 1.3s;
}



.contact_container{
	position:absolute;
	top:30px;
	right:20px;
	display:flex;
	flex-direction:row;
	gap:10px;
	width:300px;
	border:0px solid lime;
	color:white;
	background-color:hsla(360, 100%, 100%, 0.15);
	
	padding:10px;
	border-radius:10px;
}

.contact_tel{
	width:40px;
	height:40px;
	border:3px solid white;
	border-radius:50%;
	font-size:1.8rem;
	padding:0px 0 0px 3px;
	color:white;
}

.contact_nr{
	font-size:1rem;
	text-transform:uppercase;
	width:200px;
	color:white;
}


.arrows{
	position:absolute;
	bottom:0;
  left: 50%;
  transform: translate(-50%, -50%);
	z-index:11;
}

.arrows button{
	border:none;
	 background: #fff;
	width:50px;
	height:50px;
	font-size:2rem;
	color:var(--melocolor);
	border-radius:50%;
	padding-top:3px;
	margin-left:30px;
	text-align:center;
	transition: 1s;
		box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.25);
}


.arrows button:hover{
	background-color: lightgrey;
	cursor:pointer;
	color:white;
}

.thumbnail_flex{
	position:absolute;
	bottom:100px;
	z-index:15;
	display:flex;
	gap:10px;
	flex-direction: row;
	width:100%;
	height:180px;
	padding: 0 20px;
	box-sizing: border-box;
	overflow:auto;
	justify-content:center;
	border: 0px solid lime;
	}

.thumbnail_flex::-webkit-scrollbar{
	width:0;
}

.thumbnail_flex .thumbnail_item{
	width:150px;
	height:180px;
	filter: brightness(.8);
	transition:.5s;
	flex-shrink:0;

}

.thumbnail_flex .thumbnail_item img{
	width:100%;
	height:100%;
	object-fit:cover;
	border-radius:10px;
	
}

.thumbnail_flex .thumbnail_item.t_active{
	filter: brightness(1.5);
	border-radius:10px;
}


.thumbnail_flex .thumbnail_item .thumbnail_content{
	position:absolute;
	inset:auto 10px 10px 10px;
	color:var(--melocolor);
	font-weight:600;
}




  
/* CONTAINER FOR INPUT END */



.hrline{
	border: 1px solid var(--linecolor);
	width:35%;
	display:inline-block;
	margin-top:0;
	margin-bottom:0;
	margin-right:20px;
	margin-left:20px;
}



/*NEW SPECIALIST CARD*/


.special_iframe{
	background:transparent;
	box-shadow:none;
	width:100%;
	height:500px;
	
}

.special_a{
	text-decoration:none;
	transition:1s;
	color:var(--txtcolor);
}

.special_a:hover{
	color:var(--melocolor);
}

/*NEW SPECIALIST CARD*/


















/*SPECIALIST CARD (DELETE THIS AFTERWARDS*/

.specialist_container{
	display:grid;
	grid-template-columns: repeat(6, 1fr);
	gap:30px;
	border:0px solid gold;	
	margin:0;
	align-items:center;

	border:0px solid lime;

}
.specialist_item{
	border:0px solid rgb(236,229,220);
	width:300px;
	height:380px;
	border-radius:14px;	
	background-color:rgb(236,229,220);
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
	transition:1s;
}
.specialist_item_span1{
	color:blue;

}

.specialist_item_span4{
	grid-column:span 4;

}

.specialist_item:hover{
	background-color:hsla(360, 100%, 100%, 0.15);
	transform: scale(1.1);
	cursor:pointer;
}

.specialist_img{
	object-fit: cover;
  width: 150px;
  height: 150px;
  border:0px solid white;
  border-radius:50%;
	
}









/*VALUE GRID HERE*/
.val_h2 {
  text-align: center;
}

.val_ul {
  --col-gap: 2rem;
  --barH: 1rem;
  --roleH: 2rem;
  --flapH: 2rem;

  width: min(80rem, 90%);
  margin-inline: auto;

  display: flex;
  flex-wrap: wrap;

  gap: var(--col-gap);
  padding-inline: calc(var(--col-gap) / 2);

  justify-content: center;
  align-items: flex-start;
  list-style: none;
}
.val_ul .val_li {
  width: 12em;
  display: grid;
  grid-template:
    "role"
    "val_icon"
    "val_title"
    "val_descr";
  align-items: flex-start;
  gap: 0.65rem;
  padding-block-end: calc(var(--flapH) + 1rem);
  text-align: center;
  background: var(--accent-color);
  background-image: linear-gradient(
    rgba(0, 0, 0, 0.6) var(--roleH),
    rgba(0, 0, 0, 0.4) calc(var(--roleH) + 0.5rem),
    rgba(0, 0, 0, 0) calc(var(--roleH) + 0.5rem + 5rem)
  );
  clip-path: polygon(
    calc(var(--col-gap) / -2 - 5px) 0,
    calc(100% + var(--col-gap) / 2 + 5px) 0,
    calc(100% + var(--col-gap) / 2 + 5px ) calc(100% - var(--flapH)),
    50% 100%,
    calc(var(--col-gap) / -2 - 5px) calc(100% - var(--flapH))
  );
}

/* bar */
.val_ul .val_li::before {
  content: "";
  grid-area: role;
  height: var(--barH);
  width: calc(100% + var(--col-gap));
  margin-left: calc(var(--col-gap) / -2);
  margin-top: calc(var(--roleH) / 2 - var(--barH) / 2);
  background: grey;
  z-index: -1;
  background-image: linear-gradient(
    rgba(255, 255, 255, 0.4),
    rgba(255, 255, 255, 0.2) 30%,
    rgba(255, 255, 255, 0.1) 40%,
    rgba(0, 0, 0, 0.1) 60%,
    rgba(0, 0, 0, 0.2) 70%,
    rgba(0, 0, 0, 0.4)
  );
}

/* role */
.val_ul .val_li::after {
  content: "";
  grid-area: role;
  background: var(--accent-color);
  background-image: linear-gradient(
    rgba(255, 255, 255, 0.4),
    rgba(255, 255, 255, 0.2) 30%,
    rgba(255, 255, 255, 0.1) 40%,
    rgba(0, 0, 0, 0.1) 60%,
    rgba(0, 0, 0, 0.2) 70%,
    rgba(0, 0, 0, 0.4)
  );
  height: var(--roleH);
}

.val_ul .val_li .val_icon,
.val_ul .val_li .val_title,
.val_ul .val_li .val_descr {
  padding-inline: 1rem;
  color: white;
  text-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.5);
}

.val_ul .val_li .val_icon {
  font-size: 3rem;
}
.val_ul .val_li .val_title {
  font-size: 0.95rem;
  font-weight: 700;
}

.val_ul .val_li .val_descr {
  font-size: 0.9rem;
}

.val_img{
	width:90px;
	   -webkit-filter: invert(1);
   filter: invert(1);
}

/*VALUE GRID HERE*/


.circle_container{
display:flex;
flex-direction:row;
width:100%;
height:305px;
gap:30px;
border:0px solid gold;	
margin:0;
text-align:center;
justify-content:center;
flex-wrap:wrap;

}

.circle_1{
	border:5px solid rgb(236,229,220);
	width:250px;
	height:320px;
	border-radius:14px;
	position:relative;
	background-color:rgb(236,229,220);
	padding:0 5px;
}

.circle {
	position:absolute;
	top:-30px;
  left:0;
  right:0;
  margin-left: auto;
margin-right: auto;
  transform: translate(-50%, -50%);
  width: 120px;
  height: 120px;
  animation: fade-Circle linear forwards;
  animation-timeline: view();
  animation-range: 100px 350px;
  scale: .7;
  animation-fill-mode: both; /* Add this line */
  opacity:1;
  border:10px solid white;
  border-radius:50%;

}

.circle_h2{
	color:var(--melocolor);
	margin-top: 100px;
	font-size:1.2rem;
}

.circle_p{
	color:black;
	font-size:0.95rem;
	text-align:center;
}

.circle:hover {  /* New class */
  transform: rotate(360deg);
  cursor: pointer;
}

@keyframes fade-Circle {
  from {
    transform: rotate(180deg);
  }
  to {
    scale: 1;
    transform: rotate(360deg);
	opacity:1;
  }
}



.doctor_container{
	width:100%;
	height:455px;
	position:relative;
}
.doctor_img{
	display:block;
width:100%;	
object-fit:cover;
}

.dr_img{
	object-fit:cover;
	width:100%;
	border-radius:15px;	
}



.doctor_txt{
	position:absolute;
	bottom:50px;
	left:50px;
	color:white;
	font-size:3rem;
	text-shadow: 0 5px 10px rgba(94, 94, 94, 1);
	/*mix-blend-mode: overlay;*/
}

.doctor_txt p{
	font-size:1rem;
	color:var(--melocolor);
}

.dr_item{
	width:100%;
	height:400px;
	background:steelblue;
}






.dr_select_container{
min-width:205px;
height:220px;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, var(--orthopaedics) 100%);
border-radius:15px;
display:inline-block;
text-align:center;	
margin:10px;
transition:1s;
padding:4px;
color:white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
border:1px solid white;
}

.dr_select_container:hover{
	transform: scale(1.1);
	background-color:white;
	border:1px solid rgb(236,229,220);
}

.dr_select_img{
		width:100px;
		height:100px;
		border-radius:50%;
		object-content:center;
}

.anchor{
	color:black;
	text-decoration:none;
}


.inside_container{
	width:100%;
	display:grid;
	grid-template-columns:auto auto;
	width:100%;

}
.inside_container_item{
	background-color:none;
}


.inside_img{
	width:250px;
}

.mortons_img{
		width:150px;
	height:150px;
		background-color:rgb(4,33,109);
	border-radius:50%;
}




/*CSS FOR SLIDE IMAGES HORIZONTAL*/
.horizon_slider{
	width:100%;
	border:0px solid lime;
	height: var(--height);
	overflow:hidden;
	mask-image: linear-gradient(to right, transparent, #000 10% 90%, transparent);
}

.horizon_slider .horizon_list{
	    padding: 0;
		margin: 0;
		display:flex;
		flex-direction: row;
		width:100%;
		min-width:calc(var(--width) * var(--quantity));
		position:relative;
		
}

.horizon_slider .horizon_list .horizon_item{
	width: var(--width);
	height: var(--height);
	position:absolute;
	left:100%;
	animation: autoRun 10s linear infinite;
	animation-delay: calc( (10s / var(--quantity)) * (var(--position) - 1) );
	transition: filter 0.5s;
}

@keyframes autoRun{
	from{
		left:100%;
	}to{
		left: calc(var(--width) * -1);
		}
}

.horizon_slider .horizon_list .horizon_item .horizon_img{
	width:100%;
}

.horizon_slider:hover .horizon_item{
	animation-play-state:paused !IMPORTANT;
	filter: grayscale(1);
}

.horizon_slider .horizon_item:hover{
	filter: grayscale(0);
	cursor:pointer;
}
/*CSS FOR SLIDE IMAGES HORIZONTAL*/

.hos_icons{
	font-size:1.2rem;
	color:var(--melocolor);
}

.vrt_back{
	text-decoration:none;
	color:white;
	font-size:3rem;
	transition:1s;
	font-weight:100;
	position:fixed;
	top:80px;
}

.vrt_back:hover{color:var(--melocolor);}


.melocaptcha_container {
  display:inline-block;
  width:200px;
  align-items: center;
  text-align:center;
  cursor: pointer;
  border:1px solid lightgrey;
  padding:10px;
  border-radius:5px;
}

#melocaptcha {
  width: 20px;
  height: 20px;
  opacity: 0;
  position: absolute;
  cursor:pointer;
}

.checkbox-label::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid #d3d3d3;
  border-radius: 3px;
  margin-right: 10px;
  transition: transform 1s;
  cursor:pointer;
}

#melocaptcha:checked + .checkbox-label::before {
  background-color: white;
  border: none; /* Border disappears after checking */
  transform: rotate(360deg);
  background-image: url('/images/melocaptcha.png');
  background-size: cover;
  background-position: center;
  cursor:pointer;
}



/*MEDIA SCREENS HERE*/

@media only screen and (max-width: 768px) {
	
	/* body{ */
		/* background:hotpink; */
	/* } */
	
h1{font-size:1.2rem;}
h2{font-size:1rem;}
h3{font-size:0.95rem;}	
p{font-size:0.95rem;}
.h2_left{font-size:1.2rem;}	
.hrline{display:none;}
	
	iframe{
	height:calc(500px - 60px);
	
	}
.banner_overlay{
	height:calc(500px + 25px);

}	

.vrt_iframe{
	height:calc(750px - 60px);
}



.banner_header{
	font-size:1.8rem;
	top:100px;
	left:30px;
	z-index:11;
	
}
.banner_header p{
		text-align:left;
		font-size:0.65rem;
		
}

.main_container_item_span3{
	grid-column:span 8;
	padding:0 30px;
}
.main_container_item_span4{
	grid-column:span 8;
	padding:0 30px;
}
.main_container_item_span6{
	grid-column:span 8;
	padding:0 30px;
}



.panel p{
		font-size: 0.95rem;
		text-align:left;
	}
.accordion {
  font-size: 1rem;	
}


.input_label{
  font-size: 1rem;
}

	
.removethis{display:none;}

.footer_container{
	grid-template-columns: repeat(5, 1fr);
	gap:5px;
	width:100%;
	padding-left:20px;
	padding-right:10px;
}

	.footer_item{padding:0;overflow:hidden;width:100%;}
	
	.footer_header{
		margin-top:20px;
	font-size:0.75rem;
}

	.footer_menu a{
	font-size: 0.65rem;
	line-height:0;
	}
	
.footer_icons{
	font-size:2rem;
	width:40px;
	height:40px;
	border:2px solid white;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	border-radius:50%;
	margin-left:12px;
	padding:2px 2px 5px 2px;
	}

.footer_item_span6{
	grid-column:span 5;
	font-size:0.75rem;
}


.beelogo{
	width:60px;
}

.footer_follow{
	font-size:0.65rem;
}

.form_grid{
	width:95%;
}

.input_label {
  font-size: 1rem;
 
}

.images {
  object-fit: cover;
  height:45vh;
}
	
	.footer_item_span2{
	grid-column:span 6;
}


.hospital_img{
	height:40vh;
	width:100%;
}
}


@media only screen and (max-width: 1400px){
	
.melomag_txt{
	font-size:1rem;
}	
	
.sp_img_container{
height:160px;
}	
	
	.sp_container{
	gap:20px;
	}
.sp_item{
	min-height:350px;
}	

.info_card_btn{
	font-size:0.95rem;
padding:2px 6px;
}
	
.panel p{
		font-size: 1vw;
	}
.accordion {
  font-size: 1vw;	
}

.input_label {
  font-size: 1vw;
}
	.circle_1{
	width:200px;
	height:270px;
	}
	
.circle_h2{

	font-size:0.95rem;
}

.circle_p{
	font-size:0.75rem;
}	
	
.hrline{
	
	width:30%;

}
	
h1{

	font-size:1.8vw;
	
}

h2{
	font-size:1.6vw;
}

.h2_left{
	font-size:1.8vw;
}

h3{
	font-size:1.2vw;
}

h4{
	font-size:1.1vw;
}

p{
	font-size:1vw;
}

.p_left{
	font-size:1vw;
}


.banner_header{
	font-size:1.8rem;
	top:100px;
	left:30px;
	z-index:11;
	
}
.banner_header p{
		text-align:left;
		font-size:0.65rem;
		
}

}












@media only screen and (max-width: 960px){
	

	
	
h1{font-size:1.2rem;}
h2{font-size:1rem;}
h3{font-size:0.95rem;}	
p{font-size:0.95rem;}
.h2_left{font-size:1.2rem;}	
.hrline{display:none;}
	
	iframe{
	height:calc(500px - 60px);
	
	}
.banner_overlay{
	height:calc(500px + 25px);
	
}	

.vrt_iframe{
	height:calc(750px - 60px);
}

.banner_header{
	font-size:1.8rem;
	top:100px;
	left:30px;
	z-index:11;
	
}
.banner_header p{
		text-align:left;
		font-size:0.65rem;
		
}

.main_container_item_span3{
	grid-column:span 8;
	padding:0 30px;
}
.main_container_item_span4{
	grid-column:span 8;
	padding:0 30px;
}
.main_container_item_span6{
	grid-column:span 8;
	padding:0 30px;
}



.panel p{
		font-size: 0.95rem;
		text-align:left;
	}
.accordion {
  font-size: 1rem;	
}


.input_label{
  font-size: 1rem;
}

	
.removethis{display:none;}

.footer_container{
	grid-template-columns: repeat(5, 1fr);
	gap:5px;
	width:100%;
	padding-left:20px;
	padding-right:10px;
}

	.footer_item{padding:0;overflow:hidden;width:100%;}
	
	.footer_header{
		margin-top:20px;
	font-size:0.75rem;
}

	.footer_menu a{
	font-size: 0.65rem;
	line-height:0;
	}
	
.footer_icons{
	font-size:2rem;
	width:40px;
	height:40px;
	border:2px solid white;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	border-radius:50%;
	margin-left:12px;
	padding:2px 2px 5px 2px;
	}

.footer_item_span6{
	grid-column:span 5;
	font-size:0.75rem;
}


.beelogo{
	width:60px;
}

.footer_follow{
	font-size:0.65rem;
}

.form_grid{
	width:95%;
}

.input_label {
  font-size: 1rem;
 
}

.images {
  object-fit: cover;
  height:45vh;
}
	
	.footer_item_span2{
	grid-column:span 6;
}


.hospital_img{
	height:40vh;
	width:100%;
}
	
}