*{
  margin:0;
  padding:0;
}
body{
  font-family:arial,sans-serif;
  font-size:100%;
  /*margin:3em;*/
  /*background:wheat;
  background:#666;*/
  background:#607B8B;
  color:black;
}

p{
  font-size: 100%;
  font-weight: normal;
}

h1{
  font-family: "Yanone Kaffeesatz", arial, sans-serif;
  font-size: 220%;
  font-weight: bold;
}

h2{
  font-family: "Poller One", arial, sans-serif;
  font-size: 200%;
  /*font-weight: bold;*/
}

h3{
  /*font-weight: bold;*/
}

h4{
  /*font-weight: bold;*/
}

a:visited, a:link, a:active
	{
	text-decoration: none;
	}

a.footerLinks:link
	{
	color: black ;
	}

a.footerLinks:visited
	{
	color: black ;
	}

a.footerLinks:hover
	{
	color: #476373 ;
	}

a.footerLinks:focus
	{
	color: #476373 ;
	}

a.footerLinks:active
	{
	color: #476373 ;
	}

img
	{
	border: none; 
	}

table
	{
	width: 100%
	}

#otherYears
{
  font-family: "Lato", arial, sans-serif;
  font-size: 8pt;
  font-weight: normal;
}

.classYearLinks
	{
	font-family: "Lato", arial, sans-serif;
	font-size: 8pt;
	font-weight: normal;
	}

.classYrsIndex
	{
	border: 1px solid #DDDDDD;
	-webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;
	background: #DBEEF9 ;
	margin: 5px 0 ;
	/*display: block ;*/
	cursor:pointer;
	}

.classYrsIndex:hover
	{
	background: #B9CCD7 ;
	}

.classYrsIndex:focus
	{
	background: #B9CCD7 ;
	}

.classYrsIndexLabel
	{
	border: 1px solid #DDDDDD;
	background: white ;
	background: #B9CCD7 ;
	width: 130px ;
	position: relative ;
	top: -8px ;
	left: 20px ;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	text-align: center ;	
	}

.error
	{
	font-family: "Lato", arial, sans-serif;
	color: red ;
	font-size: 8pt ;
	margin: 0 0 0 5px ;
	}

.classListRows
	{
	height: 40px; 
	vertical-align: middle; 
	/*border-bottom: 9px solid #D2691E;*/
	border-bottom: 1px solid #EDB993; 
	margin-bottom: -1px; 
	}

.studentIndexTable
	{
	padding: 0 10px ;
	width: 165px ;
	display: inline-block;
	}

.studentIndexBoxLink
	{
	}

.schoolStudentNameLinks
{
	font-size:  10pt;
}

.schoolStudentNameLinks:hover 
{
	font-weight:  normal;
	color:        'red' ;
}

.schoolStudentNameLinks:focus 
{
	font-weight:  normal;
	color:        'red' ;
}


#logo
	{
	font-family: 'Poller One', cursive;
	font-size:    40pt;
	font-weight:  normal;
	line-height:  0.6em;
	color:        #476373 ;
	/*color:        #0000FF ;*/
	padding: 10px 0 0 0 ;
	/*text-shadow: 2px 3px 5px #555;*/
	-webkit-text-stroke: 1px black;
	text-shadow:
	 3px 4px 6px #888,
	 -1px -1px 0 #000,  
	  1px -1px 0 #000,
	  -1px 1px 0 #000,
	   1px 1px 0 #000;
	/*text-outline: 1px 1px #ffffff;  /* Not supported in any browser yet */
	}

.formHeading
{
  font-family: "Yanone Kaffeesatz", arial, sans-serif;
  font-size: 16pt;
  font-weight: normal;
  padding: 5px 5px 0 5px;
  text-align: center;
  float: center;
}

.schoolInfo {
  /*font-family: "Roboto";
  font-size: 1em;*/
  font-family: 'Lato' ; 
  font-size:103% ; 
  padding: 5px 0 ;
}

