a,
a:hover {
    transition: .5s
}

.showCustom,
hr {
    opacity: 1 !important
}

.secshow,
.showCustom {
    display: flex !important
}

.post_head_title,
.post_paragraph {
    font-family: Lato;
    font-style: normal
}

.custom_card,
.custom_card:hover,
.news_post_title:hover,
.panel-title>a,
.panel-title>a:active,
.second_services_container:focus,
.service_btn,
.service_btn:hover,
a:hover {
    text-decoration: none
}

.card_paragraph,
.more_news_post_text {
    text-overflow: ellipsis;
    line-height: normal
}

.mediaGalleryTitle,
.mediaViewMore,
.newsDetailsContainer {
    align-self: flex-start
}

#listofbidstable,
.bookingTableContainer,
.overflowYSCroll,
body,
html {
    scroll-behavior: smooth
}

.pagination button.active,
.pagination button:hover {
    background-color: var(--blue);
    color: var(--white)
}

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

:root {
    --background: #FBFBFB;
    --gray: hsl(0, 0%, 80%);
    --white: #fff;
    --black: #000;
    --red: #E44D52;
    --redop: #FADBDC;
    --uparrow: #BDBDBD;
    --darkGrey: #333333;
    --green: #0B9444;
    --newsBlack: #0E0E2C;
    --ContactBlack: #212121;
    --copyright: #7A7A7A;
    --bgGray: #828282;
    --bgF0: #f0f0f0;
    --mainGold: #E44D52;
    --footerBlack: #7B7979;
    --underLineGray: #E8E7E7;
    --sevenBlack: #777777;
    --blackForty: #404040;
    --horseCardBg: #FFFFFF;
    --dddColor: #ddd;
    --scrollRect: #f7f7f7;
    --f3f3f3: #f3f3f3;
    --page-number-color: #c0cedd;
    --pureRed: #FF0000;
    --B7B7B7: #B7B7B7;
    --grayColor: #A9ACB4;
    --purlple: #fe007d;
    --blue: #138496;
    --dbd6d6: #dbd6d6;
    --fafafa: #fafafa;
    --b7b5b5: #b7b5b5;
    --description: #838383;
    --bgSearch: rgba(0, 0, 0, 0.08)
}

.dropdown-divider {
    border-top: 1px solid rgba(0, 0, 0, .15) !important
}

.carousel-indicators [data-bs-target] {
    border-top: unset !important;
    border-bottom: unset !important;
    height: 7px !important
}

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

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

body,
html {
    overflow-x: hidden !important
}

hr {
    background: var(--white) fff !important;
    height: 1px !important;
    margin: 25px auto !important
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Lato
}

a {
    text-decoration: none !important
}

a:hover {
    color: var(--mainGold)
}

a:focus {
    outline: 0;
    border: 0
}

.homePage {
    background-image: url(../img/bg.svg);
    background-repeat: repeat;
    background-size: contain
}

.showCustom {
    position: absolute !important;
    top: 204px !important;
    right: 0 !important;
    background: var(--white) !important;
    align-items: flex-start !important;
    padding-left: 5px;
    transition: .5s ease-in-out
}

#menu_btn,
.overlayMenu {
    position: absolute;
    display: none
}

.overlayMenu {
    width: 100vw;
    height: 30000vh;
    background: rgba(0, 0, 0, 0);
    z-index: 500
}

.FilterBTNComponent {
    background: var(--white) fff;
    padding: '8px 10px';
    color: var(--red);
    outline: 0;
    border: solid;
    border-width: 1;
    border-color: var(--red);
    transition: .3s;
    margin: 10px 0
}

.FilterBTNComponent:hover,
.filterbtn:hover {
    background: var(--red);
    color: var(--white);
    transition: .3s
}

.FilterBTNComponent:hover img {
    filter: grayscale(1)
}

.header {
    display: flex;
    width: 100%;
    padding: 15px 5vw 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: url(../img/bg.svg) 0 0/cover
}

.fixed-top {
    position: fixed;
    top: 0;
    z-index: 4000;
    background-color: var(--white);
    background: url(../img/bg.svg), var(--white);
    background-size: cover;
    background-repeat: repeat
}

.carousalimageContainer,
.custom_card_img_container,
.nav_items,
.position-relative,
.video_container {
    position: relative
}

#menu_btn {
    top: 5px;
    right: 5px;
    z-index: 500000000
}

.logo_img_container {
    width: 250px;
    margin: -10px 0 0;
    display: block
}

.logo_img_container img,
.newsImage,
.our_news_img_post_container img,
.showImageNewContainer>img,
.singlesupplierimagecontainer>.NewsPostimg,
.studbookTabSpan,
.wd-100,
.width_100 {
    width: 100%
}

.nav_bar {
    display: flex;
    flex-direction: column;
    width: 75%
}

.lang_and_login {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end
}

.get_app_link>a,
.lang *,
.mediaCard>img {
    transition: .5s
}

.comingSoon h2,
.get_app_link>a:hover,
.lang:hover *,
.newbtn,
.redbtn {
    color: var(--red) !important
}

.get_app_link,
.lang,
.login_link {
    margin: 0 15px
}

.fontsize14,
.lang_item span,
.showssubTable>div {
    font-size: 14px
}

.login_link,
.oroginContainer>.origin {
    margin-right: 0
}

.get_app_link>a>span,
.login_link>a>span {
    margin-right: 0;
    margin-left: 5px
}

.login_link>span {
    cursor: pointer;
    font-weight: 700;
    font-size: 15px
}

.login_link>span>i {
    margin-right: 5px;
    font-weight: 700
}

.lang_and_login div a {
    font-size: 15px;
    color: var(--black);
    text-align: center
}

.nav_items {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px 0;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(0, 0, 0, .25)
}

.nav_items a {
    font-size: 15px;
    color: var(--black);
    transition: .5s
}

.underline {
    width: 100%;
    border: 1px solid var(--red);
    height: 3px;
    background-color: var(--red);
    margin-top: 15px;
    margin-bottom: -15px;
    transition: .5s;
    opacity: 0;
    visibility: hidden
}

.nav_items a:focus,
.nav_items a:hover {
    color: var(--red);
    text-decoration: none
}

.nav_items a:focus .underline,
.nav_items a:hover .underline {
    transition: .5s;
    visibility: visible;
    opacity: 1
}

.dropdown-menu li a span:hover {
    color: var(--red);
    transition: .5s
}

.video_player {
    height: 615px !important
}

.video_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5)
}

.first_slider_img {
    height: 619px
}

#video_section {
    z-index: 50
}

.carousel-indicators [data-bs-target] {
    background-color: var(--bgGray)
}

.video_section_class li {
    width: 7px !important;
    background-color: var(--bgF0);
    border-radius: 50%
}

.video_section_class .active {
    width: 7px;
    background-color: var(--red)
}

.post_paragraph {
    color: rgba(0, 0, 0, .75);
    font-size: 20px;
    font-weight: 400
}

.post_head_title {
    color: var(--green);
    font-size: 18px;
    margin-top: 30px;
    font-weight: 500;
    text-transform: capitalize
}

.custom_margin .col-sm-4,
.post_title {
    margin-top: 25px
}

.post_title,
.section_title h2 {
    font-weight: 700;
    font-size: 32px;
    font-style: normal;
    font-family: Lato
}

.post_title {
    color: var(--black);
    margin-bottom: 20px;
    text-transform: capitalize
}

.padding_left_custom {
    padding-left: 10vw !important
}

#second_news_section {
    margin-top: 0;
    background: rgba(0, 0, 0, .04)
}

.second_carousel_indicators {
    left: -35%
}

.second_carousel_indicators li {
    width: 75px;
    background: rgba(11, 148, 68, .25)
}

.second_carousel_indicators .active {
    width: 75px;
    background: var(--green)
}

.second_slider_img_container {
    height: 350px;
    overflow: hidden
}

.second_slider_img_container img {
    height: 350px
}

.section_title {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center
}

.section_title h2 {
    margin: 25px;
    color: var(--green);
    text-transform: uppercase
}

.section_title .line {
    width: 20%;
    height: 1px;
    background-color: var(--red);
    border: 1px solid var(--red)
}

.custom_card {
    position: relative;
    display: block
}

.custom_card img {
    width: 100%;
    border-radius: 5px
}

.image_over_lay {
    position: absolute;
    top: 10px;
    left: 0;
    background: var(--green);
    color: var(--white);
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    text-transform: capitalize;
    width: 100px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center
}

.card_title,
.custom_btn a {
    color: var(--red);
    font-weight: 700;
    text-transform: capitalize
}

.image_black_over_lay {
    background: rgba(0, 0, 0, .2);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.card {
    border: 0 !important
}

.card_title_row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding-top: 10px
}

.card_title {
    font-family: Lato;
    font-size: 18px;
    font-style: normal
}

.card_date,
.card_paragraph {
    font-family: Lato;
    font-size: 13px;
    font-style: normal
}

.card_date {
    color: var(--green);
    text-transform: capitalize
}

.card_paragraph {
    overflow: hidden;
    color: var(--black);
    font-weight: 400
}

.custom_btn a,
.panel-body {
    font-family: Lato;
    font-size: 18px
}

.custom_btn a {
    border-radius: 10px;
    border: 1px solid var(--red);
    background: var(--white);
    font-style: normal;
    padding: 15px 75px;
    margin: 50px auto;
    transition: .5s
}

.custom_btn a:hover {
    border: 1px solid var(--green);
    color: var(--green);
    transition: .5s
}

.collapse_background {
    background: url(../img/collapsebackground.png) center/contain no-repeat
}

.collapse_title,
.panel-body,
.panel-collapse,
.panel-default,
.panel-group,
.panel-heading,
.panel-title {
    background: 0 0 !important;
    border: 0;
    outline: 0
}

.panel-heading {
    padding: 0;
    border: 0
}

.panel-title>a,
.panel-title>a:active {
    display: block;
    padding: 15px;
    color: var(--black) !important;
    font-family: Lato;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    text-transform: capitalize
}

.panel-heading .active .panel-title>a,
.panel-title>a:active,
.panel-title>a:focus {
    color: var(--green) !important
}

.panel-heading.active a:before {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.panel-body {
    color: rgba(0, 0, 0, .5);
    font-style: normal;
    font-weight: 400;
    background: var(--white) !important
}

.service_btn,
.service_text,
.service_title {
    font-size: 16px;
    font-family: Lato;
    font-style: normal
}

.service_card_container {
    width: 300px;
    padding-right: 5px;
    padding-left: 5px
}

.service_card {
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, .15);
    background: var(--white);
    padding: 15px;
    width: 100%;
    min-height: 250px;
    margin: 0 5px;
    display: flex;
    flex-direction: column
}

.service_img_container {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    background-color: var(--red);
    display: flex;
    justify-content: center;
    align-items: center
}

.service_img_container img {
    width: 75px
}

.service_title {
    color: var(--black);
    font-weight: 700;
    text-transform: capitalize
}

.service_text {
    color: rgba(0, 0, 0, .5);
    text-align: left;
    font-weight: 400
}

.service_bar_img_and_link_conrtainer,
.service_btn {
    display: flex;
    font-weight: 700;
    text-transform: capitalize
}

.service_btn {
    border-radius: 5px;
    background: rgba(228, 77, 82, .05);
    width: 100%;
    margin: 2px auto;
    padding: 5px 25px;
    text-align: center;
    height: 44px;
    justify-content: center;
    align-items: center;
    color: var(--red)
}

.service_btn:hover {
    background-color: rgba(77, 228, 165, .479)
}

.second_services_section_container {
    display: flex;
    flex-direction: column
}

.bg-headerImage {
    background: url(../img/bgslider2.png) center/cover
}

.second_section_bar {
    max-width: 1728px;
    width: 100%;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center
}

.second_services_container {
    display: flex;
    color: var(--black);
    margin: 0 10px;
    flex-direction: column;
    align-items: center;
    cursor: pointer
}

.iconPlayContainer {
    position: absolute;
    bottom: 5%;
    left: 15%;
    font-size: 40px;
    color: var(--red);
    cursor: pointer;
    border: 2px solid var(--red);
    width: 100px;
    height: 100px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .5s
}

.second_services_container:focus .service_bar_underline,
.second_services_container:hover .service_bar_underline,
.service_bar_underline {
    opacity: 1;
    transition: .2s;
    visibility: visible
}

.iconPlayContainer:hover {
    transition: .5s;
    color: var(--mainGold);
    cursor: pointer;
    border: 2px solid var(--mainGold)
}

.service_bar_img_and_link_conrtainer {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 16px
}

.second_services_container img {
    width: 24px;
    margin-right: 5px
}

.paymentStatusSpan,
.second_services_container:focus,
.second_services_container:hover,
.showLastFilterDate>.red {
    color: var(--red)
}

.service_bar_underline {
    height: 0;
    border: 1px solid var(--underLineGray);
    background: var(--underLineGray);
    width: 100%;
    margin-top: 18px;
    margin-bottom: 0
}

.second_service_section_card_container {
    margin-top: 15px;
    position: relative;
    min-height: 100px;
    max-width: 100%;
    width: 100vw;
    border: 1px solid rgba(0, 0, 0, .25);
    border-radius: 15px;
    display: block;
    padding: 5px
}

.top_line {
    width: 60px;
    height: 1px;
    border: 1px var(--mainGold) solid;
    top: 0;
    left: 0;
    margin-top: -5.5px;
    margin-left: auto;
    margin-right: auto
}

.second_service_section_background_img {
    width: 250px;
    opacity: .1;
    position: absolute;
    right: 5px;
    bottom: 5px
}

.second_service_section_category {
    position: absolute;
    top: 35px;
    background-color: rgba(252, 242, 242, .76);
    padding: 5px 15px;
    color: var(--black);
    font-family: Lato;
    border-radius: 3px;
    font-size: 13px
}

.second_service_section_service_title {
    color: var(--black);
    font-family: Lato;
    font-size: 16px
}

.second_service_section_service_desc {
    width: 100%;
    color: rgba(0, 0, 0, .5);
    font-size: 13px;
    padding-right: 50px
}

.second_service_section_lets_start {
    bottom: 30px;
    left: 0;
    width: 100%;
    text-align: right;
    position: absolute;
    color: var(--red);
    font-size: 13px;
    padding: 0 20px
}

.second_service_section_lets_start_left_arrow_first i,
.second_service_section_lets_start_left_arrow_second i {
    font-size: 13px !important;
    font-weight: bolder
}

.news_post {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.our_news_img_post_container {
    position: relative;
    display: block
}

.our_news_img_post_container span {
    position: absolute;
    top: 15px;
    left: 15px;
    width: 178px;
    height: 37px;
    border-radius: 6px;
    background: var(--red);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--white);
    font-family: Lato;
    font-size: 14px;
    font-style: normal;
    font-weight: 400
}

.tableFixHead caption,
.tableFixHead thead th {
    position: sticky;
    top: 0
}

.posted_by {
    color: var(--black);
    font-family: Lato;
    font-size: 16px;
    font-style: normal;
    font-weight: 500
}

.news_post_title {
    color: var(--red);
    font-family: Lato;
    font-size: 22px;
    font-style: normal;
    margin-top: 20px;
    margin-bottom: 20px;
    font-weight: 600;
    display: block;
    transition: .5s
}

.news_post_title:hover {
    color: var(--green);
    transition: .5s
}

.news_post_text {
    color: rgba(0, 0, 0, .5);
    font-family: Lato;
    font-size: 18px;
    font-style: normal;
    font-weight: 400
}

.more_news,
.more_news_view_all {
    font-family: Lato;
    font-weight: 700
}

.more_news_row {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-top: 25px;
    padding-bottom: 25px
}

.more_news {
    color: var(--black);
    font-size: 30px;
    font-style: normal
}

.more_news_line {
    width: 80%;
    height: 1px;
    background-color: rgba(0, 0, 0, .15);
    border: 1px solid rgba(0, 0, 0, .15);
    margin: auto
}

.more_news_view_all {
    color: var(--green);
    font-size: 18px;
    font-style: normal;
    min-width: 75px;
    text-decoration: underline
}

.more_news_post_text,
.more_news_post_title,
.more_news_posted_at {
    color: var(--white);
    font-family: Roboto;
    font-style: normal
}

.horseName,
.ownerProfileButton {
    min-width: 175px;
    cursor: pointer
}

.more_news_post_container {
    position: relative;
    display: block;
    margin: 2px
}

.more_news_post_container img {
    height: unset
}

.newsImageinNewsPage {
    max-height: unset !important
}

.more_news_image_container {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    background: var(--white);
    justify-content: center;
    transition: .2s ease-in-out
}

.bookingTable:hover,
.more_news_image_container:hover,
.zonebg:hover {
    transform: scale(1.05)
}

.more_news_image_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) -19.58%, rgba(0, 0, 0, .7) 100%);
    border-radius: 10px
}

