/* ---fonts--- */
@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-Bold.eot');
    src: url('OpenSansCondensed-Bold.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-Bold.woff2') format('woff2'),
        url('OpenSansCondensed-Bold.woff') format('woff'),
        url('OpenSansCondensed-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-ExtraBold.eot');
    src: url('OpenSansCondensed-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-ExtraBold.woff2') format('woff2'),
        url('OpenSansCondensed-ExtraBold.woff') format('woff'),
        url('OpenSansCondensed-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-Light.eot');
    src: url('OpenSansCondensed-Light.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-Light.woff2') format('woff2'),
        url('OpenSansCondensed-Light.woff') format('woff'),
        url('OpenSansCondensed-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-Regular.eot');
    src: url('OpenSansCondensed-Regular.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-Regular.woff2') format('woff2'),
        url('OpenSansCondensed-Regular.woff') format('woff'),
        url('OpenSansCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-SemiBold.eot');
    src: url('OpenSansCondensed-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-SemiBold.woff2') format('woff2'),
        url('OpenSansCondensed-SemiBold.woff') format('woff'),
        url('OpenSansCondensed-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans Condensed';
    src: url('OpenSansCondensed-Medium.eot');
    src: url('OpenSansCondensed-Medium.eot?#iefix') format('embedded-opentype'),
        url('OpenSansCondensed-Medium.woff2') format('woff2'),
        url('OpenSansCondensed-Medium.woff') format('woff'),
        url('OpenSansCondensed-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('OpenSansSemiCondensed-ExtraBold.eot');
    src: url('OpenSansSemiCondensed-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('OpenSansSemiCondensed-ExtraBold.woff2') format('woff2'),
        url('OpenSansSemiCondensed-ExtraBold.woff') format('woff'),
        url('OpenSansSemiCondensed-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('OpenSansSemiCondensed-Light.eot');
    src: url('OpenSansSemiCondensed-Light.eot?#iefix') format('embedded-opentype'),
        url('OpenSansSemiCondensed-Light.woff2') format('woff2'),
        url('OpenSansSemiCondensed-Light.woff') format('woff'),
        url('OpenSansSemiCondensed-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('OpenSansSemiCondensed-Bold.eot');
    src: url('OpenSansSemiCondensed-Bold.eot?#iefix') format('embedded-opentype'),
        url('OpenSansSemiCondensed-Bold.woff2') format('woff2'),
        url('OpenSansSemiCondensed-Bold.woff') format('woff'),
        url('OpenSansSemiCondensed-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('OpenSansSemiCondensed-Medium.eot');
    src: url('OpenSansSemiCondensed-Medium.eot?#iefix') format('embedded-opentype'),
        url('OpenSansSemiCondensed-Medium.woff2') format('woff2'),
        url('OpenSansSemiCondensed-Medium.woff') format('woff'),
        url('OpenSansSemiCondensed-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('OpenSansSemiCondensed-Regular.eot');
    src: url('OpenSansSemiCondensed-Regular.eot?#iefix') format('embedded-opentype'),
        url('OpenSansSemiCondensed-Regular.woff2') format('woff2'),
        url('OpenSansSemiCondensed-Regular.woff') format('woff'),
        url('OpenSansSemiCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-ExtraBold.eot');
    src: url('../fonts/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-ExtraBold.woff2') format('woff2'),
        url('../fonts/OpenSans-ExtraBold.woff') format('woff'),
        url('../fonts/OpenSans-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans SemiCondensed';
    src: url('../fonts/OpenSansSemiCondensed-SemiBold.eot');
    src: url('../fonts/OpenSansSemiCondensed-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSansSemiCondensed-SemiBold.woff2') format('woff2'),
        url('../fonts/OpenSansSemiCondensed-SemiBold.woff') format('woff'),
        url('../fonts/OpenSansSemiCondensed-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Bold.eot');
    src: url('../fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-Bold.woff2') format('woff2'),
        url('../fonts/OpenSans-Bold.woff') format('woff'),
        url('../fonts/OpenSans-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Light.eot');
    src: url('../fonts/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-Light.woff2') format('woff2'),
        url('../fonts/OpenSans-Light.woff') format('woff'),
        url('../fonts/OpenSans-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-SemiBold.eot');
    src: url('../fonts/OpenSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-SemiBold.woff2') format('woff2'),
        url('../fonts/OpenSans-SemiBold.woff') format('woff'),
        url('../fonts/OpenSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.eot');
    src: url('../fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-Regular.woff2') format('woff2'),
        url('../fonts/OpenSans-Regular.woff') format('woff'),
        url('../fonts/OpenSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Medium.eot');
    src: url('../fonts/OpenSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/OpenSans-Medium.woff2') format('woff2'),
        url('../fonts/OpenSans-Medium.woff') format('woff'),
        url('../fonts/OpenSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
/* Global CSS */



*,

*:before,

*:after {

	box-sizing: border-box;

	margin: 0;

	padding: 0;

}



html {

	width: 100%;

	margin: 0 auto;

}



body {

	font-family: 'Open Sans', sans-serif !important;

	color: #222222 !important;

}



h1,

h2,

h3,

h4,

h5,

h6,

p,

li,

a {

	color: #222222;

	margin: 0;

}





/* --toggle-- */



.theme-toggle .toggle {

	position: absolute;

	display: none;

}



.theme-toggle .toggle:before {

	content: "";

	position: absolute;

	left: -56px;

	top: 30px;

	font-size: 18px;

	color: #fff;

}



.theme-toggle .toggle:after {

	content: "";

	position: absolute;

	right: -110px;

	top: 60px;

	font-size: 28px;

	color: #ffffff;

	transform: skew(-20deg, -12deg);

}



.theme-toggle .toggle label {

	position: relative;

	display: inline-block;

	width: 80px;

	height: 80px;

	background-color: #fd1015;

	border-radius: 50px;

	cursor: pointer;

	box-shadow: inset 0 0 2px 1px rgba(0, 0, 0, 0.1), 0px 9px 15px 0px #ef4247;

	-webkit-tap-highlight-color: transparent;

}



.theme-toggle .toggle label:before {

	content: "";

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%, -50%);

	transition: width 0.2s cubic-bezier(0, -1.85, 0.27, 1.75);

	height: 42px;

	width: 42px;

	background-color: #fd0f14;

	border-radius: 46px;

	box-shadow: inset 0px 0px 0px 8px #fff;

}



.theme-toggle .toggle input {

	display: none;

}



.theme-toggle .toggle input:checked+label {

	background-color: #57de72;

	box-shadow: inset 0 0 2px 1px rgba(0, 0, 0, 0.1), 0px 9px 15px 0px rgba(3, 132, 28, 0.5411764706);

}



.theme-toggle .toggle input:checked+label:before {

	width: 10px;

	background-color: #fff;

}



.on {

	background-color: #6fc57c;

}



.on .toggle:before {

	color: rgba(62, 160, 81, 0.89);

}



.on .toggle:after {

	color: #fff;

}





/* --toggle-- */

.dark-mode .custom-input input:focus {

	background-color: transparent;

	border-color: transparent;

	outline: 0;

	box-shadow: none;

	color: #fff;

}



.dark-mode {

	background: #010203;

	color: white !important;

	min-height: 100vh;

}



.dark-mode h1,

.dark-mode h2,

.dark-mode p,

.dark-mode .main-content .nav-tabs .nav-link {

	color: #fff;

}



.dark-mode .header-left img {

	filter: invert(1);

}



button.mode-btn {

	border: 0;

	background: #010203;

	color: #fff;

	padding: 5px 15px;

	border-radius: 3px;

}



.dark-mode button.mode-btn {

	background: linear-gradient(to top, #fff, #fff 35%);

	color: #000;

}



.dark-mode .content-table {

	background: #010203;

}



.dark-mode .content-table tr:nth-child(even) {

	background: #010203;

}



.dark-mode .content-table thead th {

	background: #010203;

	color: #fff;

}



.dark-mode .content-table tr td {

	color: #fff;

}



.dark-mode .web-form-body form {

	background: #010203;

}



.dark-mode h3.large-title {

	color: #fff;

}



.dark-mode .modal-header,

.dark-mode .modal-body {

	background: #010203;

}

.dark-mode .modal-header {

    border: 1px solid #fff;

    border-bottom: 0;

}

/* .model-box .btn-close {

    filter: invert(1);

} */

.dark-mode .modal-body {

	background: #010203;

	border: 1px solid #fff;

}



.dark-mode .modal-title,

.dark-mode .bank-details h3.title {

	color: #fff;

}



button.mode-btn {

	position: fixed;

	left: 71.8%;

	top: 17%;

}



.dark-mode input.form-control.read_only {

	background: #ffffffbf;

}



.dark-mode .theme-toggle .toggle:after {

	color: linear-gradient(to top, #000000, #0f0f21 35%);

}





/* ----form-1--- */



.header-left img {
	max-width: 240px;
}
.header-left {
	width: 85%;
    display: inline-block;
}



.header {

	padding-top: 20px;

}



.header-right h1 {
	font-size: 28px;
	font-weight: 500;
	text-align: end;
}



.main-content {

	margin-top: 20px;

}



.buttn {
	width: 10%;
}
.time {
	width: 5%;
}
td.event, th.event {
    width: 15%;
}
.nomber {
	width: 5%;
}

/* .class_name {
	width: 75%;
} */

.horseslot{
  width: 5%;
}

.btn.btn-green {
	display: inline-block;
	font-size: 13px;
	text-decoration: none;
	background: #198754;
	border: 1px solid #198754;
	color: #ffffff;
	font-weight: 500;
	transition: 300ms all;
	border-radius: 3px;
}
.btn.btn-green:hover {
	color: #fff;
    background-color: #157347;
    border-color: #146c43;
}
.btn.btn-red {
	display: inline-block;
	font-size: 13px;
	text-decoration: none;
	background: #d15662;
	border: 1px solid #d15662;
	color: #ffffff;
	font-weight: 500;
	transition: 300ms all;
	border-radius: 3px;
}
.btn.btn-red:hover {
	color: #fff;
    background-color: #b02a37;
    border-color: #b02a37;
}
.btn.btn-startlist,
.btn.btn-resultlist,
.btn.btn-gray {
	display: inline-block;
	font-size: 13px;
	text-decoration: none;
	background: #7e7a7b;
	border: 1px solid #ffffff;
	color: #ffffff;
	font-weight: 500;
	transition: 300ms all;
	border-radius: 3px;
}
.btn.btn-gray:hover {
	color: #fff;
    background-color: #9f9b9c;
    border-color: #9f9b9c;
}

.btn.btn-startlist{
    background-color: #2da659;
}
.btn.btn-resultlist{
    background-color: #373735;
}
.btn.btn-red{
    background-color: #EA4F44;
}

.btn.btn-gray.clear {
	background: transparent;
	color: #000000;
}
.btn.btn-gray.clear:hover {
	background: rgb(0 0 0 / 40%);
	color: #fff;
}
.btn.btn-yellow {
	display: inline-block;
	font-size: 13px;
	text-decoration: none;
	background: #FFD743;
	border: 1px solid #FFD743;
	color: #000000 !important;
	font-weight: 500;
	transition: 300ms all;
	border-radius: 3px;
}
.btn.btn-yellow:hover {
	color: #000000 !important;
    background-color: #efc427;
    border-color: #efc427;
}
.btn.btn-tab {
    padding: 7px 12px !important;
}
td.modal-top .btn-green{
	background: rgb(45 166 89 / 70%);
	border: 1px solid rgb(45 166 89 / 70%);
	font-weight: 600;
}

.addition-info{
    font-size: 12px;
    padding: 5px 0px;
}
.addition-info-main{
    background: #000000;
    font-size: 18px;
    color: #ffffff;
    margin: 0;
    text-align: center;
    padding: 5px;
}

.main-content .table tbody tr td a {

	text-decoration: none;

	color: #ffffff;

	padding: 5px 25px;

}



.horse-popup .modal-dialog {

	max-width: 1366px;

	/* top: 50%;

	transform: translateY(-50%) !important; */

}



td.head_no {

	width: 8%;

}



/* td.hours_name {
	width: 72%;
} */



td.col-btn {

	width: 25%;

}





/* --main-table-- */





/* ---footer--- */



.header-right img {

	max-width: 657px;

	width: 100%;

	height: 150px;

	object-fit: contain;

}



table.table {

	margin-bottom: 0;

}



.search-box {

	text-align: right;

	padding-bottom: 14px;

}



.search-box input {

	padding: 8px 30px;

	border: 1px solid #ccc;

	font-size: 14px;

	outline: none;

	width: 100%;

}



.content-table {

	background: #fff;

	box-shadow: 0px 40px 30px rgb(0 0 0 / 9%);

	border: 1px solid #E6E6E6;

	border-radius: 2px;

	padding: 20px 20px 20px;

	margin-top: 20px;

	margin-bottom: 60px;

}



.content-table thead th {

	padding: 8px 20px;

	background: #ebebeb;

	color: #000000;

	font-size: 14px;

}



.content-table tr:nth-child(even) {

	background: #ebebeb;

}



.content-table table.table:last-child {

	margin-bottom: 0;

}



.content-table table.table {

	border: 1px solid #E6E6E6;

}



.content-table tr td:first-child {

	font-size: 14px;

	font-weight: 600;

}



.content-table tr td:nth-child(2) {

	font-size: 14px;

}



.content-table tr td {

	padding: 8px 20px;

	vertical-align: middle;

	font-size: 14px;

}



.modal-table table.table tbody {

	border-top: none;

}



td.class_name span.ow-horse-name {

	display: inline-block;

	background: #646464;

	color: #ffffff;

	text-align: center;

	border-radius: 3px;

	padding: 2px 10px;

	font-size: 12px;

	font-weight: normal;

}



td.class_name {

	font-weight: 700;

}



table {

	border-collapse: collapse;

}



/* .main-content .nav-tabs .nav-link.active {

	background: #2da659;

	color: #ffffff;

	border-color: #2da659;

} */
.main-content .nav-tabs .nav-link.active {
    background: rgb(0 0 0 / 40%);
    color: #fff;
    border-bottom: 1px solid #999;
}



.main-content .nav-tabs .nav-link:hover {
    border-color: rgb(240 235 235 / 100%);
    border-bottom-color: transparent;
}



.main-content .nav-tabs .nav-link {

	color: #000000;

	font-size: 16px;

	font-weight: 700;

	transition: 0.5s all ease-in-out;

}



.content-table.main-screen {

	margin-top: 0;

}



.main-content .nav-tabs {

	border-bottom: 0;

}





/* -----second-tab */



.form-header {

	padding: 20px 0;

}



h3.title {

	font-size: 18px;

	font-weight: 600;

	line-height: 30px;

}



.spacer-top-bottem {

	padding: 30px 0;

}



.spacer-bottem {

	padding-bottom: 30px;

}



.form-top .row {

	align-items: end;

}



.date-box {

	text-align: end;

}



.date-box h4 {

	margin-bottom: 0;

}



.web-form-body .heading h2 {

	font-size: 34px;

	font-weight: 600;

	margin-bottom: 30px;

}



.web-form-body .heading p a {

	text-decoration: none;

	color: #222222;

}



.web-form-body .heading p {

	font-size: 18px;

	line-height: 28px;

	color: #222222;

}



.web-form-body {

	border: 1px solid #E6E6E6;

	border-radius: 2px;

	padding: 20px 20px 20px;

	margin-bottom: 20px;

}



.web-form-button {

	padding-bottom: 20px;

}



.web-form-body form {

	background-color: #eaeaea;

	padding: 0 20px;

}



.web-form-body .heading {

	margin-bottom: 50px;

}



h3.large-title {

	font-size: 34px;

	line-height: 30px;

	font-weight: 700;

	margin: 40px 0;

}



.more-info {

	max-width: 650px;

}



.more-info p {

	font-size: 18px;

	line-height: 35px;

}



.custom-input input {

	border-bottom: 1px solid #2ca558!important;

	border: none;

	border-radius: 0;

	background-color: #fff;

}



.custom-input input:focus {

	background-color: transparent;

	border-color: transparent;

	outline: 0;

	box-shadow: none;

	color: #000000;

}



.text-box-one span {

	font-size: 12px;

}



.form-group input {

	padding: 0;

	margin-bottom: 0;

	opacity: 0;

	cursor: pointer;

	position: absolute;

	z-index: 9;

	left: 10px;

	width: 22px;

	height: 20px;

}



.form-group {

	position: relative;

}



.form-group label {

	position: relative;

	cursor: pointer;

	padding: 0 10px;

}



.form-group label:before {

	content: '';

	-webkit-appearance: none;

	background-color: transparent;

	border: 2px solid #2ca558;

	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);

	padding: 10px;

	display: inline-block;

	position: relative;

	vertical-align: middle;

	cursor: pointer;

	margin-right: 5px;

}



.form-group input:checked+label:after {

	content: '';

	display: block;

	position: absolute;

	top: 5px;

	left: 19px;

	width: 6px;

	height: 14px;

	border: solid #2ca558;

	border-width: 0 2px 2px 0;

	transform: rotate( 45deg);

}



.check-box-inner {

	display: flex;

	align-items: center;

	flex-wrap: wrap;

}





/* ----form-2--- */



.web-form-body.two {

	padding-bottom: 100px;

}



.web-form-body.two {

	padding-top: 0;

}



.form-content h3 {

	color: #fff;

	text-align: left;

	font-size: 28px;

	font-weight: 600;

	margin-bottom: 5px;

}



.form-content h3.form-title {

	margin-bottom: 30px;

}



.form-content p {

	color: #fff;

	text-align: left;

	font-size: 17px;

	font-weight: 300;

	line-height: 20px;

	margin-bottom: 30px;

}



.form-content input[type=text],

.form-content input[type=password],

.form-content input[type=email],

.form-content select,

.form-content input[type=tel],

.form-content select,

.form-content input[type=radio] {

	width: 100%;

	padding: 9px 20px;

	text-align: left;

	border: 0;

	outline: 0;

	border-radius: 6px;

	background-color: #fff;

	font-size: 15px;

	font-weight: 300;

	color: #8D8D8D;

	-webkit-transition: all 0.3s ease;

	transition: all 0.3s ease;

	margin-top: 16px;

}



.btn-primary {

	background-color: #6C757D;

	outline: none;

	border: 0px;

	box-shadow: none;

}



.btn-primary:hover,

.btn-primary:focus,

.btn-primary:active {

	background-color: #495056;

	outline: none !important;

	border: none !important;

	box-shadow: none;

}



.form-content textarea {

	position: static !important;

	width: 100%;

	padding: 8px 20px;

	border-radius: 6px;

	text-align: left;

	background-color: #fff;

	border: 0;

	font-size: 15px;

	font-weight: 300;

	color: #8D8D8D;

	outline: none;

	resize: none;

	height: 120px;

	-webkit-transition: none;

	transition: none;

	margin-bottom: 14px;

}



.form-content textarea:hover,

.form-content textarea:focus {

	border: 0;

	background-color: #ebeff8;

	color: #8D8D8D;

}



.mv-up {

	margin-top: -9px !important;

	margin-bottom: 8px !important;

}



.invalid-feedback {

	color: #ff606e;

}



.valid-feedback {

	color: #2acc80;

}





/* --remove-valid-invalid-text-and-icon-- */



.set-opacity {

	opacity: 0;

}



.was-validated .maneg-icon .form-control:invalid {

	background: none;

}



.was-validated .maneg-icon .form-control:valid {

	background: none;

}



.was-validated .maneg-icon .form-control:invalid:focus,

.was-validated .maneg-icon .form-control:valid:focus {

	border-color: transparent;

	box-shadow: none;

}





/* --remove-valid-invalid-text-and-icon-- */



.set-input-half-width {

	padding: 0.375rem 0.75rem;

	font-size: 1rem;

	font-weight: 400;

	line-height: 1.5;

	color: #212529;

	background-color: #fff;

	background-clip: padding-box;

	-webkit-appearance: none;

	-moz-appearance: none;

	appearance: none;

	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	max-width: 200px;

}



.set-input-full-width {

	padding: 0.375rem 0.75rem;

	font-size: 1rem;

	font-weight: 400;

	line-height: 1.5;

	color: #212529;

	background-color: #fff;

	background-clip: padding-box;

	-webkit-appearance: none;

	-moz-appearance: none;

	appearance: none;

	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	width: 100%;

}



.select2-results__option {

	color: #555;

}



.flag-text {

	margin-left: 10px;

}



.select2 {

	width: 100% !important;

	border-bottom: 1px solid #2ca558!important;

}



.select2-container--default .select2-selection--single {

	border: 0 !important;

	border-radius: 0;

	background-color: #fff;

	display: block;

	width: 100%;

	padding: 0.375rem 0.75rem;

	font-size: 1rem;

	font-weight: 400;

	line-height: 1.5;

	color: #212529;

}



.select2-container--default .select2-selection--single {

	background-color: #fff;

	border: 1px solid #aaa;

	border-radius: 4px;

	height: 37px !important;

}



input.form-control.read_only {

	background: #ffffff73;

}



/* Toastr message start*/

.toast-title {

    font-weight: bold;

}

.toast-message {

    -ms-word-wrap: break-word;

    word-wrap: break-word;

}

.toast-message a,

.toast-message label {

    color: #ffffff;

}

.toast-message a:hover {

    color: #cccccc;

    text-decoration: none;

}

.toast-top-full-width {

    top: 0;

    right: 0;

    width: 100%;

}

.toast-bottom-full-width {

    bottom: 0;

    right: 0;

    width: 100%;

}

.toast-top-left {

    top: 12px;

    left: 12px;

}

.toast-top-right {

    top: 12px;

    right: 12px;

}

.toast-bottom-right {

    right: 12px;

    bottom: 12px;

}

.toast-bottom-left {

    bottom: 12px;

    left: 12px;

}

#toast-container {

    position: fixed;

    z-index: 999999;

}

#toast-container * {

    -moz-box-sizing: border-box;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

}

#toast-container>div {

    margin: 0 0 6px;

    padding: 15px 15px 15px 50px;

    width: 300px;

    -moz-border-radius: 3px 3px 3px 3px;

    -webkit-border-radius: 3px 3px 3px 3px;

    border-radius: 3px 3px 3px 3px;

    background-position: 15px center;

    background-repeat: no-repeat;

    -moz-box-shadow: 0 0 12px #999999;

    -webkit-box-shadow: 0 0 12px #999999;

    box-shadow: 0 0 12px #999999;

    color: #ffffff;

    opacity: 0.8;

    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);

    filter: alpha(opacity=80);

}

#toast-container> :hover {

    -moz-box-shadow: 0 0 12px #000000;

    -webkit-box-shadow: 0 0 12px #000000;

    box-shadow: 0 0 12px #000000;

    opacity: 1;

    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);

    filter: alpha(opacity=100);

    cursor: pointer;

}

#toast-container>.toast-info {

    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;

}

#toast-container>.toast-error {

    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;

}

#toast-container>.toast-success {

    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;

}