.stdForm
	{
	border: 1px solid #DDDDDD;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	box-shadow: 2px 2px 1px rgba(5,5,5,.2) ;
	-moz-box-shadow: 2px 2px 1px rgba(5,5,5,.2) ;
	-webkit-box-shadow: 2px 2px 1px rgba(5,5,5,.2) ;
	background: white ;
	-webkit-transition: all 0.30s ease-in-out;
	-moz-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
	outline: none;
	/*background: -webkit-linear-gradient(white, #F0F0F0) ;
	background: -o-linear-gradient(white, #F0F0F0) ;
	background: -moz-linear-gradient(white, #F0F0F0) ;
	background: linear-gradient(white, #F0F0F0) ;*/
	padding: 3px ;
	margin: 1px 0 ;
	text-align: left ;
	font-family: "Lato", arial, sans-serif;
	font-size: 11pt;
	font-weight: normal;
	}

input[type=text]:focus, input[type=password]:focus, textarea:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  padding: 3px 0px 3px 3px;
  border: 1px solid rgba(81, 203, 238, 1);
}

.stdFormLbl
	{
	border: none;
	padding: 0 5px ;
	margin: 0 ;
	text-align: right ;
	font-family: "Lato", arial, sans-serif;
	font-size: 9pt;
	font-weight: normal;
	width: auto ; ;
	}

.dataSmall
	{
	font-family: "Lato", arial, sans-serif;
	font-size: 10pt;
	font-weight: normal;
	padding: 0 10px ;
	}

#sendMsgForm, #tributeForm, #login, #register, #stickyNote, #stickyNoteAdd, #formSubmisionResults, #formSubmisionResultsWithPgReload, #aboutUs, #support, #otherClassYears, #rptDeath, #logout, #deleteRequest, #editprofile, #showprofile, #account, #sendEditLink, #resurrect, #resurrectRequest, #TOS, #privacyPolicy, #confirmRefundRequest, #survey1, #msg, #addNames, #chgSchool
	{
	padding: 10px 5px 10px 10px;
	/*float: center;*/
	/*width: 85%; 
	min-height: 150px;*/
	}

#sendMsgContent
	{
	float: center;
	overflow-y: scroll; 
	height: 300px;
	}

.formFieldsTable
	{
	border-collapse: collapse;
	}

.formFieldsTable td
	{
	padding: 0px 5px 5px 0 ;
	}

a:link, a:active, a:visited, a:hover, a:focus
	{
	color: #476373 ;
	text-decoration: none;
	}

a:visited 
	{
	/*color: #476373 ;*/
	color: #587484 ;
	}

.StudentName 
	{
	font-family: "Yanone Kaffeesatz",arial,sans-serif;
	font-size: 150%;
	font-weight: normal;
	}


.classYearLinks
{
  font-family: "Lato", arial, sans-serif;
  font-size: 8pt;
  font-weight: normal;
}

.td-box
	{
	border: 1px solid #DDDDDD;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	background: #FFFCF0 ;
	margin: 0 ;
	padding: 5px 15px 5px 5px ;
	}

.slideshow
	{
	/*float:left; */
	/*margin: 5px 30px 0 0; */
	/*margin: auto;*/
	position: relative; 
	/*height: 100% ;*/
	/*top: -100px ;*/
	/*left: 40px ;*/
	z-index: 30;
	-o-transform:      rotate(-7deg);
	-webkit-transform: rotate(-7deg);
	-moz-transform:    rotate(-7deg);
	transform:         rotate(-7deg); 
	/*background: white ;*/
	}

.slideshow img
	{
	-moz-box-shadow:    7px 7px 5px #856A4E;
	-webkit-box-shadow: 7px 7px 5px #856A4E;
	box-shadow:         7px 7px 5px #856A4E; 
	background: white ;
	}

.yearbook
	{
	/*float:left; */
	/*margin: 5px 30px 0 0; */
	/*margin: auto;*/
	position: relative; 
	/*height: 100% ;*/
	/*top: -100px ;*/
	/*left: 40px ;*/
	z-index: 30;
	-o-transform:      rotate(9deg);
	-webkit-transform: rotate(9deg);
	-moz-transform:    rotate(9deg);
	transform:         rotate(9deg); 
	/*background: white ;*/
	}

.yearbook img
	{
	-moz-box-shadow:    7px 7px 5px #856A4E;
	-webkit-box-shadow: 7px 7px 5px #856A4E;
	box-shadow:         7px 7px 5px #856A4E; 
	background: white ;
	}