.more_news_posted_at {
    border-radius: 50px;
    background: var(--red);
    padding: 5px 25px;
    position: absolute;
    bottom: 100px;
    left: 15px;
    font-size: 12px;
    font-weight: 400;
    line-height: normal
}

.moreNewsTextBox {
    position: absolute;
    left: 24px;
    bottom: 10px
}

.more_news_post_title {
    font-size: 20px;
    font-weight: 500
}

.more_news_post_text {
    font-size: 13px;
    font-weight: 400
}

.bookingArenaBorder {
    border: 1px solid var(--mainGold);
    border-radius: 15px;
    padding: 50px 0;
    cursor: pointer
}

.sponser_img {
    width: 250px !important;
    margin: auto
}

.sponser_title {
    margin: 15px auto;
    color: var(--black);
    max-width: 250px;
    text-align: center;
    font-family: Lato;
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase
}

.AddNewHorseBtn,
.AuctionDetailsSpan,
.EventListDiv>span,
.Horse_Details_Auction_Details_Birthdate,
.capatalise,
.capatalize_text,
.footer_link,
.horseCardLabeltitle,
.horseCardlabelContent,
.iAgreeToTheTermsAndConditionsOfTheAuction,
.ownerProfileButton,
.ownerProfileName,
.radioLable,
.viewDetailsDiv {
    text-transform: capitalize
}

.footertitle {
    color: var(--white);
    font-family: Lato;
    font-size: 18px;
    font-style: normal;
    font-weight: 700
}

.all_right_reserved,
.footer_link,
.footer_text {
    font-size: 15px;
    font-style: normal;
    font-family: Lato
}

.footer_text {
    color: var(--footerBlack);
    font-weight: 400;
    display: flex;
    line-height: 30px !important;
    align-items: center
}

.footer_link {
    display: block;
    margin: 10px 0;
    color: var(--footerBlack);
    font-weight: 500
}

.soical_media_img {
    width: 35px;
    height: 35px;
    border-radius: 50%
}

.transparent-bg {
    background-color: transparent !important
}

.text-collapse>span,
.white-icon {
    color: #fff
}

.all_right_reserved {
    color: var(--red);
    font-weight: 400;
    line-height: normal
}

.eventimage-container {
    position: relative;
    overflow: hidden;
    border-radius: 15px
}

.eventoverlay {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .25);
    z-index: 21
}

.eventimage {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 20;
    aspect-ratio: 300/121
}

.hoveronlink {
    color: var(--red);
    font-size: 16px !important;
    cursor: pointer
}

.hoveronlink:hover {
    opacity: .5
}

.ViewProfileLink {
    font-size: 16px;
    float: right;
    color: var(--red)
}

.ownerAddress,
.ownerHorseCount {
    color: var(--sevenBlack);
    display: block
}

.ownerProfileName {
    font-weight: 700;
    font-size: 36px
}

.ownerAddress {
    font-size: 16px
}

.ownerHorseCount {
    font-size: 14px
}

.ownerProfileButton {
    display: block;
    padding: 10px 20px;
    text-align: center;
    background: rgba(0, 0, 0, .08);
    color: var(--black);
    transition: .3s;
    border-radius: 5px;
    font-weight: 600
}

.customTabStyle:hover,
.customTabactive,
.fileUploadSpan:hover,
.linkbtn:hover,
.ownerProfileButton:active,
.ownerProfileButton:focus,
.ownerProfileButton:hover {
    background: var(--red);
    color: var(--white)
}

.ownerProfileSpan {
    display: block;
    font-size: 14px;
    color: var(--blackForty);
    margin-top: 10px
}

.horseCardContainer,
.horseCardContainerMInh {
    position: relative;
    display: inline-block;
    background: var(--horseCardBg);
    border-top: 2px solid var(--mainGold);
    margin-bottom: 15px;
    width: 100%;
    padding: 10px 20px;
    border-radius: 5px
}

.horseCardContainer {
    min-height: 350px
}

.horseCardContainerMInh {
    min-height: 200px
}

.horseCardlabelContent {
    font-size: 16px;
    display: block;
    margin-bottom: 5px;
    color: rgba(0, 0, 0, .6)
}

.AddNewHorseBtn {
    padding: 10px 20px;
    border-radius: 5px;
    width: 200px;
    border: var(--red) 1px solid;
    text-align: center;
    background: 0 0;
    font-weight: 700;
    color: var(--red);
    font-size: 18px;
    cursor: pointer;
    transition: .5s;
    display: block;
    margin-bottom: 10px
}

.BigLoader,
.loader {
    margin: 20px auto 0
}

.AddNewHorseBtn:hover {
    border: var(--red) 1px solid;
    background: var(--red);
    color: var(--white);
    transition: .5s
}

.horseMarketCardCategory {
    padding: 5px 10px;
    display: block;
    position: absolute;
    background: var(--black);
    font-weight: 600;
    color: var(--white);
    top: -5px;
    left: -10px;
    font-size: 12px;
    border-radius: 5px
}

.cardKeyColor,
.errormessage {
    font-weight: 700
}

.cardKeyColor,
.cardValueColor {
    font-size: 16px;
    color: var(--black) 99
}

.submitButtonContainerleft {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 15px
}

.errormessage {
    color: var(--pureRed)
}

.siblingNoDataFound {
    position: relative;
    top: 98px
}

.mediaOverLay:hover,
.popup-overlay {
    background: rgba(0, 0, 0, .7)
}

.popCustomOverLay-overlay {
    position: absolute !important
}

.popCustomOverLay-content {
    padding: 5px !important
}

.popup-content {
    background-color: var(--white);
    width: 100%;
    max-width: 1400px;
    text-align: start;
    padding: 20px;
    z-index: 50000;
    border-radius: 15px
}

.signatureCanvas {
    border: 1px solid #000;
    width: 100%;
    min-height: 400px
}

.image_slider_indicators>li {
    width: 50px;
    height: 3px;
    background-color: var(--white);
    margin: 1px 10px;
    border-radius: 0
}

.image_slider_indicators>.active {
    color: var(--red) !important;
    width: 50px !important;
    height: 3px !important;
    margin: 1px 10px;
    border: 1px solid var(--red);
    background-color: var(--red);
    border-radius: 0
}

.horse-profile-slider-image-overlay {
    width: 70%;
    height: 100%;
    background: linear-gradient(90deg, var(--white)fff 0, rgba(255, 255, 255, 0) 100%);
    z-index: 600;
    position: absolute;
    top: 0;
    left: 0
}

.minusandaddiconstyle {
    display: block;
    font-weight: 700;
    font-size: 20;
    border: 1px solid rgba(228, 77, 82, .25);
    color: var(--red);
    padding: 10px 25px;
    background: var(--white);
    cursor: pointer;
    border-radius: 8px;
    transition: .5s
}

.bidSubmit,
.bidSubmit:hover {
    padding: 5px 20px;
    transition: .5s
}

.minusandaddiconstyle:hover {
    transform: scale(1.1);
    border: 1px solid var(--red)
}

.minusandaddiconstyle:active {
    transform: scale(1.3)
}

.bidSubmit {
    display: block;
    font-size: 20px;
    background: var(--red);
    border-radius: 5px;
    color: var(--white);
    cursor: pointer;
    border: 1px solid var(--red)
}

.bidSubmit:hover {
    background: var(--white);
    border-radius: 5px;
    color: var(--red)
}

#listofbidstable {
    border-collapse: collapse;
    width: 100%;
    max-height: 400px;
    overflow-y: scroll
}

#listofbidstable td,
#listofbidstable th {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid var(--dddColor)
}

#listofbidstable th {
    background-color: var(--grayColor);
    color: var(--white);
    font-weight: 100
}

#listofbidstable td,
.SuccessMessage,
.bold,
.fontWeight,
.uaepassor,
.view-details-icon {
    font-weight: 700
}

@media (max-width:591px) {
    #listofbidstable td {
        min-width: 143px
    }
}

.tableFixHead {
    overflow-y: auto;
    overflow-x: auto;
    height: 375px;
    scrollbar-width: thin;
    scrollbar-color: var(--mainGold) var(--scrollRect)
}

.tableFixHead caption {
    background: var(--scrollRect)
}

.tableFixHead::-webkit-scrollbar {
    width: 10px
}

.tableFixHead::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 15px
}

.tableFixHead::-webkit-scrollbar-button {
    display: none
}

.loader {
    border: 5px solid var(--f3f3f3);
    border-radius: 50%;
    border-top: 5px solid var(--mainGold);
    width: 25px;
    height: 25px;
    -webkit-animation: 2s linear infinite spin;
    animation: 2s linear infinite spin
}

.BigLoaderContainer {
    width: 100vw;
    height: 100vh;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    background: var(--white)
}

.BigLoader {
    border: 15px solid var(--f3f3f3);
    border-radius: 50%;
    border-top: 15px solid var(--mainGold);
    width: 100px;
    height: 100px;
    -webkit-animation: 2s linear infinite spin;
    animation: 2s linear infinite spin
}

.showAndHideUsermenu {
    width: 150px;
    display: flex;
    position: absolute;
    right: 0;
    text-align: right;
    border-radius: 10px;
    top: 60px;
    font-weight: 700;
    background-color: var(--white);
    border: 1px solid var(--black);
    padding: 5px;
    z-index: 1250000;
    justify-content: space-around;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
    transition: .5s;
    min-height: 100px
}

.mediaCard:hover img,
.playButtonContainer:hover,
.showAndHideUsermenu span:hover {
    transform: scale(1.2);
    transition: .5s
}

.SuccessMessage {
    position: fixed;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    right: 15px;
    top: 50px;
    max-width: 300px;
    z-index: 50000000000;
    background: var(--red);
    text-align: justify;
    color: var(--white);
    font-size: 15px;
    transition: right .5s
}

.UaePassSeperator {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    align-items: center
}

.Seperator {
    width: 45%;
    height: 3px;
    border: 2px solid var(--sevenBlack);
    margin: 25px auto
}

.uaepassor {
    font-size: 20px;
    color: var(--sevenBlack)
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.tree-container {
    min-height: 800px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 10px
}

.first-level,
.first-level-spacer,
.fourth-level,
.second-level,
.second-level-spacer,
.third-level,
.third-level-spacer {
    height: 800px;
    display: flex;
    flex-direction: column;
    justify-content: space-around
}

.horseName,
.horseNamePedigree {
    display: block;
    font-size: 14px;
    padding: 5px 10px;
    color: var(--black);
    position: relative;
    text-align: center;
    text-decoration: none
}

.horseName {
    background-color: var(--white);
    border: 2px solid var(--mainGold);
    border-radius: 15px;
    margin-right: 14px
}

.horseName:active,
.horseName:focus,
.horseNamePedigree:active,
.horseNamePedigree:focus {
    text-decoration: none;
    color: var(--black)
}

.horseNamePedigree {
    background-color: var(--white) fff;
    min-width: 150px;
    border: 2px solid var(--mainGold);
    border-radius: 15px;
    margin-right: 13px
}

.upspacer,
.upspacerPedigree {
    border-top: var(--mainGold) 2px solid;
    box-sizing: border-box
}

.downspacer,
.downspacerPedigree {
    border-bottom: var(--mainGold) 2px solid
}

.downspacer,
.downspacerPedigree,
.upspacer,
.upspacerPedigree {
    width: 100px;
    height: 25%;
    border-left: var(--mainGold) 2px solid
}

.first-level-spacer {
    justify-content: center
}

.upspacer {
    border-top-left-radius: 15px
}

.downspacer {
    border-bottom-left-radius: 15px
}

.upspacerPedigree {
    border-top-left-radius: 12%
}

.downspacerPedigree {
    border-bottom-left-radius: 12%
}

.second-level-spacer-container-dad,
.second-level-spacer-container-mom {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 50%;
    width: 100%
}

.second-level-spacer-container-dad-first,
.second-level-spacer-container-dad-second,
.second-level-spacer-container-mom-first,
.second-level-spacer-container-mom-second {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 25%;
    width: 100%
}

.page-number-style,
.pagination-style {
    height: 36px;
    display: inline-block;
    line-height: 37px;
    margin: 5px;
    border-style: solid;
    cursor: pointer
}

.pagination-style {
    width: 36px;
    background: #fff;
    color: #000;
    border-radius: 5px;
    border-color: #c0cedd
}

.horse-market-card {
    padding: 15px !important
}

.horse-market-card-div {
    padding: 0;
    position: relative
}

.horse-category-img {
    border-radius: 5px;
    width: 100%
}

.view-details-icon {
    color: var(--red);
    font-size: 15px
}

.container-fluid-padding {
    padding-left: 75px;
    padding-right: 75px
}

.page-number-style {
    width: 36px;
    background: var(--white);
    color: #000;
    border-radius: 8px;
    border-color: var(--page-number-color)
}

.button-show-filter-style {
    background: var(--white);
    padding: 10px 20px;
    color: var(--red);
    outline: 0;
    border: 1px solid;
    border-color: var(--red);
    transition: .3s;
    display: block;
    margin: 10px auto
}

.horse-market-filter-form {
    background-color: var(--white);
    padding: 25px;
    border-radius: 15px
}

.horse-market-filter-reset-apply-div {
    display: flex;
    justify-content: space-between;
    flex-direction: row
}

.horseMarketImageContainer {
    max-width: 210px;
    overflow: hidden;
    max-height: 280px
}

.max_width_100,
label {
    max-width: 100%
}

.horseMarketImageContainer img {
    height: 240px;
    width: 100%
}

.AuctionFilter,
.bg-gray-p-25 {
    background-color: var(--scrollRect);
    padding: 25px
}

.AuctionFilterSpan {
    display: block;
    margin-bottom: 10px;
    margin-top: 10px;
    font-weight: 500
}

.AuctionFilterRadioContainer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start
}

.AuctionFilterRadioContainer>.form-group {
    margin: 0 2px 5px
}

.HorseMarketCategoriesContainer {
    justify-content: space-between
}

