@font-face {
  font-family: 'Social-icons';
  src:  url('/fonts/social_icons/Social-icons.eot?1k8sfg');
  src:  url('/fonts/social_icons/Social-icons.eot?1k8sfg#iefix') format('embedded-opentype'),
    url('/fonts/social_icons/Social-icons.woff2?1k8sfg') format('woff2'),
    url('/fonts/social_icons/Social-icons.ttf?1k8sfg') format('truetype'),
    url('/fonts/social_icons/Social-icons.woff?1k8sfg') format('woff'),
    url('/fonts/social_icons/Social-icons.svg?1k8sfg#Social-icons') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'Social-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-vk:before {
  content: "\e92b";
}
.icon-fb:before {
  content: "\e91d";
}
.icon-twi:before {
  content: "\e929";
}
.icon-gPlus:before {
  content: "\e91e";
}
.icon-ok:before {
  content: "\e922";
}

/* 1. footer */
footer {
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  border-top: 2px solid #d2dbe1;
  padding: 80px 0 60px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #313945;
  background: #ffffff;
  margin: 60px auto 0;
	text-align: center;
	transition: opacity .3s ease-out;
	-webkit-transition: opacity .3s ease-out;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.logo-and-copyright {
	display: inline-block;
	vertical-align: top;
	margin: 0 30px 0 0;
}

.logo.logo--footer {
	    background: url(https://www.ucoz.ru/ucoz/v3/images/logo-ukit.png) no-repeat center;
    background-size: contain;
    width: 172px;
    height: 51px;
    display: block;
    margin: 0;
    margin-bottom: 15px;
}

.copyright {
	display: block;
	text-align: left;
	color: #96999e;
	font-size: 13px;
	-webkit-user-select: auto;
	-moz-user-select: auto;
	-ms-user-select: auto;
	user-select: auto;
}

.footer-menu {
	display: inline-block;
	vertical-align: top;
	text-align: left;
}

.footer-column {
	display: inline-block;
	vertical-align: top;
	padding: 0 44px;
}

.footer-column .footer-column__name {
	color: #222222;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
	margin: 0 0 14px;
	-webkit-user-select: auto;
	-moz-user-select: auto;
	-ms-user-select: auto;
	user-select: auto;
}

.footer-column .footer-column__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer-column .footer-column__list li {
	font-size: 14px;
	margin: 0 0 12px;
}

.footer-column .footer-column__list li:last-child {
	margin: 0;
}

.footer-column .footer-column__list li a {
	color: #444444;
	text-decoration: none;
	transition: color .2s ease;
	-webkit-transition: color .2s ease;
	-webkit-user-select: auto;
	-moz-user-select: auto;
	-ms-user-select: auto;
	user-select: auto;
}

.footer-column .footer-column__list li a:hover,
.footer-column .footer-column__list li a:focus {
	color: #488bfa;
}

/* 2 social buttons */
.social-buttons {
	display: block;
	overflow: hidden;
	margin: 20px 0 0;
}

.social-buttons .social-buttons__button {
	display: block;
	float: left;
	width: 34px;
	height: 34px;
	background: #444444;
	color: #ffffff;
	text-align: center;
	font-size: 20px;
	line-height: 1px;
	margin: 0;
	text-decoration: none;
	transition: background .25s ease;
	-webkit-transition: background .25s ease;
}

.social-buttons .social-buttons__button > i {
	line-height: 34px;
}

.social-buttons .social-buttons__button:first-child {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

.social-buttons .social-buttons__button:last-child {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

.social-buttons .social-buttons__button.social-buttons__button--vk {
	background: #4D75A3;
}

.social-buttons .social-buttons__button.social-buttons__button--vk:hover,
.social-buttons .social-buttons__button.social-buttons__button--vk:focus {
	background: #6a8fb9;
}

.social-buttons .social-buttons__button.social-buttons__button--fb {
	background: #3B5998;
}

.social-buttons .social-buttons__button.social-buttons__button--fb:hover,
.social-buttons .social-buttons__button.social-buttons__button--fb:focus {
	background: #4c70ba;
}

.social-buttons .social-buttons__button.social-buttons__button--tw {
	background: #55ACEE;
}

.social-buttons .social-buttons__button.social-buttons__button--tw:hover,
.social-buttons .social-buttons__button.social-buttons__button--tw:focus {
	background: #83c3f3;
}

.social-buttons .social-buttons__button.social-buttons__button--gp {
	background: #DC4E41;
}

.social-buttons .social-buttons__button.social-buttons__button--gp:hover,
.social-buttons .social-buttons__button.social-buttons__button--gp:focus {
	background: #e4766c;
}

.social-buttons .social-buttons__button.social-buttons__button--ok {
	background: #E67E17;
}

.social-buttons .social-buttons__button.social-buttons__button--ok:hover,
.social-buttons .social-buttons__button.social-buttons__button--ok:focus {
	background: #ec9844;
}

/* 3. media */
@media only screen and (max-width: 1200px), only screen and (max-device-width: 1200px) {

	.intro {
		width: 1000px;
	}

	/* footer */
	.only-desktop {
		display: none;
	}

}

@media only screen and (max-width: 1024px), only screen and (max-device-width: 1024px) {

	.intro {
		width: 800px;
	}

	/* footer */
	.no-low-width {
		display: none;
	}

}

@media only screen and (max-width: 820px), only screen and (max-device-width: 820px) {

	.intro {
		width: 100%;
		margin: 0 auto;
		padding: 0 40px;
	}

	/* footer */
	.no-mobile {
		display: none;
	}

}

@media only screen and (max-width: 640px), only screen and (max-device-width: 640px) {

	.no-low-mobile {
		display: none;
	}

	.logo-and-copyright {
		margin: 0;
	}

}

@media only screen and (max-width: 400px), only screen and (max-device-width: 400px) {

	.intro {
		padding: 0 20px;
	}

}