ol{text-align:center;}
ol li{display:inline;padding-right:1em;}
ol li a{color:#fff;}


/*---- CROSS BROWSER DROPDOWN MENU ----*/
ul#nav {margin: 0 0 0 0px;}

ul.drop a { display:block; color: #476373; font-family: Verdana; font-size: 11px; font-weight: bold; background: white}

ul.drop, ul.drop li, ul.drop ul { list-style: none; margin: 0; padding: 1px; border: 0;  color: #476373;}

ul.drop { position: relative; z-index: 27; float: left; }

ul.drop li { float: left; color: #476373; font-size: 11px; font-weight: bolder; line-height: 1.3em; vertical-align: middle; zoom: 1; padding: 1px; }

ul.drop li.hover, ul.drop li:hover { position: relative; z-index: 29; cursor: default; background: white; -webkit-user-select: none; }
ul.drop li.focus, ul.drop li:focus { position: relative; z-index: 29; cursor: default; background: white; -webkit-user-select: none; }
/* http://bencollier.net/2010/04/disabling-hold-to-copy-on-mobile-safari/ */
/* https://css-tricks.com/forums/topic/css-dropdown-menu-for-the-ipad/ */

ul.drop ul { visibility: hidden; position: absolute; top: -10px; left: 0px; z-index: 28; width: 195px; background: white; border: 1px solid #fff; }

ul.drop ul li { float: none; }

ul.drop ul ul { top: -2px; left: 50%; }

ul.drop li:hover > ul { visibility: visible }
ul.drop li:focus > ul { visibility: visible }

.popupOptionstable
	{padding: 0 5px;
	}

/*popeasy models          http://thomasgrauer.com/popeasy/#    */
.overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 60;
  display: none;
}

.modalOLD
	{
	display: none;
	margin-left: auto ;
	margin-right: auto ;
	background-color: #FFFFF0; 
	background-color: white; 
	-webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;
	border:solid 1px #ccc; 
	padding: 0;
	overflow: visible;
	z-index: 71;
	position: fixed;
	min-width: 350px;
	max-width: 700px;
	min-height: 100px;
	/*max-height: 400px;*/
	/*top: 20px;
	left: 20px;*/
	}

.modal
	{
	display: none;
	/*background-color: #E1EFF7; 
/*background-image:url('http://www.girlswithslingshots.com/images/background-overlay.png');
background-repeat:repeat-x;*/
	-webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px;
	background: -webkit-linear-gradient(#F4FFFA, #D0DEE6) ;
	background: -o-linear-gradient(#F4FFFA, #D0DEE6) ;
	background: -moz-linear-gradient(#F4FFFA, #D0DEE6) ;
	background: linear-gradient(#F4FFFA, #D0DEE6) ;
	border:solid 1px #ccc; 
	padding:0 20px 20px;
	overflow:visible;
	z-index:71;
	position:absolute;
	width: 500px;
	min-width: 350px;
	max-width: 700px;
	min-height: 100px;
	}

.modal p 
	{
	font-size: 14px;
	text-align: left;
	margin: 10px 0 0;
	}

.modal p:hover, p:focus
	{
	cursor: pointer;
	}

.closeBtn
	{
	display: block;
	float:right;
	position:relative;
	top:-30px;
	right: -15px;
	z-index: 72;
	}

button
	{
	background: #B9CFDC;
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2); 
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2); 
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px; 
	border-radius: 3px;
	border: solid 1px #ccc; 
	padding: 10px 20px; 
	margin: 0 0 20px; 
	font-family:Arial, sans-serif; 
	font-size: 1.0em;
	text-transform: uppercase;
	font-weight: bold;
	color: #333;
	cursor: pointer;
	}

button:hover
	{
	background: #DFEDF5;
	}

button:focus
	{
	background: #DFEDF5;
	}

.smallButton
{
	margin: 1px; 
	padding: 0px 3px; 
	background: #CADFED;
	font-size: 8pt;
}

#stickyNote
	{
	/*padding: 20px;*/
	color: #000;
	background: #ffc ;
	-webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;
	-moz-box-shadow:    7px 7px 5px #708090;
	-webkit-box-shadow: 7px 7px 5px #708090;
	box-shadow:         7px 7px 5px #708090; 
	font-family: 'Short Stack', cursive ;
	font-size: 150% ;
	max-width: 250px ;
	text-align: left ;
	}

#postems ul,li
	{
	list-style:none;
	}
#postems ul{
  overflow:hidden;
  padding: 2em;
}
#postems ul li a{
  text-decoration:none;
  color:#000;
  background:#ffc;
  display:block;
  height:7em;
  width:7em;
  padding: 0 0.3em 0 0.3em;
  -moz-box-shadow:5px 5px 7px rgba(33,33,33,1);
  -webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7);
  box-shadow: 5px 5px 7px rgba(33,33,33,.7);
  -moz-transition:-moz-transform .15s linear;
  -o-transition:-o-transform .15s linear;
  -webkit-transition:-webkit-transform .15s linear;
}
#postems ul li{
  margin:1em;
  float:left;
}
#postems ul li h2{
  font-size:50%;
  font-weight:bold;
  padding-bottom:10px;
}
#postems ul li p
	{
	font-family:"Reenie Beanie",arial,sans-serif;
	font-family: 'Coming Soon', cursive;
	font-family: 'Handlee', cursive;
	font-family: 'Neucha', cursive;
	font-family: 'Patrick Hand', cursive;
	font-family: 'Short Stack', cursive;
	font-size: 80%;
	}
#postems ul li a{
  -webkit-transform: rotate(-6deg);
  -o-transform: rotate(-6deg);
  -moz-transform:rotate(-6deg);
}

