@charset "utf-8";
/* CSS Document */
* {
	margin: 0px; padding: 0px
}
header, section, footer, aside, nav, article, figure, figcaption, hgroup {
	display: block
}



#z {
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
	background-color: hsla(239,91%,18%,1.00);
	color: #FFFFFF;
	font-size: 3em;
	height: 1.2em;
	position: absolute;
	width: 100%;
	text-align: center;
	margin-left: 0px;
	margin-top: 0px;
	border-width: 0px;
	min-height: 0px;
}

#z2 {
	position: absolute;
	width: 100%;
	height: 10vw;
	background-color: rgba(7,226,237,1.00);
}

#logo {
	background-image: url(img/EMB.png);
	background-size: cover;
	height: 8vw;
	width: 12vw;
	position: absolute;
	margin-left: 1vw;
	margin-top: 1vw;
	margin-bottom: 1vw;
	margin-right: 1vw;
}

	#dev {
	position: absolute;
	left: 17vw;
	color: #000000;
	width: 35vw;
	height: 8vw;
	text-align: center;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
	font-style: italic;
	font-size: 2.3vw;
	margin-top: 1vw;
	margin-right: 1vw;
	margin-bottom: 1vw;
	margin-left: 1vw;
}

#ss {
	position: absolute;
	right: 1vw;
	width: 38vw;
	height: 6vw;
	top: 2vw;
	bottom: 2vw;
	vertical-align: center;
	text-align: center;
}
		
	.odnoklassniki a:hover {background: #f93; color: #fff;}

.youtube a:hover {background: #c4302b; color: #fff;}
.vk a:hover {background: #5d84ae; color: #fff;}
.vk a:hover {background: #5d84ae; color: #fff;}
.facebook a:hover {background: #3b5998; color: #fff;}
.instagram a:hover {background: #3f729b; color: #fff;}
.social a {
	font-size: 25px;
    text-align: center;
    width: 48px;
    height: 48px;
    float: left;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15), inset 0 0 50px rgba(0,0,0,0.1);
    border-radius: 24px;
    margin: 0 10px 10px 0;
    padding: 6px;
    color: #000;
}


.navi {
	position: absolute;
	top: 15vw;
	height: 5vw;
	width: 100%;
	align: center;
}

#butgl{
	position: absolute;
	left: 1vw;}
	
	#butnew{
	position: absolute;
	left: 23vw;
	
}

#butus{
	position: absolute;
	left: 45vw;
	}
#butcon{
	position: absolute;
	left: 68vw;
	}


a {
  text-decoration: none;
  outline: none;
  display: inline-block;
  padding: 12px 40px;
  margin: 10px 20px;
  border-radius: 30px;
  background-image: linear-gradient(45deg, #6ab1d7 0%, #33d9de 50%, #002878 100%);
  background-position: 100% 0;
  background-size: 200% 200%;
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  font-weight: 300;
  color: white;
  box-shadow: 0 16px 40x 0 rgba(0,40,120,.35);
  transition: .5s;
}
a:hover {
  box-shadow: 0 0 0 0 rgba(0,40,120,0);
  background-position: 0 0;
}


@media screen and (max-width: 1559px) { 
    #z {
    font-size: 2.5rem
    }
		
	@media screen and (max-width: 1279px)  {
    #z {
    font-size: 2rem
    }
		
	@media screen and (max-width: 1079px)  {
    #z {
    font-size: 1.5rem
    }	
    
	@media screen and (max-width: 801px)  {
    #z {
    font-size: 1rem
    }		

		
		@media screen and (max-width: 1559px) { 
    #dev {
    font-size: 2.2vw
    }
		
	@media screen and (max-width: 1279px)  {
    #dev {
    font-size: 2vw
    }
		
	@media screen and (max-width: 1079px)  {
    #dev {
    font-size: 1.5vw
    }	
    
	@media screen and (max-width: 801px)  {
    #dev {
    font-size: 0.8vw
    }