/* ----------------------
   Screen
---------------------- */

html {
    margin: 0;
    padding: 10px;
}

body {
    margin: 0;
    padding: 0;
    color: #000000;
    background-color: #FFFFFF;
    font-size: 0.83em;
    font-family: Arial,Helvetica,Sans-serif;
}

#container_a {
    width: 184px;
    float: left;
    position: relative;
    overflow: hidden;
    margin-bottom:10px;
}

#container_b {
    width: 100%;
    float: left;
    margin-left: -184px;
    margin-bottom:10px;
}

.full #container_b {margin-left:0;}

#container_bp {
    padding-left: 184px;
}

.full #container_bp {padding-left:0;}

#container_fb ul {
    list-style:none;
    margin:0;
    padding:0;
    text-align:left;
}

#container_fb ul li {
    display: inline;
}

#footer { width:100%; background-color:#ee1c24; -webkit-border-top-left-radius:16px; -webkit-border-top-right-radius:16px; -moz-border-radius-topleft:16px; -moz-border-radius-topright:16px; border-top-left-radius:16px; border-top-right-radius:16px; padding: 4px 0 0 0; /* top right bottom left */ margin:0; }
#footer_a { max-width:100%; background-color:#454545; -webkit-border-top-left-radius:16px; -webkit-border-top-right-radius:16px; -moz-border-radius-topleft:16px; -moz-border-radius-topright:16px; border-top-left-radius:16px; border-top-right-radius:16px; }
#footer_b { max-width:100%; background-color:#454545; font-size:0.77em; -webkit-border-bottom-right-radius:16px; -webkit-border-bottom-left-radius:16px; -moz-border-radius-bottomright:16px; -moz-border-radius-bottomleft:16px; border-bottom-right-radius:16px; border-bottom-left-radius:16px; }
#footer_a .padding { padding:10px 30px 0; /* top rightleft bottom*/ line-height:1.4em; color:#FFFFFF; }
#footer_b .padding { padding:10px 30px; /* topbottom rightleft */ line-height:1.4em; color:#FFFFFF; }

#footer_b p { margin:0; padding:0; }
#footer_b a,
#footer_b a:visited { color:#FFFFFF; text-decoration:underline; outline:none; }
#footer_b a:focus,
#footer_b a:hover { color:#ee1c24; text-decoration:underline; }
#footer_b a:active { color:#ff6666; text-decoration:underline; }

#footer_b_left { float:left; width:48.5%; font-size:1.2em; line-height:1.2em; }
#footer_b_right { float:right; width:48.5%; text-align:right; }

/* ----------------------
   Content
---------------------- */

h1,
h2 {
    color: #000000;
    font-size: 1.37em;
    margin-top: 0;
    font-weight: normal;
}

h3 {
    color: #000000;
    font-size: 1.13em;
    margin-top: 0;
}

h4 {
    color: #000000;
    font-size: 1.13em;
}

h5 {
    color: #000000;
    font-size: 1.0em;
}

h6 {
    color: #000000;
    font-size: 0.9em;
}

p {
    padding: 0;
    margin: 0 0 16px;
}

a, a:visited {
    color: #ee1c24;
    text-decoration: underline;
}

a:hover {
    color: #E32121;
    text-decoration: underline;
}

.clear {
    clear: both;
    height: 0;
    overflow: hidden;
}

.centre {
    text-align: center;
}

.center {
    text-align: center;
}

.justify {
    text-align: justify;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.small_text {
    font-size: 0.8em;
}

.copyright {
    font-size: 0.77em;
}

.search {
    text-align: center;
    font-weight: bold;
    color: Gray;
}

img.socialmedia {
    margin-left: 2px;
}


#logo {
    width: 61px;
    height: 61px;
    background: url("hh_logo.png") left top no-repeat;
    overflow: hidden;
    display: block;
}

#logo span {
    display: none;
}

.layoutrow {
    padding: 5px 5px 5px 0; /* top right bottom left */
    clear: left;
    min-height: 12px;
}

.layoutrowlabel { font-weight:bold; }

#container_b .layoutrowlabel { width: 40%; float: left; text-align: right; font-weight:bold; padding-right: 7px; }
#container_b .layoutrowlabel::after { content: ":"; }
#container_b .layoutrowfield { width: 58%; float: left; }


.excluded {
    font-style: italic;
}

.penalty {
    font-style: italic;
}

.fastest {
    text-decoration: underline;
    font-weight: bold;
}

/* ----------------------
   Messages
---------------------- */