#postems ul li:nth-child(even) a{
  -o-transform:rotate(4deg);
  -webkit-transform:rotate(4deg);
  -moz-transform:rotate(4deg);
  position:relative;
  top:5px;
  background:#cfc;
}

#postems ul li:nth-child(3n) a{
  -o-transform:rotate(-3deg);
  -webkit-transform:rotate(-3deg);
  -moz-transform:rotate(-3deg);
  position:relative;
  top:-5px;
  background:#ccf;
}

#postems ul li:nth-child(5n) a{
  -o-transform:rotate(5deg);
  -webkit-transform:rotate(5deg);
  -moz-transform:rotate(5deg);
  position:relative;
  top:-10px;
}
/*
#postems ul li a:hover,ul li a:focus{
  box-shadow:10px 10px 7px rgba(0,0,0,.7);
  -moz-box-shadow:10px 10px 7px rgba(0,0,0,.7);
  -webkit-box-shadow: 10px 10px 7px rgba(0,0,0,.7);
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -o-transform: scale(1.3);	
  width:7em;
  font-size:220%;
  overflow-y: auto;
  position:absolute;
  left: 350px;
  top:  250px;
  z-index:5;
}
*/

.messages
	{
	background: #DFEDF5 ;
	padding: 5px ;
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 2px 3px rgba(0, 0, 0, 0.2); 
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 2px 3px rgba(0, 0, 0, 0.2); 
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0px 2px 3px rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px; 
	border-radius: 3px;
	border: solid 1px #ccc; 

	}

.ui-autocomplete-loading 
	{
	background: white url('http://old-friends.co/images/ajax-loader_16x16.gif') right center no-repeat;
	}

.alignLeft   {text-align: left;}
.alignCenter {text-align: center;}
.alignRight  {text-align: right;}
.w950 {width: 950px;}
.w900 {width: 900px;}
.w850 {width: 850px;}
.w800 {width: 800px;}
.w750 {width: 750px;}
.w700 {width: 700px;}
.w650 {width: 650px;}
.w600 {width: 600px;}
.w550 {width: 550px;}
.w500 {width: 500px;}
.w450 {width: 450px;}
.w400 {width: 400px;}
.w350 {width: 350px;}
.w300 {width: 300px;}
.w250 {width: 250px;}
.w200 {width: 200px;}
.w150 {width: 150px;}
.w100 {width: 100px;}
.h650 {height: 650px;}
.h600 {height: 600px;}
.h550 {height: 550px;}
.h500 {height: 500px;}
.h450 {height: 450px;}
.h400 {height: 400px;}
.h350 {height: 350px;}
.h300 {height: 300px;}
.h250 {height: 250px;}
.h200 {height: 200px;}
.h150 {height: 150px;}
.h100 {height: 100px;}
.colorRed  {color: red;}
.colorBlue {color: blue;}