/*Global Styles*/
* { margin: 0; }
html, body { height: 100%; width:100%;}
body
{
	background: #FFF;
    font-family: "Open Sans", Verdana, sans-serif;
    color:black;
}

a, a:link, a:visited { color: #383838;text-decoration: none; }
a:hover { color:#012950; }

#wrapper {
	background-color: #FFF;
    margin: 0 auto;
    position: relative;
    height: auto !important;
    min-height: 100%;
    min-height: -moz-calc(100% - 480px);
    min-height: -webkit-calc(100% - 480px);
    min-height: calc(100% - 480px);
}
#header {
    background: #012950;
	text-align: center;
    width:100%;
}

#header h1 {
    background: #012950;
    color: #FFF;
    font-family: 'Times New Roman', Georgia, serif;
    font-size: 45px;
    font-weight: normal;
    padding: 30px 0;
}

#header a {
    color: #FFF;
    text-decoration: none;
}

#header a:hover {
    color: #FFF;
}

#header span.silver {
    color: silver;
}

#logo {
    background: url(../img/platnium.jpg) center no-repeat;
    background-size: cover;
    padding: 180px 0;
}

#headerFade {
    background: #012950;
    background: -webkit-linear-gradient(rgba(1,41,80,0),rgba(1,41,80,1));
    background: -o-linear-gradient(rgba(1,41,80,0),rgba(1,41,80,1));
    background: -moz-linear-gradient(rgba(1,41,80,0),rgba(1,41,80,1));
    background: linear-gradient(rgba(1,41,80,0), rgba(1,41,80,1));
    margin-top: -195px;
    padding: 60px 0;
}

.content { 
	clear:both;
	color:black;
	padding: 10px;
    max-width:960px;
    margin: 0 auto;
    height: auto !important;
    min-height: 100%;
    min-height: -moz-calc(100% - 710px);
    min-height: -webkit-calc(100% - 710px);
    min-height: calc(100% - 710px);
}
}

.clearfix:after {
	clear:both;
	content:".";
	display:block;
	height:0;
	visibility:hidden;
}

* html .clearfix { height:1%; }

.boxContainer {
    text-align: center;
}

.box {
    display: inline-block;
    margin: 0 30px;
    vertical-align: top;
    width: 280px;
}

.box:first-of-type {
    margin-left: 0;
}

.box:last-of-type {
    margin-right: 0;
}

/* Menu */

#nav {
	margin: 0 auto;
    padding: 10px 0 20px;
}
#nav li {
    display: inline-block;
}
#nav a {
    background-color: #FFF;
    border-radius: 3px;
	color: #012950;
	text-transform: capitalize;
	text-decoration: none;
	padding: 10px 25px;
    margin-right: 4px;
}
#nav a:hover {
	color: #012950;
}
#nav li li a {
	padding: 10px;
}

/* Mobile Menu */

#btnMobileMenu {
  padding: 9px 10px;
  background-color: #FFFFFF;
  background-image: none;
  border: 1px solid #FFFFFF;
  box-sizing: border-box;
  border-radius: 4px;
}

#btnMobileMenu:hover {
  cursor: pointer;
  background-color: #FFFFFF;
}

#btnMobileMenu:focus {
  outline: 0;
}

.icon-bar {
  background-color: #012950;
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}

.icon-bar + .icon-bar {
  margin-top: 4px;
}

.mobilemenu, .mobilenav {
    display: none;
}

/* Footer */

#footer
{
  line-height: 2em;
  background-color: #383838;
  color: #FFFFFF;
  text-align: center;
  padding: 40px 0 140px;
}
#footer #copyright { 
    color: #FFFFFF;
    font-size: 18px;
}
#footer #copyright a {
    color: #FFFFFF;
	text-decoration: none; 
    vertical-align: middle;
}
#footer #copyright a { color: #FFFFFF; }
#footer #siteby { 
    font-size: small;
    color: #877F75;
}
#footer #copyright img {
    vertical-align: middle;
}
#footer #siteby a {
    color: #877F75;
	text-decoration: none; 
}
#footer #siteby a { color: #877F75; }

input[name="custid"] {
    display: none;
}

/* Home Page */

.homeCol1 {
    display: inline-block;
    vertical-align: top;
    width: 635px;
}

.homeCol2 {
    display: inline-block;
    vertical-align: top;
    width: 325px;
}

.bgGrey {
    background-color: #E2E2E2;
}

.homeContent {
    clear:both;
	color:black;
    max-width:960px;
    margin: 0 auto;
    padding: 50px 0;
}

.newsText {
    background-color: #012950;
    font-size: 14px;
    font-weight: bold;
    height: 60px;
    margin-top: -5px;
    padding: 10px;
}

.newsText a {
    color: #FFFFFF;
    text-decoration: none;
}

.newsText a:hover {
    color: #FFFFFF;
}

.horseNameHome {
    width: 140px;
}

.racetimeHome {
    width: 65px;
}

.venueHome {
    width: 150px
}

.DistanceHome {
    width: 85px;
}

.weightHome {
    width: 65px
}

/* Contact Us */

.contactus input[type='text'] {
    width: 300px;
}

.contactus textarea {
    width: 300px;
}

.contactus .googleMap {
    float: right;
}

@media only screen and (max-width: 768px) {
    img 
    {
        max-width: 100%;
    }
    
    #nav
    {
        display: none;
    }

    .mobilemenu {
        text-align: center;
        display: block;
        margin: 10px 0;
        padding: 10px;
    }
    .mobilenav li {
        float: none;
        background-color: #012950;
    }
    .mobilenav a {
        display: block;
        padding: 10px 20px;
        border-bottom: 1px dotted #FFF !important;
        font-size: 1em;
        color: #FFF;
        text-transform: none;
        font-weight: normal;
        text-align: center;
        text-decoration: none;
    }
    .mobilenav li:hover {
        background-color: #57955b;
        
    }
    .mobilenav li:hover a {
        color: #FFF;
    }

    #footer-left, #footer-right {
        display: block;
        float: none;
    }

    /* Responsive Tables */

    table.responsivetable, table.responsivetable thead, table.responsivetable tbody, table.responsivetable th, table.responsivetable td, table.responsivetable tr {
        display: block;
        border: none;
    }

    table.responsivetable thead {
        display: none;
    }

    table.responsivetable tr {
        border: 1px solid #012950;
        border-bottom: none;
        margin-bottom: 10px;
    }

    table.responsivetable tr:last-child td {
        padding-bottom: 6px;
    }

    table.responsivetable td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #012950;
        position: relative;
        padding-left: 65px;
        text-transform: none;
        padding-bottom: 6px;
    }

    table.responsivetable td:first-child {
        background-color: #012950;
        color: White;
        border: 1px solid #000;
    }

    table.responsivetable td:before  {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 60px;
        padding-right: 10px;
        white-space: nowrap;
    }

    table.responsivetable td:nth-of-type(1):before {
        content: "Horse";
    }

    table.responsivetable td:nth-of-type(2):before{
        content: "Race";
    }

    table.responsivetable td:nth-of-type(3):before {
        content: "Date";
    }

    table.responsivetable td:nth-of-type(4):before {
        content: "Venue";
    }

    table.responsivetable td:nth-of-type(5):before {
        content: "Wgt";
    }

    /* Home page */

    .homeContent {
        padding: 10px;
        width: auto;
    }

    .homeCol1 {
        display: block;
        text-align: center;
        width: auto;
    }

     .homeCol2 {
        display: block;
        text-align: center;
        width: auto;
     }

     .box {
         margin: 0 auto 25px;;
     }
}