body, html{
	margin:0;
	font-size: 16px;
	font-family: 'Poppins', sans-serif;
}
ul, ol{
	list-style: none;
	padding:0;
	margin:0;
}
input:focus, button:focus, textarea:focus{
	outline: none;
}
a:hover,a:focus{
	text-decoration: none;
}
img{
	max-width: 100%;
}
.header{
    background: url('https://sutra-sites.s3.amazonaws.com/valleyofrelation/images/header.png'), #F5FDFB;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    padding: 5rem 0;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100vh;
}
.header .blurb-wrap {
	text-align: center;
	justify-content: center;
	align-items: center;
	display: flex;
}
.header .head{
    color: #253F33;
    font-size: 3.25rem;
    font-weight: bold;
    margin-bottom: .5rem;
		line-height: 1.2em;
}
.header p {
    color: #4B625C;
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
    font-weight: 500;
		width: 800px;
}
.header .btn_green{
    background: #3AA691;
    color: white;
    font-size: 1rem;
    font-weight: bold;
    border: 0.1rem solid #3AA691;
    padding: 1.35rem 5rem;
    border-radius: .35rem;
    margin-bottom: .75rem;
    transition: all ease .4s;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -ms-transition: all ease .4s;
    -o-transition: all ease .4s;
}
.header .btn_green:hover,.header .btn_green:focus{
    background: white;
    color: #3AA691;
}
.header .text_lg{
    color: #253F33;
    font-size: 1.15rem;
    margin-bottom: .5rem;
    font-weight: 600;
		/* margin-bottom: 5px; */
}

.header .text_lg span {
	padding-bottom: 15px;
	border-bottom: 1px solid #4B625C;
}

.header .text_sm a {
		/* padding-top: 10px; */
	  color: #4B625C;
    font-size: 1rem;
    font-weight: 300;
    text-transform: uppercase;
}

.header .text_sm a:hover {
	font-weight: bold;
}

.header .fa-chevron-down{
position: absolute;
left: 50%;
bottom: 2.5rem;
color: #4B625C;
font-size: 3rem;
transition: all .2s ease;
}
.header .fa-chevron-down:hover{
bottom: 2rem;
}


.header .title{
    text-align: center;
    color: #253F33;
    font-weight: 600;
    font-size: 1.5rem;
		margin-top: 15px;
    margin-bottom: 20px;
    position: relative;
    z-index: 9;
}
.header .whitebox{
    display: inline-block;
    width: 100%;
		/* height: 100%; */
    position: relative;
    background: #FFFFFF;
    /* text-align: center; */
    padding: 2rem 2.5rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
    z-index: 2;
    box-shadow: 0 0 1rem #bac1c138;
}
.header .whitebox span{
    background: white;
    position: relative;
    z-index: 999;
    display: inline-block;
    width: 100%;
}
.header .whitebox a{
    color: #ff69b4;
}
.header .whitebox .head{
    color: #253F33;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    position: relative;
    z-index: 9;
}

.header .whitebox .description {
	font-weight: 500;
}
.header .whitebox p{
    margin-bottom: 0;
    color: #4B625C;
    font-size: 1rem;
    line-height: 1.75;
    position: relative;
    z-index: 9;
}

.header .a2a_default_style {
	display: flex;
	justify-content: center;
}



.space_section{
    position: relative;
    background: white;
}
.space_section .text_lg{
    color: #4B625C;
    /* text-align: center; */
    font-size: 1.25rem;
    /* font-weight: 500; */
    margin-top: 4rem;
    line-height: 1.75;
    position: relative;
    z-index: 9;
}
.space_section .space_box{
    display: flex;
    width: 100%;
    position: relative;
    justify-content: center;
    align-items: center;
    height: 600px;
}

.space_section .space_box a {
	color: #ff69b4;
}

.space_section .space_box a:hover {
	text-decoration: underline;
}

