/* Fonts ---------------------------------------------------------------- */
@font-face {
    font-family: 'Ephesis';
    src: url('files/fonts/Ephesis-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* GENERAL -------------------------------------------------------------- */
html{
	color-scheme: light !important;
}

.site-title a {
	font-family: 'Ephesis', cursive;
}

form *{
	margin: 3px 0px;
}

input[type=date]{
	background-color: rgb(255,255,255) !important;
}

.full_width_form input[type=text], .full_width_form input[type=password], .full_width_form input[type=submit], .full_width_form input[type=button], .full_width_form input[type=number], .full_width_form input[type=date], .full_width_form select, .full_width_form textarea{
	width: 100%;
	appearance: none;
	-webkit-appearance: none;
}

input:disabled, input[type=text]:read-only, input[type=password]:read-only, input[type=email]:read-only, input[type=number]:read-only, textarea:read-only{
	background-color: rgb(220,220,220);
}

label{
	font-size: 16px;
}

table, tr, td, th{
	border-style: none;
	padding: 0px;
	margin: 0px;
	text-align: left;
	vertical-align: middle;
}

a button, button{
	width: 100%;
}

.table_visible_border{
	border-collapse: collapse;
}
.table_visible_border tr td, .table_visible_border tr th{
	border: 1px solid black;
	padding: 5px;
	text-align: center;
}
.table_visible_border tr td a button{
	margin: 0px 5px;
}

.table_with_padding{
	border-collapse: collapse;
}
.table_with_padding tr td, .table_with_padding tr th{
	padding: 5px;
	text-align: center;
}

.button_alternate{
	color: rgb(20,50,20);
	background-color: rgb(180,220,180);
	border: 3px solid rgb(20,50,20);
}
.button_alternate:hover{
	color: rgb(255,255,255);
	background-color: rgb(50,150,50);
	border: 3px solid rgb(20,50,20);
}
.button_active{
	color: rgb(255,255,255);
	background-color: rgb(50,150,50);
}

.hidden{
	display: none;
}

.center{
	display: block;
	margin: auto;
	text-align: center;
}

.inline{
	display: inline;
}

.inline-block{
	display: inline-block !important;
}

.p_success_msg, .p_success_msg_permanent{
	width: 100%;
	padding: 10px;
	background-color: rgb(50,150,50);
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	border-color: rgb(0,50,0);
	color: rgb(230,230,230);
}
.p_error_msg{
	width: 100%;
	padding: 10px;
	background-color: rgb(100,50,50);
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	border-color: rgb(50,0,0);
	color: rgb(230,230,230);
}
.p_warning_msg{
	width: 100%;
	padding: 10px;
	background-color: rgb(100,100,50);
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	border-color: rgb(50,50,0);
	color: rgb(230,230,230);
}

.p_success_msg a, .p_success_msg_permanent a, .p_error_msg a, .p_warning_msg a{
	color: rgb(255,255,255);
}

.help_mark_title{
	display: flex !important;
	align-items: center !important;
	margin-bottom: 20px;
}
.help_mark_title h1, .help_mark_title h2, .help_mark_title h3{
	margin: 0px;
}
.a_help_mark{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	text-decoration: none !important;
	font-weight: bold;
	color: rgb(255,255,255);
	background-color: rgb(200,200,200);
	/*padding: 5px 11px;*/
	margin-left: 10px;
	border-radius: 50%;
	width: 30px;
	height: 30px;
}


/* DASHBOARD -------------------------------------------------------------- */
#div_dashboard_title{
	display: flex !important;
	align-items: center !important;
}
#div_dashboard_title h1{
	margin: 0px !important;
}
.img_profile_picture_dashboard{
	display: inline-block;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 10px;
	height: 50px !important;
	width: 50px !important;
	object-fit: cover;
	border-radius: 50% !important;
	cursor: pointer;
}

