@import url ("https://fonts.googleapis.com/css?family=Nunito"); 
@import url("https://fonts.googleapis.com/css?family=Sriracha");
@import url("https://fonts.googleapis.com/css?family=Julee");    
    

body { font-family: "Nunito", sans-serif;font-size: 20px; margin:auto; }


a {
	text-decoration:none;
	color:#ED602A;
	font-style:bold;
}


#content p { font-size:2.5vw; line-height:1.6; text-align:center; width:90%; margin:auto; padding-top:20px;  }
#content ul li { font-size:2.5vw; text-align:center; width:90%; margin:0; padding:0;list-style-type:none;line-height:1.6; 
}

#content ol{
	list-style:none;
	counter-resent:item;
}

#content li{
	counter-increment:item;
	margin-bottom:5px; 
}
#content ol li:before {
margin-right: 10px;
   content: counter(item);
   background:#1083cf;
   border-radius: 100%;
   color: white;
   width: 1.2em;
   text-align: center;
   display: inline-block;}

#content ol li {font-size:2.5vw; line-height:1.6; text-align:center; width:90%; margin:auto; list-style-position:inside;	
}

#content h1 { font-family:"Sriracha", sans serif; font-weight:bold; font-size:3.5vw; color:#1083cf; text-align:center; width:85%; margin:auto; padding-top:40px; padding-bottom:20px; line-height:1.6; }


#content h2 { font-family:"Sriracha", sans serif; font-size:3vw; color:#1083cf; text-align:center; width:70%; margin:auto; padding-top:40px; line-height:1.6;	
}
#banner { display:block; margin:auto; width:95%; }
	
#banner p { font-size:5vw; }

#copyright p {
	font-size:2.5vw;
}
#copyright {
	text-align:center; 
	color:white;
	background-color:#333; 
	width:100%;
	padding:10px;
	margin-top:50px;
	margin-bottom:0;
}

#navbar, #joinus {
	text-align:center; 
	color:white;
	background-color:#333; 
	width:100%;
	padding:10px;
	margin-top:20px;
	margin-bottom:20px;
}


#content { width:90%; display:block; margin:auto;	
}
	
.logo-font { padding-top:20px; padding-bottom:10px; font-family:"Julee",cursif;font-size:30px; font-weight:bold;
}

.logo-align {
	float:left; padding-left:10px; padding-right:10px;
}

.sticky {
	position:-webkit-sticky;
	position:sticky;
	top:0;
	width:100%;
}


.overlay {
  height: 100%;
  width: 100%;
  display: none;
  position: fixed;
  top:0;
	overflow-y:scroll;
  z-index: 1;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
}

.overlay-content  {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
}

.overlay a {
  padding: 8px;
  text-align:center;
  text-decoration: none;
  font-size: 30px;
  color:#999;
  display: block;
}

.overlay a:hover, .overlay a:focus {
  color:white;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}


@media screen and (max-width: 450px) {
  .overlay a, dropdown a {font-size: 25px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }

#content h1
 {font-size:5vw;
}
#content h2
 {font-size:4.5vw;
}
#content p
 {font-size:4vw;
}
#content ul ol
 {font-size:4vw;
}

#content ul li
 {font-size:4vw;
}

table tr
{font-size:4vw;
}


#copyright p {
	font-size:3vw;
}

}

		

.dropdown-btn {
padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 36px;
  color:red;
  display: block;
  border: none;
  background: none;
  width: 100%;
  cursor: pointer;
  outline: none;	
}

.dropdown-btn:hover {
	color: #f1f1f1;
}

.active {
color: red;	
}

.dropdown-container {
  display: none;
  background-color: #262626;
  padding-left: 8px;
  text-align:center;
  font-size:18px;
}
	
.dropdown a {
	font-size: 30px;
}

.responsive {
	width: 80%;
	max-width: 500px;
	height:auto;
	display:block; 
	margin-left:auto;
	margin-right:auto;
}
.responsive2 {
	width:50%;
	height:auto;
	display:block; 
	margin-left:auto;
	margin-right:auto;
}

.responsive3 {
	width:30%;
	height:auto;
	display:block; 
	margin-left:auto;
	margin-right:auto;
}

.space-out {
margin-top: 50px;
margin-bottom: 50px;
}


#learn-more, #events, #back {
  background-color:#f3632a;
  text-decoration:none;
  border: none;
  padding:10px;
  color: white;
  font-size:2.5vw;
  text-align:center;
  margin:auto;
  width:20%;
  cursor: pointer;
}

#learn-more p, #events p, #back p {
	font-size:2.5vw;
	text-align:center;
	padding-top:0;
}

#learn-more a, #events a, #back a {
	color:white;
}

#learn-more:hover, #events:hover, #back:hover  {
  background-color:#1083cf;

}
	
#bottom-banner {line-height:1.6;
	
}

#bottom-banner p { font-size:2.5vw; line-height:1.6; text-align:left; width:90%; margin:auto; padding-top:30px;  }

#bottom-banner ul li { list-style-type:none; text-indent:30px;font-size:2.5vw; text-align:left; width:90%; margin:0; padding:0; 
}

.map {
max-width:80%;
margin-left:auto;
margin-right:auto;
display:block;
}

.quote {
	font-style:italic;
	color:#f3632a;
}
.top-margin {
	margin-top:50px;
}
.top-margin2 {
	margin-top:30px; 
}
.top-padding {
	padding-top:20px; 
}
.bottom-padding {
	padding-bottom:10px;}

.instructors {
	max-height:200px;
	max-width:150px;
	display:block; 
	margin-left:auto;
	margin-right:auto;
}
table {
	padding-top:0;
	margin-top:0;
	width:80%;
	max-width:550px;
	margin-left:auto;
	margin-right:auto;
	display:block;
	border:2px solid black;
	text-align:left;
	font-size:2.5vw;
	line-height:1.6; }

th { width:100%;}
.frame {
	width:80%;
	margin:auto;
	border:2px solid black;
}

#reverse-healing {
	margin:auto; width:70%;
	padding-left:50px;
}
#reverse-healing p {
	font-size:4vw;
	font-weight:bold;
	font-style:italic;
	display:block; width:55%;
	text-align:left;
}

#reverse-healing a {
	text-decoration:none;
	color:black;
}

.accordion {
  background-color: #eee;
  color:#1083cf;
  font-size:2.5vw;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #ccc;
}

.accordion:after {
  content: '\02795'; 
  font-size: 13px;
  color: #777;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2796";
}

.panel {
  padding: 0 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}

.red { color: #DC143C; }