#toast-container>.toast-warning {

    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;

}

#toast-container.toast-top-full-width>div,

#toast-container.toast-bottom-full-width>div {

    width: 96%;

    margin: auto;

}

#toast-container>.toast {

    background-color: #030303;

}

#toast-container>.toast-success {

    background-color: #51a351;

}

#toast-container>.toast-error {

    background-color: #bd362f;

}

#toast-container>.toast-info {

    background-color: #2f96b4;

}

#toast-container>.toast-warning {

    background-color: #f89406;

}

/* Toastr message end*/

#info a {

    color: #000000;

    font-weight: bold;

    text-decoration: none;

}

.status-online {
    background: #4bc577;
    padding: 3px 10px;
    color: white;
    border: none;
    border-radius: 3px;
}

.status-online > svg {

    height: 20px;

    width: 10px;

    fill: #ffffff;

    vertical-align: middle;

    padding: 2px 0;

}

.status-del-requested, .status-start-requested {

    background: #646464;

    padding: 3px 8px;

    color: white;

    border: none;

    border-radius: 3px;

}

/* tr.group-head td{padding-top: 15px;} */

.content-table tr.group-head {

    background:  #004139;

    color: #ffffff;

}

td.class_name span.ow-horse-name.starting {
    background: rgb(45 166 89 / 70%);
    color: #ffffff;
    font-weight: 600;
}

