styles.css

h1,h2,h3,h4,h5,h6 {
  padding: 0%;
  margin: 0%;
}
.class1{
  position: inherit;
  width: 100px;
  height: 100px;
  background-color: red
;

}
/* Наложение (фон) */
.overlay {
  /* Высота и ширина зависят от того, как вы хотите показать наложение (см. JS ниже) */   
  height: 100%;
  width: 0;
  position: fixed; /* Оставаться на месте */
  z-index: 1; /* Сидеть на вершине */
  left: 0;
  top: 0;
  background-color: rgb(0,0,0); /* Черный резервный цвет */
  background-color: rgba(0,0,0, 0.9); /*Черный с непрозрачностью */
  overflow-x: hidden; /* Отключить горизонтальную прокрутку */
  transition: 0.5s; /* 0.5 секунды эффект перехода, чтобы скользить в или скользить вниз по наложению (высота или ширина, в зависимости от показа) */
}

/* Расположите содержимое внутри наложения */
.overlay-content {
  position: relative;
  top: 25%; /* 25% сверху */
  width: 100%; /* 100% ширина */
  text-align: center; /* Центрированный текст/ссылки */
  margin-top: 30px; /* 30px верхнее поле, чтобы избежать конфликта с кнопкой закрытия на небольших экранах */
}

/* Навигационные ссылки внутри наложения */
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block; /* Блок дисплея вместо встроенного */
  transition: 0.3s; /* Эффекты перехода при наведении (цвет) */
}

/* При наведении курсора мыши на навигационные ссылки измените их цвет */
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

/* Расположите кнопку закрыть (верхний правый угол) */
.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

/* Если высота экрана меньше 450 пикселей, измените размер шрифта ссылок и снова установите кнопку закрыть, чтобы они не перекрывались */
@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
  }
}


body {
  color: #8f8f8f;
  font: 12px Tahoma, sans-serif;
  background-color: #f8f8f8;
  border-top: 5px solid #7e7e7e;
  margin: 0;
}
input[type="text"] {
  background-color: #f3f3f3;
  border: 1px solid #e7e7e7;
  height: 30px;
  color: #b2b2b2;
  padding: 0 10px;
  vertical-align: top;
}
button {
  color: #fff;
  background-color: #29c5e6;
  border: none;
  height: 32px;
  font-family: 'Oswald', sans-serif;
}
p {
  margin: 20px 0;
}

#wrapper {
  max-width: 960px;
  margin: auto;
}
header {
  padding-left: 20px 0;
  padding-top:  30px 0;
}
form[name="search"] {
  float: right;
}
nav a {
  text-decoration: none;
}

nav ul {
  margin: 0;
  padding: 0;
}

nav li {
  list-style-position: inside;
  font: 14px 'Oswald', sans-serif;
  padding: 10px;
}

.top-menu li {
  display: inline-block;
  padding: 10px 30px;
  margin: 0;
}

.top-menu li.active {
  background: #29c5e6;
  color: #fff;
}

.top-menu a {
  color: #b2b2b2;
}
#heading {
  background: transparent url(../images/h1-bg.png);
  margin: 30px 0;
  padding-left: 20px;
}

h1 {
  display: inline-block;
  color: #7e7e7e;
  font: 40px/40px 'Oswald', sans-serif;
  background: url(../images/bg.png);
  margin: 0;
  padding: 0 0px;
}
aside {
  float: left;
  width: 250px;
}
section {
  margin-left: 280px;
  padding-bottom: 50px;
}
.aside-menu li {
  font-weight: 300;
  list-style-type: square;
  border-top: 1px solid #e7e7e7;
}

.aside-menu li:first-child {
  border: none;
}

.aside-menu li.active {
  color: #29c5e6;
}

.aside-menu a {
  color: #8f8f8f;
}
aside > h2 {
  background: #29c5e6;
  font: 14px 'Oswald', sans-serif;
  color: #fff;
  padding: 10px;
  margin: 30px 0 0 0;
}

aside > p {
  background: #f3f3f3;
  border: 1px solid #e7e7e7;
  padding: 10px;
  margin: 0;
}
blockquote {
  margin: 0;
  background: #29c5e6;
  padding: 10px 20px;
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
}

blockquote p {
  color: #fff;
  font-style: italic;
  font-size: 33px;
  margin: 0;
}

blockquote cite {
  display: block;
  font-size: 20px;
  font-style: normal;
  color: #1d8ea6;
  margin: 0;
  text-align: right;
}
section > h2 {
  background: #29c5e6;
  font: 30px 'Oswald', sans-serif;
  font-weight: 300;
  color: #fff;
  padding: 0 10px;
  margin: 30px 0 0 0;
}
figure figcaption {
  font-size: 16px;
  font-weight: 300;
  margin-top: 5px;
}

figure div {
  font-size: 14px;
  color: #29c5e6;
}

.team-row figure {
  margin-top: 20px;
}

.team-row figure + figure {
  margin-left: 43px;
}
footer {
  background: #7e7e7e;
  color: #dbdbdb;
  font-size: 11px;
}

#footer {
  max-width: 960px;
  margin: auto;
  padding: 10px 0;
  height: 90px;
}
footer a {
  color: #dbdbdb;
}

#sitemap {
  width: 150px;
  float: left;
  margin-left: 20px;
  padding-right: 15px;
}

#sitemap div {
  display: inline-block;
}

#sitemap div + div {
  margin-left: 40px;
}

#sitemap a {
  display: block;
  text-decoration: none;
  font-size: 12px;
  margin-bottom: 5px;
}

#sitemap a:hover {
  text-decoration: underline;
}