a:link {color: #9900CC ;text-decoration: underline}
a:visited {color: #9900CC ;text-decoration: underline}
a:hover {color: #FF33CC ; text-decoration: underline}
a:active {color: #FF33CC ; text-decoration: underline}

body
{
background-color: black;
color: white;
font-family: verdana ;
max-width: 1200px;
margin: 1em auto;
}


div#main
{
margin-left: auto;
margin-right: auto;
background-color: #FFFFCC;
/* background-color: #CCCCCC; */  
color: black;
overflow: hidden; 
font-size: 80%;
line-height: 110%;
position:relative;
border-radius: 10px;
}

#banner { margin: 0 20px; }
img#banner { max-width: 90%; }

#footer { margin: auto; width: 90%; text-align: center; font-weight: bold ; clear:both; }

#bannerdiv {
    position: relative;
    float: left;
}

#home {
    position: absolute;
    bottom: 3%;
    right: 8%;
    z-index: 4;
}

#newmenu {
    font-size:130%;
    margin-left: 20px;
    position: relative;
    z-index: 3;
}

#newmenu ul, #newmenu ul li{
    margin: 1px 0px 0px 0px;
    padding:0;
    list-style:none;
}

#newmenu ul li{
    background-color:#9900CC;
    border-bottom:solid 1px white;
    height: 1.5em;
    width:7em;
    cursor:pointer;
    display:inline-block;
    border-radius: 10px;
}

#newmenu ul:first-child {
    clear: left;
}


div.newmenuS ul li {
        width: 9em !important;
}

#newmenu ul li:hover{
    background-color:#FF33CC;
    position:relative;
}

#newmenu ul li a{
    padding:5px 15px;
    color:#ffffff;
    display:inline-block;
    text-decoration:none;
}

/* We make the position to absolute for flyout menu and hidden the ul until the user hover the parent li item */
#newmenu ul li ul{
    z-index: 4;
    position:absolute;
    display:none;
}

#newmenu ul li:hover ul{
    left:0px;
    top:1.5em;
    display:block;
}

#newmenu ul li ul li{
    width:10em;
    background-color:#CC33FF;
    border-bottom:solid 3px white;
    border-right:solid 1px white;
}

div.newmenuS ul li ul li {
        width: 14em !important;
}

#newmenu ul li ul li:first-child{
    border-top:solid 5px white;
}

#newmenu ul li:hover ul li:hover{
    background-color:#FF55EE;
}
#newmenu ul li ul li a{
    color:#ffffff;
    display:inline-block;
}


.roundtop { height: 20px; border-bottom-style:solid; border-bottom-width: 1px}
.roundbottom { height: 20px; border-top-style:solid; border-top-width: 1px}
.roundtop img, .roundbottom img {margin: 0; border: none; width: 20px; clear:none; float: left}
.roundbottom a{font-weight: bold;}
div.lang { display:inline; font-weight: bold; clear:none; float: right}
.lang img { float: none}
.lang a {margin-right: 15px} 

input.icon { width: 20px; height: 20px; margin-top: 4px; cursor:pointer;}
img.icon { cursor:pointer; }
.blankicon {width: 20px; height: 20px; margin-top: 4px;}

div#usercontent {
        margin: 3px 0 0 0 ;
        padding: 0 20px 0.4em 20px;
        border-top-style: solid;
        border-bottom-style: solid;
        border-width: 1px;
        clear: both
}

div.homecontent {
        border-style: none !important;
}

div#wrap
{
    text-align: left;
}

.gal div { float: left; clear: none }
.gal div > a{ float: left; clear: none }
div.gal {float :none; clear: both; padding-bottom: .4em; }

li img {padding: 0; margin: 3px 3px 0 0; clear:left; float: left}
ul li {list-style-type: none ; font-weight: bolder; padding: 2px 0; margin-right: 10px; clear: left}
ul { padding: 0; margin: 0}
ol li { font-weight: bolder}

div#slideshow
{
    margin-left: 10px;
    margin-top: 5px;
    margin-bottom: .4em;
    clear: none;
    float: right;
    position:relative;
    width: 100%;
    height: calc(233 * 100vw / 350 - 20px);
    text-align: center;
}