.horse_overview{
	vertical-align: top;
	display: inline-block;
	width: 100%;
	max-width: 370px;
	border: 1px solid black;
	border-radius: 10px;
	padding: 10px;
	margin-right: 20px;
	margin-bottom: 20px;
	text-decoration: none !important;
	color: rgb(50,50,50);
}
.horse_overview:hover{
	background-color: rgb(160,200,160);
	color: rgb(50,50,50);
}
.horse_overview *{
	margin: 0px !important;
}

/* HORSE ------------------------------------------------------------------ */
#div_horse_title{
	display: flex !important;
	align-items: center !important;
	margin-bottom: 10px;
}

.img_horse_picture_info{
	margin: auto;
	display: block;
	height: 100%;
	width: 100%;
	max-height: 150px !important;
	max-width: 150px !important;
	cursor: pointer;
	object-fit: cover;
	aspect-ratio: 1 / 1;
	border-radius: 50% !important;
}

#div_tab_control_buttons, #div_tab_control_buttons_mobile{
	margin-bottom: 10px;
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
}
#div_tab_control_buttons button, #div_tab_control_buttons_mobile button{
	flex: 1;
	padding-left: 10px;
	padding-right: 10px;
	min-width: 40px;
	border-radius: 0px;
}
#div_tab_control_buttons button img{
	height: 20px;
	aspect-ratio: 1 / 1;
	margin-right: 10px;
}
#div_tab_control_buttons_mobile button img{
	max-height: 25px;
	aspect-ratio: 1 / 1;
}

#div_tab_control_buttons{
	display: flex;
}
#div_tab_control_buttons_mobile{
	display: none;
}
@media screen and (max-width: 1100px){
	#div_tab_control_buttons{
		display: none;
	}
	#div_tab_control_buttons_mobile{
		display: flex;
	}
}

.flex_buttons{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.flex_buttons button{
	flex: 1;
	padding-left: 5px;
	padding-right: 5px;
}
.flex_buttons a{
	flex: 1;
}

#a_edit_activities button{
	margin: 10px 0px;
}

#div_horse_news_text table{
	border-collapse: collapse;
}
#div_horse_news_text table tr td, #div_horse_news_text table tr th{
	border: 1px solid black;
	padding: 5px;
	text-align: left;
}

.td_diary{
	padding: 2px 10px !important;
}

.p_diary_date{
	text-align: left;
	margin: 0px !important;
	padding: 0px;
	font-weight: bold;
}
.p_diary_empty{
	margin: 0px !important;
	padding: 0px;
	text-align: left;
	font-style: italic;
}
.p_diary_entry{
	text-align: left;
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	margin: 5px 0px !important;
	padding: 5px;
	cursor: pointer;
}
.p_diary_entry_GREY{
	border-color: rgb(100, 100, 100);
	background-color: rgb(240, 240, 240);
}
.p_diary_entry_RED{
	border-color: rgb(127, 0, 0);
	background-color: rgb(255, 210, 210);
}
.p_diary_entry_YELLOW{
	border-color: rgb(127, 127, 0);
	background-color: rgb(255, 255, 200);
}
.p_diary_entry_GREEN{
	border-color: rgb(0, 127, 0);
	background-color: rgb(200, 255, 200);
}
.p_diary_entry_CYAN{
	border-color: rgb(0, 127, 127);
	background-color: rgb(200, 255, 255);
}
.p_diary_entry_BLUE{
	border-color: rgb(0, 0, 127);
	background-color: rgb(200, 230, 255);
}
.p_diary_entry_MAGENTA{
	border-color: rgb(127, 0, 127);
	background-color: rgb(240, 220, 255);
}

.p_horse_diary_category{
	padding: 5px;
	border-style: 1px solid black;
	background-color: rgb(50,100,50);
}
.p_calendar_week{
	text-align: left;
	margin: 40px 0px 0px 0px !important;
	padding: 0px;
	font-weight: bold;
}
.p_calendar_current_week{
	text-align: left;
	margin: 0px 0px 0px 0px !important;
	padding: 0px;
	font-weight: bold;
}


