﻿/* 
 * HTML5 ✰ Boilerplate
 *
 * What follows is the result of much research on cross-browser styling. 
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 * 
 * ==|== normalize ==========================================================
 */


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
   display: block;
}

audio, canvas, video {
   display: inline-block;
   *display: inline;
   *zoom: 1;
}

   audio:not([controls]) {
      display: none;
   }

[hidden] {
   display: none;
}

/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Force vertical scrollbar in non-IE
 * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html {
   font-size: 100%;
   overflow-y: scroll;
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
}

body {
   margin: 0;
   font-size: 13px;
   line-height: 1.231;
}

body, button, input, select, textarea {
   font-family: sans-serif;
   color: #222;
}

/* 
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */

::-moz-selection {
   background: #fe57a1;
   color: #fff;
   text-shadow: none;
}

::selection {
   background: #fe57a1;
   color: #fff;
   text-shadow: none;
}


/* =============================================================================
   Links
   ========================================================================== */

a, a:visited, a:hover, a:focus, a:active {
   color:#2A4882; 
   text-decoration: none;
   outline: 0;
}

/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] {
   border-bottom: 1px dotted;
}

b, strong {
   font-weight: bold;
}

blockquote {
   margin: 1em 40px;
}

dfn {
   font-style: italic;
}

hr {
   display: block;
   height: 1px;
   border: 0;
   border-top: 1px solid #ccc;
   margin: 1em 0;
   padding: 0;
}

ins {
   background: #ff9;
   color: #000;
   text-decoration: none;
}

mark {
   background: #ff0;
   color: #000;
   font-style: italic;
   font-weight: bold;
}

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp {
   font-family: monospace, monospace;
   _font-family: 'courier new', monospace;
   font-size: 1em;
}

/* Improve readability of pre-formatted text in all browsers */
pre {
   white-space: pre;
   white-space: pre-wrap;
   word-wrap: break-word;
}

q {
   quotes: none;
}

   q:before, q:after {
      content: "";
      content: none;
   }

small {
   font-size: 85%;
}

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup {
   font-size: 75%;
   line-height: 0;
   position: relative;
   vertical-align: baseline;
}

sup {
   top: -0.5em;
}

sub {
   bottom: -0.25em;
}


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol {
   margin: 1em 0;
   padding: 0 0 0 40px;
}

dd {
   margin: 0 0 0 40px;
}

nav ul, nav ol {
   list-style: none;
   list-style-image: none;
   margin: 0;
   padding: 0;
}


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/e 
 */

img {
   border: 0;
   -ms-interpolation-mode: bicubic;
   vertical-align: middle;
}

/*
 * Correct overflow not hidden in IE9 
 */

svg:not(:root) {
   overflow: hidden;
}


/* =============================================================================
   Figures
   ========================================================================== */

figure {
   margin: 0;
}


/* =============================================================================
   Forms
   ========================================================================== */

form {
   margin: 0;
}

fieldset {
   border: 0;
   margin: 0;
   padding: 0;
}

/* Indicate that 'label' will shift focus to the associated form element */
label {
   cursor: pointer;
}

/* 
 * 1. Correct color not inheriting in IE6/7/8/9 
 * 2. Correct alignment displayed oddly in IE6/7 
 */

legend {
   border: 0;
   *margin-left: -7px;
   padding: 0;
}

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea {
   font-size: 100%;
   margin: 0;
   vertical-align: baseline;
   *vertical-align: middle;
}

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 * 2. Correct inner spacing displayed oddly in IE6/7
 */

button, input {
   line-height: normal;
   *overflow: visible;
}

/*
 * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
 */

table button, table input {
   *overflow: auto;
}

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 */

button, input[type="button"], input[type="reset"], input[type="submit"] {
   cursor: pointer;
   -webkit-appearance: button;
}

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] {
   box-sizing: border-box;
}

input[type="search"] {
   -webkit-appearance: textfield;
   -moz-box-sizing: content-box;
   -webkit-box-sizing: content-box;
   box-sizing: content-box;
}

   input[type="search"]::-webkit-search-decoration {
      -webkit-appearance: none;
   }