@media screen and (min-width: 1200px) {
    div#slideshow { height: calc(233 * 1200px / 350 - 20px); }
}

#slideshow img {
    position:absolute;
    top:0;
    right:0;
    visibility:hidden;
    width: 200%;
    max-width: 100%;
}

#slideshow div.caption {
    font-size: 200%;
    line-height: 120%;
    background-color: #9900CC;
    color: white;
    position:absolute;
    bottom:0;
    visibility:hidden;
    width: 100%;
}

#slideshow div.caption a {
        color: white;
}

em { background-color:yellow; font-style:normal }

h1 { font-size: 125%; font-weight: bolder; margin-bottom: 0em; margin-top: .3em; padding: 0; line-height: normal; } 
h2 { font-size: 113%; clear: none; font-weight:bolder; margin-bottom: 0em; margin-top: .3em }
#galStills h2 { text-align: center;}
h3, h4 {
	font-size: 110%;
	BACKGROUND: #9900CC;
	margin: .4em 0;
	color: #FFFFFF;
	clear: none; 
	padding: .25em ;
	white-space: normal;
    border-radius: 5px;
}

body.popup
{
background-color: #FFFFCC ;
/* background-color: #CCCCCC ; */
color: black;
font-family: verdana ;
padding-left: 20px;
padding-right: 20px;
}

.popup p {
font-size: 78%; padding:0; margin: 0.2em;
}

table {margin-top: 0.5em; border-style: none; border-collapse: collapse}
td, th { padding:3px; vertical-align: top;} 
form { margin:.1em 0; padding: 0}

#usercontent p {  text-align: justify ; margin: .4em 0}
#usercontent a {  font-weight: bold; }
#usercontent p .padded p, #usercontent p label { font-size: 90%; font-weight: bold; padding: .1em; margin: 0;  text-align: left }
#usercontent p.c, #usercontent p.cy { text-align: center; margin:0 }
#usercontent p.cy { background-color: yellow; }

div.content2col {
width: 47%;
margin: 0.4em 0.5em;
font-weight: bold;
float: left;
clear: none;
padding:0;
}
.content2col li, .content2col a { font-weight: bold; display: block; min-height: 1em; }
.content2col ul { margin: .7em 0 }

.floatright
{
clear: none;
float: right;
}
img.floatright {margin-left: 10px; }

.floatleft
{
clear: none;
float: left;
}
img.floatleft {margin-right: 10px; }

.clearboth
{
clear: both;
}

.galthumbs
{
margin-top: 0 ;
margin-left: 0 ;
margin-bottom: .3em ;
margin-right: .3em ;
border: solid 2px #9900CC;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	float: none;
	clear:both;
	zoom: 1;
    height:0; 
    font-size: 1px; 
    line-height: 0px; 
} 

#galVideos td {  padding: 0 0 1px 0; }

div#horsethumb { width: 260px; float: left; clear: none; margin-right: 6px;}
#horsethumb img {border: solid; border-width: 2px; border-color: #9900CC; }
#galStills img:first-of-type 

.pagingleft { float: left; width: auto}
.pagingleft { float: right; width: auto}

div#keuringprep ul li { list-style-type: disc; font-weight: normal; margin-left: 5em; }
div#keuringprep table { margin-left: 5em; font-weight: bold; }

.video-embeded {
    width: 640px;
    height: 352px;;
}

.video-popup {
    width: 100%;
    object-fit: contain;
    overflow:hidden;
}

video {
    width: 100%;
    height: auto;
}

.nextprev {
    background-color: #9900CC;
    border: none;
    color: white;
    padding: .5em 2em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: .4em 0;
    clear: none;
    white-space: normal;
    border-radius: 5px;
    cursor: pointer;
    font-size: 130%;
    font-weight: bolder;
}

.blockedpara {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.blockedpara > ul {
        padding-top: 0.5em;
        padding-left: 4em;
}

#scheduling > .blockedpara {
        font-size: 110%;
}

#scheduling > .blockedpara > ul{
        padding-left: 0;
}