@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
body {
    line-height: 1.3em;
    text-align: left;
    letter-spacing: 0;
    font-weight: 400;
   font-size: 1rem;
    font-family:Raleway, Helvetica, Arial, Verdana, sans-serif;
    background: #ffffff;
    color: #23332D;
}

a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}

a:link {
	color: #23332D;
	text-decoration: none; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #23332D;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: underline; ;
}
strong {font-weight:500}

h1 {font-family: Montserrat, sans-serif;margin: 0px auto 20px auto;font-size: 2.4rem; text-transform: uppercase; }
h2 {font-family: Montserrat, sans-serif;font-size: 1.9rem; text-transform: uppercase; }
h3 {font-family: Montserrat, sans-serif;font-size:1.9rem; }
h4 {font-family: Montserrat, sans-serif;font-size: 1.5rem; }
h5 {font-size: 1.2rem;line-height: 1.5em;}
h6 {font-size: 1.1rem;line-height: 1.5em;}

.fs-1    {font-size: 2.9rem;}
.fs-2 {font-size: 2.7rem;}
.fs-3 {font-size:2.2rem;}
.fs-4 {font-size: 1.8rem;}
.fs-5 {font-size: 1.4rem;}
.fs-6 {font-size: 1.2rem;}


.small {font-size:0.7em;}
.xl	{font-size:1.3em}
.sitecolour	{color: #0068BF!important;}
.sitecolour1	{color:#BBE3EF!important;}
.sitecolour2	{color:#EBEBEB!important;}

.bg1	{background:#0068BF; color:#FFFFFF !important;}
.bg2	{background:#BBE3EF; color:#23332D;}
.bg3	{background:#EBEBEB; color:#23332D;}


.navbar-dark .navbar-nav .nav-link    {color:#FFFFFF}
.btn    {border-radius: 40px !important; padding-left: 16px; padding-right: 16px; padding-top:5px;padding-bottom:5px;  border-color: #000000; border-width: 1px; font-size:0.9rem }
.benefits .card-title    {display: block; background-color:#0068BF; color: #FFFFFF; padding: 10px; text-align: center; text-transform: uppercase; margin-bottom: 0  }
.findmore .card-title    { text-transform: uppercase;position: relative;  }
.iconcircle     {border-radius: 50%; background: #ffffff; margin: auto; position: relative; margin-top:-20px; padding: 5px }
.legsbanner    {background:  url("../img/horse-racing-legs.webp"); background-size: cover;  background-repeat: no-repeat; background-position: center; color:#ffffff !important;  text-shadow: 2px 2px #000000;}
.owner .row   {text-align: center}
.owner .tag  { text-transform: uppercase; font-size: 1.8rem; font-family: Montserrat, sans-serif;font-weight:500}
.contact .row   {background:#0068BF; text-align: center}
.contact h4  {color: #ffffff !important;}
.contact .tag  {color: #ffffff !important; text-transform: uppercase; font-size: 1.8rem; font-family: Montserrat, sans-serif;}


#footer	ul{margin:0;padding:0;list-style:none}
#footer li{padding:7px 0;}
#footer a:hover{color:#fff}
#footer a {color:#ffffff!important;}

@media only screen and (min-width:576px) {
.banner    {  }
}
@media only screen and (min-width:768px) {
.banner    { }

#footer li{padding:4px 0px;}

}
@media only screen and (min-width:992px) {
.banner .container    { background:  url("../img/blazing-blues-and-twos.webp");  background-repeat: no-repeat; background-position: right }
.owner.container-fluid   {background:#EBEBEB url("../img/racing-horse-owner.webp"); background-size: cover;  background-repeat: no-repeat; background-position: center;}
.owner .row   {background:none; text-align: left}
.owner .tag  {color: #000000 !important; }
.contact.container-fluid    {background:  url("../img/blazing-blues-and-twos-racing-club-bg.webp"); background-size: contain;  background-repeat: repeat-x; background-position: center;}
.contact .container    {background:  url("../img/blazing-blues-and-twos-racing-club.webp"); background-size: contain;  background-repeat: no-repeat; background-position: right;}
.contact .row   {background:none; text-align: left}
.contact h4  {color: #000000 !important;}
.contact .tag  {color: #000000 !important; font-weight:500}
}
@media only screen and (min-width:1200px) {
    .banner h1    {font-size: 2.6rem;}
.banner h2    {font-size: 2rem;}
.banner h6    {font-size: 1.1rem;}

}


@media only screen and (min-width:1400px) {
.owner.container-fluid   {background:#EBEBEB}
.owner  .container   {background:#EBEBEB url("../img/racing-horse-owner.webp"); background-repeat: no-repeat;  background-size: contain; background-position: right;}
}