td.class_name span.ow-horse-name.starting_requested {

    background: #a5a3a3;

    color: #ffffff;

}

td.class_name span.ow-horse-name.notstarting_requested {
    text-decoration-line: line-through;
	background: rgb(234 79 68 / 70%);
    color: #ffffff;
	font-weight: 600;
}

.timer > span.days::after {
    content: ":";
}

.timer > span.hours::after {
    content: ":";
}

.timer > span.minutes::after {
    content: ":";
}
.errormsg {
    color: #EA4F44;
}

.table>thead.second-head::before {

    content: "_";

    line-height: 20px;

    display: block;

    text-indent: -99999px;

}

#horses table td.time {
    width: 10%;
}#horses table.table tr td.nomber {
    width: 90%;
}
 .content-table {
    border-top-color: #999;
}
#home .content-table td.class_name {
	font-weight: 500;
}
.modal-table tbody tr td.col-btn .horse_order {
    display: inline-block;
    width: 70px;
    padding: 4px 10px;
    vertical-align: middle;
}
select.horse_order {margin-right: 20px;}
.guest-wrap .header{display: none;}
.guest-wrap {background-color: #fff;}
.guest-page {
    height: calc(100vh - 111px);
    display: flex;
    align-items: center;
    background: #fff;
}
.guest-form {
    max-width: 400px;
    margin: 0 auto;
    background: #fff;
    padding: 50px 45px 50px;
    border-radius: 10px;
    box-shadow: 0px 15px 100px rgb(0 0 0 / 28%);
}
.guest-form h3 {
    font-size: 40px;
    text-transform: uppercase;
    font-weight: bold;
    color: #6c6c6c;
    margin-bottom: 5px;
    text-align: center;
}
.guest-form label.form-label {
    font-size: 16px;
    margin-bottom: 7px;
    color: #727272;
    font-weight: 500;
}
.guest-form input {
    padding: 9px 15px;
    border: 1px solid #e8e8e8;
}
.guest-form button.btn.btn-primary, .guest-form a.btn.btn-primary {
    min-width: 140px;
    border-radius: 50px;
    background: #2da659;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    border: none;
    box-shadow: 0px 10px 20px rgb(0 0 0 / 21%);
    display: block;
    margin: 20px auto 0;
    font-size: 15px;
    padding: 10px 25px;
}

/* Side Layout Start */
.hide {display: none;}
.wrapper {
    width: 100%;
    min-height: 100vh;
}
.logo img {
    width: 90%;
}
span.sub-title {
    font-size: 13px;
    font-weight: 400;
}
.main-content .header-show {display: none;}
.loggedin-wrap .main-content {max-width: 100%;}
.loggedin-wrap > .wrapper{display: flex;}
.hash-wrap header > .sidelayout, .loggedin-wrap header .header {display: none;}
header > .sidelayout.active {
	display: block !important;
    position: absolute;
    left: 0;
    top: 0;
}
.sidelayout.active + .sidelayout-overlay {
    width: 100%;
    background: #000000b5;
    height: 100vh;
    z-index: 1;
    position: fixed;
    top: 0;
    right: 0;
}
header > .sidelayout {
    position: relative;
    background: #198754;
    height: 100%;
	z-index: 9;
}
ul.nav-tabs li.nav-item .nav-link span.fa-solid + .label, .btn.btn-tab span.fa-solid + .label {
    margin-left: 5px;
}
.custom-menu-box {width: 40px;display: none;}
#sidebar ul.components .list-group .list-group-item {background-color: transparent;}
#sidebar ul.components .list-group .list-group-item a {border-bottom: none;}
.fa-sr-only, .fa-sr-only-focusable:not(:focus), .sr-only, .sr-only-focusable:not(:focus) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border-width: 0;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}
.top-header .toggle-btn:after {
    z-index: -1;
    position: absolute;
    top: 4px;
    right: 0;
    bottom: 0;
    content: '';
    transform: rotate(45deg);
    background: #198754;
    border-radius: 10px;
    width: 50px;
    height: 50px;
    left: 7px;
}
.menu-box {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
#sidebar {
    min-width: 270px;
    max-width: 270px;
    background: #198754;
    color: #fff;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#sidebar .logo {
    display: block;
    color: #fff;
    font-weight: 900;
    padding: 20px 20px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
img {
    vertical-align: middle;
    border-style: none;
}
#sidebar ul.components {
    padding: 0;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
#sidebar ul li {
    font-size: 16px;
}
#sidebar ul li.active>a {
    background: #5494da;
    color: #fff;
}
#sidebar ul li a {
    padding: 10px 30px;
    display: block;
    color: white;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	text-decoration: none;
}
#sidebar ul li a > span {
    width: 22px;
    margin-right: 5px;
    text-align: center;
}
main {
    width: 100%;
}
.main-content {
    position: relative;
    padding: 15px 15px;
}
.side-footer {
    position: fixed;
    bottom: 0;
    left: 0;
	width: auto;
	min-width: 265px;
}
.side-footer .dropdown {
	display: flex;
    justify-content: space-between;
}
/* Side Layout End */

