/*----------------------body------------------------*/

body.noScroll {
  overflow:hidden;
}

.body {
	background-image:url("../../images/bg_header.gif");
	background-position:100% 15px;
	background-repeat:no-repeat;
	clear:both;
	display: block;
	float:none;
	margin:0px auto 0px auto;
	max-width:1440px;
	padding:0px 0px 0px 0px;
	text-align:left;
	width:90%;
}

.body img {
	float:left;
}

.menuToggle {
  background-color:#EBF0EF;
  border:2px solid #326758;
  color:#326758;
  cursor: pointer;
  display:block;
  padding:3px;
  position:absolute;
}

/*----------------------header------------------------*/

.header {
	clear:both;
	height:120px;
	position:relative;
	width:100%;
}

.header span {
	clear:both;
	display:block;
}

.header span.titleTop {
	color:#326758;
	font-size:150%;
	font-style:normal;
	font-weight:bold;
	margin:40px 0px 0px 0px;
	padding:0px;
}

.header span.titleTop span {
	clear:none;
	display:inline;
	font-size:70%;
}

.header span.titleBottom {
	font-size:130%;
	font-style:normal;
	font-weight:normal;
	margin:2px 0px 0px 0px;
	padding:0px;
}

.header .menuToggle {
  display:none;
  right:0px;
  top:60px;
}

/*----------------------content------------------------*/

.content {
	background-color:#EBF0EF;
	overflow:visible;
	padding:20px 20px 5px 20px;
  width: calc(100% - 300px);
}

.content p {
	text-align:justify;
}

.content ul {
	float:left;
	padding-right:10px;
	width: calc(100% - 30px);
}

.content ul.listHalf {
  width: calc(50% - 30px);
}

.content img.imageWrap {
  margin:0 20px 10px 0;
}

.content .BackToTop {
  display:none;
}

.contentLeft,
.contentRight {
  margin:0px 0px 0px 10px;
	width: calc(50% - 10px);
}

.contentLeft {
	margin:0px 10px 0px 0px;
}

.sobriety {
	width:100%;
}

#sobrietyResult {
	display:none;
}

.sobriety h2 {
	margin:0px 0px 10px 0px;
}

/*----------------------menu------------------------*/

.menu {
	margin:0px 0px 0px 20px;
	width:240px;
}

.menu .menuToggle {
  display:none;
  right:20px;
  top:20px;
}

.menu ul {
	border-top:1px solid #326758;
	border-bottom:1px solid #326758;
	padding-top:1px;
	width:100%;
}

.menu ul li {
	margin:0px 0px 1px 0px;
	padding:0px;
	width:100%;
}

.menu ul li a {
	background-color:#EBF0EF;
	color:#326758;
	display:block;
	font-weight:normal;
	padding:5px 10px 5px 10px;
	text-decoration:none;
	width: calc(100% - 20px);
}

.menu ul li.on a,
.menu ul li a:hover {
	background-color:#326758;
	color:#FFFFFF;
	text-decoration:none;
}

.menu ul li.on ul {
  border-top:1px solid #FFFFFF;
}

.menu ul li.on ul li a {
	padding:5px 10px 5px 25px;
	width: calc(100% - 35px);
}

.menu ul li.extra {
	border-top:1px solid #326758;
	padding-top:1px;
}

/*----------------------logos------------------------*/

.logo {
	background-color:#FFFFFF;
	border:1px solid #326758;
	padding:10px;
}

.logoSchool {
	margin-bottom:15px ! important;
	margin-top:10px ! important;
}

.logoMedia {
	margin-bottom:10px ! important;
	margin-top:25px ! important;
}

.logoSqua {
  height:75px;
  width:auto;
}

.logoHori {
  height:60px;
  object-fit:contain;
  max-width:calc(100% - 22px);
}

.logoVert {
  height:auto;
  width:50px;
}

.logoSchool.logoGrid {
  height:60px !important;
  max-width:calc(100% - 22px) !important;
	margin:0px ! important;
}

/*----------------------responsive------------------------*/

@media only screen and (max-width: 1080px) {
  .content {
    width: calc(100% - 240px);
  }

  .menu {
    width:180px;
  }
}

@media only screen and (max-width: 640px) {
  .header .menuToggle {
    display:block;
  }

  .content {
    width: calc(100% - 40px);
  }

  .content .BackToTop {
    display:block;
  }

  .menu {
    position:fixed;
    top:0;
    left:0;
    right:0;
    opacity:1;
    height:100vh;
    height:calc(var(--vh, 1vh) * 100);
    background-color:rgb(255,255,255,.95);
    z-index:999;
    display:none;
    overflow:auto;
    width: calc(100% - 40px);
    margin:0px;
    padding:20px 20px 20px 20px;
  }

  .menu.active {
    display:block;
  }

  .menu .menuToggle {
    display:block;
  }

  .menu ul {
    margin-bottom:40px;
    margin-top:40px;
  }
}

@media only screen and (max-width: 480px) {
  label {
    clear:both;
    float:none;
    margin:0px 0px 5px 0px;
    text-align:left;
  }

  input.fieldSubmit {
    margin:18px 0 10px 0;
  }

  .sobriety h2 {
    font-size:100%;
  }

  .header span.titleTop {
    font-size:110%;
    margin-top:40px;
  }

  .header span.titleBottom {
	  font-size:110%;
	  margin-top:5px;
  }

  .content img.imageWrap {
    float:none;
    margin:0 0 10px 0;
  }
}