html { -webkit-text-size-adjust: 100%;}

@import "compass/css3";

#toggle {
  display: none;
}

#toggle:target {
  display: block;
}

#toggle:target + .close {
  display: block;
}

.close {
  display: none;
}

body {
	margin: 0px;
	vertical-align: top;
	background-color: #d697db;
}


em.hide-on-mobile { display: none; }


/* mobileheader */

.mobileheader {
  background-color: transparent;
  position: fixed; 
  width: 100%;
  z-index: 3;
}

.mobileheader ul {
  margin: 0px 0px 0 0px; 
  padding: 0;
  list-style: none;
  overflow: hidden;
  background-color: transparent;
}

.mobileheader li {
	border-bottom: 0px;
	margin-left: 8%; margin-right: 8%; 
}

.mobileheader li a {
  font-family: arial, Helvetica, sans-serif;
  display: block;
text-align: center;
  padding: 2px 2px; 
 border-bottom: 1px solid #fff;
 border-left: 1px solid #f4f4f4;
 border-right: 1px solid #f4f4f4;
border-top: 0px;
  text-decoration: none;
  background-color: #630063;
  opacity: 0.9;
color: #fff;
font-size: 15px; 
margin-left: 0px;
}

.mobileheader li a:hover,
.mobileheader .menu-btn:hover {
  background-color: #323232;
}


/* menu */

.mobileheader .menu {
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
}

/* menu icon */

.mobileheader .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  padding: 24px 16px; 
  position: relative;
  user-select: none;
}

.mobileheader .menu-icon .navicon {
  background: #484848;
  display: block;
/* Mike changed from 2 to 3 */
  height: 3px;
  position: relative;
  transition: background .2s ease-out;
/* Mike changed from 20 to 32 */
  width: 32px; 
}

.mobileheader .menu-icon .navicon:before,
.mobileheader .menu-icon .navicon:after {
  background: #484848;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

.mobileheader .menu-icon .navicon:before {
  top: 10px; 
}

.mobileheader .menu-icon .navicon:after {
  top: -10px; 
}

/* menu btn */

.mobileheader .menu-btn {
  display: none;
}

.mobileheader .menu-btn:checked ~ .menu {
  max-height: 480px;
}

.mobileheader .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}

.mobileheader .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}

.mobileheader .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}

.mobileheader .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.mobileheader .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}


h1 {font-size: 24px; margin-left: 3%; margin-right: 3%; font-family : verdana, arial; margin-top: 12px; color : #630063;}

h2 {font-size: 19px;  margin-left: 3%; margin-right: 3%; color: #484848; font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; padding-bottom: 6px;}

h3 {font-size: 22px;  margin-left: 3%; margin-right: 3%; color: #605E5E; font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; padding-bottom: 8px; padding-top: 8px;}

h5.home {
    font-style: normal;
    font-variant: normal;
    font-weight: bold;
    font-stretch: normal;
    font-size: 18px;
    line-height: 1.4em;
    letter-spacing: 0.28em;
    font-family: Verdana, sans-serif;
    color: #2F2E2E;
    margin-top: 4px;
    margin-bottom: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
}

p {font-size: 17px; margin-left: 3%; margin-right: 3%; color: #760443; line-height: 1.3em; font-family: verdana, geneva; text-align: left;}

/* extra space on mobiles */
p.esom {
	line-height: 1.6em;
}

p.sources {font-size: 11px; line-height: 1.3em;}

li {font-size: 16px; margin-left: 4%; margin-right: 4%; color: #760443; line-height: 1.3em; font-family: verdana, geneva; text-align: left;
	
}

li > a {font-size: 17px; padding-top: 8px; padding-bottom: 8px; line-height: 1.6em;}




table.counsellors-table {
	vertical-align: top;
	padding: 0;
	margin: 0;
}

table.desktop-table {
	display: hidden;
}

table.table-margin {margin-left: 3%;}

a {color: #630063;}
a:hover,a:active {color: #7f89c6;}

a.bl {
	text-decoration: none;
	color: #630063;
}

a.bl2 {
	text-decoration: underline;
	color: #630063;
	font-size: 14px;
}

div.bmh {
	margin-top: 8px;
	width: 100%;
	text-align: center;
	#630063;
}

img.mi {
	margin-right: 2px;
}
