/* Основные шрифты страницы */
@font-face {
    font-family: 'MainFont'; /*a name to be used later*/
    font-display: swap;
    src: url('https://down-cs.su/fonts/cs_regular.ttf'); /*URL to font*/
}

@font-face {
    font-family: 'HalfLife'; /*a name to be used later*/
    font-display: swap;
    src: url('https://down-cs.su/fonts/Headhumper.ttf'); /*URL to font*/
}

@font-face {
    font-family: 'BlackWolf'; /*a name to be used later*/
    font-display: swap;
    src: url('https://down-cs.su/fonts/GearusBook.otf'); /*URL to font*/
}

/* начальные значения */

body {
	margin: auto;
	padding: 0;
	background:#d1d1d1;
	background-attachment:fixed;
	background-position: center top; 
	color: #cdcdcd;
	font-size:13px;
}

h1{font-family: MainFont;font-size:40px;margin-top:0px;text-transform:uppercase;}
h2{font-family: Tahoma;font-size:20px;margin-top:5px;font-weight: bold;margin-top:0px;margin-bottom:0px;text-transform:uppercase;}
h3{font-family: MainFont;font-size:40px;margin-top:25px;margin-bottom:25px;margin-top:0px;text-transform:uppercase;}
h4{font-family: Tahoma;font-size:20px;margin-top:5px;margin-bottom:15px;font-weight: bold;margin-top:0px;text-transform:uppercase;}
h5{font-family: MainFont;font-size:40px;margin-top:25px;margin-bottom:25px;margin-top:0px;text-transform:uppercase;}

