@import url('https://fonts.googleapis.com/css?family=Ubuntu+Condensed');

   
   html {
background-image: url(images/owl.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;

background-size: cover;

}

body
{ background-color: transparent; margin: 1% 37% 5% 8%;}
h1{margin: 3%; }
h2 { color: #a91d11;}
h3 {text-align: justify;}

div {background-color: transparent;}

.menu-main {
  list-style: none;
  margin: 10px 0 5px;
  padding: 5px 0 5px;
  text-align: center;
  font-weight: bold;
  
}
.menu-main li {display: inline-block;}
.menu-main li:after {
  content: "|";
  color: #a91d11;
  display: inline-block;
  vertical-align:top;
}
.menu-main li:last-child:after {content: none;}
.menu-main a {
  text-decoration: none;
  font-family: 'Ubuntu Condensed', sans-serif;
  letter-spacing: 2px;
  position: relative;
  padding-bottom: 10px;
  margin: 0 34px 0 30px;
  font-size: 17px;
 /text-transform: uppercase;
  display: inline-block;
  transition: color .2s;
}
.menu-main a, .menu-main a:visited {color: #a91d11;}
.menu-main a.current, .menu-main a:hover{color:black;}
.menu-main a:before,
.menu-main a:after {
  content: "";
  position: absolute;
  height: 2px;
  top: auto;
  right: 50%;
  bottom: -2px;
  left: 50%;
  background: #fff;
  transition: .8s;
}
.menu-main a:hover:before, .menu-main .current:before {left: 0;}
.menu-main a:hover:after, .menu-main .current:after {right: 0;}   
@media (max-width: 550px) {
.menu-main {padding-top: 0;}
.menu-main li {display: block;}
.menu-main li:after {content: none;}
.menu-main a {
  padding: 20px 10px 20px; 
  margin: 0 40px;
}
}
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
a {
  text-decoration: none;
  font-family: 'Ubuntu Condensed', sans-serif;
  letter-spacing: 2px;
  position: relative;
  padding-bottom: 10px;
  margin: 0 34px 0 30px;
  font-size: 17px;
 /text-transform: uppercase;
  display: inline-block;
  transition: color #a91d11;
}
a:visited {color: #a91d11;}
 a.current, a:hover{color: black;}

footer{
    position: relative;/*относительное позиционирование*/
    width: 100%;/*на всю ширину*/
    padding: 20px 50px;/*поля для контента*/
    /*background: #3586ff;/*цвет футера*/
    display: flex;
    justify-content: center;/*в центре по горизонтали*/
    align-items: center;/*в центре по вертикали*/
    flex-direction: column;
    margin-top: 100px;/*отступ сверху*/
}
footer .wave{
    position: absolute;/*абсолютное позиционирование*/
    top: -100px;
    left: 0;
    width: 100%;
    height: 100px;
   /*background: url(wave.png);/*картинка волны*/
    background-size: 1000px 100px;/*ширина и высота волны*/
}.social,
.menu{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px 0;
    flex-wrap: wrap;/*разрешен перенос на новую строку*/
}
.social li,
.menu li{
    list-style: none;/*удалить черные маркеры*/
}
.social li a {
    font-size: 2em;/*размер иконок*/
    color: #a91d11;/*цвет иконок*/
    margin: 0 10px;
    display: inline-block;/*отображать как строчно-блочный элемент*/
    transition: 0.5s;/*плавный переход*/
}
.menu li a {
    font-size: 1.2em;/*размер ссылок меню*/
    color: #a91d11;/*цвет ссылок меню*/
    opacity: 0.75;/*значение прозрачности*/
    margin: 0 15px;
    text-decoration: none;/*ссылка без подчеркивания*/
    display: inline-block;
}
.menu li a:hover {
    opacity: 1;
}
footer p {
    color: #fff;
    text-align: center;
    margin-top: 15px;
    font-size: 1.1em;
}       

label, input, textarea, button, select{
    font-size: 1.3rem;
    line-height: 1.2
}
 
form {
    width: 30em;
    max-width: 90%;
    margin: 0 auto;
}
 
label {
    margin-bottom: 0.4rem;
    display: block;
}
 
input, textarea {
    padding: 0.4rem;
    width: 100%;
}
 
button {
    margin-top: 2rem;
    background: #a91d11;
    color: #fff;
    border: none;
    padding: 0.6rem;
}