.AuctionFilterNumberofhoursesContainer {
    margin-top: -5px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.AuctionFilterBirthDate,
.flex_wrap,
.radiofelxwrap {
    flex-wrap: wrap
}

.ChampionShipCard>.col-md-12>h1,
.font-24,
.fontsize24 {
    font-size: 24px
}

.font25-b {
    font-size: 25px;
    font-weight: 700
}

.d-flex-flex-end {
    display: flex;
    justify-content: flex-end
}

.collapseLableStyle {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 0;
    cursor: pointer;
    color: var(--black);
    transition: .5s
}

.collapseLableStyle:hover,
.colorred,
.requiredColor {
    color: var(--pureRed)
}

.m-auto-10-font-20 {
    margin: auto 10px;
    font-size: 20px
}

.color-white-bold {
    color: var(--white);
    font-weight: 700
}

.EventListSpan {
    position: absolute;
    top: 25px;
    left: 0;
    z-index: 500;
    color: var(--white);
    background: var(--mainGold);
    padding: 10px 20px
}

.C89C66,
.color-eahsred,
.goldenicon-mr-5,
.red {
    color: var(--mainGold)
}

.EventListDiv {
    width: 100%;
    background-color: var(--white);
    z-index: 50;
    position: relative;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 10px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start
}

.EventListDiv>span {
    font-weight: 700
}

.font-20-d-block {
    display: block;
    font-size: 15px
}

.EventListDivSpan {
    display: block;
    font-size: 12px;
    margin-top: 5px;
    font-weight: unset;
    font-family: Lato;
    margin-bottom: 10px
}

.EventListDivSpacer {
    width: 100%;
    height: 0;
    background: var(--gray);
    border-top: solid 1px var(--gray);
    margin-top: 6px;
    margin-bottom: 5px
}

.d-flex-row-spb-c {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap
}

.ChampionShipCard,
.mb-10,
.mb-form-group,
.notification-item,
.viewDetailsRow {
    margin-bottom: 10px
}

.EventListDiv>.d-flex-row-spb-c>.font-11,
.EventListDiv>.d-flex-row-spb-c>.font-12,
.EventListDiv>.d-flex-row-spb-c>.hoveronlink {
    font-size: 17px
}

.font-11 {
    font-size: 11px
}

.font-13-m-15-0 {
    font-size: 13px;
    margin: 15px 0
}

.goldenicon-mr-5 {
    margin-right: 5px
}

.red-fz-8-op-1,
.red-fz-8-op-25,
.red-fz-8-op-50 {
    color: var(--red);
    font-size: 8px
}

.red-fz-8-op-25 {
    opacity: .25
}

.red-fz-8-op-50 {
    opacity: .5
}

.font-12 {
    font-size: 12px
}

#root>div>div.mainLayoutContainer>div>div>div.col-md-9.col-sm-12>div>div>div>div.EventListDiv.rtl>span.font-20-d-block,
.EventListDiv>.d-flex-row-spb-c>.font-11,
.font-15,
.form-group>label,
.theadHorseSelect>tr>th {
    font-size: 15px
}

.EventListDataFoundDiv {
    margin-top: 1vw;
    margin-bottom: 1vw;
    color: var(--pureRed);
    font-weight: 700;
    font-size: 18px
}

.p-0-10w {
    padding: 0 10vw
}

.px75 {
    padding-right: 75px;
    padding-left: 75px
}

.p-0-10px {
    padding: 0 10px
}

.p-0-50px {
    padding: 0 50px
}

.p-0-5w {
    padding: 0 5vw
}

.bgBlack50 {
    background: rgba(0, 0, 0, .5)
}

.color-green,
.wahoContentCompition {
    color: var(--green)
}

.FileUploadRow {
    padding: 25px;
    border: 1px solid var(--mainGold);
    border-radius: 5px;
    margin-bottom: 10px
}

.DragActive {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.uploadicon {
    width: 30px;
    height: 30px
}

.Gray_color,
.graycolor {
    color: var(--grayColor)
}

.Upload_container {
    background: var(--red);
    color: var(--white);
    padding: 10px auto;
    width: 100%;
    text-align: center;
    height: 50px;
    display: flex;
    margin-top: 25px;
    margin-bottom: 10px
}

.margin_auto {
    margin: auto
}

.mt-20d-flex-flexwrap {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap
}

.Upload_container2 {
    outline: 0;
    color: var(--red);
    border-radius: 12px;
    width: 24px;
    height: 24px;
    border: 1px solid var(--red);
    background: var(--white);
    margin-right: 5px;
    display: flex;
    cursor: pointer
}

.color_white,
.font-22-white,
.volumeControll>i,
.wahoTitleContainer>i {
    color: var(--white)
}

.UploadPreviewIMG {
    max-width: 100%;
    max-height: 100px;
    margin-top: 10px
}

.bg-gray-75-p-0-12w {
    background: var(--blackForty);
    padding: 0 12vw !important;
    z-index: 100;
    position: relative
}

.paddleft-zero {
    padding-left: 0
}

.font-22-white {
    font-size: 22px
}

.d-flex-jc-center-fld-col {
    display: flex;
    justify-content: center;
    flex-direction: column
}

.ChampionShipCardHeader>span,
.classdisplay,
.dblock,
.display_block,
.latestnewsCardNewsPage,
.oroginContainer>span {
    display: block
}

.bgtransparent-outline-0-border-0 {
    background: 0 0;
    outline: 0;
    border: 0
}

.width-17 {
    width: 17px
}

.width_200 {
    width: 200px
}

.accountSettingMenu {
    width: 50px;
    height: 50px;
    border-radius: 25px;
    text-align: center;
    background: #e44d52;
    color: var(--white);
    font-weight: 700;
    position: absolute;
    top: 5px;
    right: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.PedigreeChart,
.PedigreeChartSpan {
    bottom: 50%;
    right: -16px;
    position: absolute
}

.font-50 {
    font-size: 50px
}

.d-flex-js-center-align-items-center {
    display: flex;
    justify-content: center;
    align-items: center
}

.PedigreeChart {
    display: block;
    width: 15px;
    background: var(--mainGold);
    border: 1px solid var(--mainGold);
    top: 45%;
    border-bottom-left-radius: 100%;
    border-top-left-radius: 100%
}

.color_Blue {
    color: var(--blue)
}

.perpul {
    color: var(--purlple)
}

.mb-5 {
    margin-bottom: 5px
}

.mb-25 {
    margin-bottom: 25px
}

.mb-90 {
    margin-bottom: 90px
}

.m-23 {
    margin: 23px
}

.maxHeight480 {
    max-height: 480px
}

.pading-10-20 {
    padding: 10px 20px
}

.zindex1500 {
    z-index: 1500
}

.ReactModal__Overlay--after-open,
.css-1nmdiq5-menu,
.zindex5000 {
    z-index: 5000 !important
}

.zindex400 {
    z-index: 400
}

.transformScale1 {
    transform: scale(1)
}

.carousel-caption_custom {
    top: 30%;
    color: var(--black);
    width: 30%;
    left: 10px;
    text-align: left;
    z-index: 1000
}

.passwordButton {
    position: absolute;
    top: -20px;
    transform: translateY(-50%);
    background-color: transparent;
    border: none;
    cursor: pointer
}

.d-flex-row-itemscenter-justify-flexStart {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.radiobuttonstyle {
    accent-color: var(--black);
    margin-top: auto !important;
    margin-bottom: auto !important;
    cursor: pointer;
    min-width: 16px;
    min-height: 16px
}

.radioLable {
    margin-left: 4px;
    font-size: 15px;
    line-height: auto;
    margin-top: auto;
    margin-bottom: auto;
    font-family: Lato;
    cursor: pointer
}

.ml-15 {
    margin-left: 15px
}

.ml-10 {
    margin-left: 10px
}

.ml-25 {
    margin-left: 25px
}

.mt--5 {
    margin-top: -5px
}

.margintopprogramCardwahoconference,
.mt-50 {
    margin-top: 50px
}

.mt-5 {
    margin-top: 5px
}

.mt-15 {
    margin-top: 15px
}

.mt-25 {
    margin-top: 25px
}

.mt-20 {
    margin-top: 20px
}

.mt-67 {
    margin-top: 67px
}

.ml-5 {
    margin-left: 5px
}

.mr-5 {
    margin-right: 5px
}

.PedigreeChartSpan {
    display: block;
    width: 16px;
    height: 1px;
    background: var(--mainGold);
    border: 1px solid var(--mainGold);
    top: 45%;
    border-bottom-left-radius: 100%;
    border-top-left-radius: 100%
}

.RegisterFormRow {
    border-radius: 15px;
    background: var(--white)
}

.AuctionHeaderDate,
.aboutusItem {
    border: 1px solid var(--mainGold)
}

.siteMapStyle {
    width: 100%;
    min-height: 50px;
    display: flex;
    color: var(--white);
    padding: 10px 50px
}

.margin_auto_zero {
    margin: auto 0
}

.margin_auto_20 {
    margin: auto 20px
}

.mr-10 {
    margin-right: 10px
}

.transformScale1-4 {
    transform: scale(1.4)
}

.font-64 {
    font-size: 64px
}

.fontweight600 {
    font-weight: 600
}

.AuctionHeaderRow {
    background: var(--mainGold);
    max-height: 480px
}

.p0 {
    padding: 0
}

.zindex200 {
    z-index: 200
}

.AuctionHeaderDetails {
    padding-right: 50px;
    padding-left: 15px;
    background: var(--mainGold);
    color: var(--white);
    z-index: 100;
    display: flex;
    flex-direction: column
}

.AuctionHeaderDetails_Type {
    text-align: justify;
    font-family: Lato;
    font-weight: 100
}

.AuctionHeaderDate {
    width: 100%;
    height: 50px;
    display: flex !important;
    flex-direction: row;
    color: var(--mainGold);
    background: var(--white);
    margin-left: -15px;
    box-shadow: 0 0 25px rgba(0, 0, 0, .15);
    justify-content: flex-start;
    padding-left: 10px;
    align-items: center
}

.AuctionHeaderNOH {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: 0;
    padding-left: 0;
    flex-wrap: wrap
}

.web-numberOfHourses {
    font-size: large;
    line-height: 4px
}

.showAuctionPaymentConfirmation {
    top: 200px;
    left: 0;
    right: 0;
    position: absolute;
    height: 400px;
    background: rgba(0, 0, 0, 0);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 800
}

.showAuctionPaymentConfirmationRow {
    background: var(--white);
    padding: 25px
}

.showAuctionPaymentConfirmationspan {
    display: block;
    font-size: 20px;
    font-weight: 700
}

.auctionPaymentuserKeyCol {
    background: var(--mainGold)
}

.auctionPaymentuserValCol {
    background: var(--bgF0)
}

.auctionPaymentuserkeyspan,
.programCardTitle {
    font-size: 18px;
    color: var(--white);
    font-weight: 700
}

.auctionPaymentuserValspan {
    font-size: 18px;
    color: var(--black);
    font-weight: 700
}

.iAgreeToTheTermsAndConditionsOfTheAuction {
    font-size: 15px;
    margin-left: 5px;
    color: #e44d52
}

.acceptTerms {
    position: absolute;
    width: 100%;
    height: 100%
}

.paymentConfirmation {
    position: absolute;
    top: 200px;
    left: 0;
    right: 0;
    height: 480px;
    background: rgba(0, 0, 0, 0);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000
}

.AuctionDatesStyle,
.d-flex-row-space-center-w100-my5 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 5px 0
}

.AuctionDetailsRow,
.AuctionDetailsRow2 {
    margin-right: 0;
    margin-left: 0
}

.AuctionDetailsRow {
    padding-left: 50px;
    padding-right: 50px
}

.AuctionDetailsRow2,
.BiddingPageRow {
    background: rgba(0, 0, 0, .03);
    padding: 25px 50px
}

.BiddingPageRow {
    margin: 0
}

.AuctionDetailsHorseList,
.minH250-p-0-br-5-bg-white {
    min-height: 250px;
    padding: 0;
    border-radius: 5px;
    background: var(--white)
}

.p-5,
.padding-5 {
    padding: 5px
}

.p-20 {
    padding: 20px
}

.AuctionDetalisListhourseImage {
    height: 25em
}

.AuctionDetailsSpan {
    background: var(--mainGold);
    top: 25px;
    left: 15px;
    position: absolute;
    min-width: 100px;
    min-height: 40px;
    text-align: center;
    font-size: 14px;
    line-height: 40px;
    color: var(--white)
}

.AuctionDetailsHorseDesc {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 30vh
}

.AuctionDetailsHorseDescDiv {
    width: 100%;
    margin: auto
}

.AuctionDetailsSpacer {
    width: 100%;
    height: 1px;
    background: rgba(0, 0, 0, .15);
    border: 1px solid rgba(0, 0, 0, .15)
}

.AuctionDetails_HorseDetails {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    margin: 10px 0;
    flex-wrap: wrap
}

.Horse_Details_Auction_Details_Birthdate {
    display: block;
    color: rgba(0, 0, 0, .5)
}

.Horse_Details_Auction_Details_BirthdateVal {
    display: block;
    text-transform: capitalize;
    color: #000
}

.AuctionDetailsStartingPrice {
    display: block;
    color: rgba(0, 0, 0, .5);
    margin: 5px 0
}

.AuctionDetailsStartingPriceVal {
    margin-left: 79px;
    color: var(--red)
}

.viewDetails {
    min-height: 320px;
    border-radius: 5px;
    padding: 10px 0;
    background: var(--white)
}

.viewDetailsDiv {
    color: var(--red);
    font-size: 20px
}

.pl-40-15-40 {
    padding-left: 40px;
    padding-top: 15px;
    padding-right: 40px
}

.paymentStatusRow {
    display: flex;
    margin: 15px 0;
    justify-content: space-between;
    width: 100%;
    color: var(--mainGold);
    font-size: 18px
}

.d-block-c-red-font-18 {
    display: block;
    color: var(--mainGold);
    font-size: 18px
}

.d-flex-col-my-15 {
    display: flex;
    flex-direction: column;
    margin: 15px 0
}

.d-block-font13-my15-ml-20 {
    display: block;
    font-size: 13px;
    margin: 5px 0 5px 20px
}

.AuctionDetailsAnotherSpacer {
    width: 100%;
    height: 25px;
    background: rgba(0, 0, 0, .03)
}

.m0-bgred {
    margin: 0;
    background: var(--red)
}

.m0 {
    margin: 0 !important
}

.p0-dflex-col {
    padding: 0;
    display: flex;
    flex-direction: column
}

.w100-bgred-f1p3020 {
    width: 100%;
    background: var(--red);
    flex: 1;
    padding: 30px 20px
}

.d-block-font25-fw-bold-white {
    display: block;
    font-size: 25px;
    font-weight: 700;
    color: var(--white)
}

.fz15-mt15-white {
    font-size: 15px;
    margin-top: 15px;
    color: rgba(255, 255, 255, .75)
}

.BiddingPageSpacer {
    width: 100%;
    height: 1px;
    border: 1px solid var(--white);
    background: var(--white);
    margin-left: -20px
}

.my-15 {
    margin: 15px 0
}

.d-block-font12-white {
    display: block;
    font-size: 12px;
    color: var(--white)
}

.d-block-font20-white {
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: var(--white)
}

.py20 {
    padding: 20px 0
}

.white-30 {
    color: var(--white);
    font-size: 30px
}

.w100br-6 {
    width: 100%;
    border-radius: 6px
}

.BiddingPageRow2 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 90%;
    margin: 5px auto;
    background: rgba(0, 0, 0, .02);
    padding: 15px 25px;
    max-width: 325px
}

.d-block-f15-bold {
    display: block;
    font-weight: 700;
    font-size: 15px
}

.dflex-bold-20-white-p2-br-5 {
    display: flex;
    font-weight: 700;
    font-size: 20px;
    background: var(--white);
    padding: 2px;
    border-radius: 5px
}

.dflex-jcenter-acenter-w125-text-center {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 125px;
    text-align: center
}

.dflex-jcenter-acenter-text-center-br2 {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 2px
}

.font-10 {
    font-size: 10px
}

.red-f20-pt0 {
    color: var(--red);
    font-size: 20px;
    padding-top: 0
}

.LoginPage {
    width: 100%;
    height: 84vh;
    display: flex;
    position: relative
}

.LoginPageContent {
    flex: 1;
    background-color: var(--black) 26;
    position: relative;
    overflow: hidden
}

.LoginPageBG {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%
}

.LoginFormContainer {
    position: absolute;
    width: 50vw;
    max-width: 500px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow-x: hidden
}

.pl0-mb15 {
    padding-left: 0;
    margin-bottom: 15px
}

.spanblockcolor7 {
    display: block;
    color: var(--sevenBlack)
}

.spanblockbold {
    display: block;
    font-weight: 700
}

.horseCardLabeltitle {
    font-weight: 700;
    font-size: 16px;
    color: var(--darkGrey);
    display: block;
    margin-bottom: 5px
}

.origin,
.originval {
    font-size: 15px;
    text-transform: capitalize
}

.oroginContainer {
    margin-bottom: 22px
}

.origin,
.originval {
    font-weight: 700;
    margin-bottom: 5px
}

.origin {
    display: block;
    margin-right: 195px;
    color: #777
}

.originval {
    display: inline;
    color: #000
}

.selectedSearchTypeContainer {
    min-height: 250px;
    padding: 2rem;
    background: rgba(0, 0, 0, .08);
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px
}

.horsePrice,
.hoursePrice {
    float: right
}

.studBookHorseCompetitionDataContainer,
.titleShowSchedule {
    display: flex;
    justify-content: space-between
}

.studBookHorseCompetitionDataContainerShowName {
    font-weight: 700;
    font-size: 20px;
    text-transform: capitalize;
    margin-bottom: 5px;
    color: var(--green)
}

.totalPoint,
.totalPointVal {
    font-size: 15px;
    display: block;
    font-weight: 700;
    text-transform: capitalize
}

.totalPoint {
    margin-bottom: 0;
    color: var(--sevenBlack)
}

.totalPointVal {
    margin-bottom: 5px;
    color: var(--black)
}

.studBookPedigreeDataRow {
    margin: 0 0 30px
}

.pt1em {
    padding-top: 1em
}

.horseCardContainerWidthHeight {
    width: 214.79px;
    height: 240.6px
}

.marginbottomzero {
    margin-bottom: 0
}

.serviceLabelKey,
.serviceLabelVal {
    font-family: Lato;
    font-size: 20px;
    margin-bottom: 15px;
    font-style: normal
}

.classnotdisplay,
.livedivMobileOnly,
.mobileMenuSpacer,
.showonMobileJust,
.showsListMobileOnly,
.viewMobileOnly {
    display: none
}

.bg-gray-p-25bg-gray-p-25 {
    background-color: var(--scrollRect);
    padding: 25px;
    display: flex;
    flex-direction: column
}

.serviceLabelKey {
    font-weight: 700;
    color: var(--red)
}

.serviceLabelVal {
    font-weight: 400;
    color: var(--sevenBlack)
}

.serviceFlowContainer {
    position: relative;
    width: 100%;
    overflow-x: auto
}

.serviceFlowChartContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-left: 50px;
    padding-right: 50px
}

.serviceFlowNode {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.serviceNodeCircleContainer {
    display: flex;
    flex-direction: row;
    align-items: center
}

.serviceNodeCircle {
    width: 40px;
    height: 40px;
    border: 2px solid var(--red);
    border-radius: 50%;
    color: var(--red);
    font-weight: 700;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px
}

.NewsPostDate,
.ServiceNodeName {
    font-weight: 400;
    color: var(--sevenBlack);
    font-family: Lato
}

.ServiceNodeSpacer {
    width: 160px;
    height: 1px;
    background-color: var(--red);
    border: 2px solid var(--red)
}

.ServiceNodeName {
    width: 100px;
    margin-left: -31px;
    margin-right: -31px;
    text-align: center;
    font-size: 16px
}

.historyTitle,
.history_paragraph {
    text-align: justify
}

.ApplyButnContainerServicePage {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end
}

.NewsPostDate {
    font-style: normal;
    font-size: 20px;
    text-transform: capitalize
}

.NewsPostimg {
    margin: 10px 0
}

.aboutusImageContainer img {
    width: 100%;
    margin: 10px 0
}

.aboutusItem {
    min-height: 400px;
    padding: 20px;
    border-radius: 5px;
    max-height: max-content
}

.wahoSliderItem {
    min-height: 205px;
    padding: 20px
}

.customowlcontainer>.owl-stage-outer>.owl-stage>.owl-item>.carousel-item {
    border: 1px solid var(--mainGold);
    border-radius: 5px
}

.historyImage {
    border-radius: 10px
}

.historyTitle {
    font-family: Lato;
    font-size: 30px;
    font-weight: 700;
    color: var(--red);
    margin-top: -26px
}

.owl-dot>span {
    width: 5px !important;
    height: 5px !important;
    background: var(--red) !important
}

@media (max-width:452px) {
    .owl-dot>span {
        width: 5px !important
    }
}

.owl-theme .owl-dots .owl-dot.active span {
    background: var(--sevenBlack) !important
}

.column {
    flex-direction: column !important;
    justify-content: flex-start;
    align-items: flex-start
}

.horseMarketCardLabeltitle {
    font-weight: 700;
    font-size: 20px;
    text-transform: capitalize;
    margin-bottom: 23px
}

.image-gallery-thumbnail img {
    width: auto;
    height: 75px
}

.novideofound {
    height: 320px
}

.userInfoTitle {
    margin-bottom: 30px;
    font-size: 23px;
    font-weight: 700;
    color: var(--pureRed);
    text-transform: uppercase
}

.bookingTableDateBox,
.end-date-showlist,
.iconScoringDetails,
.legendCardDescription,
.showNewTitle,
.spanpef:before,
.start-date-showlist {
    text-transform: capitalize
}

.opensigniturepad {
    border-radius: 20px
}

.changepasswordcard,
.userinfocard {
    border-radius: 15px;
    background: var(--white);
    padding: 1rem 2rem
}

.changepasswordcard {
    margin-top: 10px
}

.NewsCardDate,
.NewsCardTitle,
.NewsCarddesc {
    padding-left: 10px;
    padding-right: 10px
}

.latestNewsContainer {
    width: 100%;
    min-height: 300px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center
}

.LatestNewsImageContainer {
    width: 50%;
    max-height: 274px;
    overflow: hidden;
    min-width: 612px;
    border-radius: 5px
}

.w-25 {
    width: 25%
}

.mh-137 {
    max-height: 137px !important
}

.LatestNewsImageContainer>.more_news_post_container,
.LatestNewsImageContainer>.more_news_post_container>.more_news_image_container,
.LatestNewsImageContainer>.more_news_post_container>.more_news_image_container>.more_news_image_overlay,
.LatestNewsImageContainer>.more_news_post_container>.more_news_image_container>img,
.border-radius-5 {
    border-radius: 5px
}

.LatestNewsImageContainer>.more_news_post_container>.more_news_post_title {
    bottom: 15px
}

.NewsPageNewsCard {
    border: var(--mainGold) 1px solid;
    border-radius: 5px
}

.NewsCardImageContainer {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    max-height: 370px
}

.NewsCardImageContainer>img {
    width: unset;
    min-height: 370px
}

.NewsCardTitle>h3,
div.col-lg-8.col-md-12.col-sm-12.p0.position-relative.mh-371>a.NewsCardTitle.dblock>h3 {
    line-height: 1.5;
    color: var(--black)
}

.NewsCarddesc {
    font-size: 17px;
    color: var(--sevenBlack)
}

.NewsCardDate {
    position: absolute;
    bottom: 5px;
    left: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    min-width: 100px;
    font-size: 20px;
    font-weight: 700
}

.mh-371 {
    height: 371px
}

.NewsCardDay {
    border-right: var(--black) 1px solid;
    padding-right: 5px;
    font-size: 24px;
    text-align: center
}

.NewsCardMonthandYear {
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    padding-left: 5px
}

.horseMarketProfileButton>div>a,
.supplierTitle {
    font-size: 30px
}

.m5 {
    margin: 5px
}

.px-5px {
    padding: 0 5px
}

.SupplierCardContainer,
.singlesupplierimagecontainer {
    background: var(--white);
    border-radius: 15px;
    padding: 2rem
}

.supplierTitle {
    font-weight: 700
}

.supplierdesc {
    font-size: 14px;
    color: var(--sevenBlack)
}

.SupplierCardContainer {
    position: relative;
    margin: 1rem 0
}

.SupplierCardContainer>ul {
    margin: 5px 15px
}

.supplierImageContainer {
    overflow: hidden;
    color: var(--black)
}

.SupplierTitle {
    font-weight: 700;
    font-size: 18px;
    color: var(--black)
}

.Suplliericon {
    display: block;
    color: var(--black);
    margin: 5px 0;
    font-size: 13px
}

.Supplierdesc {
    font-size: 16px;
    color: var(--sevenBlack)
}

.singlesupplierimagecontainer {
    width: 100%
}

.hoursemarketsitmep {
    font-size: 13px;
    color: var(--blackForty)
}

.Contact-US-Desc {
    font-size: 18px !important;
    color: var(--darkGrey) !important
}

.contactUsLable {
    display: block;
    margin: 15px 0;
    font-family: Lato;
    font-size: 22px;
    font-weight: 700;
    color: var(--black)
}

.alignselfflexCenter>.TableLegend,
.contactUsLable>span {
    margin: 0 10px
}

.contactUsLable>p {
    margin: 0 30px;
    font-size: 14px;
    font-weight: 400;
    color: var(--sevenBlack)
}

.contactFormContainer {
    border: 1px solid var(--mainGold);
    padding: 25px 40px;
    border-radius: 10px
}

.page-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background-color: var(--dbd6d6);
    opacity: .5
}

.loading {
    height: 139px;
    width: 139px;
    position: relative;
    top: 50%
}

.countrymargin,
.mb-form-group-last,
.mb-main {
    margin-bottom: 20px
}

.supplierViewMore {
    position: absolute;
    bottom: 20px;
    right: 25px
}

.OrgChartContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%
}