.space_section .space_box .head{
    color: #253F33;
    font-size: 2.25rem;
    font-weight: 600;
    margin-bottom: 2.5rem;
    position: relative;
    z-index: 9;
}
.space_section .space_box .text{
    color: #4B625C;
    font-size: 1.15rem;
    line-height: 1.75;
    position: relative;
    z-index: 9;
}
.space_section .space_box .plant{
    position: absolute;
    left: 0;
    top: 8%;
    width: 38rem;
}
.space_section .space_box .flower{
    position: absolute;
    right: 0;
    top: 0;
    width: 16rem;
}
.space_section .space_box2{
    height: 500px;
    margin-bottom: 5rem;
}
.space_section .space_box2 .plant{
    position: absolute;
    left: initial;
    right: 0;
    top: 6%;
    width: 42.5rem;
}
.space_section .space_box2 .flower{
    position: absolute;
    right: initial;
    left: 0;
    top: -6rem;
    width: 20rem;
}
.space_section .green_box{
    background: #367367;
    display: inline-block;
    width: 100%;
    border-radius: 2rem;
    padding: 5rem 4rem;
    position: relative;
   	margin-top: 4rem;
}
.space_section .green_box .title{
    color: white;
    font-size: 2.25rem;
    font-weight: 600;
    margin-bottom: 1.2rem;
    margin-top: -.25rem;
    position: relative;
    z-index: 9;
}
.space_section .green_box .text_sm{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.space_section .green_box .btn_white{
    background: #FFFFFF;
    color: #446D5B;
    font-size: 1rem;
    font-weight: bold;
    border: 0.1rem solid #FFFFFF;
    padding: 1.35rem 5rem;
    border-radius: .35rem;
    margin-bottom: .75rem;
    position: relative;
    z-index: 9;
    transition: all ease .4s;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -ms-transition: all ease .4s;
    -o-transition: all ease .4s;
}
.space_section .green_box .btn_white:hover,
.space_section .green_box .btn_white:focus{
    background: #446D5B;
    color: #FFFFFF;
}
.space_section .green_box .date{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.space_section .green_box img{
    width: 9.5rem;
    position: absolute;
    right: 0;
    bottom: 0;
}

.green_box .text_sm a {
		color: #fff;
		text-decoration: underline;
}

.green_box .text_sm a:hover {
		color: #fff;
		text-decoration: none;
}

.team_section{
    background: #E9EDEB;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 40%;
    padding-top: 5rem;
    padding-bottom: 7rem;
    position: relative;
}
.team_section .title{
    text-align: center;
    color: #253F33;
    font-weight: 600;
    font-size: 2.25rem;
    margin-bottom: 5rem;
    position: relative;
    z-index: 9;
}
.team_section .whitebox{
    display: inline-block;
    width: 100%;
		/* height: 100%; */
    position: relative;
    background: #FFFFFF;
    text-align: center;
    padding: 2rem 2.5rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
    z-index: 2;
    box-shadow: 0 0 1rem #bac1c138;
}
.team_section .whitebox span{
    background: white;
    position: relative;
    z-index: 999;
    display: inline-block;
    width: 100%;
}
.team_section .whitebox img{
    width: 12rem;
    border-radius: 50%;
    margin-bottom: 1.25rem;
}
.team_section .whitebox .head{
    color: #253F33;
    font-size: 1.35rem;
    font-weight: 500;
    margin-bottom: 1rem;
    position: relative;
    z-index: 9;
}
.team_section .whitebox p{
    margin-bottom: 0;
    color: #4B625C;
    font-size: 1rem;
    line-height: 1.75;
    position: relative;
    z-index: 9;
}
.team_section .flower {
    position: absolute;
    left: 0;
    bottom: 2.5rem;
    width: 22.5rem;
    z-index: 2;
}
.team_section .flower2{
    width: 40rem;
    position: absolute;
    right: 0;
    top: 15%;
}

.team_section .green_box{
    background: #367367;
    display: inline-block;
    width: 100%;
    border-radius: 2rem;
    padding: 5rem 4rem;
    position: relative;
   	margin-top: 5rem;
   	margin-bottom: 5rem;
}
.team_section .green_box .title{
    color: white;
    font-size: 2.25rem;
    font-weight: 600;
    margin-bottom: 1.2rem;
    margin-top: -.25rem;
    position: relative;
    z-index: 9;
}
.team_section .green_box .text_sm{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.team_section .green_box .btn_white{
    background: #FFFFFF;
    color: #446D5B;
    font-size: 1rem;
    font-weight: bold;
    border: 0.1rem solid #FFFFFF;
    padding: 1.35rem 5rem;
    border-radius: .35rem;
    margin-bottom: .75rem;
    position: relative;
    z-index: 9;
    transition: all ease .4s;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -ms-transition: all ease .4s;
    -o-transition: all ease .4s;
}
.team_section .green_box .btn_white:hover,
.team_section .green_box .btn_white:focus{
    background: #446D5B;
    color: #FFFFFF;
}
.team_section .green_box .date{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.team_section .green_box img{
    width: 9.5rem;
    position: absolute;
    right: 0;
    bottom: 0;
}

.team_section .signature{
    width: 25rem;
    position: absolute;
    left: 0;
    bottom: 1rem;
}

.schedule_section .intro {
    color: #253F33;
    font-weight: 400;
    font-size: 1.25rem;
    z-index: 9;
		text-align: center;
		width: 100%;
}

.schedule_section .intro a {
	color: #ff69b4;
}

.schedule_section .intro a:hover {
	text-decoration: underline;
}


.schedule_section{
    padding: 5rem 0;
    position: relative;
    background: white;
}

.schedule_section .timezone{
    text-align: center;
		/* margin-bottom: -30px; */
		font-size: 1.2em;
}

.schedule_section .timezone a {
	color: #ff69b4;
}

.schedule_section .timezone a:hover {
	text-decoration: underline;
}

.schedule_section .flexer{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 2.5rem;
}
.schedule_section .title{
    color: #253F33;
    font-weight: 600;
    font-size: 2.25rem;
    position: relative;
    z-index: 9;
}
.schedule_section .topbar{
    border-bottom: 0.1rem solid #E9F1EF;
}
.schedule_section .topbar li {
    margin: 0;
}
.schedule_section .topbar li a{
    display: inline-block;
    padding: .35rem 1.5rem;
    font-size: 1.05rem;
    text-transform: uppercase;
    color: #20765F;
    font-weight: 400;
    border: 0;
    border-bottom: 0.25rem solid transparent;
    margin-bottom: -0.25rem;
    transition: all ease .4s;
    position: relative;
    z-index: 9;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -ms-transition: all ease .4s;
    -o-transition: all ease .4s;
}
.schedule_section .topbar li:first-child a{
    padding-left: 0.25rem;
}
.schedule_section .topbar li a:hover,.schedule_section .topbar li a:focus{
    font-weight: 600;
    border-bottom: 0.25rem solid #087D5F;
}
.schedule_section .topbar li a.active{
    font-weight: 600;
    border-bottom: 0.25rem solid #087D5F;
}
.schedule_section .schedule_box{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    position: relative;
    margin-top: 3rem;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox{
    background: #EDF2F0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 9.25rem;
    border-radius: 1rem;
    padding: 1.5rem;
    position: relative;
}
.schedule_section .schedule_box .greenbox.box_sm{
    width: 20%;
    text-align: center;
    margin-right: 2rem;
}
.schedule_section .schedule_box .greenbox.box_lg{
    width: 80%;
    display: inline-block;
}
.schedule_section .schedule_box .greenbox .time{
    color: #4B625C;
    font-size: 1.25rem;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: .75rem;
    position: relative;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox .time span{
    color: #4B625C;
    font-size: .9rem;
    text-transform: uppercase;
    font-weight: 300;
}
.schedule_section .schedule_box .greenbox .date{
    color: #4B625C;
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 500;
    position: relative;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox .head{
    color: #253F33;
    font-weight: 600;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    position: relative;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox .text{
    color: #4B625C;
    font-size: 1.1rem;
    font-weight: 400;
    position: relative;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox .imgbox{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
		margin-bottom: 10px;
}
.schedule_section .schedule_box .greenbox .imgbox img{
    width: 6rem;
    margin-right: .75rem;
		border-radius: 50%;
}
.schedule_section .schedule_box .greenbox .imgbox .name{
    color: #4B625C;
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: .5rem;
		margin-right: 20px;
    position: relative;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox .imgbox .rank{
    color: #4B625C;
    font-size: 0.8rem;
    font-weight: 500;
    position: relative;
    z-index: 9;
}

.schedule_section .greenbox .item_header {
	align-items: center;
}

.schedule_section .greenbox .item_body {
	margin-top: 20px;
}

/* .schedule_section .schedule_box .greenbox.box_sm.top:before{
    content: '';
    background: #087D5F;
    width: .75rem;
    height: .75rem;
    display: inline-block;
    border-radius: 50%;
    position: absolute;
    left: 48%;
    top: -3rem;
    z-index: 9;
}
.schedule_section .schedule_box .greenbox.box_sm:after{
    content: '';
    background: #E9F1EF;
    width: .15rem;
    display: inline-block;
    height: 3rem;
    position: absolute;
    left: 50%;
    top: -3rem;
}
.schedule_section .schedule_box .greenbox.box_lg:after{
    content: '';
    background: #E9F1EF;
    height: .15rem;
    display: inline-block;
    width: 2.5rem;
    position: absolute;
    left: -2.5rem;
    top: 50%;
} */
.schedule_section .green_box{
    background: #367367;
    display: inline-block;
    width: 100%;
    border-radius: 2rem;
    padding: 5rem 4rem;
    position: relative;
   	margin-top: 5rem;
   	margin-bottom: 5rem;
}
.schedule_section .green_box .title{
    color: white;
    font-size: 2.25rem;
    font-weight: 600;
    margin-bottom: 1.2rem;
    margin-top: -.25rem;
    position: relative;
    z-index: 9;
}
.schedule_section .green_box .text_sm{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.schedule_section .green_box .btn_white{
    background: #FFFFFF;
    color: #446D5B;
    font-size: 1rem;
    font-weight: bold;
    border: 0.1rem solid #FFFFFF;
    padding: 1.35rem 5rem;
    border-radius: .35rem;
    margin-bottom: .75rem;
    position: relative;
    z-index: 9;
    transition: all ease .4s;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -ms-transition: all ease .4s;
    -o-transition: all ease .4s;
}
.schedule_section .green_box .btn_white:hover,
.schedule_section .green_box .btn_white:focus{
    background: #446D5B;
    color: #FFFFFF;
}
.schedule_section .green_box .date{
    color: white;
    font-size: 1rem;
    position: relative;
    z-index: 9;
}
.schedule_section .green_box img{
    width: 9.5rem;
    position: absolute;
    right: 0;
    bottom: 0;
}
.schedule_section .flower{
    width: 40rem;
    position: absolute;
    right: 0;
    top: 15%;
}
.schedule_section .signature{
    width: 25rem;
    position: absolute;
    left: 0;
    bottom: 1rem;
}
footer{
    position: relative;
    background: #367367;
    padding: 3rem 0;
}
footer p{
    margin: 0;
    color: white;
    font-weight: 500;
    font-size: 1.2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
footer p span{
    font-size: 1rem;
    font-weight: 500;
}



/* RESPONSIVE  */

.visible-xs{
	display: none !important;
}
.hidden-xs{
	display: block !important;
}
@media(max-width: 767px){
	.visible-xs{
		display: block !important;
	}
	.hidden-xs{
		display: none !important;
	}
}
@media(max-width: 1440px){
	html, body{
		font-size: 14px;
	}
}
@media(max-width: 1366px){
	html, body{
		font-size: 13px;
	}
}
@media(max-width: 1200px){
	html, body{
		font-size: 12px;
	}
	.space_section .space_box{
		height: 600px;
	}
	.space_section .space_box2{
		height: 500px;
	}
}
@media(max-width: 1024px){
	html, body{
		font-size: 10px;
	}
	.header{
		height: 50vh;
	}
	.space_section .space_box {
	    height: 500px;
	}
	.space_section .space_box2 {
	    height: 400px;
	}
}
@media(max-width: 767px){
	html, body{
		font-size: 12px;
	}
	.header{
	    height: auto;
	    padding: 10rem 0;
	}
	.header .head{
	    font-size: 2.5rem;
	}
	.space_section .space_box{
	    display: block;
	    height: auto;
	}
	.space_section .space_box .plant{
	    position: relative;
	    top: initial;
	    left: initial;
	    width: 50%;
	    margin-bottom: 2rem;
	}
	.space_section .space_box .flower{
	    bottom: 0;
	    top: initial;
	    width: 20%;
	}
	.green_box .text_sm{
	    margin-bottom: 2rem;
			text-align: center;
	}
	.green_box .title{
			text-align: center;
	}

	.space_section .space_box2{
	    display: block;
	    width: 100%;
	}
	.space_section .space_box2 .plant{
	    display: block;
	    position: relative;
	    margin-left: auto;
	    margin-top: 2rem;
	}

	.space_section .space_box .head,
	.space_section .space_box .text {
		text-align: center;
	}
	.space_section .space_box .flower {
	    bottom: 50%;
	}
	.schedule_section .flexer{
	    display: block;
	}
	.schedule_section .title{
			text-align: center;
	    margin-bottom: 2rem;
	}
	.schedule_section .schedule_box{
	    display: block;
	}
	.schedule_section .schedule_box .greenbox{
	    width: 100% !important;
	    margin-right: 0;
	}
	.schedule_section .schedule_box .greenbox.box_sm.top:before{
	    left: 49.25%;
	}
	.schedule_section .schedule_box .greenbox.box_lg{
	    margin-top: 3rem;
	}
	.schedule_section .schedule_box .greenbox.box_lg:after{
	    content: '';
	    background: #E9F1EF;
	    width: .15rem;
	    display: inline-block;
	    height: 3rem;
	    position: absolute;
	    left: 50%;
	    top: -3rem;
	}
	.schedule_section .schedule_box .greenbox .imgbox{
			margin-top: 10px;
			justify-content: center;
	}

	.schedule_section .greenbox .item_presenter {
		display: -webkit-box;
	  display: -moz-box;
	  display: -ms-flexbox;
	  display: -webkit-flex;
	  display: flex;
		-webkit-flex-flow: row;
  	flex-flow: row;
	}

	.schedule_section .greenbox .head{
			text-align: center;
	}



	footer p{
	    display: block;
	    text-align: center;
	}
	footer p span{
	    display: inline-block;
	}
}
@media(max-width: 576px){
	html, body{
		font-size: 11px;
	}
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
	z-index: 999999;
}

/* Modal Content */
.modal-content {
	background-color: #E9EDEB;
  margin: 10% auto; /* 10% from the top and centered */
  padding: 30px 40px;
  border: 1px solid #888;
	width: 90%;
  max-width: 500px; /* Balanced width */
  border-radius: 10px; /* Rounded corners for modal */
  color: #000; /* White text */
}

/* Input fields styling */
input[type="text"], input[type="email"], input[type="submit"] {
  width: 100%; /* Take up most of the modal width */
  padding: 12px 20px;
  margin: 0px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px; /* Rounded corners for inputs */
  box-sizing: border-box;
	font-size: 16px;
}

#registerForm label {
	color: #4B625C;
	margin-bottom: .3rem;
}

#registerForm #firstName {
	margin-bottom: 20px;
}

.closeWrap .intro {
	color: #4B625C;
	font-size: 1.4rem;
	margin-bottom: 1rem;
	font-weight: 600;
}

/* The Close Button */
.closeWrap {
	width: 100%;
	/* text-align: right; */
	display: flex;
	justify-content: space-between;
}

.close {
  color: #000;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #666;
  text-decoration: none;
  cursor: pointer;
}

/* Submit button styling */
input[type="submit"] {
	background: #3AA691;
	color: white;
	font-size: 1rem;
	font-weight: bold;
	border: 0.1rem solid #3AA691;
	padding: 1rem 5rem;
	border-radius: .35rem;
	margin-bottom: .75rem;
	transition: all ease .4s;
	-webkit-transition: all ease .4s;
	-moz-transition: all ease .4s;
	-ms-transition: all ease .4s;
	-o-transition: all ease .4s;
}

input[type="submit"]:hover {
	background: white;
	color: #3AA691;
}

#confirmationMessage {
	color: #4B625C;
}

/* Confirmation Message styling */
#confirmationMessage {
  text-align: center;
  padding: 20px;
  font-size: 18px;
}

footer a {
	color: #fff;
}

footer a:hover {
	color: #fff;
	text-decoration: underline;
}
