/*Padding and margin reset*/
	html, body {
	 Background: #94aace;	
	}
	html, body, p, ul, li, ol, dl, dt, dd, h1, h2, h3, h4, h5, h6, blockquote, address, table, tr, td, th, form, fieldset, img{
	margin: 0;
	padding: 0;
	font-size: small;
	list-style: none;
	font-style: normal;
	font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Helvetica, Arial, Tahoma, sans-serif;		
	}
/* Header */
   div {
	margin-left:  5%;
	margin-right: 5%;
	margin-top: 2%;
   }
   img {
   border-radius: 10%;
    }
   
	#header{
	    background:   url(logo-100x100.png) no-repeat 90% 20% ;
        margin-bottom: 0%;
		padding:30px 10px 25px 5px; /* 30px 10px 25px 334px*/
	}
	
	#header h1{
	color:#5265AD;
	font-size:3.5em;
	font-weight: normal;
	}
	
	#header h2{
		color:#94AACE;
		font-size:2em;
		font-weight: normal;
	}
	/* Content */

	#content h1{
		font-size: 2.5em;
		font-weight:normal;
		position:relative;
		margin-top:-1.5em;
		height:1.5em;
 	}
	
	#content p, #content #main ul, #content ol{
		margin-bottom:1em;
	}
	
	#content h2{
		font-size:1.5em;
		font-weight: normal;
		color:#333;
		margin-bottom:.25em;
	}
	
	#content h3{
		font-size:1em;
		margin:.25em 0 .75em;
	}

	#content #main ul, #main ul li{
		list-style-type: square;  
	}
	
	#content #main ol, #main ol li{
		list-style-type: decimal;
	}
	
	#content #main ol, #content #main ul{
		padding-left:2em;
	}
	/* Navigation */

#wrapper {
    max-width: 800px;
    margin: auto;
	width: 90%;
	background: url(bg_tab_tl.gif) repeat-y top left,url(bg_tab_tr.gif) repeat-y top right;
	background-color: #FEFEFE;
}
	background:url(bg_tab_br.gif) no-repeat bottom right;

#Warning {
  color: red;
}
#wrapper #main h1 {
	color: #94AACE;
	font-size: 2.5em;
	line-height: 3;
}


.msg {
    margin: 30px auto; 
    padding: 10px; 
    border-radius: 5px; 
    color: #3c763d; 
    background: #dff0d8; 
    border: 1px solid #3c763d;
    width: 50%;
    text-align: center;
}
#content  h2 {
	font-size: 1.5em;
	color: #333;
}
#wrapper #main h2 {
	font-size: 1.2em;
	color: #333;
	line-height: 2;
}

#mmenu {
    width: 100px;
    text-align: left;
	margin-left: auto;
	font-size:10px;
	}
#wrapper #main #formlabel {
	width: 50px;
}

.pagination {
	list-style-type: none;
	padding: 10px 0;
	display: inline-flex;
	justify-content: space-between;
	box-sizing: border-box;
}
.pagination li {
	box-sizing: border-box;
	padding-right: 10px;
	list-style-type:none;
}
.pagination li a {
	box-sizing: border-box;
	background-color: #e2e6e6;
	list-style-type:none;
	padding: 8px;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	color: #616872;
	border-radius: 4px;
}
.pagination li a:hover {
	background-color: #d4dada;
}
.pagination .next a, .pagination .prev a {
	text-transform: uppercase;
	font-size: 12px;
}
.pagination .currentpage a {
	background-color: #518acb;
	color: #fff;
}
.pagination .currentpage a:hover {
	background-color: #518acb;
}
  /* made this so i could visually center the shapes */


.button {
  box-sizing: border-box;
  height: 74px;
  background-color:#FFFFFF;
  
  /*border-color: transparent transparent transparent #202020; */
 
  border-color: transparent transparent transparent #94AACE; 
  transition: 100ms all ease;
  will-change: border-width;
  cursor: pointer;

  // play state
  border-style: solid;
  border-width: 37px 0 37px 60px;

  // paused state
  &.pause {
    border-style: double;
    border-width: 0px 0px 0px 60px; 
/*    border-color: transparent  #94AACE transparent #94AACE; 
    border-width: 0px 30px 0px 30px;  */
  }
}

.button.play {
  box-sizing: border-box;
  width: 74px;
  height: 74px;
  border-style: solid;
  border-width: 37px 0 37px 74px;
  /*border-color: red blue green yellow;*/
  /*  border-color: transparent transparent transparent #202020; */
  border-color: transparent transparent transparent #94AACE; 
  background-color:#FFFFFF;
	
}

.button.pause {
  width: 74px;
  height: 74px;
 /* border-color: #202020; */
   border-color: #94AACE; 

   border-style: double;
   border-color: transparent  transparent transparent #94AACE; 
   border-width: 0px 0px 0px 60px; 
  background-color:#FFFFFF;
  }

.playpause {
  label {
    display: block;
    box-sizing: border-box;
    
    width: 0;
    height: 74px;
    
    cursor: pointer;

    border-color: transparent transparent transparent #202020;
    transition: 100ms all ease;
    will-change: border-width;
    
    // paused state
    border-style: double;
    border-width: 0px 0 0px 60px;
  }
  input[type='checkbox'] {
    visibility: hidden;
    
    &:checked + label {
      // play state
      border-style: solid;
      border-width: 37px 0 37px 60px;
    }
  }
}

     .radio-container {
            box-sizing: border-box;
            font-family: ‘Open Sans’, sans-serif;
            font-size: 13px;
            line-height: 30px;
            margin: 0;
            outline: 0;
            overflow: hidden;
            padding: 0;
			
			
        }


        .radio-container input {
             box-sizing: border-box;
            margin: 0;
            outline: 0;
            padding: 0;
            position: relative;
            top: 9px;
            vertical-align: top;
         }
		 