/* 
 * Remove inner padding and border in FF3/4: h5bp.com/l 
 */

button::-moz-focus-inner, input::-moz-focus-inner {
   border: 0;
   padding: 0;
}

/* 
 * 1. Remove default vertical scrollbar in IE6/7/8/9 
 * 2. Allow only vertical resizing
 */

textarea {
   overflow: auto;
   vertical-align: top;
   resize: vertical;
}

   /* Colors for form validity */
   input:valid, textarea:valid {
   }

   input:invalid, textarea:invalid {
      background-color: #f0dddd;
   }


/* =============================================================================
   Tables
   ========================================================================== */

table {
   border-collapse: collapse;
   border-spacing: 0;
}

td {
   vertical-align: top;
}

/**** CUSTOM STYLES *****/

/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body {
   background-color: #ffffff;
   /*background-image: url(Images/swimtracker_bg.jpg);*/
   background-position: top left;
   background-repeat: repeat-x;
   background-position: top left;
   background-repeat: repeat-x;
   font-family: Helvetica, Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
   margin: 0;
   padding: 0;
   color: #000000;
   font-size: 10pt;
}

body, p, a, th, td {
   font-family: Helvetica, Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
   font-size: 10pt;
   font-weight: normal;
}
p, ul {
   margin-bottom: 20px;
   line-height: 1.6em;
}

/* fix for jquery UI themed buttons */
a .ui-button-text {
   color: #fff;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
   font-size: 1.5em;
   font-weight: normal;
   color: #2a4882;
   font-family: Helvetica, Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
}

h1 {
   font-size: 2em;
   padding-bottom: 0;
   margin-bottom: 0;
}

h2 {
   font-size: 1.4em;
   padding: 0 0 0 0;
}

h3 {
   font-size: 1.2em;
}

h4 {
   font-size: 1.1em;
}

h5, h6 {
   font-size: 1em;
}

/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 {
   margin-top: 0;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
   margin: 1em;
}

body {
   /*background: url(Images/hdr-bg.jpg) top left repeat-x;*/
}

#header {
   position: relative;
   margin-bottom: 0px;
   color: #000;
   padding: 0;
   padding-top: 5px;
   border-bottom: 1px solid #eee;
}

   #header h1 {
      font-weight: bold;
      padding: 5px 0;
      margin: 0;
      color: #000;
      border: none;
      line-height: 2em;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 32px !important;
   }

#main {
   padding: 0;
   padding-top: 5px;
   background-color: #fff;
   margin-bottom: 30px;
   _height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}

#footer {
   color: #999;
   padding: 10px 0;
   text-align: center;
   line-height: normal;
   margin: 0;
   font-size: .9em;
}

/* new menu */
ul.menu {
   list-style: none;
   padding: 0;
}


   ul.menu li {
      display: inline-block;
   }

      ul.menu li.dropdown-item-display {
         display: inline-block;
         background-color: #eee;
      }

.dropdown-item {
   display: none;
   position: absolute;
   left: 0;
   background: #eee;
   z-index: 999;
}

.dropdown-item-display {
   display: block;
   width: 100%;
   border-bottom: 1px solid #ccc;
}

a.link, a.dropdown-link {
   font-size: 1.4em;
   font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
   font-weight: bold;
   padding-right: 10px;
   color: #000;
   text-decoration: none;
}

a.link-active, a.dropdown-link-active {
   background-color: #eee;
}

a.link:hover, a.dropdown-link:hover {
   color: #333;
   text-decoration: none;
}

ul.menu-list {
   padding-left: 10px;
   list-style: none;
   padding-bottom: 0px;
}

   ul.menu-list li {
      display: inline-block;
      padding-right: 5px;
   }
   
   ul.menu-list li.active {
       font-size: 1.5em;
       font-weight: bold;
   }

      ul.menu-list li a {
         font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
         font-size: 1.1em;
         text-decoration: none;
         color: #555;
      }

         ul.menu-list li a:hover {
            color: #000;
         }



/* end new menu */