.OrgChartHeader,
.OrgChartHeaderCardContainer {
    justify-content: center;
    width: 100%;
    display: flex
}

.OrgChartHeader {
    align-items: center;
    flex-direction: column
}

.OrgChartHeaderCardContainer {
    align-items: center;
    flex-direction: column;
    max-width: 21vw
}

.OrgChartHeaderCard {
    width: 100%;
    min-height: 20px;
    min-width: 325px;
    border-top: 0 solid var(--mainGold);
    padding: 1rem;
    background: var(--white);
    border-radius: 15px;
    margin-bottom: 15px;
    text-align: center;
    z-index: 501;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center
}

.ClusterContainer>.OrgChartHeaderCard,
.Responsive {
    min-width: unset
}

@media (max-width:970px) {
    .OrgChartHeaderCard {
        padding: 1rem
    }

    .ClusterContainer {
        width: 80% !important
    }
}

.pt-10 {
    padding-top: 5rem !important
}

.OrgChartHeaderCard>span {
    display: block;
    padding: 0 5px;
    font-weight: 700;
    font-size: 18px
}

.OrgChartHeaderCard>p {
    padding: .1vw .5vw
}

.OrgChartHeaderCardSpacer {
    height: 20px;
    width: 1px;
    border: 1px solid var(--red);
    background-color: var(--red)
}

.hidetheSpacer {
    border: none;
    background: 0 0
}

.lastSpacer {
    position: absolute;
    top: 85px;
    right: 0;
    left: 0;
    margin: 0 auto;
    height: 7.3vw
}

.OrgChartHorizentalHeaderCardSpacer {
    width: 20px;
    height: 1px;
    border: 1px solid var(--red);
    background-color: var(--red)
}

.isFirstOrgChartCard {
    background-color: var(--mainGold) !important;
    color: var(--white) !important;
    width: 150%
}

.isFirstOrgChartCard>span {
    font-weight: 700;
    font-size: 18px
}

.OrgChartSectionSpacer {
    width: 68vw;
    height: 1px;
    border: 1px solid var(--red);
    background-color: var(--red)
}

.ownerProfileInput {
    width: 42%;
    height: 53px;
    display: flex;
    border: 1px solid #e44d52;
    padding: 6px 7px;
    border-radius: 6px
}

@media (min-width:1539px) {
    .OrgChartSectionSpacer {
        width: 80vw;
        height: 1px;
        border: 1px solid var(--red);
        background-color: var(--red)
    }
}

.OrgChartLevelTwoContainer {
    width: 89vw;
    min-height: 350px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap
}

.MultiItemInRow {
    min-height: unset;
    flex-direction: row;
    justify-content: center
}

.MultiItemInRow>.OrgChartHeaderCardContainer {
    flex-direction: row;
    width: 100%;
    max-width: unset
}

.MultiItemInRow>.OrgChartHeaderCardContainer>.OrgChartHeaderCard {
    width: unset
}

.ClusterContainer {
    width: 75%;
    margin-top: -1vw;
    border-left: 2px solid var(--red);
    border-bottom: 2px solid var(--red);
    position: relative;
    min-height: 6vw;
    z-index: 500;
    border-bottom-left-radius: 5px
}

.ClusterContainer>div {
    max-width: 15vw;
    position: absolute;
    top: 4.5vw;
    background: var(--horseCardBg);
    z-index: 5000;
    left: 2vw
}

@media (max-width:970px) {
    .ClusterContainer>div {
        max-width: 200px !important;
        top: 70px !important;
        left: 10px !important;
        font-size: 12px
    }

    .OrgChartSectionSpacerResponsive {
        width: 1px;
        background: var(--red);
        border: 1px solid var(--red);
        height: 100% !important;
        position: absolute;
        left: 3.4em;
        top: 0 !important
    }
}

.OrgChartSectionSpacerResponsive {
    width: 1px;
    background: var(--red);
    border: 1px solid var(--red);
    height: 75%;
    position: absolute;
    left: 3.4em;
    top: -29px
}

.Responsive {
    max-width: 50%
}

.Responsive>.OrgChartHeaderCard {
    font-size: 13px !important;
    max-width: 200px;
    top: 110px
}

.Responsive>.isFirstOrgChartCard>span {
    font-size: 13px
}

.OrgChartLevelTwoContainerResponsive {
    width: 419px;
    flex-direction: column;
    position: relative;
    justify-content: center;
    align-items: center
}

.OrgChartHeaderCardContainerResponsiveLevel2 {
    position: relative;
    min-height: 150px;
    min-width: 250px
}

.NewLevel2Responsive,
.NewLevel2ResponsiveContainer {
    min-height: unset
}

.OrgChartHeaderCardContainerResponsiveLevel2>.OrgChartHeaderCard {
    min-width: 250px
}

.NewLevel2Responsive>.OrgChartHeaderCardContainerResponsiveLevel2>.OrgChartHeaderCard {
    min-width: 280px
}

.NewLevel2ResponsiveContainer>.OrgChartSectionSpacerResponsive {
    height: 100%
}

.orgChartHorizentalSpacerResponsive {
    width: 30px;
    height: 1px;
    border: 1px solid var(--red);
    position: absolute;
    top: 25px;
    left: -30px
}

.countryFlageImg {
    height: 40px;
    width: 60px;
    line-height: 1.42857143;
    background-color: var(--white);
    border: 1px solid var(--dddColor);
    padding: 2px
}

.showDetailsJudesLetter {
    font-size: 14px;
    width: 25px;
    text-align: start;
    font-weight: 700
}

.showDetailsJudesName {
    font-size: 14px;
    margin: 0 5px
}

.JudgesTableRow {
    margin-top: 5px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin-bottom: 5px;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    overflow-x: hidden
}

.ChampionShipCardHeader {
    font-size: 16px;
    background-color: var(--red);
    color: var(--white)
}

.ChampionShipHorseName {
    font-size: 14px;
    line-height: 30px
}

.OrgChartHeaderCardContainerResponsiveLevel2>.ClusterContainer {
    min-height: 100px;
    margin-bottom: 25px;
    margin-top: -50px
}

#root>div>div.mainLayoutContainer>div>div>div.OrgChartLevelTwoContainer.OrgChartLevelTwoContainerResponsive>div>div>div {
    width: 200%
}

.brownImp {
    background-color: var(--mainGold) !important
}

.spanpef:before {
    font-family: "Glyphicons Halflings";
    content: "\e114";
    float: right;
    transition: .5s;
    display: block;
    padding-top: 15px;
    text-decoration: none;
    color: red !important;
    font-size: 24px;
    font-style: normal;
    font-weight: 700
}

.showsGallery>.owl-carousel>.owl-nav {
    position: absolute;
    top: -55px;
    right: 10px
}

.showsGallery>.owl-carousel>.owl-nav>button {
    font-size: large !important;
    color: var(--mainGold) !important;
    border: 1px solid var(--mainGold) !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 15px !important
}

.ChampionShipBronze>.col-md-10>h3,
.ChampionShipGold>.col-md-10>h3,
.ChampionShipSilver>.col-md-10>h3,
.fontsize18 {
    font-size: 18px
}

#root>div>div.mainLayoutContainer>div>div.row.studBookPedigreeDataRow>div.col-md-4>div>div>p,
#root>div>div.mainLayoutContainer>div>div.row.studBookPedigreeDataRow>div.col-md-4>div>div>span,
.fontsize16,
.locationDot16,
.showCardTitle,
.showDetaisLabel,
.showTableTabHeader,
.showTableTabHeader>a,
.wahoTitleContainer {
    font-size: 16px
}

.ShowsCard {
    height: 300px;
    padding: 0 5px !important
}

.ShowsCard>.horseCardContainer {
    min-height: 250px
}

.showCardTitle {
    font-weight: 700
}

.judgesList {
    scrollbar-color: var(--mainGold);
    scrollbar-width: 1px
}

.judgesList::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 5px
}

.judgesList::-webkit-scrollbar-track {
    background: var(--gray);
    width: 3px;
    scrollbar-width: 1px;
    border-radius: 10px
}

.judgesList::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    scrollbar-width: 1px;
    border-radius: 10px;
    border: 1px solid var(--mainGold)
}

.judgesList::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.showsImageContainer>img {
    height: unset;
    width: 100%;
    max-width: 160px
}

.showsImageContainerInMainPage>img {
    max-width: unset
}

.image-gallery-content .image-gallery-slide .image-gallery-image,
.video-wrapper {
    max-height: 450px
}

.image-gallery-content .image-gallery-slide .image-gallery-image {
    max-height: unset !important;
}

.stubBookcardHorseName,
.stubBookcardHorseReg {
    font-size: 16px;
    color: var(--darkGrey)
}

.mainLayoutContainer {
    min-height: 80vh
}

.horseMarketImageContainer_OwnerProfile img {
    height: 249px;
    width: 100%
}

.horseMarketImageContainer_HorseMarket img {
    height: 250px;
    width: 100%
}

.text-right.rotateUp.collapsed>span>i {
    position: relative;
    transform: rotate(0) !important;
    top: 0
}

.rotateUp>span>i {
    position: relative;
    transform: rotate(180deg);
    top: 15px
}

.horseMarketProfileButton {
    margin-top: 25px;
    display: flex;
    justify-content: space-around
}

.loaderDiv {
    top: 50%;
    position: fixed;
    left: 50%
}

#searchStudBook {
    box-shadow: none
}

@media (max-width:400px) {
    #searchStudBook::placeholder {
        font-size: 2.5vw
    }
}

.SupplierCardImageContainer {
    position: absolute;
    top: 25px;
    right: 25px
}

.SupplierCardImageContainer>img {
    width: 100px;
    height: 100px
}

.supplierDetailsContainer {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch
}

.imageGalleryFlex {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    min-height: 300px;
    align-items: center;
    justify-content: space-between
}

.imageGalleryFlex>img {
    height: 300px;
    margin: 5px 0
}

.studbookTabsrow>div {
    padding: 0;
    margin-top: 5px;
    margin-right: 5px
}

.selectedSearchTypeContainer {
    margin-top: 0 !important;
    margin-right: 0 !important
}

.StudBookSearchBarContainer,
.justfycontentwahoconferencereg {
    display: flex;
    justify-content: center
}

.headerimagewahoconference {
    max-height: 382px;
    overflow: hidden
}

.headerimagetextwahoconference {
    position: absolute;
    font-size: 28px;
    color: #fff;
    font-weight: 700;
    width: 15%;
    min-width: 250px;
    left: 48px;
    bottom: 15px
}

