:root {
	--default-text-color: #fff;
	--default-background-color: #00031f;
	--default-logo-color: #78CAFF;
}

body, div {margin: 0; padding: 0; background: var(--default-background-color);}
header {height: 50px; width: 100%; display: flex; justify-content: space-between; color: var(--default-logo-color);}
main {position: relative;margin: auto; margin-top: 60px; display: flex; min-height: calc(100vh - 160px);}
.brain {height: 80vh; width: 80vh; margin: auto;}
.LeftText {width: 30vw; flex-wrap: wrap; display: flex;}
.RightText {width: 30vw; flex-wrap: wrap; display: flex;}
a {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-size: 1.5vw; color: var(--default-text-color); text-decoration: none; width: 20vw; margin: auto; text-align: center;}
footer {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-size: 1vw; color: #A3A3A3; line-height: 50px; margin-left: 1vw}
.logo {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-size: 1.5vw; text-align: center; text-shadow: 1px 1px 2px #7D0FDC; line-height: 30px}
.inf {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-size: 25px; text-shadow: 1px 1px 2px #7D0FDC; text-align: center; margin-left: 50px; margin-top: 1vw}
.unv2 {display: none;}
.unv {height: 90vh; width: 100vw; background-color: rgba(85,85,85,0.3); z-index: 50; position: fixed; top: 10vh; display: block}
.me {height: 20vw; width: 20vw; ; border: solid 5px #7D0FDC; border-radius: 30px; position: absolute; top: 8vw; left: 40vw; z-index: 100; animation: breathing 5s ease-out infinite normal; color: var(--default-text-color)}
.me > div {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; font-size: 1.5vw; text-align: center; margin-top: 5vw; padding: 1vw;}
.up {display:none}
.tema {height: 50px; width: 50px; position: relative; right: 50px; top: 20px; animation: rotateX 5s linear infinite alternate; background-position: center; background-size: cover; box-shadow: 1px 1px 5px #0d67c7; border-radius: 50%; background-image: url("../image/tema1.png") }

.lob:hover, .tem:hover, .zat:hover, .vis:hover, .moz:hover, .moz_telo:hover, .most:hover, .gip:hover, .prom_mozg:hover, .prod_mozg:hover, .sred_mozg:hover {cursor: pointer; text-shadow: 1px 1px 2px #7D0FDC; box-shadow: 3px 3px #008BF0; border-top: solid 1px #008BF0; border-left: solid 1px #008BF0; background-color: rgba(204, 204, 255, 0.3)}
.inf:hover, .tema {cursor: pointer;}


@keyframes rotateX {
  to { transform: rotateX(360deg); }
}


@keyframes breathing {
  0% {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }

  25% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  60% {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }

  100% {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@media screen and (max-width : 1000px){
	main {flex-wrap: wrap; display: flex;}
	.inf {font-size: 20px; margin-left: 10px; margin-top: 10px}
	.logo {margin-left: 7vw; font-size: 10px}
	.brain {width: 90vw; height: 80vw; position: absolute;}
	.lob, .tem, .zat, .vis, .moz, .moz_telo, .most, .gip, .prom_mozg, .prod_mozg, .sred_mozg {position: relative; top: 0; left: 0; width: 80vw; text-shadow: 1px 1px 2px #7D0FDC; box-shadow: 3px 3px #008BF0; border-top: solid 1px #008BF0; border-left: solid 1px #008BF0; background-color: rgba(204, 204, 255, 0.3); margin: auto; text-align: center; padding: 1vw; margin-bottom: 5vw; animation: breathing 5s ease-out infinite normal}
	.LeftText {width: 90vw; margin: auto; margin-top: 90vw}
	.RightText {width: 90vw; margin: auto}
	a {font-size: 5vw; color: var(--default-text-color); width: 90vw}
	footer {font-size: 3vw}
	.me {height: 70vw; width: 70vw; top: 10vw; left: 12vw}
	.me > div {font-size: 5vw; margin-top: 20vw}
	.up {display: block; height: 50px; width: 50px; border: solid 2px #008BF0; box-shadow: 0px 0px 5px #008BF0; font-size: 50px; color: #008BF0; text-align: center; border-radius: 50%; position: fixed; bottom: 20px; right: 20px; z-index: 100}
	.tema {right: 10px; top: 5px; height: 44px; width: 44px}
}