.information-message { display:block; color:#2B2B2B; font-weight:bold; border:1px solid #FFCC00; padding:8px 9px; margin-bottom:5px; background-color:#FFEFB0; }
.information-message p { margin: 0;}
.information-message strong { color:#FF9900; }

.error-message { display:block; color:#2B2B2B; font-weight:bold; border:1px solid #B10000; padding:8px 9px; margin-bottom:5px; background-color:#F4DADA; }
.error-message p { margin: 0;}
.error-message strong { color:#B10000; }

/* ----------------------
   Flat Pages Only
---------------------- */

.resultsblock {
    margin-bottom: 15px;
    width: 100%;
}

.resultsblock-title {
    padding: 9px 0 8px 0;
    margin-bottom: 0 0 5px 0;
    background-color: #B30202;
    width:100%
}

.resultsblock-title h2 {
    font-size: 1.23em;
    font-weight: bold;
    margin: 0 0 0 11px;
    padding: 0;
    color: #FFFFFF;
}

.resultsblock-info {
    margin: 5px;
}

/* ----------------------
   Data Tables
---------------------- */

.data_narrow, .data_wide {
    border-collapse:collapse;
    border: 1px solid #D9D9D9;
    margin: 5px;
}

.data_narrow th, .data_narrow td, .data_wide th, .data_wide td {
    margin: 0;
    padding: 2px 5px;
    border-spacing: 0px;
}

.data_narrow th.right, .data_wide th.right {
    text-align: right;
}

.data_narrow th.centre, .data_wide th.centre {
    text-align: center;
}

.data_narrow tr:nth-child(odd), .data_wide tr:nth-child(odd) {
    background-color: #ffffff;
}

.data_narrow tr:nth-child(even), .data_wide tr:nth-child(even) {
    background-color: #e8e8e8;
}

.data_narrow tr:hover td, .data_wide tr:hover td {
    background-color: #D9D9D9;
}

.data_narrow th, .data_wide th {
    background: #EDEDED url("rowstrong.gif") left top repeat-x;
    border-bottom: 1px solid #D9D9D9;
    font-weight: bold;
    vertical-align: top;
    text-align: left;
    padding: 6px;
}

.lastcol {
    /* Live Scoreboard - Used to mark last column in block of results when multiple results columns displayed */
    border-right: 20px solid #D9D9D9;
}

.data_narrow td, .data_wide td {
    vertical-align: top;
    white-space: nowrap;
}

.data_narrow td.wrap, .data_wide td.wrap {
    vertical-align: top;
    white-space: normal;
}

.data_narrow td img, .data_wide td img {
    border: 0;
}


.data th.evttitle {
    width: 95px;
}

/* ----------------------
   List Tables
---------------------- */


table.list {
    border: 0;
    font-size: 1.0em;
    vertical-align: top;
}

table.list th, table.list td {
    margin: 0;
    padding: 3px 2px;
    border-spacing: 0px;
}

table.list th {
    font-weight: bold;
}

/* ----------------------
    Buttons
---------------------- */

.button { display:inline-block; font-size:10pt; font-weight:bold; color:#FFFFFF!important; text-decoration:none!important; text-align:center; min-width:130px; padding: 1px; margin:8px 7px 2px 7px; cursor:pointer; }

/* Green */
.button_refresh, 
.button_search, 
.button_start, 
.button_save
{ border-bottom:1px solid #294105; border-top:1px solid #a4c673; border-left:1px solid #83b13f; border-right:1px solid #3e6208; background-color:#629c0c; }
.button_refresh:hover,
.button_refresh:focus, 
.button_search:hover,
.button_search:focus, 
.button_start:hover,
.button_start:focus, 
.button_save:hover,
.button_save:focus
{ background-color:#426908; }
.button_refresh:active, 
.button_search:active,
.button_start:active, 
.button_save:active
{ background-color:#223604; }

/* Blue */
.button_select,
.button_print,
.button_login, 
.button_next, 
.button_close
{ border-bottom:1px solid #072d48; border-top:1px solid #106bab; border-left:1px solid #438abd; border-right:1px solid #0a446c; background-color:#106bab; }
.button_select:hover,
.button_select:focus, 
.button_print:hover,
.button_print:focus,
.button_login:hover,
.button_login:focus,
.button_next:hover,
.button_next:focus,
.button_close:hover,
.button_close:focus
{ background-color:#0b4a78; }
.button_select:active, 
.button_print:active,
.button_login:active, 
.button_next:active, 
.button_close:active
{ background-color:#062b45; }

/* Orange */
.button_previous
{ border-bottom:1px solid #613a00; border-top:1px solid #f1bc6c; border-left:1px solid #eba336; border-right:1px solid #915700; background-color:#8C7412; }
.button_previous:hover,
.button_previous:focus 
{ background-color:#715E0F; }
.button_previous:active 
{ background-color:#5E4E0D; }

/* Red */
.button_delete 
{ border-bottom:1px solid #4c0606; border-top:1px solid #d47474; border-left:1px solid #c54141; border-right:1px solid #740909; background-color:#b50e0e; }
.button_delete:hover,
.button_delete:focus 
{ background-color:#820a0a; }
.button_delete:active 
{ background-color:#4f0606; }

/* ----------------------
    Forms
---------------------- */

input, textarea, select { color:#333333; background-color:#ffffcc;}

/* ----------------------
    Search
---------------------- */
#container_as {
    vertical-align: top;
    width: 172px;
    text-align: center;
    margin-top:10px;
}

#container_as_h {display:block; text-align:left; background-color:#454545; padding: 5px 5px 5px 10px; color:#ffffff; font-weight: bold;}
#container_as_b {text-align:center; background-color:#D9D9D9; font-size: .9em;}

/* ----------------------
   Menu
---------------------- */
#container_am {
    vertical-align: top;
    width: 172px;
    text-align: center;

}

#container_am_h {display:block; text-align:left; background-color:#454545; padding: 5px 5px 5px 10px; color:#ffffff; font-weight: bold;}
#container_am_b {font-size: .9em;}

#container_am_b ul.menu {
	margin: 0;
	padding: 0;
    list-style:none;
}

.menu li {
	padding: 0;
    margin:0;
    width: 172px;
    text-align:center;
	background-color: #ee1c24;
    border-bottom: 1px solid #454545;
}

.menu li a:link, .menu li a:visited {
    display:block;
    color: #ffffff;	
    padding: 5px 0; /* topbottom rightleft */
	width: 172px;
	margin: 0;
	text-decoration: none;
}

.menu li a:hover {
	background-color: #E32121;
	color: #ffffff;
}

/* ----------------------
   CSS smaller than 800px, all devices
---------------------- */
@media handheld and (max-width: 800px), screen and (max-width: 800px)
{
	.no_large { display:none; }

    /* ----------------------
       Screen
    ---------------------- */

    #container_a, #container_b, #container_bp, .layoutrowdata {
        float:none; 
        width:100%;
    }
    #container_a {
        margin-left:0;
        margin-right:0;
        padding-left:0;
        padding-right:0;
    }
    #container_b, #container_bp, .layoutrowdata {
        margin-left:0;
        margin-right:0;
        padding-left:0;
        padding-right:0;
    }

    #container_b {margin-top:20px;}

    #container_fb ul {
    text-align:center;
}

    #footer_a_left {float:none; width:100%; text-align:center;}
    #footer_a_right {display:none;}
    #footer_b_left {float:none; width:100%; text-align:center;}
    #footer_b_right {display:none;}

    /* ----------------------
        Search
    ---------------------- */

    #container_as {width:100%; }

    #container_as_b {display:none;} /* Hide Search Panel on page open */ 

    /* ----------------------
        Menu
    ---------------------- */
    #container_am {width:100%; }

    #container_am_b {
        width:100%;
        display:none;
    }

    .menu li {width: 100%; }

    .menu li a:link, .menu li a:visited { width: 100%; }

    p.user {display:none;}

    #container_b .layoutrowlabel { width:auto; float: none; padding-right: 0; text-align: left;}
    #container_a .layoutrowlabel { text-align: center; }
    #container_b .layoutrowlabel::after { content: ""; }
    #container_b .layoutrowfield { width:auto; float: none; }


	.layoutrowfield { width:auto; float: none; }

	.data_narrow table,
	.data_narrow thead,
	.data_narrow tbody,
	.data_narrow th,
	.data_narrow td,
	.data_narrow tr { display: block; }

    table.data_narrow {width:100%;}

	.data_narrow thead tr { position: absolute; top: -9999px; left: -9999px; }
	.data_narrow tr { border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }
	.data_narrow td { position: relative; padding-left: 45%; border: none; border-bottom: 1px solid #ccc;  white-space:normal; text-align:left; }
	.data_narrow td:before { position: absolute; width: 40%; top: 3px; left: 3px; padding-right: 10px; font-weight: bold; }


}

/* ----------------------
   CSS smaller than 600px, all devices
---------------------- */
@media handheld and (max-width: 600px), screen and (max-width: 600px)
{
	.no_medium { display:none; }

}

/* ----------------------
   CSS smaller than 420px, all devices
---------------------- */
@media handheld and (max-width: 420px), screen and (max-width: 420px)
{
	.no_small { display:none; }

    .layoutrowlabel { width:auto; 
                      float: none; 
                      padding-right: 0; 
                      text-align: left; 
                      top: 0; 
                      -ms-transform: none; 
                      -webkit-transform: none; 
                      transform: none; }
    
    /* More spacing and bigger font for mobile */
    #container_am_h, #container_as_h { padding: 10px 5px 10px 10px;} /* top right bottom left */
    #container_am_h, #container_as_h, .menu li { font-size:1.2em;}
    .menu li { padding-top: 5px; padding-bottom: 5px;}

    #pagination {font-size:1.5em;}
    input, textarea, select {font-size:1.1em;}


}