/* ############# HERO ############# */
#sHero {background: #e7f8ff;}
#sHero .inner {padding: 30px 20px; text-align:left; background: url(../img/img_Family@2x.png) no-repeat bottom right; background-size: 250px;}

#sHero .inner h1 {color: #32CCFF; font-size: 200%; line-height: 1.3em; font-weight: 700; margin: 0;}
#sHero .inner h2 {text-transform: uppercase; font-size: 100%; font-weight: 700;}

#sHero .inner .play-video {}
#sHero .inner .play-video a {}
#sHero .inner .play-video a i {font-size: 126%;}
#sHero .inner p {margin-top: 10px;}

.modal-video {background-color:rgba(0,0,0,.7);}
.modal-video-close-btn {cursor: pointer;}
.modal-video-close-btn:before,
.modal-video-close-btn:after{background:#fff;}

/*  response  */
@media screen and (min-width: 768px) {
	#sHero .inner {padding: 60px 0px; background-size: 500px;}
	#sHero .inner h2 span {display: block;}
}

/* ############# HOW HELP ############# */
#sHowHelp {}
#sHowHelp .inner {padding: 30px 20px;}
#sHowHelp .inner h2 {font-size: 150%; line-height: 1.5em; font-weight: 300; text-align:center; margin: 0;margin-bottom: 10px;}
#sHowHelp .inner h2.call-today {margin-bottom: 20px;}
#sHowHelp .inner h2.call-today a[href^="tel:"] {color: #32CCFF; font-weight: bold;}

/*  response  */
@media screen and (min-width: 960px) {
	#sHowHelp .inner {padding: 30px 0px; padding-bottom: 50px;}
	#sHowHelp .inner h2 {font-size: 210%;}
}

/* ############# COVID-19 ############# */




/* ############# GRADUATES ############# */
#sGraduates {background: #fff;}
#sGraduates .inner {padding: 10px 20px;}

#sGraduates .cols .colL h2 {color: #8AC240; font-size: 150%; font-weight: 700;}
#sGraduates .cols .colR h3 {color: #000; margin: 0; font-size: 140%;}

/*  response  */
@media screen and (min-width: 960px) {
	#sGraduates .inner {padding: 30px 0px;}

	#sGraduates .cols {overflow:auto;}
	#sGraduates .cols .colL {width: 40%; float: left;}
	#sGraduates .cols .colL h2 {font-size: 200%; text-align:left;}
	#sGraduates .cols .colL h2 span {display:block; margin: 20px 0;}

	#sGraduates .cols .colR {width: 50%; float: right;}
	#sGraduates .cols .colR h3 {}
	#sGraduates .cols .colR p {margin-right: 90px;}

}

/* ############# BUILDING ############# */
#sBuilding {background: #fff;}
#sBuilding .inner {padding: 30px 20px;}

#sBuilding h2 {margin-bottom: 20px; font-size: 150%; line-height: 1.3em; font-weight: 300; text-align:center;}
#sBuilding h3 {font-size: 120%; line-height: 1.3em; font-weight: 300;}

/*  response  */
@media screen and (min-width: 960px) {
	#sBuilding .inner {padding: 30px 0px;}
	#sBuilding h2 {font-size: 210%;}
	#sBuilding h2 span {display:block; margin: 0px 0;}
	#sBuilding h3.caption {margin-top: 10px; font-weight: 300;}

	#sBuilding .cols {overflow:auto;}
	#sBuilding .cols .colL {width: 48%; float: left;}
	#sBuilding .cols .colR {width: 48%; float: right;}

}

/* ############# FIRSTSTEPS ############# */
#sFirstStep {margin: 0px 0; background: #fff;}
#sFirstStep .inner {padding: 10px 20px 10px 20px;}

#sFirstStep .inner h2 {margin-bottom: 20px; font-size: 150%; line-height: 1.3em; font-weight: 300; text-align:center;}
#sFirstStep .inner .how {margin-bottom: 20px;}
#sFirstStep .inner .how img {width: 100%;}

#sFirstStep .inner .testy {margin-bottom: 20px;}
#sFirstStep .inner .testy img {width: 100%;}

/*  response  */
@media screen and (min-width: 960px) {
	#sFirstStep .inner {padding: 20px 0px 30px 0;}
	#sFirstStep .inner h2 {margin-bottom: 40px; font-size: 210%;}
	#sFirstStep .inner .how {margin-bottom: 40px;}

}
/* ############# FAMILYPROGRAMS ############# */
#sFEP {background: #f7f7f7;}
#sFEP .inner {padding: 20px 20px;}

#sFEP .inner h2 {font-weight: 700; font-size: 150%; color: #992063;}
#sFEP .inner p.intro {padding-right: 8px; font-size: 100%; line-height: 1.6em;}

#sFEP .cols .iconBlock .icon {width: 75px;}
#sFEP .cols .iconBlock .icon img {width: 100%;}
#sFEP .cols .iconBlock {margin-bottom: 40px; clear:both;}
#sFEP .cols .iconBlock .icon {float:left; margin-right: 30px; margin-bottom: 40px;}
#sFEP .cols .iconBlock h3 {font-size: 100%; margin-bottom: 10px; font-weight: 700; color: #000;}
#sFEP .cols .iconBlock p {}

#sFEP .apply-block {background:#fff url(../img/img_Face@2x.png) no-repeat top left; background-size: 140px; padding: 0; font-size: 80%; width: 100%; margin: 20px auto;}
#sFEP .apply-block .inside {padding: 6px 0; margin-left: 154px; }
#sFEP .apply-block .inside p {margin: 2px 0;}
#sFEP .apply-block .inside a.actionBtn {font-size: 90%; padding: 6px 30px;}

/*  response  */
@media screen and (min-width: 960px) {
	#sFEP .inner {padding: 30px 0px;}

	#sFEP .inner h2 {font-size: 200%;}
	#sFEP .inner h2 span {display:block; margin: 14px 0;}

	#sFEP .cols {overflow:auto;}
	#sFEP .cols .colL {width: 48%; float: left;}
	#sFEP .cols .colR {width: 50%; float: right;}

	#sFEP .cols .iconBlock {margin-bottom: 10px; clear:both;}
	#sFEP .cols .iconBlock .icon {}
	#sFEP .cols .iconBlock h3 {font-size: 120%; margin-left: 100px; margin-right: 70px;}
	#sFEP .cols .iconBlock p {margin-left: 100px; margin-right: 70px;}

	#sFEP .apply-block {background-size: 200px; width: 80%; padding: 26px 0; font-size: 100%;}
	#sFEP .apply-block .inside {margin-left: 300px; margin-right: 10px;}
	#sFEP .apply-block .inside p {margin: 10px 0;}
	#sFEP .apply-block .inside a.actionBtn {font-size: 110%; padding: 10px 30px;}

}


/* ############# INTERFAITH ############# */
#sInterfaith {background: #f7f7f7; margin-bottom: 40px;}
#sInterfaith .inner {padding: 30px 20px;}

#sInterfaith .cols .colL .interfaith-logo {}
#sInterfaith .cols .colL .interfaith-logo img {width: 70%;}

#sInterfaith .call-today {text-transform: uppercase; margin: 20px 0;}
#sInterfaith .call-today a[href^="tel:"] {margin-left: 6px; color: #32CCFF; font-weight: bold;}

#sInterfaith .address-info {}
#sInterfaith .address-info .view-map {}
#sInterfaith .address-info a.view-map {text-transform: uppercase; color: #32CCFF; font-weight: bold;}

/*  response  */
@media screen and (min-width: 960px) {
	#sInterfaith .inner {padding: 30px 0px;}

	#sInterfaith .cols {overflow:auto;}
	#sInterfaith .cols .colL {width: 40%; float: left;}
	#sInterfaith .cols .colL .interfaith-logo {margin-top: 40px;}
	#sInterfaith .cols .colL .interfaith-logo img {}

	#sInterfaith .cols .colR {width: 50%; float: right;}
	#sInterfaith .cols .colR h2 {font-size: 150%; font-weight: 300;}
	#sInterfaith .cols .colR p {margin-right: 90px;}

}
/* ############# APPLY PAGES ############# */
#sHeadline {background: #f7f7f7;}
#sHeadline .inner {padding: 30px 20px; text-align:center;}
#sHeadline .inner h1 {font-weight: 300; font-size: 250%; line-height: 50px;}

/*  response  */
@media screen and (min-width: 960px) {
	#sHeadline .inner {padding: 40px 0px;}

}

#sSuccess {margin: 0px 0; background: #fff;}
#sSuccess .inner {padding: 50px 20px 50px 20px; background: #fff; text-align:center;}

/*  response  */
@media screen and (min-width: 960px) {
	#sSuccess .inner {padding: 130px 20px 130px 20px;}

}
/* ############# TEMP ############# */
#sApplyNow {}
#sApplyNow .inner {padding: 30px 20px;}

/*  response  */
@media screen and (min-width: 960px) {
	#sApplyNow .inner {padding: 30px 0px;}

#sApplyNow .cols {overflow: auto;}
#sApplyNow .cols .colL {float:left; width: 65%;}
#sApplyNow .cols .colR {float:right; width: 300px; text-align:center;}
#sApplyNow .cols .colR .banner img {width: 100%;}

}
/* ############# TEMP ############# */
/* ############# TEMP ############# */


/* default */
#sTemplate {}
#sTemplate .inner {padding: 30px 20px;}

/*  response  */
@media screen and (min-width: 960px) {
	#sTemplate .inner {padding: 30px 0px;}

}

/* respond */
@media screen and (min-width: 480px) {body: background: tan;}/* ===== == = === 30em (480px) === = == ===== */
@media screen and (min-width: 600px) {body: background: tomato;}/* ===== == = === 37.5em (600px) === = == ===== */
@media screen and (min-width: 768px) {body: background: brown;}/* ===== == = === 48em (768px) === = == ===== */
@media screen and (min-width: 1024px) {body: background: gray;}