/* ---responsive---- */



@media (max-width:992px) {}



@media (max-width: 991px) {

	h3.large-title {

		font-size: 30px;

		margin: 40px 0 15px;

	}

	.main-field .col-sm-8 {

		width: 60%;

	}

	.main-field .col-sm-4 {

		width: 40%;

	}

	.header-right h1 {

		font-size: 30px;

	}

}



@media (max-width: 767px) {

	.entry-until .timer{display: none;}
	.header-right h1 {

		text-align: center;

	}

	.header-left {

		text-align: center;

	}

	.form-top img {

		max-width: 200px;

		object-fit: cover;

	}

	.form-logo {

		text-align: center;

		padding-bottom: 20px;

	}

	.date-box {

		text-align: center;

	}

	h3.large-title {

		text-align: center;

		font-size: 24px;

	}
	.btn.btn-tab span.fa-solid + .label {margin-left: 0;display: block;}
	.sm-text-center{text-align: center;}
	.custom-menu-box {display: inline-block;}
	.loggedin-wrap > .wrapper{display: block;}
	.loggedin-wrap header .header {display: block;}
	.contact-box .row {
		margin-bottom: 10px !important;
	}
	ul.nav-tabs li.nav-item .nav-link {padding: 7px 12px;}
	ul.nav-tabs li.nav-item .nav-link span.fa-solid + .label {
		margin-left: 0;
		display: block;
	}
	.side-footer{
		position: absolute;
		width: 100%;
    	min-width: auto;
	}

	.more-info p {

		font-size: 16px;

		line-height: 30px;

	}

	.web-form-body .heading p {

		margin-bottom: 20px !important;

	}

	.text-box-one .title {

		margin-bottom: 20px;

	}

	.full-width {

		width: 100% !important;

		margin-bottom: 10px;

	}

	.spacer-top-bottem {

		padding: 30px 0 0;

	}

	.bottem-box .custom-input {

		max-width: 100%;

	}

	/* .web-form-body {

		padding-top: 10px;

	} */

	.bottem-box {

		padding-top: 60px;

	}

	.main-field .col-sm-8 {

		width: 100%;

	}

	.main-field .col-sm-4 {

		width: 100%;

	}

	.addrase-input input.form-control:nth-child(1) {

		padding: 13px 12px;

	}

	.contact-box .col-sm-8 input.form-control:nth-child(2),

	.contact-box .col-sm-8 input.form-control:nth-child(3) {

		padding: 25px 10px 5px;

	}
	.table.desktop thead{
		display: none;
	}
	.horseslot {
		display: none;
	}
	/* td.nomber {
		position: absolute;
		top: 50%;
		left: 10px;

	} */
	td.nomber {

		position: absolute;
		top: 25px;
		left: 10px;
		}
	.group-data{
		position: relative;
		position: -webkit-sticky;
	}
	/* tr.group-data {
		min-height: 300px;
		display: flex;
		align-items: center;
	} */
	td.buttn {
		display: inline-block;
		width: 100% !important;
	}
	/* td.buttn {
		top: 120px;
		position: relative;
		right: 146px;
		border: 0;
	} */
	.ow-horse-name {
		margin-bottom: 5px;
	}

	.nomber, .time,.class_name,.horseslot,.buttn{
		border: 0;
	}
	.hours_name span.status-del-requested {
		display: inline-block;
		text-align: center;
	}
	tr.popup-head {
		display: none;
	}
	td.class_name {
		width: 100%;
		text-align: start;
		display: inline-block;
	}
	td.time {
		/* display: inline-block; */
		width: 14%;
	}
	/* td.head_no {
		width: 100% !important;
		display: block;
	} */
	td.hours_name {
		display: block;
	}
	td.col-btn {
		width: 100% !important;
		text-align: start;
		display: block;
	}
	span.ow-horse-name.notstarting_requested {
		margin-bottom: 0 !important;
	}
	/* .content-table tr td {
		padding-top:  0;
	} */
	.content-table tr td {

		padding-top: 0;
		vertical-align: text-top;
		}
		td.buttn .btn-manage-entry {
			width: 100%;
		}
		#horses table.table tr td.nomber {
			position: inherit;
		}
	

}