strong{color:#91d0f0;font-weight:normal;font-style:normal;}

.screenshot{width:170px;border: 1px solid #cdcdcd;}
.yt_frame{margin-top:20px;margin-bottom:15px;width:100%;max-width:560px;}

.icon_img{height:22px;margin-right:5px;margin-top:3px;margin-bottom:-4px;margin-left:5px;
  -webkit-filter: drop-shadow(0 0 1px #dedede);
  filter: drop-shadow(0 0 1px #dedede);
}

.notify{width:100%;max-width:490px;
opacity:0.6;
}
.notify:hover{
opacity: 0.9;
}

@media (min-width: 769px) {

.notify2{width:100%;max-width:490px;opacity:0.6;
}
.notify2:hover{
opacity: 0.9;
}

.vertical-menu {float:left;margin-right:20px;margin-left:20px;padding:0;   
width: 250px;
font-weight: bold; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;border-radius: 5px;
}

.logo_holder{background: url(/full_logo.png);	background-attachment:fixed;background-position: center top; height:197px; font-family: MainFont;font-size:70px; text-align:center;}

.logo{display: block; width:646px; margin-left: auto; margin-right: auto; margin-top:-190px;margin-bottom:30px;}

.banner{display: block; width:900px; margin-left: auto; margin-right: auto; margin-top:0px;margin-bottom:12px;opacity: 0.79;}
.banner:hover,.banner:active{opacity: 1.0;}

.ad_holder{display: block; width:1000px; margin-left: auto; margin-right: auto; margin-top:0px;margin-bottom:30px;}
.table {width:1050px; margin-top:-5px;margin-bottom:20px;display: block; margin-left: auto; margin-right: auto;}
.td {font-weight: bold;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:14.1%;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td2 {font-weight: bold;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:47.4%;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td3 {font-weight: bold;margin-top:8px;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:22.45%;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td4 {font-weight: bold;margin-top:0px;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:1024px;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.menu_p{}

.red{color:red}
.white{color:#cdcdcd}
}
@media (max-width: 768px) {

.notify2{width:100%;max-width:490px;margin-bottom:20px;
opacity:0.6;
}
.notify:hover{
opacity2: 0.9;
}

.logo_holder{background: url(/full_logo.png);	background-attachment:fixed;background-position: center top; max-width:600px;height:197px; font-family: MainFont;font-size:70px; text-align:center;margin-bottom:25px;}

.logo{display: block; max-width:550px; margin-left: auto; margin-right: auto; margin-top:-180px;margin-bottom:40px;}

.img_logo{max-width:550px;}

.banner{display: block; max-width:550px; margin-left: auto; margin-right: auto; margin-top:0px;margin-bottom:12px;opacity: 0.79;}
.banner:hover,.banner:active{opacity: 1.0;}

.ad_holder{display: block; max-width:600px; margin-left: auto; margin-right: auto; margin-top:0px;margin-bottom:30px;}
.table {width:578px; margin-top:-5px;margin-bottom:20px;display: block; margin-left: auto; margin-right: auto;}

.td {font-weight: bold;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");width:550px;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td2 {font-weight: bold;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");width:550px;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td3 {font-weight: bold;margin-top:8px;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:550px;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.td4 {font-weight: bold;margin-top:0px;margin-left:2px;margin-right:2px;background-image: url("/cel2.png");display:inline-block;width:550px;padding:5px 10px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;text-align: center;}

.menu_p{margin-top:-14px;}

.red{color:red}
.white{color:#cdcdcd}
}



@media (min-width: 769px) {
.global-wrap{min-width:700px;max-width:1240px; margin: 0 auto;}
.content-wrap{min-width:490px;max-width:1240px;width:100%;}
.inside-wrap{margin-right:20px;background:#272727;margin-left:305px;box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-bottom:15px;padding-left:30px;padding-right:30px;padding-top:30px;padding-bottom:30px;}

.inside-wrap3{margin-right:20px;background:#272727;margin-left:305px;box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-bottom:15px;padding-left:30px;padding-right:30px;padding-top:30px;padding-bottom:30px;}

.inside-wrap2{margin-right:20px;background:#272727;margin-left:305px;box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-bottom:15px;padding-left:30px;padding-right:30px;padding-top:5px;padding-bottom:5px;}

.main_text{color:#cdcdcd;text-align: justify;font-size:16px;}
}
@media (max-width: 768px) {
.global-wrap{width:100%; margin: 0 auto;}
.content-wrap{}
.inside-wrap{background:#272727;width:82%;padding:20px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-left:20px;margin-top:10px;margin-bottom:10px;}

.inside-wrap3{background:#272727;width:82%;padding:20px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-left:20px;margin-top:10px;margin-bottom:30px;padding-top:30px;}

.inside-wrap2{background:#272727;width:82	%;padding:20px; box-shadow: 3px 3px 2px #080808; border-radius: 5px; font-size: 18px;  color:#006ea5;font-family:Tahoma;text-align: center;font-size:20;margin-left:20px;margin-top:10px;margin-bottom:10px;}

.main_text{color:#cdcdcd;text-align: justify;font-size:20px;}
}



.img_but {margin-left:2px;margin-right:2px;display:inline-block;opacity: 0.85}
.img_but:hover,.img_but:active{opacity: 1.0;}

.img_pic {width:19%;margin-left:2px;margin-right:2px;margin-top:5px;margin-bottom:5px;display:inline-block;}

.footer_css{display: block; margin-left: auto; margin-right: auto;}
.footer_css2{display: block; margin-left: auto; margin-right: auto;88px;text-align:center;}
.copyright{color:#cdcdcd;font-size: 12px;font-family:Tahoma;}

a:link {
	color: #7fb7d3;
	text-decoration: none;
}

/* visited link */
a:visited {
	color: #7fb7d3;
	text-decoration: none;
}

/* mouse over link */
a:hover {
	color: #7fb7d3;
	text-decoration: underline;
}

/* selected link */
a:active {
	color: #7fb7d3;
	text-decoration: none;
}

.dropbtn {
    color: #7fb7d3;
    padding: 0px;
    font-size: 16px;
    border: none;
}

@media (min-width: 769px) {
	.dropdown {
	    position: relative;
	    display: inline-block;
	}
}
@media (max-width: 768px) {
	.dropdown {
	    position: relative;
	    display: inline-block;
	    width:100%;
	}
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #2a2a2a;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: #c9c9c9;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {text-decoration: underline;}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    
}

@media (min-width: 769px) {
.comment-text{width:100%;max-width:400px;}
.comment-emoji{width:100%;}
.menu_td2{border-radius:5px;height:31px;width:93%;margin:5px;padding:2px;text-align:left;color:#cdcdcd;background-color:#151515;font-size:16px;border:solid #2a2a2a;border-width:0.1em;}
.menu-wrap{width:250px;height:102%;float:left;}
.menu-box{width:260px;height:100%;background-color:#191919;border-radius:5px;float:left;overflow: hidden;white-space: nowrap;}
.menu_td_top{font-weight:bold;text-transform:uppercase;height:32px;width:96.2%;padding:5px;text-align:left;color:#cdcdcd;background-color:#006ea5;border-radius:5px 5px 0 0;font-size:18px;}
}
@media (max-width: 768px) {
.comment-text{width:30%;max-width:400px;}
.comment-emoji{width:150px;}
.comment-p{margin-left:-450px;}
.menu_td2{border-radius:5px;height:31px;width:96%;margin:5px;padding:2px;text-align:left;color:#cdcdcd;background-color:#151515;font-size:16px;border:solid #2a2a2a;border-width:0.1em;}
.menu_td_top{font-weight:bold;text-transform:uppercase;height:32px;width:97.2%;padding:5px;text-align:left;color:#cdcdcd;background-color:#006ea5;border-radius:5px 5px 0 0;font-size:18px;}
.menu-wrap{width:100%;height:100%;}
.menu-box{width:100%;height:100%;padding-bottom:3px;background-color:#191919;border-radius:5px;}

.vertical-menu {
width:93%;margin-right:20px;margin-left:20px;padding:0;margin-bottom:20px;
text-align:center;
font-weight: bold; font-size: 18px;  color:#7fb7d3;font-family:Tahoma;border-radius: 5px;

}
}
.menu_space{margin-bottom:-12px;}
.menu_title{margin-left:10px;margin-top:4px;}


.menu_td{font-weight:bold;text-transform:uppercase;height:32px;width:100%;padding:5px;text-align:left;color:#cdcdcd;background-color:#d6af16;font-size:16px;}

.menu_td2:hover,.menu_td2:active{color:#f4f4f4;background-color:#006ea5;-webkit-transition:background-color 0.5s ease-out;-moz-transition:background-color 0.5s ease-out;-o-transition:background-color 0.5s ease-out;transition:background-color 0.5s ease-out;

#game-container {
  width: 500px;
  height: 300px;
  border: 1px solid black;
  position: relative;
}

#target {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: red;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}