*{
	padding: 0;
	margin: 0;
	border: 0;
}
*,*:before,*:after{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
:focus,:active{outline: none;}
a:focus,a:active{outline: none;}

nav,footer,header,aside{display: block;}

html,body{
	height: 100%;
	width: 100%;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
input,button,textarea{font-family:inherit;}

input::-ms-clear{display: none;}
button{cursor: pointer;}
button::-moz-focus-inner {padding:0;border:0;}
a, a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
ul li{list-style: none;}
img{vertical-align: top;}

h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight: 400;}
.JS{position: absolute;}

body{display: flex; align-items: center; justify-content: space-between; flex-direction: column; height: 110%;}

header{width: 80%; height: 70px; display: flex; align-items: center; flex-direction: column;}
ul{height: 70px; width: 100%; display: flex;justify-content: space-evenly;}
.Ul2{display: none; width: 80%;}

li{color: #000; background-color: rgb(245, 245, 245);width: 350px; height: 70px; border: 1px black solid; border-radius: 15px;font-size: 24px; text-align: center; font-family:'Times New Roman', Times, serif; padding-top: 25px; box-shadow: inset 0 0 12px black; transition: all 0.1s ease 0s;overflow: hidden; user-select: none;}
li:hover{box-shadow: inset 0 0 24px black;}
li:active{box-shadow: inset 0 0 36px black;}

#P1,#P5{flex: 0 3 auto; min-width: 80px;}
#P2,#P4{flex: 0 2 auto; min-width: 140px;}
#P3{flex: 0 1 auto; min-width: 200px;}

#PP{flex: 1;}

@media (max-width: 1624px) {#P1,#P5{padding-top: 18px;}}
@media (max-width: 1334px) {#P2,#P4{padding-top: 18px;}}
@media (max-width: 646px) {#P3{padding-top: 18px;}}

@media (max-width: 990px) {header{height: 140px;}
	#P1,#P5{display: none;}
.Ul2{display: flex;}
.Ul2 li{padding-top: 20px;}}

.Body{width: 80%;text-align: center; flex: 1 0 auto; display: flex; align-items: center; justify-content: start; flex-direction: column; padding: 15px;}
.Title{padding-top: 30px; padding-bottom: 30px; width: 100%;}
h1{font-size: 36px; line-height:1}
.Body_Info{height: 320px; overflow: auto; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center;width: 100%;}
.Info{width: 480px;margin: 5px 0;}
h2{font-size:28px; margin-bottom: 18px;}
p{font-size:22px; line-height:1.5; max-width: 1200px; margin: 0 auto;}
.Body_Elements-Box{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; max-width: 1450px; margin: 0 auto; max-height: 600px; overflow: auto;width: 100%;}
.Body_Element{min-width: 260px; min-height: 175px; border: 1px black solid; border-radius: 15px; margin: 12px; box-shadow: inset 0 0 15px black;transition: all 0.1s ease 0s;}
.Body_Element:hover{box-shadow: inset 0 0 30px black;}
.Body_Element:active{box-shadow: inset 0 0 45px black;}

footer{width: 100%; height: 9%; background-color: rgb(150, 150, 150);}

#Menu{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; background-color: rgb(150, 150, 150);}
#Menu li{min-width: 280px; margin: 0 15px; margin-top: 20px; }

@media (max-width:1536px) {#Menu{height: 200%;}}
@media (max-width:776px) {#Menu{height: 400%;}}