/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/
/*
fieldset {      
position: relative;      
float: left;      
clear: both;      
width: 100%;      
margin: 0 0 -1em 0;      
padding: 0 0 1em 0;      
border-style: none;      
margin-bottom: 2em;
}    
fieldset.submit {    
float: none;    
width: auto;    
border-style: none;    
padding-left: 12em;    
background-color: transparent;    
background-image: none;    
}
legend {      
padding: 0;      
color: #545351;      
font-weight: bold;    
}
legend span {      
position: absolute;      
left: 0.74em;      
top: 0;      
margin-top: 0.5em;      
font-size: 135%;    
}
label     
{
position: relative;
float: left;
width: 10em;    
margin-right: 1em;    
text-align: left;  
}
label em         
{
color: #060;        
font-size: 85%;        
font-style: italic;        
font-weight: bold;
text-transform: uppercase;      
}
label strong         
{
margin-top: 0em;
display: block;        
color: #C00;        
font-size: 90%;        
font-weight: normal;        
font-style: italic;
margin-left: 12em;
width: 30em;
}
fieldset p 
{
   margin-top: 2.5em;
   margin-left: 1.5em;
}
fieldset ol {      
padding: 2em 1em 0 2em;
list-style: none;    
display: block;
}
fieldset li {
float: left;    
clear: left;    
width: 100%;    
padding-bottom: 1em;  
display: block;
}
fieldset li p 
{
padding: 0;
margin: 0;
}
fieldset fieldset       
{
border-style: none;      
background-color: transparent;      
background-image: none;      
padding: 0 0 1em 0;
}      
fieldset fieldset legend       
{
float: left;
margin-left: 0;      
font-weight: normal;      
color: #000;
}      
fieldset fieldset ol {      
position: absolute;      
float: left;
padding: 0 0 0 0;
margin: 0 0 0 11em;
}      
fieldset fieldset label       
{
display: inline;
float: none;      
width: auto;      
margin-right: auto;      
}
*/
/*
fieldset
{
   margin: 1em 0;
   padding: 1em;
   border: 1px solid #CCC;
}

fieldset p
{
   margin: 2px 12px 10px 10px;
}

fieldset label
{
   display: block;
}

fieldset label.inline
{
   display: inline;
}

legend
{
   font-size: 1.1em;
   font-weight: 600;
   padding: 2px 4px 8px 4px;
}

input[type="text"]
{
   width: 200px;
   border: 1px solid #CCC;
}

input[type="password"]
{
   width: 200px;
   border: 1px solid #CCC;
}
*/
/* TABLE
----------------------------------------------------------*/

table {
   border: solid 1px #e8eef4;
   border-collapse: collapse;
}

   table td {
      padding: 5px;
      border: solid 1px #e8eef4;
   }

   table th {
      padding: 5px;
      text-align: left;
      background-color: #eee;
      border: solid 1px #fff;
      font-weight: normal;
   }

/* MISC  
----------------------------------------------------------*/
.clear {
   clear: both;
}

.error {
   color: Red;
}

#menucontainer {
   padding-top: 3px;
   padding-bottom: 3px;
   border-top: 1px solid #eee;
}

   #menucontainer div a {
      font-size: 12pt;
      text-decoration: none;
      padding-right: 10px;
   }

      #menucontainer div a:hover {
         color: #000;
      }


div#title {
   display: block;
   float: left;
   text-align: left;
}

div#title h2 {
   margin: 0;
   padding: 5px 0;
}

#logindisplay {
   font-size: 1.1em;
   display: block;
   text-align: right;
   margin: 0px;
   color: #000000;
}

   #logindisplay a:link {
      color: #000;
      text-decoration: underline;
   }

   #logindisplay a:visited {
      color: #000;
      text-decoration: underline;
   }

   #logindisplay a:hover {
      color: white;
      text-decoration: none;
   }

   #logindisplay h2, #logindisplay p, #logindisplay a, #logindisplay, #logindisplay b {
      /*color: #00a;*/
   }

.field-validation-error {
   color: #ff0000;
}

.input-validation-error {
   border: 1px solid #ff0000;
   background-color: #ffeeee;
}

.validation-summary-errors {
   font-weight: bold;
   color: #ff0000;
}