@media (max-width: 499px) {

	.check-box-inner span {

		width: 100%;

		margin-bottom: 10px;

	}

	.web-form-body .heading p a {

		display: block;

	}
	.container.content {
		overflow: hidden;
	}
	.header-left img {
		max-width: 200px;
	}
	.main-content .header-show {margin-top: -15px !important;display: block;}
	.header-right h1, .header-show h1 {
		font-size: 20px;
		color: #ffffff;
		margin: 0;
		text-align: center;
	}
	.main-content .col-md-12.mb-3 {
		margin-bottom: 0 !important;
	}
	.main-content {
		margin-top: 0;
	}
	.entry-until {
		display: none;
	}
	td.buttn {
		text-align: start !important;
	}
	td.time {
		vertical-align: top !important;
	}
	td.nomber {
		top: 20px;

	}
	span.ow-horse-name.notstarting_requested {
		margin: 0 0 7px 0 !important;
	}
	.content-table .group-head td {
		padding: 5px 5px;
		border: 1px solid #004139;
	}
	.header .container {
		padding: 0;
		overflow: hidden;
	}
	.header .header-right, .header-show {
		background: #000000;
		padding: 7px 0;
		margin-bottom: 10px;
	}
	.horse-popup .modal-body {
		padding: 7px;
	}
	#info .main-screen {
		padding-left: 15px;
		padding-top: 10px;
	}
	.main-content .nav-tabs .nav-link {
		font-size: 15px;
	}
	td.modal-top .btn-green {
		padding: 3px 10px;
	}
	.spacing-top {
		padding-top: 0;
	}
	.margin-btn span.ow-horse-name.starting {
		margin-bottom: 0;
	}	
	#home table tbody tr.group-data td.buttn {
		padding-top: 0;
		margin-top: -7px;
		margin-bottom: 7px;
	}
	.modal-table tbody tr td.col-btn .errormsg {
		margin-top: -10px;
	}
	.modal-table tbody tr td.col-btn a.btn.btn-green.btn-select-entry, .modal-table tbody tr td.col-btn .horse_order {
		width: 100%;
	}
	body .btn-close {

		border: 1px solid #198754;

	}
	#home .content-table table.table tbody tr.group-data:nth-child(5) td:last-child {
		margin-bottom: 20px;
	}
	a.btn.btn-green.btn-delete-entry {
		width: 100%;
	}

}



