/************************
FONT INCLUDES
All fonts should be included in the /fonts folder in the root directory.
If new downloads are needed, Open Sans is available at https://fonts.google.com/specimen/Open+Sans
*************************/

@import url('//fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

@font-face {
	font-family: Quincy;
	src: url(../fonts/QuincyCF-Bold.woff);
}

@font-face {
	font-family: Open Sans;
	src: url(../fonts/OpenSans-Regular.ttf);
}

@font-face {
	font-family: OpenSans;
	src: url(../fonts/OpenSans-Regular.ttf);
}

/************************
KEENELAND THEME COLORS
*************************/
:root .theme-keeneland, :root .theme-keeneland-animate {
	--primary: #115740; /*keeneland green*/
	--secondary: #EA6218; /*keeneland orange*/
	--tertiary: #6E6E6E; /*midtone gray*/
	--dark: #262626;
	--light: #fff;
	--gray: #6E6E6E;
	--accent01: #F4F1F0;
	--accent02: #197D5C;
	--accent03: #014533;
	--active: #57A66C;
	--danger: #C01115;
	--warning: #FFCF28;
	--success: #197D5C;
	--info: color-mix(in srgb, var(--primary), white 80%);
}

/************************
CHAMPIONSHIP THEME COLORS - for use in CHAMP only
*************************/
:root .theme-championship {
	--primary: #808663; /*sage green*/
	--secondary: #522D6D; /*champ purple*/
	--tertiary: #6E6E6E; /*mid tone gray*/
	--dark: #262626;
	--light: #fff;
	--gray: #6E6E6E;
	--accent01: #F4F1F0;
	--accent02: #197D5C;
	--accent03: #014533;
	--active: #57A66C;
	--danger: #C01115;
	--warning: #FFCF28;
	--success: #197D5C;
	--info: color-mix(in srgb, var(--primary), white 80%);
}		

/************************
TEXT AND BACKGROUND COLORS: GENERAL
*************************/
/*white*/
.bg-light {
  background: var(--light) !important;
}

.text-light {
  color: var(--light) !important;
}

/*dark*/
.bg-dark {
  background: var(--dark) !important;
}

.text-dark {
  color: var(--dark) !important;
}

/*** primary ***/
.bg-primary {
	 background: var(--primary) !important;
}

.text-primary {
	color: var(--primary) !important;
}

/*** secondary ***/
.bg-secondary {
	 background: var(--secondary) !important;
}

.text-secondary {
	color: var(--secondary) !important;
}

/*** tertiary ***/
.bg-tertiary {
	 background: var(--tertiary) !important;
}

.text-tertiary {
	color: var(--tertiary) !important;
}

/*lighter green accent*/
.bg-accent01 {
  background: var(--accent01) !important;
}

.text-accent01 {
  color: var(--accent01) !important;
}

/* darker green accent*/
.bg-accent02 {
  background: var(--accent02) !important;
}

.text-accent02 {
  color: var(--accent02) !important;
}

/* "limestone" pale warm gray accent*/
.bg-accent03 {
  background: var(--accent03) !important;
}

.text-accent03 {
  color: var(--accent03) !important;
}

/************************
GENERAL STYLING
*************************/
body {
	font-family: 'Open Sans', Open Sans, Verdana, Helvetica, Arial, Sans-serif;
	font-size: 2.5vw;
	line-height: auto;
	background: var(--primary);
	color: var(--light);
	margin: 0;
	padding: 0;
}

html {
	margin: 0;
	padding: 0;
}

body.theme-keeneland {
	background: var(--primary);
	color: var(--light);
	background-size: 100%;
	min-height: 100vh;
	
	background-image: url(../img/sales-pattern-02-accent.svg)!important;
	background-position: top left;
	background-size: 100px !important;
}

body.theme-keeneland-animate {
	background-color: var(--primary);
	color: var(--light);
	background-size: 100%;
	min-height: 100vh;
	
	background-image: url(../img/sales-pattern-02-accent.svg)!important;
	background-repeat: round;
	background-size: 6vw!important;
	animation: movebg 45s infinite linear;
}

body.theme-championship {
	background: var(--primary) url(../img/Championship-HorseHead.svg) no-repeat top left;
	background-size: auto 100%;
	color: var(--light);
	min-height: 100vh;
}

.ke-icon {
	position: absolute;
	z-index: 10;
	right: 4vw;
	top: 4vw;
	width: 8vw;
}

@keyframes movebg {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -100vw 50vh;
  }
}

/***********************
STRUCTURE
************************/
.atg-wrapper {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 95vw;
	margin: 0 auto;
}

.wrapper-container {
	text-align: center;
}
 
.hidden {
    display:none;
}
.hide-the-images img {
    display:none;
}
.consignment table {
    width:100%;
}

.theme-championship .soldgreen {
    color: #D7F089;
}
 
 
@keyframes fadeScaleIn {
    0% {
      opacity: 0;
      transform: scale(4);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
 
  /* Apply this class to the div you want to animate */
  /*.fade-scale-in {
    animation: fadeScaleIn 300ms ease-out forwards;
  }*/

.white-wrapper {
	min-height: 90vh;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 95vw;
	margin: 2.5vw auto;
	background: var(--light);
	color: var(--dark);
}

hr {
	opacity: 1;
	height: 0.2vh;
	background: var(--tertiary);
	border: 0.1vh solid var(--tertiary);
	max-width: 10vw;
	margin: 4vh auto 1vh auto;
}

/**********************
TYPE
***********************/

/*** hip number & horse info ***/
.hip-no {
	font-family: 'Quincy', Quincy, Georgia, sans-serif;
	font-size: 280%;
	transition: 0.3s;
}

.horsename {
	font-family: 'Quincy', Quincy, Georgia, sans-serif;
	font-size: 150%;
	margin: -10px;
	transition: 0.3s;
}

.horsedetails {
	margin: 0;
	font-weight: bold;
	transition: 0.3s;
}

/*** consignor text ***/
.consignment {
	font-size: 75%;
	font-style: italic;
	opacity: 0.65;
	transition: 0.3s;
	margin: 0;
}

/*** bid number ***/
.bidno {
	font-weight: bold;
	font-size: 200%;
	margin: 0;
	transition: 0.3s;
}

/*** sold status ***/
.hammerprice {
	font-weight: bold;
	font-size: 200%;
	margin: 0;
	transition: 0.3s;
}

.soldstatus {
	text-transform: uppercase;
	margin: 0;
	display: inline-block;
	text-align: center;
	padding: 0 0.5vw;
	/*color: var(--light);
	font-size:43%;*/
	display:block;
}

/*** condition of sale - not currently used ***/
.conditionofsale {
	background: var(--secondary);
	font-weight: bold;
	text-transform: uppercase;
	margin: 0;
	display: inline-block;
	text-align: center;
	padding: 0.5vw;
	font-size: 65%;
	margin-top: 1vw;
	color: var(--light);
}

.minheight340 {
	min-height:345px;
}
.extratoppad {
	padding-top:6vh;
}