/* Site Specific CSS Styles */

/*

// Media Queries
Mobile First - everything below 768px (48em)
$small-screen: 768px; //Desktop/Tablet and up (48em) - *This is where the fluid grid and componenets change!
$sweetspot-screen: 980px; //Desktop (61.25em) - *This is where the magic happens ... err ... the UTMB nav changes! - @mgcooper
$medium-screen: 1280px; //Desktop Medium (80em) - Assigned but not used in templates
$large-screen: 1440px; //Desktop Large (90em) - Assigned but used in templates

1) Example Test: Add this html text to your page: 
   <i class="hello-world">Hello, World!</i>

2) Open your page in a decent browser

3) Resize your browser window and watch the font color change.

4) You just made something using "Mobile First" responsive design :)

*/


/* "Mobile First" (default) - Styles for screens that are smaller than 768px (48em) */
.hello-world { 
    color: green; 
}


/* Tablet and up (Sass: $small-screen: 768px;) 
	Styles for screens that are at least 768px (ie 48em) */
@media only screen and (min-width: 48em) {
    .hello-world { 
        color: blue; 
    }
}


/* Desktop and up (Sass: $sweetspot-screen: 980px;)
	Styles for screens that are at least 980px (61.25em) */
@media only screen and (min-width: 61.25em) {
    .hello-world { 
        color: red; 
    }
}

.table_body {font-family: Verdana, Arial, Helvetica, sans-serif; margin: 1px; font-size: 100%; color: #000066;}

.form_table {font-size: 90%;}
.form_td {background-color: #CCCCCC;}

.list_table {font-size: 90%;}
.list_th {background-color: #000066; color: #FFFFFF;}
.list_td {background-color: #CCCCCC;}

.search_table {background-color: #CCCCCC;}

.header_th {background-color: #CCCCCC; font-size: 90%;}

.page_title {font-size: 180%; color: #000066;}
.bold_label {font-size: 100%; color: #000066; font-weight: bold;}
.small_label {font-size: 90%; color: #000066;}
.tiny_label {font-size: 70%; color: #000066;}
.reg_text {font-size: 100%; color: #000000;}
.red_label {font-size: 100%; color: #FF0000; font-weight: bold;}
.small_link {font-size: 90%;}
.msg_reg_title {font-size: 100%; color: #000066; font-weight: bold;}
.msg_adm_title {font-size: 100%; color: #FF0000; font-weight: bold;}
.msg_text_bold {font-size: 100%; color: #000000; font-weight: bold;}
.msg_text_body {font-size: 100%; color: #000000;}

.hidden_control {visibility: hidden;}