@media (max-width:449px) {

	/* td.head_no {

		width: 15% !important;

		display: block;

	} */

	/* td.hours_name {

		width: 60% !important;

		display: block;

	} */

	/* td.col-btn {

		width: 25% !important;

		text-align: end;

	} */

	td.nomber {

		width: 20% !important;

	}
	#horses table td.time {
		width: 10%;
	}#horses table.table tr td.nomber {
		width: 90%;
	}

	td.buttn {

		/* width: 20% !important; */

		text-align: end;

	}

	/* td.time {

		width: 20% !important;

	} */

	/* td.class_name {

		width: 60% !important;

		text-align: start;

	} */

	/* .content-table table.table tbody tr {

		display: flex;

		flex-wrap: wrap;

		align-items: center;

	} */

	.content-table tr td {

		padding: 5px 5px;

		border: 0;

	}

	/* td.nomber {

		display: none;

	} */

	.content-table {

		padding: 0;

		box-shadow: 0px 10px 15px rgb(0 0 0 / 9%);

	}

	.content-table thead th {

		padding: 7px 7px;

	}

	.btn.btn-green {

		padding: 5px 15px;

	}

	/* .main-content .container {

        padding: 0;

    } */

	/* .header-right h1 {

		font-size: 25px;

	} */

	.web-form-body {

		padding: 0;

	}

	/* .main-content .container {

		padding: 0;

	} */
	#home .content-table.main-screen {
		border: 0;
	}
	.main-content .nav-tabs button#home-tab .nav-link.active {
		border-bottom-color: #004139;
	}

}



@media (max-width:423px) {

	.theme-toggle .toggle label {

		width: 50px;

		height: 50px;

	}

	.header-left img {

		max-width: 200px;

	}
	.mobile-header{display: flex;}
	header > .sidelayout {display:none;}
}

@media all and (max-width: 240px) {

    #toast-container>div {

        padding: 8px 8px 8px 50px;

        width: 108px;

    }

}

@media all and (min-width: 241px) and (max-width: 320px) {

    #toast-container>div {

        padding: 8px 8px 8px 50px;

        width: 128px;

    }

}

@media all and (min-width: 321px) and (max-width: 480px) {

    #toast-container>div {

        padding: 8px 8px 8px 50px;

        width: 192px;

    }

}

@media all and (min-width: 481px) and (max-width: 768px) {

    #toast-container>div {

        padding: 15px 15px 15px 50px;

        width: 300px;

    }

}