.showLastFilterDate,
.showLastFilterDetails {
    font-size: 14px;
    color: var(--black);
    display: flex;
    font-weight: 700
}

.showsDetailsFilterContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0
}

.showLastFilterRow {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 0;
    min-height: 80px;
    background: var(--fafafa)
}

.zindex2000 {
    z-index: 2000 !important
}

.showLastFilterDate {
    flex-direction: column;
    width: 100%;
    max-width: 95px;
    text-align: center
}

.showLastFilterDetails>.gray {
    color: var(--gray);
    font-size: 12px
}

.showLastFilterRowContainer {
    max-height: 215px;
    overflow-y: auto;
    scrollbar-color: var(--mainGold);
    scrollbar-width: 2px
}

.showLastFilterRowContainer::-webkit-scrollbar {
    -webkit-appearance: none
}

.showLastFilterRowContainer::-webkit-scrollbar-track {
    background: 0 0
}

.showLastFilterRowContainer::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 10px;
    border: 2px solid var(--mainGold)
}

.showLastFilterRowContainer::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.showLastFilterDetails {
    flex-direction: column;
    width: calc(100% - 93px);
    max-width: calc(100% - 93px);
    height: 4em;
    justify-content: space-around
}

.showLastFilterSpacer {
    height: 60px;
    width: 1px;
    background: var(--black);
    margin: 0 5px
}

.fontsize30 {
    font-size: 30px;
    margin-left: 5px
}

.backgroundcolorwahoconference {
    background-color: var(--mainGold);
    color: #fff;
    padding: 21px;
    max-width: 500px
}

.textalignend {
    text-align: end
}

.textalignstart {
    text-align: start
}

.borderrightwahoconference {
    border-right-color: #faebd7;
    border-right-style: solid
}

.cardsponsorwahoconference {
    border-top: 3px solid var(--mainGold);
    border-radius: 5px;
    min-height: 250px;
    max-height: max-content;
    padding: 25px
}

.justfycontentwahoconference {
    display: flex;
    justify-content: space-evenly
}

.backgroundcolorprogramwahoconference {
    background-color: var(--mainGold);
    color: #fff;
    padding: 9px;
    border-radius: 5px;
    transition: .5s
}

.borderrightprogramwahoconference {
    border-right: 1px solid #faebd7;
    height: 46px
}

.marginleftprogramwahoconference {
    margin-left: -9px
}

.marginleftprogramCardwahoconference {
    margin-left: 3px
}

.mt-11wahoconference {
    margin-top: 11px
}

.mt-30wahoconference {
    margin-top: 30px
}

.backgroundcolorfooterwahoconference {
    color: #fff;
    padding: 21px
}

.fontsize23 {
    font-size: 23px;
    margin-left: 5px
}

@media (max-width:623px) {
    .justfycontentwahoconferencereg {
        flex-direction: column
    }

    .justfycontentwahoconferencereg>div {
        margin-bottom: 5px
    }

    .justfycontentwahoconferencereg>div>div>img {
        height: 200px !important
    }
}

@media (max-width:370px) {
    .responsiveGalleryTitle {
        max-width: 100px !important;
        margin: 5px auto
    }
}

.maxwithwahoconferenceprogram {
    max-width: 700px
}

.wahoProgramesContainerRow {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50px
}

.wahoProgramesContainer {
    width: 100%;
    max-width: 700px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    min-height: 100px;
    justify-content: space-around;
    align-items: center
}

.flexwidthwahoconferenceprogram {
    width: 150px;
    margin: 5px 0
}

.backgroundcolorprogramwahoconference:hover {
    transition: .5s;
    background: var(--red);
    cursor: pointer
}

.wahoconferenceprogramDate {
    line-height: 45px
}

.auctionimagecontainer {
    overflow: hidden;
    border-radius: 5px
}

.footerSocialRow {
    display: flex;
    justify-content: flex-start;
    flex-direction: row
}

.footerSocialRow>div {
    width: 40px
}

.MuiDayCalendar-weekDayLabel,
.MuiPickersCalendarHeader-labelContainer,
.MuiPickersDay-dayWithMargin,
.MuiPickersYear-yearButton,
.fontsize16 * {
    font-size: 16px !important
}

.MuiOutlinedInput-input {
    font-size: 12px !important;
    padding-left: 5px !important
}

.startDateEndDateWahoConferanceContainer {
    display: flex;
    justify-content: space-around;
    width: 100%
}

.wahoConferanceRow {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center
}

.WahoDatesContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 100%;
    max-width: 600px;
    margin: 2px auto;
    background-color: var(--mainGold);
    padding: 5px;
    color: var(--white);
    min-height: 100px;
    align-items: center
}

.wahoDateCard {
    width: 50%;
    text-align: center
}

.wahoDateSpacer {
    background: var(--white);
    border: solid 1px var(--white);
    height: 75%;
    min-height: 75px;
    width: 1px
}

.programCardContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center
}

.programCardDateContainer {
    display: flex;
    width: 100%;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 50px
}

.programCardDateSpacer {
    background: var(--white);
    height: 100%;
    min-height: 50px;
    width: 1px;
    margin: 0 5px
}

@media (max-width:425px) {
    .WahoDatesContainer {
        flex-direction: column !important
    }

    .wahoDateSpacer {
        min-height: unset;
        height: 1px;
        width: 100%;
        margin: 5px 0
    }
}

.latestNewsContainerNewPage {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    flex-wrap: wrap;
    align-items: center;
    min-height: 350px
}

.latestnewsCardNewsPage {
    position: relative;
    overflow-x: hidden;
    max-width: 50vw
}

.latestnewsCardNewsPage>img {
    height: 300px
}

.isThirdColumn>img {
    height: 145px;
    min-width: 100%
}

.latestNewsimgOverlay {
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    position: absolute;
    background: linear-gradient(360deg, var(--black) 0, rgba(0, 0, 0, 0) 100%);
    padding: 40px 25px;
    box-sizing: border-box
}

.latestNewsimgOverlay>span {
    display: block;
    color: var(--white);
    font-size: 20px
}

.thirdcolmnCard {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 304px
}

.newsCardWithImg,
.newsRow {
    display: flex;
    flex-direction: row
}

.isThirdColumn,
.secondColmn {
    max-width: 25vw
}

.newsListContainer {
    max-width: 75vw
}

@media (max-width:1350px) {
    .thirdcolmnCard {
        margin: 25px 0
    }

    .isThirdColumn,
    .latestnewsCardNewsPage,
    .secondColmn {
        max-width: 100vw
    }
}

.newsRow {
    width: 100%;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap
}

.newsCardWithImg {
    width: 60%;
    border: 1px solid var(--mainGold);
    border-radius: 5px;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 10px
}

.newsImageNewsPageContainer {
    width: 37%;
    overflow: hidden;
    max-height: 375px;
    display: block
}

.newsImageNewsPageContainer>img {
    height: 375px
}

.newsDetailsContainer {
    width: 63%;
    position: relative;
    padding: 25px 15px 15px 5px;
    min-height: 375px
}

.newsPageNewsTitle {
    font-size: 20px;
    font-weight: 700;
    color: var(--ContactBlack);
    margin-top: 10px;
    margin-bottom: 10px;
    display: block;
    padding-left: 10px;
    padding-right: 10px
}

.newsPageNewsDescription {
    color: var(--sevenBlack);
    font-size: 16.6px;
    padding-left: 10px;
    padding-right: 10px
}

.newsPageNewsDateContainer {
    display: flex;
    flex-direction: row;
    width: 75px;
    height: 50px;
    justify-content: space-between;
    align-items: center
}

.card>div {
    min-height: 550px !important
}

.todayRow {
    justify-content: space-between !important;
    padding: 0 15px
}

.mediaGalleryContainer {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center
}

.mediaCard {
    max-width: 40%;
    height: 200px;
    overflow: hidden;
    position: relative;
    margin: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 15px
}

.mediaOverLay {
    display: flex;
    opacity: 1;
    transition: .5s;
    top: 0;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, .5);
    color: var(--white) !important;
    font-size: 25px;
    font-weight: 700;
    text-align: left;
    line-height: 40px;
    padding-left: 25px
}

.mediaViewMore {
    display: block;
    font-size: 18px;
    letter-spacing: 2px
}

.mediaCard:hover .mediaOverLay {
    opacity: 1
}

.secondSectionContainer {
    width: 100%;
    background: var(--white);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start
}

.w90 {
    width: 90%
}

.bookingTableDateBox {
    color: var(--mainGold);
    padding: 15px 10px;
    font-size: 16px;
    box-shadow: 0 0 23px rgba(0, 0, 0, .1)
}

@media (max-width:992px) {

    .newsImage,
    .ownerProfileInput {
        width: 100%
    }

    .newsImage {
        height: unset
    }

    .newsPageNewsDateContainer {
        position: relative;
        margin-top: 10px
    }

    .card-text {
        max-height: unset;
        margin-bottom: unset
    }

    .noMarginRow {
        margin: 0
    }
}

@media (max-width:943px) {
    .mediaGalleryContainer {
        align-items: center;
        justify-content: flex-start
    }

    .mediaCard {
        max-width: unset
    }

    .MediaGallerySectionContainer {
        padding: 50px 0
    }
}

@media (max-width:611px) {
    .mediaGalleryContainer {
        justify-content: center
    }
}

@media (max-width:779px) {
    .thirdcolmnCard {
        height: unset
    }

    .isThirdColumn>img,
    .latestnewsCardNewsPage,
    .latestnewsCardNewsPage>img {
        height: unset;
        width: 100%
    }
}

@media (max-width:700px) {
    .singlePostImage {
        max-height: unset;
        height: unset;
        width: 100%;
        max-width: 500px
    }
}

.newsPageNewsDay {
    font-size: 15px;
    font-weight: 700;
    color: var(--ContactBlack)
}

.newsPageDateSpacer {
    height: 35px;
    width: 1px;
    border: 1px solid var(--ContactBlack);
    margin: 0 5px
}

.newsPageMonthAndYear>span {
    display: block;
    color: var(--ContactBlack);
    font-size: 13.3px
}

.noImg {
    width: 35%
}

.noImg>.newsDetailsContainer {
    width: 100%;
    padding: 25px 15px 15px
}

.noImg>.newsDetailsContainer>.newsPageNewsDateContainer {
    left: 15px
}

@media (max-width:1127px) {
    .newsRow {
        flex-direction: column
    }

    .newsCardWithImg {
        width: 100%
    }
}

@media (max-width:663px) {
    .secondColmn {
        margin-top: 25px
    }

    .newsCardWithImg {
        flex-direction: column
    }

    .newsImageNewsPageContainer {
        width: 100%;
        height: unset;
        max-height: 300px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .newsImageNewsPageContainer>img {
        height: unset;
        max-height: unset;
        width: 100%
    }

    .newsDetailsContainer {
        width: 100%
    }
}

.showsLocation {
    margin: 0 10px;
    font-size: 16px
}

.calendarContainer {
    background: var(--white);
    border-radius: 5px;
    width: 100%
}

.fc-daygrid-day {
    border: 1px solid var(--dddColor) !important
}

.black-color-new,
.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>.fc-daygrid-day,
.nohoverlink:hover {
    color: var(--black) !important
}

.fc-col-header-cell-cushion,
.fc-daygrid-day-number,
.volumeControll:hover,
.volumeControll:hover>i {
    color: var(--black)
}

.fc td,
.fc th {
    padding: 0;
    vertical-align: middle
}

.fc .fc-daygrid-day-top {
    flex-direction: row;
    margin: auto;
    justify-content: center;
    align-items: center
}

.btn-primary {
    background: var(--red) !important
}

.fc .fc-non-business {
    background: var(--white);
    z-index: -1 !important
}

.fc-daygrid-day-events {
    position: absolute !important;
    top: 0;
    left: 0
}

.fc .fc-daygrid-day-number {
    z-index: 100 !important
}

.custom-event-style {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 3.4rem;
    height: 3.4rem;
    z-index: 0;
    border-radius: 0 !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position-x: center !important;
    background-position-y: center !important
}

.fc-daygrid-event-harness.fc-daygrid-event-harness-abs {
    top: 0 !important
}

.fc-daygrid-dot-event {
    padding: 0 !important
}

.Championship,
.ChampionshipReception,
.Exhibition,
.ExhibitionReception,
.internationalShow,
.internationalShowReception {
    text-wrap: wrap;
    text-align: center;
    padding: 2px;
    font-size: 14px
}

@media (max-width:1412px) {
    .custom-event-style {
        width: 2.8rem;
        height: 2.8rem
    }
}

@media (max-width:1199px) {
    .custom-event-style {
        width: 4.5rem;
        height: 4.5rem
    }

    .LatestNewsImageContainer,
    .mh-137,
    .more_news_post_containerResponsive {
        max-height: unset !important
    }

    .studbookTabsrow>div {
        margin-right: 0
    }

    .AuctionDetailsRow2,
    .px75 {
        padding-left: 10px;
        padding-right: 10px
    }

    .AuctionDetailsRowTabs,
    .AuctionDetailsRowTabs>.col-lg-2,
    .AuctionDetailsRowTabs>.col-lg-3,
    .NewsFilterContainer {
        padding-left: 0;
        padding-right: 0
    }

    .AuctionDetailsRowTabs,
    .AuctionDetailsRowTabs>.col-lg-2>span,
    .AuctionDetailsRowTabs>.col-lg-3>span {
        margin-right: 0 !important
    }

    .LatestNewsImageContainer {
        width: 100% !important;
        min-width: unset
    }

    .NewsPageNewsCard>div {
        min-height: unset !important
    }

    .NewsCardImageContainerResponsive>img {
        width: 100%;
        min-height: unset !important
    }

    .NewsPageNewsCardResponsive {
        width: 50%;
        min-width: 325px
    }

    .NewsCarddescResponsive {
        margin-bottom: 50px
    }
}

@media (max-width:1175px) {
    .custom-event-style {
        width: 3.5rem;
        height: 3.5rem
    }
}

.fc-h-event {
    background-color: rgba(0, 0, 0, 0) !important;
    border: 1px solid transparent !important
}

@media (max-width:768px) {
    .newsPageNewsDateContainer {
        position: relative
    }

    .t-center-responsive {
        text-align: center !important
    }

    .AddNewHorseBtn {
        width: unset
    }

    .w100OnMobile {
        width: 100%
    }

    .custom-event-style {
        width: 6rem;
        height: 6rem
    }
}

@media (max-width:756px) {
    .custom-event-style {
        width: 5.7rem;
        height: 5.7rem
    }
}

@media (max-width:720px) {
    .custom-event-style {
        width: 38px;
        height: 37px;
        opacity: 1 !important;
    }
}

@media (max-width:390px) {
    .fc .fc-col-header-cell-cushion {
        font-size: 8px
    }
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    color: var(--black);
    width: 98%;
    aspect-ratio: 1/1;
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .internationalShow) {
    box-sizing: border-box;
    border: 1px solid var(--red);
    border-radius: 50%;
    background-color: var(--red);
    text-align: center;
    font-weight: 700;
    color: var(--white);
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .internationalShowReception) {
    box-sizing: border-box;
    border: 1px solid var(--red);
    border-radius: 50%;
    background-color: var(--white);
    text-align: center;
    font-weight: 700;
    color: var(--black);
    width: 98%;
    aspect-ratio: 1/1;
    margin: auto;
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .Championship) {
    box-sizing: border-box;
    border: 1px solid var(--mainGold);
    border-radius: 50%;
    background-color: var(--mainGold);
    text-align: center;
    font-weight: 700;
    color: var(--white);
    width: 98%;
    aspect-ratio: 1/1;
    margin: auto;
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .ChampionshipReception) {
    box-sizing: border-box;
    border: 1px solid var(--mainGold);
    border-radius: 50%;
    background-color: var(--white);
    text-align: center;
    font-weight: 700;
    color: var(--black);
    width: 98%;
    aspect-ratio: 1/1;
    margin: auto;
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .Exhibition) {
    box-sizing: border-box;
    border: 1px solid var(--green);
    border-radius: 50%;
    background-color: var(--green);
    text-align: center;
    font-weight: 700;
    color: var(--white);
    width: 98%;
    aspect-ratio: 1/1;
    margin: auto;
    min-width: unset;
    min-height: unset
}

.leftCalender>table>tbody>tr>td>div>div>div>table>tbody>tr>td.fc-day.fc-daygrid-day>div:has(.fc-daygrid-day-events > .fc-daygrid-event-harness > .ExhibitionReception) {
    box-sizing: border-box;
    border: 1px solid var(--green);
    border-radius: 50%;
    background-color: var(--white);
    text-align: center;
    font-weight: 700;
    color: var(--black);
    width: 98%;
    margin: auto;
    min-width: unset;
    min-height: unset;
    aspect-ratio: 1/1
}

.ChampionshipReception>div>i,
.ExhibitionReception>div>i,
.internationalShowReception>div>i {
    font-style: normal !important;
    color: var(--black) !important
}

.ExhibitionReception {
    color: var(--black) !important;
    font-style: normal !important;
    background: var(--fafafa);
    border: 1px solid var(--green);
    border-radius: 0
}

.Championship>div>i,
.Exhibition,
.Exhibition>div>i,
.internationalShow>div>i {
    color: var(--white) !important;
    font-style: normal !important
}

.Exhibition {
    background: var(--green);
    border: 1px solid var(--green);
    border-radius: 0
}

.ChampionshipReception {
    color: var(--black) !important;
    font-style: normal !important;
    background: rgb(200, 156, 102, .2);
    border: 1px solid var(--mainGold);
    border-radius: 0
}

.Championship {
    color: var(--white) !important;
    font-style: normal !important;
    background: var(--mainGold);
    border: 1px solid var(--mainGold);
    border-radius: 0
}

.internationalShowReception {
    color: var(--black) !important;
    font-style: normal !important;
    background: rgba(228, 77, 82, .2);
    border: 1px solid var(--red);
    border-radius: 0
}

.internationalShow {
    color: var(--white) !important;
    font-style: normal !important;
    background: var(--red);
    border: 1px solid var(--red);
    border-radius: 0
}

.calendarLegendContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%
}