#tbl_month_calendar tr th, #tbl_month_calendar tr td{
	width: 14.29%;
}
#tbl_month_calendar tr td{
	vertical-align: top;
	height: 60px;
}
.td_calendar{
	padding: 2px 10px !important;
}
.td_calendar_empty{
	background-color: rgb(160,200,160);
}
.td_calendar_today{
	background-color: rgb(50,150,50);
}
.td_calendar_today .p_month_calendar_date, .td_calendar_today .p_list_calendar_date{
	color: rgb(255,255,255);
}
.p_month_calendar_date{
	text-align: center;
	margin: 0px !important;
	padding: 0px;
	/*font-weight: bold;*/
}
.p_list_calendar_date{
	text-align: left;
	margin: 0px !important;
	padding: 0px;
	/*font-weight: bold;*/
}
.p_list_calendar_entry{
	font-weight: bold;
	text-align: left;
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	margin: 5px 0px !important;
	padding: 5px;
	cursor: pointer;
}
.p_month_calendar_entry{
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	border-style: solid;
	border-width: 1px 1px 1px 5px;
	margin: 5px 0px !important;
	padding: 5px;
	word-break: break-word;
	cursor: pointer;
}
.tr_month_calendar_weekdays{
	display: revert;
}
.tr_month_calendar_weekdays_mobile{
	display: none;
}

@media screen and (max-width: 1000px){
	.p_month_calendar_date{
		font-size: 10px;
	}
	.tr_month_calendar_weekdays{
		display: none;
	}
	.tr_month_calendar_weekdays_mobile{
		display: revert;
	}
	.td_calendar{
		padding: 2px 2px !important;
	}
	.p_month_calendar_entry{
		font-size: 10px;
		text-align: center;
		border-width: 1px 1px 1px 2px;
		margin: 2px 0px !important;
		padding: 2px;
		cursor: pointer;
	}
}


/* LOGIN / REGISTER ------------------------------------------------------- */
#div_login_form, #div_register_form{
	max-width: 300px;
	width: 100%;
}
.small_p form p{
	margin: 0px;
	font-size: 12px;
	text-align: left;
}
.valid_pw{
	color: rgb(50,150,50);
}

/* CONTACT ---------------------------------------------------------------- */
#div_contact_form{
	max-width: 600px;
	width: 100%;
}

/* PROFILE SETTINGS ------------------------------------------------------- */
.img_set_profile_picture{
	margin: auto;
	display: block;
	height: 100%;
	width: 100%;
	max-height: 150px !important;
	max-width: 150px !important;
	cursor: pointer;
	object-fit: cover;
	aspect-ratio: 1 / 1;
	border-radius: 50% !important;
}

.img_profile_picture{
	display: inline-block;
	margin: 5px 10px;
	height: 50px !important;
	width: 50px !important;
	object-fit: cover;
	border-radius: 50% !important;
	cursor: pointer;
}

.img_horse_picture_title{
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 10px;
	height: 50px !important;
	width: 50px !important;
	object-fit: cover;
	border-radius: 50% !important;
	cursor: pointer;
}

#div_lightbox_background{
	display: none;
	pointer-events: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.6);
	z-index: 9999;
}
#div_lightbox_background img{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(90vw, 90vh, 1024px);
	height: min(90vw, 90vh, 1024px);
	object-fit: cover;
}

#div_change_password{
	width: 100%;
}

/* EDIT HORSES ------------------------------------------------------------ */
.p_label_horse_owner{
	color: rgb(255,255,255);
	text-align: center;
	display: inline;
	background-color: rgb(0,150,0);
	border-radius: 30px;
	padding: 3px 10px;
}
.p_label_horse_share{
	color: rgb(255,255,255);
	text-align: center;
	display: inline;
	background-color: rgb(0,150,150);
	border-radius: 30px;
	padding: 3px 10px;
}
.p_label_horse_replace_active{
	color: rgb(255,255,255);
	text-align: center;
	display: inline;
	background-color: rgb(150,150,0);
	border-radius: 30px;
	padding: 3px 10px;
}
.p_label_horse_replace_inactive{
	color: rgb(255,255,255);
	text-align: center;
	display: inline;
	background-color: rgb(150,150,150);
	border-radius: 30px;
	padding: 3px 10px;
}