#subpage section#tabs nav#newtabs { display:flex; position:relative; background:#fff; padding:12px; border-radius:50px; box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15); margin-top:65px;}
#subpage section#tabs nav#newtabs.narrow { display:none;}
input[type=radio] {display: none;}
#subpage section#tabs nav#newtabs * {z-index:2;}
#subpage section#tabs nav#newtabs label.tablabel { display:flex; align-items:center; justify-content: center; height:45px;line-height:1em; width:175px; font-size:16px; font-weight:500; border-radius:50px; cursor:pointer; transition:color 0.15s ease-in;margin:0 5px 0 ;padding:0; color:#333; background-color: transparent;}
#subpage section#tabs nav#newtabs label.tablabel b { font-weight:100;}
#subpage section#tabs #tab_1:checked ~ nav#newtabs [for='tab_1'],
#subpage section#tabs #tab_2:checked ~ nav#newtabs [for='tab_2'],
#subpage section#tabs #tab_3:checked ~ nav#newtabs [for='tab_3'],
#subpage section#tabs #tab_4:checked ~ nav#newtabs [for='tab_4']{color:#1897be;background:none; font-weight:bold;}
#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(5px);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(187px);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(375.5px);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(560.5px);}
#subpage section#tabs nav#newtabs #glider { position:absolute; display:flex; height:45px; width:175px; z-index:1;  
background-color:#e3f0f3; border-radius:50px; transition:0.25s ease-out;}

@media (max-width: 990px) { 
#subpage section#tabs2 nav#newtabs { margin-top:80px; }

#subpage section#tabs.aboutassistance article.tab_content_1>*,
#subpage section#tabs.aboutassistance article.tab_content_2>*,
#subpage section#tabs.aboutassistance article.tab_content_3>*,
#subpage section#tabs.aboutassistance article.tab_content_4>* { width:90%; margin-left: auto; margin-right: auto;}
}


@media (max-width: 940px) { 
#subpage section#tabs nav#newtabs #glider { width:22%; }
#subpage section#tabs nav#newtabs label.tablabel {width:22%; }

#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(0);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(103%);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(208%);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(315%);}
}


@media (max-width: 850px) { 
#subpage section#tabs nav#newtabs{transform: scale(0.9);margin-top:110px;} 
#subpage section#tabs nav#newtabs.narrow { display:flex;}
#subpage section#tabs nav#newtabs.wide { display:none;}
#subpage section#tabs nav#newtabs label.tablabel {width:23.75%; border: hidden; }
#subpage section#tabs header nav{margin-top:-55px; }
#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(4.65%);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(114.5%);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(224%);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(333.5%);}
}




@media (max-width: 768px) { 
#subpage section#tabs header { padding-top:20px;}
#subpage section#tabs header nav{background:none;margin-top:-55px; padding-right:auto; padding-left:auto;width:90%;
}
#subpage section#tabs nav#newtabs{transform: scale(0.85);margin-top:160px;} 


}

@media (max-width: 680px) { 
#subpage section#tabs nav#newtabs{margin-top:175px; margin-left:-10px;} 
#subpage section#tabs nav#newtabs #glider { width:21.8%;}
#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(4.45%);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(110%);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(215%);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(324%);}

}

@media (max-width: 585px) { 
#subpage section#tabs nav#newtabs{margin-top:215px;} 
}

@media (max-width: 506px) { 
#subpage section#tabs nav#newtabs{margin-top:275px; } 
#subpage section#tabs nav#newtabs #glider { width:20%;}
#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(5%);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(120%);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(236%);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(347.5%);}
}

@media screen and (max-width: 480px){
#subpage section#tabs nav#newtabs{transform: scale(0.82);margin-top:190px;  } 
#subpage section#tabs input[id=tab_1]:checked ~ nav#newtabs #glider {transform: translateX(8.5%);}
#subpage section#tabs input[id=tab_2]:checked ~ nav#newtabs #glider {transform: translateX(127%);}
#subpage section#tabs input[id=tab_3]:checked ~ nav#newtabs #glider {transform: translateX(246.5%);}
#subpage section#tabs input[id=tab_4]:checked ~ nav#newtabs #glider {transform: translateX(364%);}
}






.flow-wave {
color:#fb5f3b;
background-color:#f7e9e8;
font-weight:bold; 
padding-bottom: 6px; 
text-decoration:underline;
text-underline-offset: 2px;
text-decoration-style: wavy;

}
.flow-wave:hover,.flow-wave:focus {
text-decoration: none;
background:
radial-gradient(circle at 10px -7px, transparent 8px, currentColor 8px, currentColor 9px, transparent 9px) repeat-x,
radial-gradient(circle at 10px 27px, transparent 8px, currentColor 8px, currentColor 9px, transparent 9px) repeat-x;
background-size: 20px 20px;
background-position: -10px calc(100% + 16px), 0 calc(100% - 4px);
animation: waveFlow 1s infinite linear;
}
@keyframes waveFlow {    
from { background-position-x: -10px, 0; }    
to { background-position-x: -30px, -20px; }   
}





#subpage.teacher #tabs.aboutassistance h3{ margin-bottom:1rem;}


details{
color: #2c9db9;
cursor: pointer;
border: 1px solid #61adc5;
border-left-width:5px;
border-bottom: none;

&::details-content 
{
height: 0;
interpolate-size: allow-keywords;
opacity: 0;
overflow: hidden;
transition: 
height 0.5s ease-in-out,
content-visibility 0.5s ease-in-out,
opacity 0.5s ease-in-out,
scale 0.5s ease-in-out;
transition-behavior: allow-discrete;
}
	
&[open] > summary { text-decoration:underline; text-underline-offset: 0.65rem; text-decoration-style: wavy;}
&[open] > summary:after {background-color:#61f8dd;transform: rotate(45deg);}
&[open]::details-content {height: auto;opacity: 1;}

}

summary {
list-style: none;
font-weight:bold;
padding: 0.75rem;
position: relative;
transition: color 0.5s ease-in-out;
	
&:after {
background-color: pink;
border-radius: 50%;
content: '+';
color: black;
font-size: 1.75rem;
height: 1.5rem;
position: absolute; top: 1rem;right: 1rem;
text-align: center;
transition: 
background-color 0.5s ease-in-out,
transform 0.5s ease-in-out;
width: 1.5rem;
 }
 
}

details.last {border-bottom: 1px solid #61adc5;	}
.ctn-info {padding: 1rem;}



	
	
	
	
	
	
	
	
	
	
	
	
	
#alink li { margin-bottom:5px; list-style: circle}	
#alink a{ color:#2c9db9; display: block; position: relative; margin-inline: 5px;}
#alink a:before{ content: "";  height: 12px; width:50px; background-color: #fef0dd;
  position: absolute; bottom: 0; z-index: -1;transition:width 0.5s ease-in-out;}
#alink a:hover:before {width: 100%;}

#alink a:after { content: "→";position: relative;display: inline-block;
  margin-left: 5px; transform:rotate(-45deg);
  transition: margin 0.3s ease-in-out, transform 0.3s ease-in-out, color 0.3s ease-in-out;}
#alink a:hover:after {color: #ff470f;margin-left:15px;transform:rotate(0deg); font-weight:bold;}