html, body {
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
}
body {
	font-family:'Exo';
	font-size:20px;
	color:#030303;
	background-color:#535353;
}
h1 {
	font-size:42px;
}
h2 {
	font-size:34px;
}
h3 {
	font-size:28px;
}
a, a:hover {
	text-decoration:none;
	font-weight:bolder;
}
.i {
	font-style:italic;
}
#wrap {
	width:95%;
	max-width:960px;
	margin:0px auto;
	background-color:#fcfcfc;
}
#wrap > img {
	width:100%;
	max-width:800px;
	border-radius:75px;
	display:block;
	margin:75px auto 25px auto;
	border:#16c60c solid 3px;
}
#wrap > h1 {
	text-align:center;
	color:#535353;
	margin:0px;
}
.wrapper {
	width:95%;
	max-width:800px;
	margin:0px auto;
}
.wrapper > h2 {
	text-align:center;
	color:#303030;
}
.wrapper > h3 {
	color:#666666;
	text-decoration:underline;
}
.wrapper > p {
	line-height:1.789;
	color:#030303;
}
.wrapper > p > em {
	color:#232323;
}
.wrapper > p > img {
	width:100%;
	max-width:800px;
	border-radius:75px;
}
.wrapper > p > a {
	color:#16c60c;
}
.contacts {
	display:flex;
	align-items:center;
	justify-content:space-around;
	flex-wrap:no-wrap;
}
.contacts > .items {
	width:30%;
	max-width:200px;
	background-color:#535353;
	box-sizing:border-box;
}
.items > a {
	display:block;
	border:#ffffff solid 2px;
	border-radius:15px;
	border:#535353 solid 1px;
	width:190px;
	height:190px;
}
a > .tg {
	background-image:url('../img/tg.png');
	background-position:center center;
	background-size:150px 150px;
	background-repeat:no-repeat;
}
a > .vb {
	background-image:url('../img/vb.png');
	background-position:center center;
	background-size:150px 150px;
	background-repeat:no-repeat;
}
a > .fb {
	background-image:url('../img/fb.png');
	background-position:center center;
	background-size:150px 150px;
	background-repeat:no-repeat;
}
/*** Модалка ***/

.modal-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.6);
      z-index: 9999;
      justify-content: center;
      align-items: center;
      padding: 20px;
    }

    .modal-overlay.active {
      display: flex;
    }

    .modal-window {
      position: relative;
      width: 100%;
      max-width: 520px;
      background: #ffffff;
      border-radius: 16px;
      padding: 30px 24px;
      text-align: center;
      box-shadow: 0 10px 35px rgba(0, 0, 0, 0.25);
      animation: modalFadeIn 0.3s ease;
    }

    .modal-close {
      position: absolute;
      top: 12px;
      right: 16px;
      font-size: 22px;
      font-weight: bold;
      color: #333;
      text-decoration: none;
    }

    .modal-close:hover {
      color: #000;
    }

    .modal-window h2 {
      margin: 0 0 18px;
      font-size: 28px;
	  color:#353535;
    }

    .modal-window img {
      width: 100%;
	  max-width:640px;
	  display:block;
	  margin:5px auto;
      height: auto;
	  border-radius:75px;
    }

    .modal-window p {
      font-size: 16px;
      line-height: 1.5;
      color: #333;
    }

    .modal-links {
      display: flex;
      gap: 12px;
      justify-content: center;
      margin-top: 20px;
      flex-wrap: wrap;
    }

    .modal-links a {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      min-width: 150px;
	  max-width:310px;
      padding: 12px 18px;
      background-color: #353535;
      color: #fff;
      border-radius: 8px;
      text-decoration: none;
      font-weight: 600;
      transition: background 0.2s ease;
    }

    .modal-links a:hover {
      background: #005fa3;
    }

    @keyframes modalFadeIn {
      from {
        opacity: 0;
        transform: translateY(-15px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @media (max-width: 480px) {
      .modal-window {
        padding: 26px 18px;
      }

      .modal-window h2 {
        font-size: 24px;
      }

      .modal-links {
        flex-direction: column;
      }

      .modal-links a {
        width: 95%;
		max-width:310px;
		box-sizing:border-box;
      }
    }