.legendCard {
    display: flex;
    flex-direction: row;
    padding: 15px;
    background-color: rgba(0, 0, 0, .03);
    justify-content: space-between;
    align-items: center
}

.legendCardrect {
    width: 25px;
    height: 25px
}

.eventRow,
.eventsContainer {
    width: 100%;
    margin: 5px 0;
    display: flex
}

.legendCardDescription {
    font-size: 14px
}

.eventsContainer {
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.eventRow {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap
}

.dayContainer {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50%;
    margin: 0 5px;
    color: var(--white);
    font-weight: 700;
    aspect-ratio: 1/1
}

.eventName {
    font-size: 14px;
    font-weight: 700;
    max-width: 220px
}

.comingSoonAnimationContainer {
    width: 16px !important;
    display: inline-block;
    text-align: left
}

.anmationdot1 {
    animation: 3s infinite flash
}

@keyframes flash {
    0% {
        opacity: 0;
        margin: 0 5px
    }

    20% {
        opacity: 1;
        margin: 0 5px
    }

    40% {
        opacity: 0;
        margin: 0 10px
    }

    60% {
        opacity: 1;
        margin: 0 10px
    }

    80% {
        opacity: 0;
        margin: 0 15px
    }

    100% {
        opacity: 1;
        margin: 0 15px
    }
}

.eyeBtnContainer {
    position: absolute;
    top: 10px;
    right: 25px
}

.bgdefault {
    background: rgba(0, 0, 0, .08) !important
}

.backgroundWhiteSystem {
    background: #fcfaf7
}

.galleryContainer {
    position: fixed;
    height: 100vh !important;
    z-index: 50000
}

.wahotrophyRow {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center
}

.wahoCard {
    width: 100%;
    max-width: 1100px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    background: var(--white);
    padding: 0;
    border-radius: 15px
}

@media (max-width:1123px) {
    .wahoCard {
        flex-direction: column;
        justify-content: center
    }
}

.wahoCardImg {
    width: 254px;
    margin: 5px 15px;
    border-radius: 15px;
    cursor: pointer;
    aspect-ratio: 200/141
}

.popupmaxwidthUnset-content {
    max-width: unset !important;
    background: var(--white) !important
}

.wahoCardContent {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 210px;
    max-width: 450px;
    width: 100%;
    padding-top: 25px
}

.marginLeftENRightAR {
    margin-left: auto
}

.wahoContentCompition,
.wahoContentTitle {
    font-weight: 700;
    font-size: 20px
}

.wahoLocation {
    color: var(--blackForty);
    font-size: 16px;
    margin: 0 5px
}

.wahoContentDescription {
    color: var(--blackForty);
    font-size: 18px
}

.flex-end {
    align-self: flex-end
}

@media (min-width:1800px) {
    .second_service_section_service_title {
        bottom: 140px
    }
}

@media (min-width:1516px) {
    .video_container {
        display: flex;
        background-color: transparent
    }

    .first_slider_img {
        margin-left: auto;
        margin-right: auto
    }
}

@media (max-width:1305px) {

    .accountSettingMenu,
    .menueSpacer {
        display: none
    }

    .smallscreennopaddingleft {
        padding-left: 0
    }

    .nav_bar {
        max-width: 400px
    }

    .header {
        min-height: 75px
    }

    .mobileMenuSpacer {
        display: block;
        width: 100px;
        height: 1px;
        background: rgba(0, 0, 0, .25);
        margin: 1px auto
    }

    .lang_and_login,
    .nav_items {
        display: none;
        flex-direction: column;
        background-color: var(--white);
        position: absolute;
        border-left: 1px solid var(--red);
        border-right: 1px solid var(--red);
        padding-left: 10px
    }

    .nav_items {
        align-items: center;
        top: 25px;
        right: -250px;
        height: 350px;
        width: 200px;
        opacity: 0;
        z-index: 4000;
        transition: .5s ease-in-out;
        border-bottom: 1px solid var(--red);
        padding-top: 2px
    }

    #menu_btn {
        display: block;
        z-index: 500000 !important
    }

    .lang {
        width: 50%;
        margin: 0
    }

    .login_link {
        margin-left: 0;
        margin-top: 15px
    }

    .get_app_link {
        margin: 0
    }

    .lang_and_login {
        padding-bottom: 15px;
        height: 150px;
        justify-content: space-between;
        align-items: flex-start;
        width: 200px;
        top: 75px;
        right: 0;
        z-index: 600;
        border-top: 1px solid var(--red)
    }

    .showonMobileJust {
        display: block
    }

    .dropdown-menu {
        left: unset !important;
        right: 0;
        z-index: 5000000000
    }

    .AuctionDatesStyle {
        flex-direction: column;
        align-items: flex-start
    }

    .desktopOnly {
        display: none !important
    }

    .livedivMobileOnly {
        display: flex;
        align-items: center
    }

    .viewMobileOnly {
        display: block;
        position: absolute;
        top: 20px;
        right: 70px
    }
}

@media (max-width:1275px) {
    .service_card {
        width: unset;
        min-height: unset
    }

    .service_title {
        font-size: 12px
    }

    .service_btn,
    .service_text {
        font-size: 10px
    }

    .service_img_container {
        width: 50px;
        height: 50px
    }

    .service_btn {
        padding: 5px 0
    }
}

@media (max-width:1200px) {
    .second_slider_img_container {
        width: 100%;
        justify-content: center;
        height: unset
    }

    .second_slider_img_container img {
        width: 100%;
        height: unset
    }

    .more_news_view_all {
        text-align: center;
        min-width: 75px
    }

    .more_news {
        min-width: 160px
    }

    #second_services_container_fluid {
        max-width: 1259px;
        width: 100%
    }

    .p0responsive {
        padding: 3px 0 !important
    }

    .p0responsive2 {
        padding: 0 !important
    }

    .ShowsCard {
        height: 450px
    }

    .responsiveTextalighnLeft {
        text-align: left !important
    }

    .m0responsive {
        margin: 0
    }
}

@media (max-width:993px) {
    .StudBookCard>div {
        min-height: 270px !important
    }
}

@media (max-width:872px) {
    .second_services_container {
        display: flex;
        color: var(--black);
        margin: 20px 10px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-around;
        width: 200px
    }

    .StudBookSearchBarContainer {
        flex-direction: column;
        align-items: center
    }

    .StudBookSearchBarContainer>form {
        margin-bottom: 5px;
        width: 100% !important;
        margin-right: 0
    }
}

@media (max-width:768px) {
    .wahoCard {
        flex-direction: column
    }

    .wahoCardImg {
        width: 100%;
        max-width: 350px
    }

    .video_player {
        height: 500px !important;
        transform: scale(1)
    }

    .video_container {
        overflow: hidden
    }

    .first_slider_img {
        height: 500px;
        margin-left: -40vw
    }

    .second_slider_img_container {
        width: 100%;
        justify-content: center;
        height: unset
    }

    .second_slider_img_container img {
        width: 100%;
        height: unset
    }

    .service_img_container img {
        width: 50px
    }

    .BiddingPageRow {
        padding-left: 10px;
        padding-right: 10px
    }

    .borderrightwahoconference {
        border-right-color: unset !important;
        border-right-style: unset !important;
        border-left-color: unset !important;
        border-left-style: unset !important;
        border-bottom-color: #faebd7;
        border-bottom-style: solid
    }

    .mobileRow {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        overflow-x: auto;
        scroll-behavior: smooth;
        scrollbar-color: var(--mainGold);
        scrollbar-width: 2px
    }

    .mobileRow::-webkit-scrollbar {
        -webkit-appearance: none
    }

    .mobileRow::-webkit-scrollbar-track {
        background: 0 0
    }

    .mobileRow::-webkit-scrollbar-thumb {
        background-color: var(--mainGold);
        border-radius: 10px;
        border: 2px solid var(--mainGold)
    }

    .mobileRow::-webkit-scrollbar-thumb:hover {
        background-color: var(--mainGold)
    }

    .addhorseHere {
        font-size: 20px !important;
        font-weight: 700;
        text-align: center
    }

    .paddingonMobile {
        padding-top: 15px;
        margin-top: 5px
    }
}

@media (max-width:631px) {
    .video_title {
        font-size: 20px !important
    }

    .video_subtitle {
        font-size: 15px !important
    }

    .LoginFormContainer {
        width: 94vw
    }
}

@media (max-width:580px) {

    .container-fluid-padding,
    .p-0-50px {
        padding-left: 5px;
        padding-right: 5px
    }

    .RegistrationPage {
        padding-left: 5px !important;
        padding-right: 5px !important
    }

    .RigistrationForm {
        padding-left: 20px !important;
        padding-right: 20px !important
    }
}

@media (max-width:559px) {
    .video_player {
        height: 500px !important;
        transform: scale(1)
    }

    .video_container {
        overflow: hidden
    }

    .first_slider_img {
        height: 500px;
        margin-left: -120vw
    }

    .px75 {
        padding: 0 10px !important
    }
}

@media (max-width:535px) {

    .image-gallery-content .image-gallery-slide .image-gallery-image,
    .video-wrapper {
        max-height: 350px !important
    }
}

@media (max-width:485px) {
    .lang {
        width: 50%
    }

    .login_link {
        margin-left: 0;
        margin-top: 15px
    }

    #langbtn {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: center
    }

    .lang_and_login {
        padding-bottom: 15px;
        display: none;
        flex-direction: column-reverse;
        height: 150px;
        justify-content: space-between;
        background-color: var(--white);
        width: 200px;
        position: absolute;
        top: 75px;
        right: 0;
        z-index: 600
    }

    .more_news_view_all {
        color: var(--green);
        font-family: Lato;
        font-size: 17px;
        font-style: normal;
        display: block;
        min-width: 75px;
        text-align: center;
        font-weight: 700
    }
}

@media (max-width:438px) {
    .first_slider_caption {
        padding-bottom: 0 !important
    }

    .video_title {
        font-size: 18px !important
    }

    .video_subtitle {
        font-size: 10px !important
    }

    .post_head_title {
        font-size: 15px
    }

    .padding_left_custom {
        padding-left: 20px
    }

    .news_post_title,
    .post_title,
    .sponser_title {
        font-size: 25px
    }

    .card_title,
    .post_paragraph {
        font-size: 20px
    }

    .second_carousel_indicators {
        left: 50%
    }

    .second_carousel_indicators li {
        width: 25px;
        background: rgba(11, 148, 68, .25)
    }

    .second_carousel_indicators .active {
        width: 25px;
        background: var(--green)
    }

    .more_news,
    .section_title h2 {
        font-size: 25px;
        text-align: center
    }

    .custom_card,
    .more_news_post_container {
        margin: 15px auto
    }

    .panel-title>a,
    .panel-title>a:active {
        display: block;
        padding: 15px;
        text-decoration: none;
        color: var(--black) !important;
        font-family: Lato;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        text-transform: capitalize
    }

    .card_paragraph {
        font-size: 12px
    }

    .news_post_text {
        font-size: 18px
    }

    .more_news_view_all {
        margin-left: 15px
    }

    .more_news_posted_at {
        top: 15px;
        line-height: 20px;
        max-height: 25px
    }

    .more_news_post_title {
        top: unset;
        font-size: 15px;
        bottom: 50px
    }

    .more_news_post_text {
        top: unset;
        bottom: 0
    }

    .nav_items div {
        align-self: center
    }

    .second_service_section_service_title {
        bottom: 135px;
        left: 20px;
        position: absolute;
        color: var(--black);
        font-family: Lato;
        font-size: 16px
    }

    .second_service_section_service_desc {
        bottom: 60px;
        left: 20px;
        position: absolute;
        color: rgba(0, 0, 0, .5);
        font-size: 13px;
        padding-right: 50px
    }

    #second_service_col,
    #second_services_container_fluid {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .second_service_section_lets_start,
    .second_service_section_service_desc {
        width: 83%
    }
}

.fontsize18 * {
    font-size: 18px !important
}

.divModalChampionchip {
    max-height: 350px;
    overflow-x: hidden
}

.iconScoringDetails {
    padding-top: 15px;
    color: red !important;
    font-size: 28px
}

.showsResultTableContainer {
    width: 100%;
    max-width: unset;
    overflow-x: scroll;
    scrollbar-color: var(--mainGold) !important;
    scrollbar-width: 2px !important
}

.overflowYSCroll,
.overflowauto {
    scrollbar-color: var(--mainGold)
}

.table {
    min-width: 800px !important
}

.showsResultTableContainer::-webkit-scrollbar {
    -webkit-appearance: none
}

.showsResultTableContainer::-webkit-scrollbar-track {
    background: 0 0
}

.showsResultTableContainer::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 10px;
    border: 2px solid var(--mainGold)
}

.showsResultTableContainer::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.brownImp:has(a[aria-expanded=true]) {
    background-color: var(--b7b5b5) !important
}

.accordionSecondShowDetails>.panel-title:has(a[aria-expanded=true])>a,
.accordionSecondShowDetails>.panel-title>a:focus,
.accordionShowDetails>.panel-heading:has(a[aria-expanded=true]) {
    background-color: var(--b7b5b5) !important;
    color: var(--white) !important
}

.bg-gray {
    background-color: #d1d1d1 !important;
    color: var(--ContactBlack) !important
}

.text-collapse[aria-expanded=true]>span {
    color: var(--ContactBlack)
}

.accordionThirdShowDetails {
    padding-bottom: 10px
}

.accordionThirdShowDetails>.panel-title>a:focus {
    color: #000 !important
}