/* new form elements */

div.formRow em, div.formRow label, div.formRow input {
   display: block;
}

div.checkRow em, div.formRow em {
   display: block;
   clear: both;
}

div.formRow, div.checkRow {
   clear: both;
   margin-top: 10px;
   width: 400px;
}

   div.formRow label, div.checkRow label {
      font-weight: bold;
   }

   div.formRow input, div.formRow select {
      width: 400px;
      display: block;
   }

      div.formRow input.date-editor {
         display: inline-block;
         width: 200px;
      }

div.qtr {
   float: left;
   width: 100px;
}

   div.qtr input, div.qtr select {
      width: 90px;
   }

div.half {
   float: left;
   width: 200px;
}

   div.half input {
      width: 190px;
   }

div.checkRow {
   clear: both;
   width: 400px;
}

   div.checkRow input {
      clear: left;
      float: left;
      margin-top: 3px;
      margin-right: 5px;
      padding-right: 5px;
   }

   div.checkRow label {
      float: left;
      margin-left: 10px;
      font-weight: normal;
      display: block;
   }

div.radioList {
   margin-top: 2px;
   vertical-align: top;
}

   div.radioList input {
      margin-top: 5px;
      clear: left;
      float: left;
      vertical-align: top;
   }

   div.radioList label {
      font-weight: normal;
      float: left;
      margin-left: 20px;
      vertical-align: top;
      margin-top: 4px;
   }

div.radioListHorizontal input {
    float: left;
    margin-right: 5px;
    margin-top: 3px;
    vertical-align: top;
}

div.radioListHorizontal label {
   font-weight: normal;
   float: left;
   margin-left: 10px;
   margin-right: 15px;
   vertical-align: top;
   margin-top: 5px;
}

div.submit {
   width: 400px;
   clear: both;
   margin-top: 50px;
   padding-top: 10px;
   border-top: 1px solid #888;
}

/***** END CUSTOM STYLES *****/

/* meet index */
div.meet-card-small {
   display: inline-block;
   width: 150px;
   height: 80px;
   border: 1px solid #06e;
   text-align: center;
   padding: 0;
   margin: 0.5em;
   cursor: pointer;
   box-shadow: 1px 1px 5px 0px #06e;
}

   div.meet-card-small:hover {
      background-color: #eee;
   }

   div.meet-card-small h3 {
      font-size: 1.2em;
      font-weight: 600;
      line-height: 38px;
      margin: 0;
      padding: 0;
   }

   div.meet-card-small a {
      text-decoration: none;
   }

   ul.event-container {
      padding: 0;
   }

/* event index */
li.event-card-small {
   float: left;
   list-style: none;
   display: inline-block;
   width: 160px;
   height: 105px;
   border: 1px solid #06e;
   text-align: center;
   padding: 0;
   margin: 0.5em;
   cursor: pointer;
   box-shadow: 1px 1px 5px 0px #06e;
}

   li.event-card-small:hover {
      background-color: #eee;
   }

   li.event-card-small h3 {
      font-size: 10pt;
      font-weight: 600;
      line-height: 24px;
      margin: 0;
      padding: 0;
   }

   li.event-card-small a {
      text-decoration: none;
   }

   li.event-card-small input[type=checkbox] {
      margin-right: 5px;
      position: relative;
      top: 2px;
   }

   li.event-card-small span.delete {
      float: right;
      font-weight: bold;
      color: #f00;
      font-size: 15px;
      font-weight: bolder;
      padding: 5px;

   }


/* event index */
div.event-card-xsmall {
   display: inline-block;
   width: 150px;
   height: 56px;
   border: 1px solid #06e;
   text-align: center;
   padding: 0;
   margin: 0.5em;
   cursor: pointer;
   box-shadow: 1px 1px 5px 0px #06e;
}

   div.event-card-xsmall:hover {
      background-color: #eee;
   }

   div.event-card-xsmall h3 {
      font-size: 1.2em;
      font-weight: 600;
      line-height: 24px;
      margin: 0;
      padding: 0;
   }

   div.event-card-xsmall a {
      text-decoration: none;
   }
