﻿body {
}

.divMenu {
	width: 100%;
	height: auto;
	padding: 10px 0;
	text-align: center;
	background-color: #e7e5d7;
	overflow: hidden;
	max-width: fit-content;
	margin-left: auto;
	margin-right: auto;
}

.navbar {
	position: relative;
	min-height: 50px;
	margin-bottom: 0px;
	border: 1px solid transparent
}

div.changebackground:hover {
	background-color: lightgray;
}
.config_sections {
	border-top: 3px dotted black;
	width: 100%;
	padding: 2px;
	background-color: ivory;
}
.sgrbutton {
	font-size: 18pt;
	height: 37px;
	background-color: lightblue;
	border-radius: 5px;
	font-family: Times New Roman, Arial, Helvetica, sans-serif;
}

.sgrbuttongreen {
	font-size: 18pt;
	height: 37px;
	background-color: #124a0e;
	border-radius: 5px;
	color: white;
	font-family: Times New Roman, Arial, Helvetica, sans-serif;
}

.sgrbuttonred {
	font-size: 18pt;
	height: 37px;
	background-color: #5d1719;
	border-radius: 5px;
	color: white;
	font-family: Times New Roman, Arial, Helvetica, sans-serif;
}

.sgrboxes {
	border: 1px solid maroon;
	padding: 5px;
	background-color: white;
	box-shadow: 10px 9px 10px 9px #124a0e;
}


.h2 {
	font-size: 20pt;
	font-family: Arial, Helvetica, sans-serif;
}

b {
	font-size: 14pt;
	font-family: Arial, Helvetica, sans-serif;
}

p {
	font-size: 14pt;
	font-family: Arial, Helvetica, sans-serif;
}

li {
	font-size: 14pt;
	font-family: Arial, Helvetica, sans-serif;
}

.text_size {
	font-size: 14pt;
	font-family: Arial, Helvetica, sans-serif;
}

/*=======================================================*/
@media (min-width: 50px) {
	.form_width {
		width: 400px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid black;
		max-width: fit-content;
		margin-left: 0%;
		margin-right: 5%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 300px;
		color: greenyellow;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid greenyellow
	}

	.breeder_herd_inside {
		width: 100%;
		height: 90%;
		border: 1px solid greenyellow;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 125px;
		/*background-color: #e7e5d7;*/
		/*border: 1px solid black;*/
		font-size: 11px;
	}

	.popup_middle {
		width: 100%;
		height: 125px;
		display: flex;
		/*	border: 1px solid greenyellow;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*	border: 1px solid black;*/
		width: 25%;
		margin-left: auto;
		margin-right: auto;
		height: 120px;
	}

	.homepage_h1 {
		font-size: 11px;
	}
}


@media (min-width: 576px) {
	.form_width {
		width: 500px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid black;
		max-width: fit-content;
		margin-left: 0%;
		margin-right: 5%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 500px;
		color: red;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid red
	}

	.breeder_herd_inside {
		width: 90%;
		height: 90%;
		border: 1px solid red;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 170px;
		/*background-color: red;
				border: 1px solid black;*/
		font-size: 17px;
	}

	.popup_middle {
		width: 100%;
		height: 165px;
		display: flex;
		/*border: 1px solid red;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*border: 1px solid black;*/
		width: 27%;
		margin-left: auto;
		margin-right: auto;
		height: 165px;
	}

	.homepage_h1 {
		font-size: 17px;
	}
}

@media (min-width: 768px) {
	.form_width {
		width: 700px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid red;
		max-width: fit-content;
		margin-left: 5%;
		margin-right: 5%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 500px;
		color: yellow;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid yellow
	}

	.breeder_herd_inside {
		width: 90%;
		height: 90%;
		border: 1px solid yellow;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 200px;
		/*background-color: yellow;
					border: 1px solid black;*/
		font-size: 20px;
	}

	.popup_middle {
		width: 100%;
		height: 200px;
		display: flex;
		/*border: 1px solid yellow;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*border: 1px solid black;*/
		width: 25%;
		margin-left: auto;
		margin-right: auto;
		height: 195px;
	}

	.homepage_h1 {
		font-size: 20px;
	}
}

@media (min-width: 992px) {
	.form_width {
		width: 900px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid black;
		max-width: fit-content;
		margin-left: 10%;
		margin-right: 5%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 500px;
		color: blue;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid blue
	}

	.breeder_herd_inside {
		width: 90%;
		height: 90%;
		border: 1px solid blue;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 265px;
		/*background-color: blue;
					border: 1px solid black;*/
		font-size: 28px;
	}

	.popup_middle {
		width: 100%;
		height: 260px;
		display: flex;
		/*border: 1px solid blue;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*border: 1px solid black;*/
		width: 25%;
		margin-left: auto;
		margin-right: auto;
		height: 260px;
	}

	.homepage_h1 {
		font-size: 28px;
	}
}

@media (min-width: 1200px) {
	.form_width {
		width: 900px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid red;
		max-width: fit-content;
		margin-left: 15%;
		margin-right: 5%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 500px;
		color: purple;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid purple
	}

	.breeder_herd_inside {
		width: 90%;
		height: 90%;
		border: 1px solid purple;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 265px;
		/*background-color: purple;
					border: 1px solid black;*/
		font-size: 30px;
	}

	.popup_middle {
		width: 100%;
		height: 260px;
		display: flex;
		/*border: 1px solid purple;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*border: 1px solid black;*/
		width: 25%;
		margin-left: auto;
		margin-right: auto;
		height: 260px;
	}

	.homepage_h1 {
		font-size: 30px;
	}
}

@media (min-width: 1400px) {
	.form_width {
		width: 900px;
	}

	.editor_input_box {
		width: 98%;
		margin-left: 5px;
		margin-right: 5px;
		border-radius: 5px;
	}

	.pge_text {
		width: 45%;
		border: 0px solid black;
		max-width: fit-content;
		margin-left: 30%;
		margin-right: 0%;
	}

	.breeder_herd_outside {
		width: 100%;
		height: 500px;
		color: black;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid orange
	}

	.breeder_herd_inside {
		width: 90%;
		height: 90%;
		border: 1px solid orange;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}

	.popup_outside {
		width: 100%;
		height: 265px;
		/*background-color: #e7e5d7;*/
		/*border: 1px solid black;*/
		font-size: 30px;
	}

	.popup_middle {
		width: 100%;
		height: 260px;
		display: flex;
		/*background-color: #e7e5d7;*/
		/*border: 1px solid #e7e5d7;*/
		margin-left: 30px;
	}

	.popup_inside {
		/*border: 1px solid black;*/
		width: 20%;
		margin-left: auto;
		margin-right: auto;
		height: 260px;
	}

	.homepage_h1 {
		font-size: 30px;
	}
}