.flagJudgDiv {
    background-color: var(--white);
    border-radius: 10px;
    min-height: 54px;
    max-width: 400px;
    margin: 5px 2px;
    padding: 5px 10px;
    font-size: 14px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.flagJudgDiv>.flagJudgimg {
    margin: 0 7px
}

.flagJudgimg {
    display: inline;
    margin-left: 5px;
    margin-bottom: 0
}

.imgs-horse,
.imgs-horse:focus,
.imgs-horse:hover {
    background-color: var(--mainGold);
    color: #fff;
    margin-top: 16px
}

.displayRuby {
    display: ruby-text
}

.displayRuby>div {
    width: 110px
}

.showLastResultDiv {
    background-color: var(--fafafa);
    margin-bottom: 5px;
    margin-top: 5px
}

.start-date-showlist {
    background-color: var(--mainGold);
    color: #fff;
    font-size: 16px;
    margin-bottom: 5px
}

.end-date-showlist>div>div,
.end-date-showlist>div>div>i,
.start-date-showlist>div>div,
.start-date-showlist>div>div>i {
    margin-right: 11px
}

.end-date-showlist {
    font-size: 16px;
    margin-bottom: 5px
}

.year-input-showdetails {
    display: inline;
    height: 48px;
    font-size: 16px
}

.month-input-showdetails>div>select {
    height: 48px;
    font-size: 16px
}

.show-entry-first-div {
    padding: 0 5px 0 0;
    background: rgba(0, 0, 0, 0)
}

.background-color-orange {
    background-color: var(--mainGold)
}

.start-end-date-display-ownerprofile {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 14px !important;
    padding: 0 10px
}

.width48Per {
    width: 48%
}

.black-color {
    color: #000
}

.bottom-76 {
    bottom: -76px
}

.borderRightStyleGroove {
    border-right-style: groove
}

.paddingRight74 {
    padding-right: 74px
}

.popupUnsetmaxWidth-content {
    top: 75px;
    width: 80% !important;
    max-width: 1100px
}

.formshowentrycard {
    display: flex;
    border: 1px solid #e44d52;
    padding: 6px 7px;
    border-radius: 6px
}

.iconformshowentrycard {
    margin-left: 14px;
    color: rgb(244 159 162);
    margin-right: 14px;
    margin-top: 19px
}

.showentrycard {
    overflow: hidden;
    height: 226px
}

.buttonformshowentrycard {
    padding: 10px 20px;
    outline: 0;
    border: 1px solid;
    border-color: var(--red);
    transition: .3s;
    height: 53px;
    margin-right: 19px;
    margin-left: 3px
}

.titletrashshowentrycard {
    display: flex;
    justify-content: space-between;
    padding: 0
}

.upload-input,
.upload-label {
    display: block;
    cursor: pointer
}

.cursorPointer {
    cursor: pointer
}

.plusIcon {
    color: var(--sevenBlack);
    font-size: 15px;
    font-weight: 700
}

.graybackgroundcolor {
    background-color: var(--scrollRect)
}

.whitebackgroundcolor {
    background-color: #fff
}

.tablebackgroundcolor {
    background-color: var(--mainGold);
    color: #fff
}

.minheight700 {
    min-height: 700px
}

.height30hidden {
    height: 38px;
    border-style: hidden
}

.wd-65 {
    width: 65%
}

.bordercategorycard {
    border: 2px solid var(--mainGold)
}

.showScheduleParag {
    font-size: 22px;
    font-weight: 700;
    margin-top: 20px;
    margin-bottom: 10px
}

.padding-27 {
    padding: 27px
}

.isNotQualifiedBackground {
    background: var(--f3f3f3)
}

.coverImgShowEntryDetails {
    width: 100%;
    height: 240px;
    border-radius: 5px
}

.wd-70 {
    width: 70%
}

.wd-86 {
    width: 86%
}

.wd-87 {
    width: 87%
}

.upload-label {
    position: relative;
    width: 22%;
    background: #e44d52;
    color: var(--white);
    padding: 15px 0;
    text-transform: uppercase;
    font-size: 12px;
    border-radius: 20px
}

.upload-input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    opacity: 0
}

.upload-img {
    width: 100%;
    max-width: 399px;
    max-height: 291px
}

.pd-21 {
    padding-top: 21px
}

.height46 {
    height: 46px
}

.maxwidth-429 {
    max-width: 429px
}

.maxwidth-490 {
    max-width: 490px
}

.left-43 {
    left: 43%
}

.padding-40 {
    padding: 40px
}

.width-fitcontent {
    width: fit-content
}

.height-fitcontent {
    height: fit-content
}

.p9 {
    padding: 9px
}

.bordershowentrytotal {
    border: 1px solid var(--mainGold)
}

.button-saveasdraft {
    padding: 10px 20px;
    outline: 0;
    border: 1px solid #e44d52;
    transition: .3s;
    margin-bottom: 0
}

.theadHorseSelect {
    background-color: var(--grayColor);
    color: #fff;
    font-size: 128%
}

.divHorseSelect {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 25px
}

.divHorseSelectClose,
.linkbtn {
    background: var(--white);
    color: var(--red)
}

.minHeight-174 {
    min-height: 174px
}

.flex-center {
    display: flex;
    align-items: center
}

.marginrightleft-10 {
    margin-left: 10px;
    margin-right: 10px
}

.marginrightleft-1 {
    margin-left: 5px;
    margin-right: 5px
}

.marginLeft_-5 {
    margin-left: -5px
}

.iconjudge {
    width: 45px;
    height: 30px
}

.width-32p {
    width: 32%
}

.overflowauto {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 699px;
    scrollbar-width: 2px
}

.overflowauto::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 10px
}

.overflowauto::-webkit-scrollbar-track {
    background: 0 0
}

.overflowauto::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 10px;
    border: 2px solid var(--mainGold)
}

.overflowauto::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.edit-unregisterhorsebutton {
    position: absolute;
    right: 15px;
    top: 10px
}

.height-255 {
    height: 255px
}

.line-height {
    line-height: normal !important
}

.display-inline {
    display: inline
}

.line-height-inherit {
    line-height: inherit
}

.width-auto {
    width: auto
}

.width-inherit {
    width: inherit
}

.w100max450 {
    width: 100%;
    max-width: 450px;
    margin: 10px 0
}

.titlepleaseRegisterHorsesMax {
    text-align: center;
    color: var(--mainGold);
    background-color: var(--white);
    border-color: var(--mainGold);
    width: 41%;
    padding: 20px;
    margin: auto
}

.margin-left-unset {
    margin-left: unset !important
}

.newbtn:hover {
    color: var(--white) !important;
    background: var(--red) !important;
    border-color: var(--white) !important
}

.bookingTableCenter,
.customRow {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.horseResultTable {
    overflow-x: scroll
}

.overflowYSCroll {
    overflow-y: auto !important;
    scrollbar-width: 1px;
    padding: 0 5px
}

.bookingTableContainer,
.scrollableDivOn250 {
    scrollbar-color: var(--mainGold);
    scrollbar-width: 2px
}

.calenderBtn,
.filterbtn {
    background: var(--white);
    padding: 10px 20px;
    color: var(--red)
}

.overflowYSCroll::-webkit-scrollbar {
    -webkit-appearance: none;
    scrollbar-color: var(--mainGold);
    scrollbar-width: 1px
}

.overflowYSCroll::-webkit-scrollbar-track {
    background: 0 0;
    cursor: pointer;
    scrollbar-color: var(--mainGold);
    scrollbar-width: 1px
}

.overflowYSCroll::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border: 1px solid var(--mainGold);
    scrollbar-color: var(--mainGold);
    scrollbar-width: 1px
}

.calenderBtn,
.calenderBtn:hover {
    border: 1px solid var(--red);
    transition: .5s
}

.overflowYSCroll::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.calnderuttonsContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-bottom: 15px
}

.year {
    font-size: 30px;
    font-weight: 700
}

.calenderBtn {
    font-size: 20px;
    cursor: pointer;
    font-weight: 700
}

.calenderBtn:hover {
    color: var(--white);
    background: var(--red)
}

.tooltip {
    position: relative;
    opacity: 1;
    margin: auto;
    display: inline-block;
    z-index: unset;
    transition: .5s
}

.tooltip .tooltiptext {
    visibility: hidden;
    opacity: 0;
    width: 150px;
    background-color: #000;
    color: var(--white);
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    cursor: pointer;
    position: absolute;
    transition: .5s;
    z-index: 1;
    top: 25px
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
    transition: .5s
}

.filterbtn {
    outline: 0;
    border: 1px solid;
    border-color: var(--red);
    transition: .3s;
    height: 53px
}

.filterbtn:focus {
    outline: 0
}

.dateDiv {
    width: 100%;
    display: flex;
    padding: 6px 10px;
    justify-content: space-between;
    border: 1px solid var(--gray);
    border-radius: 4px;
    min-height: 36px;
    align-items: center
}

.datePickerPosioition {
    left: 90px
}

.showEntryHorseCard {
    min-height: 350px
}

.zindex0 {
    z-index: 0
}

.divModalAuctionEntry {
    max-height: 600px
}

.bookingTableContainer {
    overflow-y: hidden;
    overflow-x: auto
}

.bookingTableContainer::-webkit-scrollbar,
.overflowYSCroll::-webkit-scrollbar {
    -webkit-appearance: none
}

.bookingTableContainer::-webkit-scrollbar-track,
.overflowYSCroll::-webkit-scrollbar-track {
    background: 0 0;
    cursor: pointer
}

.bookingTableContainer::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 10px;
    border: 2px solid var(--mainGold);
    cursor: pointer
}

.overflowYSCroll::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 5px;
    border: 1px solid var(--mainGold);
    cursor: pointer
}

.bookingTableContainer::-webkit-scrollbar-thumb:hover,
.overflowYSCroll::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.BookingTableArena>img {
    height: 540px;
    aspect-ratio: 823/500
}

.bookingTablesRow {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    padding-left: 125px;
    min-width: 1000px
}

.bookingTable {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 50px;
    height: 50px;
    color: var(--green);
    background: rgba(0, 255, 0, .2);
    font-size: 10px;
    border: 1px solid rgba(0, 255, 0, .2);
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
    transition: transform .3s
}

.bookingTable>img {
    width: 25px;
    height: 25px;
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 0 auto;
    right: 0;
    z-index: 0
}

.bookingTable>div {
    z-index: 100;
    text-align: center;
    font-weight: 700
}

.bookingTable>div>span {
    font-size: 6px
}

.withVIPSection {
    flex-wrap: wrap;
    align-items: flex-start
}

.vipSection {
    width: 200px;
    height: 70px;
    background: var(--red);
    border: 1px solid var(--red);
    display: flex;
    color: var(--white);
    align-items: center;
    justify-content: center
}

.secondVIPRow {
    padding-left: 175px
}

.isBookedTable {
    color: var(--red);
    background: rgba(255, 0, 0, .2);
    font-size: 10px;
    border: 1px solid rgba(255, 0, 0, .2);
    cursor: not-allowed;
    opacity: .5
}

.isSelectedTable {
    color: #00f;
    border: 2px solid #00f;
    background-color: rgba(0, 0, 255, .25)
}

.isHoldedTable {
    color: #fc0;
    border: 2px solid #fc0;
    background-color: rgba(255, 204, 0, .25);
    cursor: not-allowed
}

.notavailableTable {
    color: gray;
    border: 2px solid gray;
    background-color: rgba(0, 0, 0, .25)
}

.isSystemTable {
    color: var(--mainGold);
    border: 2px solid var(--mainGold);
    background-color: rgba(133, 100, 4, .25);
    cursor: not-allowed
}

.marginrightleft-30 {
    margin-left: 30%;
    margin-right: 30%
}

.maxwidth-853px {
    max-width: 853px
}

.disabledBTN {
    opacity: .7;
    cursor: not-allowed
}

.fileUploadSpan,
.fileUploadSpanDisabled {
    background: var(--white);
    padding: 10px 20px;
    color: var(--red);
    outline: 0;
    border: 1px solid;
    border-color: var(--red);
    transition: .3s;
    display: block;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700
}

.maxWidth150 {
    max-width: 150px;
    text-align: center
}

.marginrightleft-5,
.spanbtnmargin>.btn {
    margin: 0 5px
}

.mt0 {
    margin-top: 0
}

.invoiceContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%
}

.invoice {
    max-width: 850px
}

.zoomTools {
    position: absolute;
    left: 15px;
    top: 15px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    width: 130px;
    z-index: 3999
}

.badgebell,
.belldevContaner {
    top: 0;
    position: absolute;
    right: 0
}

.TabelLegendContainer {
    padding: 25px 0
}

.zoomTools>button {
    background: 0 0;
    color: var(--green);
    outline: 0;
    border: 0;
    font-size: 20px
}

.blueBtn {
    color: #00f !important
}

.BookingTableRow {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    max-width: 400px;
    flex-wrap: wrap;
    margin-bottom: 5px
}

.TableLegend {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.customFlexForDeskTop {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.alignselfflexCenter {
    max-width: unset;
    width: 100%;
    align-items: center;
    justify-content: center
}

.aboutUsImagesBox>p,
.maxwidth350 {
    max-width: 350px
}

.width50 {
    width: 45%;
    margin: 0 5px
}

.addconflictButton {
    position: absolute;
    bottom: 70px;
    right: 10px
}

.showEntryViewDetials {
    position: absolute;
    bottom: 40px;
    right: 10px
}

.maxwidth350 {
    width: 100%
}

.minHight150 {
    min-height: 100px;
    height: unset;
    max-height: unset;
    padding: 3px !important
}

.minHight150>.horseCardContainer {
    height: unset;
    min-height: 80px;
    max-height: unset
}

.react-tabs__tab--selected {
    background: #e44d52 !important;
    color: var(--white) !important;
    margin: 0 5px
}

.react-tabs__tab {
    background: rgba(0, 0, 0, .08);
    color: var(--black);
    margin: 0 5px;
    transition: .5s
}

.upgradeRequestFlage {
    width: 100%;
    margin: 5px auto;
    max-width: 400px;
    text-align: center;
    background-color: rgba(0, 0, 0, .08);
    padding: 10px;
    font-size: 16px;
    animation: 5s infinite notifincation;
    transition: .5s
}

@keyframes notifincation {
    0% {
        background-color: rgba(0, 0, 0, .08);
        color: var(--black)
    }

    25%,
    75% {
        background-color: var(--red);
        color: var(--white)
    }

    100%,
    50% {
        color: var(--black);
        background-color: rgba(0, 0, 0, .08)
    }
}

.pendingFlag {
    padding: 5px;
    color: var(--red);
    font-weight: 700;
    margin: auto
}

.displayBasline {
    display: flex;
    justify-content: space-around;
    align-items: baseline
}

.badgebell,
label {
    display: inline-block
}

.badgebell {
    color: #fff;
    background-color: var(--red);
    height: 18px;
    width: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    text-align: center;
    font-size: 10px
}

.bellDiv {
    width: 30px;
    position: relative
}

.userNameContainer {
    padding: 0 40px;
    overflow: hidden
}

.agentForm {
    border-radius: 10px;
    border: 1px solid #000;
    margin: 20px 0;
    padding: 15px 10px;
    position: relative
}

.removeRowButn {
    color: var(--white);
    background: var(--red);
    border: 1px solid var(--white);
    border-radius: 5px;
    width: 20px;
    height: 20px;
    display: flex;
    font-size: 10px;
    align-items: center;
    cursor: pointer;
    justify-content: center;
    position: absolute;
    transition: .5s;
    top: -10px;
    right: -10px
}

.removeRowButn:hover {
    color: var(--red);
    background: var(--white);
    border: 1px solid var(--red);
    transition: .5s
}

.info_circle {
    margin: auto 15px;
    font-size: 20px !important;
    color: var(--mainGold) !important
}

.ownerSignitureContainer {
    min-height: 184px
}

.ownerSignitureContent {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    align-items: center
}

.ownerSigintureImage {
    margin: 25px auto
}

@media (max-width:340px) {
    .radiofelxwrap {
        flex-direction: column !important;
        justify-content: flex-start;
        align-items: flex-start !important;
        padding-left: 30px;
        padding-right: 30px
    }
}

@media (max-width:500px) {
    .siteMapStyle {
        padding: 10px
    }

    .imageGalleryFlex>img {
        height: unset;
        width: 100%
    }

    .supplierImageContainer {
        width: 100%;
        display: block
    }

    .panelBodyResponsive {
        padding: 0 !important
    }

    .Supplierdesc {
        margin-bottom: 50px
    }

    .agentForm {
        align-items: center;
        flex-direction: column;
        justify-content: flex-start
    }
}

.scrollableDivOn250 {
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden
}

.scrollableDivOn250::-webkit-scrollbar {
    -webkit-appearance: none
}

.scrollableDivOn250::-webkit-scrollbar-track {
    background: 0 0
}

.scrollableDivOn250::-webkit-scrollbar-thumb {
    background-color: var(--mainGold);
    border-radius: 10px;
    border: 2px solid var(--mainGold)
}

.scrollableDivOn250::-webkit-scrollbar-thumb:hover {
    background-color: var(--mainGold)
}

.classnotdisplayImp,
.hideLabel>label,
.rpv-open__input-wrapper,
[aria-describedby=rpv-core__tooltip-body-get-file],
[aria-describedby=rpv-core__tooltip-body-print] {
    display: none !important
}

.edit-unregisterhorselink {
    color: #000;
    font-size: 17.5px;
    margin-bottom: 0
}

.minHight200 {
    min-height: 200px !important
}

.paymentRectangleInShow {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start
}

.scrolableTable {
    overflow-x: auto;
    overflow-y: hidden
}

.page,
.panel {
    overflow: hidden
}

.horseResultTable {
    min-width: 700px
}

.downloadAppsContainerFlex {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blackForty);
    border-radius: 15px;
    margin-top: 25px;
    margin-bottom: -40px;
    position: relative;
    z-index: 200
}

.downloadAppsContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    padding: 10px 20px;
    flex-wrap: wrap;
    width: 100%;
    margin: 10px auto
}

.storeCard {
    width: 48%;
    min-width: 250px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.storeCardsImagesContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-around
}

.storeImage {
    height: 50px;
    transition: .5s;
    margin: 5px 0
}

.storeImage:hover {
    transition: .5s;
    transform: scale(1.1);
    filter: invert(1)
}

.verticalSpacer {
    height: 150px;
    margin: auto 0;
    width: 1px;
    border: 1px solid var(--white);
    background: var(--white)
}

@media (max-width:542px) {
    .verticalSpacer {
        display: none
    }
}

.volumeControll {
    background: var(--black);
    padding: 15px;
    border-radius: 5px;
    transition: .5s;
    cursor: pointer;
    border: 1px solid var(--black)
}

.volumeControll:hover {
    border: 1px solid var(--black);
    background: var(--white)
}

.aboutUsImagesRowContainer {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    min-width: 250px
}

.aboutUsImagesRow {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    overflow: hidden;
    width: 60%;
    min-width: 300px
}

@media (max-width:1357px) {
    .aboutUsImagesRow {
        flex-direction: column-reverse;
        align-items: center
    }
}

.aboutUsImagesBox>img {
    width: 150px;
    margin: 0 10px
}

.aboutUsImagesBox {
    display: flex;
    text-align: center;
    justify-content: flex-start;
    flex-direction: row;
    align-items: center;
    margin: 10px auto;
    width: 100%;
    border: 1px solid var(--mainGold);
    padding: 10px;
    border-radius: 5px
}

.currentFont * {
    font-family: Roboto !important
}

.AboutUsHistoryCardContainer {
    padding-top: 26px;
    width: 100%;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.AboutUsHistoryCard {
    width: 80%;
    min-width: 300px;
    margin: auto;
    text-align: center;
    position: relative;
    border-left: 1px solid var(--red);
    padding: 5px 15px 26px
}

.showNewDetials,
.showNewTitleWithDetails {
    padding-top: 5px;
    align-self: center;
    display: flex
}

.redCircleAboutHistory {
    width: 20px;
    height: 20px;
    background: var(--red);
    border: 1px solid var(--red);
    position: absolute;
    border-radius: 10px;
    left: -10px;
    top: -10px
}

.fc-scrollgrid-section.fc-scrollgrid-section-header {
    background: var(--bgGray) !important
}

.fc-scrollgrid-section.fc-scrollgrid-section-header * {
    min-height: 40px !important;
    line-height: 40px !important;
    color: var(--white)
}

.fc-scrollgrid-sync-table {
    background: var(--scrollRect) !important
}

.showCardComponent {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.showNewFlexRow {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly
}

.showCardFinial {
    position: relative;
    background: var(--horseCardBg);
    margin: 5px;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 390px;
    border-radius: 5px;
    border-top: 2px solid var(--mainGold)
}

@media (min-width:1452px) {
    .showCardFinial {
        max-width: unset;
        width: 49%
    }
}

.showImageNewContainer {
    width: 30%;
    min-width: 125px;
    margin: auto 0
}

.showNewTitleWithDetails {
    width: 70%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    height: 100%
}

.showNewDetials {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin: auto 0
}

.showNewTitle,
label {
    margin-bottom: 5px;
    font-weight: 700
}

.showNewDetials * {
    font-size: 14px !important
}

.showNewTitle {
    color: var(--darkGrey);
    font-size: 16px
}

.showNewLocation,
.showNewRank {
    font-size: 16px;
    padding: 0 10px 2px;
    width: 100%;
    margin-bottom: 2px;
    border-bottom: solid 1px var(--gray) !important;
    text-transform: capitalize
}

.showNewLocation>i,
.showNewRank>i,
.showNewStartDate>div>i {
    margin: auto 5px
}

.showNewLocation {
    font-family: Lato;
    color: #333
}

.showNewStartDate {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

.showNewViewDetails {
    align-self: flex-end;
    margin: 5px 20px
}

@media (max-width:481px) {
    .showCardFinial {
        flex-direction: column;
        align-items: center
    }

    .showNewTitleWithDetails {
        width: 90%
    }

    .showNewLocation,
    .showNewRank {
        width: 100%
    }
}

.menueSpacer {
    height: 20px;
    width: 1px;
    background: rgba(0, 0, 0, .25)
}

.aBoutusItemBorder {
    border: 1px solid var(--mainGold);
    border-radius: 5px;
    padding: 15px 5px;
    width: 40%;
    transition: .5s;
    background: var(--white);
    min-height: 430px;
    min-width: 300px
}

.aBoutusItemBorder:hover {
    background: 0 0
}

@media (max-width:1199px) {
    .flexColumnOnMDDevices {
        display: flex;
        flex-direction: column;
        align-items: center
    }

    .aBoutusItemBorder {
        margin: 10px
    }
}

@media (max-width:821px) {
    .aboutUsImagesBox {
        flex-direction: column;
        align-items: center;
        text-align: center
    }

    .aboutUsImagesBox>img {
        width: 100%
    }

    .vipMensDesc * {
        max-width: unset
    }
}

.ReactGridGallery {
    padding-left: 0 !important;
    padding-right: 0 !important
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: var(--blackForty);
    background-color: var(--white);
    background-image: none;
    border: 1px solid var(--gray);
    border-radius: 4px;
    min-height: 38px !important
}

.panel {
    background-color: var(--blackForty);
    border-radius: 10px 0 0 10px;
    width: 300px;
    height: 100vh;
    box-shadow: -2px 0 8px rgba(0, 0, 0, .3);
    position: fixed;
    top: 0;
    right: -300px;
    transition: right .3s ease-in-out;
    color: #fff;
    z-index: 50000
}

.panel.show {
    right: 0
}

.notifications {
    padding: 15px
}

.notification-item a {
    font-size: 16px !important;
    color: #fff !important
}

.notification-item a i {
    padding: 10px
}

.redpointLive {
    width: 15px;
    height: 15px;
    background: var(--pureRed);
    border: 1px solid var(--pureRed);
    border-radius: 50%
}

.requestBtn {
    margin: auto 10px;
    padding: 10px 20px;
    outline: 0;
    transition: .3s
}

.closeButn {
    position: absolute;
    top: 5px;
    left: 5px;
    border: 1px solid var(--white);
    padding: 2px 8px;
    border-radius: 50%;
    cursor: pointer
}

.playButtonContainer {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    z-index: 1000;
    cursor: pointer;
    color: var(--red);
    font-size: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s
}

.dropdown-menu.show {
    z-index: 2000
}

.customTabStyle {
    display: block;
    padding: 10px 20px;
    text-align: center;
    background: rgba(0, 0, 0, .08);
    cursor: pointer;
    color: var(--black);
    transition: .3s;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.pdf-page-flip-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    background-color: var(--fafafa)
}

.page,
.pagination {
    justify-content: center
}

.page {
    width: 100%;
    height: 100%;
    display: flex
}

.rpv-core__progress-bar-progress {
    background-color: var(--mainGold) !important;
    transition: .5s !important;
    border-radius: 0 !important
}

.tablenominwidth {
    min-width: unset !important
}

.marginLeft0Important {
    margin-left: 0 !important
}

.service input[type=date]:in-range::-webkit-datetime-edit-day-field,
.service input[type=date]:in-range::-webkit-datetime-edit-month-field,
.service input[type=date]:in-range::-webkit-datetime-edit-text,
.service input[type=date]:in-range::-webkit-datetime-edit-year-field {
    color: transparent
}

.effectiveDateParagraph {
    margin-bottom: -28px;
    margin-top: 11px
}

.pagination {
    display: flex;
    gap: 8px;
    margin-top: 20px
}

.pagination button {
    padding: 8px 12px;
    font-size: 16px;
    border: 1px solid var(--dddColor);
    border-radius: 4px;
    background-color: var(--fafafa);
    cursor: pointer;
    transition: .3s
}

.pagination button.active {
    border-color: var(--blue)
}

.pagination button:focus {
    outline: 0;
    box-shadow: 0 0 3px var(--blue)
}

.fullScreenBorder {
    border: 1px solid var(--newsBlack);
    border-radius: 15px;
    padding: 25px 10px !important;
    box-shadow: 0 0 30px var(--black)
}

.maxh300 {
    max-height: 300px
}

.noMarginBottomForP>*,
.noMarginBottomForP>*>* {
    margin-bottom: unset !important
}

.popupContentStyle {
    max-height: 60vh;
    overflow-y: auto;
    z-index: 5000
}

@media (max-width:768px) {
    .invoice {
        max-width: 300px
    }

    .bordershowentrytotal>div {
        text-align: center !important
    }

    .customFlexForDeskTop {
        display: block
    }

    .addconflictButton,
    .showEntryViewDetials {
        position: unset;
        bottom: unset;
        right: unset;
        background: var(--horseCardBg)
    }

    .show-entry-first-div {
        background: var(--horseCardBg);
        margin: 12px 0
    }

    .showEntryViewDetials {
        min-height: 20px;
        padding-bottom: 10px
    }

    .ownerProfileButton {
        border: 1px solid var(--red)
    }

    .nowidthClass {
        width: 100% !important;
        min-width: unset !important;
        max-width: 260px !important
    }

    .showsListDesktopOnly {
        display: none !important
    }

    .showsListMobileOnly {
        display: block !important
    }

    .popupContentStyle {
        max-height: 50vh
    }
}

.borderGold {
    border: 1px solid var(--mainGold);
    border-radius: 20px
}

.closeDivAboluste {
    border-radius: 50%;
    border: 1px solid #6c757d;
    width: 25px;
    top: 15px;
    right: 10px;
    cursor: pointer;
    transition: .5s
}

.bookingFormContainer,
.showBookingForm,
.zonebg {
    transition: .5s ease-in-out
}

.closeDivAboluste:hover {
    transition: .5s;
    opacity: .8
}

.bookingFormContainer {
    display: none !important;
    position: absolute;
    top: 0;
    right: -100%;
    z-index: 4500;
    background: var(--white);
    width: 100vw;
    height: 200vh;
    background-color: rgba(0, 0, 0, .8)
}

.showBookingForm {
    display: block !important;
    right: 0
}

.mr-3 {
    margin-right: 3rem !important
}

.ml-3 {
    margin-left: 3rem !important
}

.zonebg {
    background: var(--white) !important;
    height: 50%;
    display: flex;
    width: 150px;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: 1px solid var(--red);
    font-size: 25px;
    font-weight: 700;
    cursor: pointer
}

.comment-section {
    margin: auto;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1)
}

.comment {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--dddColor);
    padding-bottom: 10px
}

.comment-content {
    flex: 1
}

.comment-author {
    font-weight: 700;
    margin-bottom: 5px
}

.comment-header {
    display: flex;
    align-items: center;
    font-weight: 700;
    color: var(--darkGrey);
    font-size: 20px
}

.comment-date {
    font-size: 15px;
    color: var(--gray);
    margin-left: 20px
}

.comment-text {
    font-size: 18px;
    color: var(--darkGrey)
}

.bg-offWhite {
    background: var(--bgF0) !important
}

.homeWhiteBg {
    background: var(--f3f3f3) !important
}

.borderf3 {
    border-color: var(--f3f3f3) !important
}

.myTranslateClass {
    transform: translate3d(1747px, 0, 0)
}

.judgeCard {
    border-top: 2px solid var(--mainGold);
    border-radius: 15px
}

.dropdown-toggle::after {
    margin-top: 3px !important;
    margin-bottom: -3px !important
}

.hourseCardClass {
    position: relative;
    background: var(--white);
    border-radius: 15px
}

.replacementHorseCard {
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.whatsapp-green {
    color: #25D366 !important;
}

.horseCardTitle {
    font-weight: 700;
    font-size: 15px;
    color: var(--black);
    text-transform: capitalize;
    display: block
}

.horseCardDescription {
    font-size: 12px;
    text-transform: capitalize;
    color: var(--description);
    line-height: 18px
}

.scaleHoverEffect {
    transition: .2s ease-in-out
}

.scaleHoverEffect:hover {
    transform: scale(1.01)
}

.ms-n5 {
    margin-left: -25px !important;
    z-index: 2000
}

.ms-n5-form {
    margin-left: -40px !important;
    z-index: 2000
}

.horse-market-filter-form>h2 {
    font-size: 32px
}

.end-n-25 {
    right: -3rem !important
}

.ReactGridGallery_tile-viewport,
.border-15 {
    border-radius: 15px !important
}

.fc-scrollgrid-sync-table {
    overflow: hidden !important
}

.bg-search {
    background: var(--bgSearch) !important
}

.br-15 {
    border-radius: 15px
}

.border-start-rd-15 {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px
}

.border-end-rd-15 {
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px
}

.bg-none,
.bg-none>.css-13cymwt-control,
.bg-none>.css-13cymwt-control:hover,
.bg-none>.css-t3ipsp-control,
.bg-none>.css-t3ipsp-control:hover {
    background: 0 0 !important;
    border-color: transparent !important;
    box-shadow: none !important
}

.orgChartTitle {
    font-weight: 700 !important;
    font-size: 15px !important;
    text-transform: capitalize !important
}

.labelStyle,
label {
    font-size: 13px !important
}

.btn-info {
    color: var(--white) !important
}

.mainSpacer {
    border: 0;
    width: 100%;
    height: 1px;
    background: var(--gray)
}

.col-xl-2-5 {
    flex: 0 0 auto;
    width: 20%
}

@media (min-width:1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1400px !important
    }

    .row {
        --bs-gutter-x: 20px !important
    }

    .col-xl-2-5 {
        width: 'unset'
    }
}

@media (min-width:576px) {
    .p-main {
        padding: 20px !important
    }
}

@media (max-width:1400px) {
    .second_section_bar {
        width: 100%;
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scrollbar-color: none !important;
        scrollbar-width: 0px
    }

    .scrollHorizintal {
        scrollbar-color: var(--mainGold);
        scrollbar-width: 1px
    }

    .scrollHorizintal::-webkit-scrollbar,
    .second_section_bar::-webkit-scrollbar {
        -webkit-appearance: none;
        scrollbar-width: 1px;
        height: 5px
    }

    .scrollHorizintal::-webkit-scrollbar-track,
    .second_section_bar::-webkit-scrollbar-track {
        background: 0 0;
        scrollbar-width: 1px
    }

    .scrollHorizintal::-webkit-scrollbar-thumb,
    .second_section_bar::-webkit-scrollbar-thumb {
        background-color: none !important;
        border-radius: 0;
        border: 0 solid !important;
        scrollbar-width: 0px
    }

    .scrollHorizintal::-webkit-scrollbar-thumb:hover,
    .second_section_bar::-webkit-scrollbar-thumb:hover {
        background-color: none !important;
        height: 0
    }

    .second_services_container {
        min-width: 200px !important;
        text-align: center
    }

    .service_bar_img_and_link_conrtainer {
        margin-top: 10px
    }

    #second_services_container_fluid {
        max-width: 80vw
    }

    .mb-main {
        margin-bottom: 1.5rem
    }
}

.form-control:focus {
    box-shadow: none !important
}

.mt-175 {
    margin-top: 175px
}

.mb-157 {
    margin-bottom: 157px
}

@media (max-width:991px) {

    body,
    html {
        overflow-x: hidden
    }

    .AuctionHeaderContainer {
        min-height: 715px
    }

    .auctionimagecontainer {
        overflow: unset
    }

    .AuctionDetalisListhourseImage {
        height: unset;
        width: 100%
    }

    .ShowsCard {
        height: unset;
        min-height: unset
    }

    .underline {
        display: none !important
    }

    .mb-157 {
        margin-bottom: 0
    }

    .mt-175 {
        margin-top: 25px
    }
}

.mt-10 {
    margin-top: 10px !important
}

i.fa,
i.fa-brands,
i.fa-regular,
i.fa-solid {
    width: 20px !important;
    margin: 0 !important;
    text-align: start !important
}

.whiteSpacer {
    height: 2px;
    background: var(--white);
    border: 0;
    width: 100%
}

.w-unset,
i.w-unset {
    width: unset !important
}

table>thead>tr {
    background-color: var(--bgGray) !important
}

th {
    vertical-align: middle !important
}

.popUpElemnts {
    width: 100% !important;
    max-height: 60vh !important;
    min-height: 150px;
    overflow-y: auto;
    overflow-x: hidden
}

.fz-26 {
    font-size: 26px !important
}

.arText {
    position: relative !important
}

.arText::before {
    position: absolute;
    z-index: 50000;
    width: 100%;
    height: 1px;
    background: #663399;
    transform: translateY(-50%);
    content: "";
    top: 50%
}

.dropdown-menu {
    font-size: 12px !important
}

@media (max-width:575.98px) {
    .mobile-extra-padding {
        padding-left: 1rem;
        padding-right: 1rem
    }
}

.w-75 {
    width: 75%
}

.ltr {
    direction: ltr !important
}

.mt-n1 {
    margin-top: -5px !important;
    padding-bottom: 10px !important
}

.mb-n2 {
    margin-bottom: -53px !important
}

.bg-selected {
    color: var(--white) !important;
    background: rgba(0, 0, 0, 0.5) !important;
}
i.fa-horse-head,i.fa-chess-knight{
    width: unset !important;
}
.fa-horse-head::before,
.fa-chess-knight::before {
    content: "" !important;
    display: inline-block;
    width: 1.7em;
    height: 1.7em;
    /* 3. Add your SVG as a background image */
    background-image: url(../svg/contact_horse.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    vertical-align: middle;
}

.fa-chess-knight::before {
    background-image: url(../svg/contact_horse_red.svg);
}