@font-face {
  font-family: 'TildaSans';
  font-style: normal;
  font-weight: 250 300 400 500 600 700 800 900 1000;
  src: url('https://static.tildacdn.com/fonts/tildasans/TildaSans-VF.woff2') format('woff2-variations'),
       url('https://static.tildacdn.com/fonts/tildasans/TildaSans-VF.woff') format('woff-variations');     
}
body {
    margin: 0;
	padding: 0;
    font-size: 100%;
    font-family: 'TildaSans', Arial, sans-serif;
    background-color: #fff;
    text-align: center;
}
header {
    height: 100vh;	
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-repeat: no-repeat;
    top: 0px;
}


.verh, nav ul, .soob, .me, .gallery, .one, .lhr, .otzivi, aside, aside ul, .soc, footer, menu ul {
display: flex;
}
.verh, nav ul, .soob, footer {
align-items: center; 
justify-content: space-around;
}
.verh {background-color: #fff;
flex-wrap: wrap;
} 
a {
    text-decoration: none;
    color: #000000;
}
h1, h2, h4, nav, #excursii, aside h5, footer a {font-weight: 600;}
h1 {font-size: 20px;}
ul {
  list-style: none;
}
ul, .soob, .soc {
  gap: 15px;
}
@media (max-width: 1280px){
h1 {
  order: -1;
  flex: 1 0 100%;
}
nav {
  margin: 15px;
}
ul {
  margin-left: -50px;
}
}
@media (max-width: 600px){
nav {
display: none;
}
}
@media (max-width: 480px){
.soob {
flex-direction: column;
} 
button {
margin: 15px;
} 
}

button, aside h6 {
	font-size: 14px;
}
button {
    border: 3px solid #000000;
    background-color: #ffffff;
	height: 40px;
	width: 220px;
    font-weight: 700;
}

h2 {font-size: 62px; line-height: 1.2;}
header h3 {
    font-size: 40px;
}

header h3, main h4, h5, article ul, aside h3, em, p {
    line-height: 1.5;
	font-weight: 300;
}

@media (max-width: 780px){
h2, header h3 {
color: #ffffff;
text-shadow: 1px 1px 2px #000, 0 0 1em #000, 0 0 0.2em blue;}
}
@media (max-width: 780px){
h2 {
font-size: 36px;
}
header h3 {font-size:30px;}
}
@media (max-width: 480px){
h2 {
font-size: 26px;
}
header h3 {font-size: 24px;}
}

.str {position: absolute;
    bottom: 40px;
    display: inline-block;
    -webkit-transition: all ease-in-out .2s;
    -moz-transition: all ease-in-out .2s;
    -o-transition: all ease-in-out .2s;
    transition: all ease-in-out .2s;
    cursor: pointer;
	animation: t-arrow-bottom 1.7s infinite ease;
}

@media (max-width: 480px){
.str {
    bottom: 10px;
}
}
    
	@-webkit-keyframes t-arrow-bottom{0%,to{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}50%,55%{-moz-transform:translateY(-7px);-ms-transform:translateY(-7px);-webkit-transform:translateY(-7px);-o-transform:translateY(-7px);transform:translateY(-7px)}}
	@keyframes t-arrow-bottom{0%,to{-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}50%,55%{-moz-transform:translateY(-7px);-ms-transform:translateY(-7px);-webkit-transform:translateY(-7px);-o-transform:translateY(-7px);transform:translateY(-7px)}}

article, #otzivi {background-color: #f0f0f0; padding: 15px;}
main h4 {
    font-size: 24px;
}
@media screen and (max-width: 1200px) {
main h4 {
        font-size: 22px;
    }
}
@media screen and (max-width: 640px) {
main h4 {
        font-size: 20px;line-height: 1.4;
    }
}
article h4, main h3, .me h4, main > h4  {line-height: 1.23;}

article h4 {font-size: 38px;}
h5 {	color: #666; font-size: 22px;}
hr {background-color: #ff7b00; height: 3px;max-width: 50px;}
h6 {text-transform: uppercase;}
article ul {
  font-size: 18px;
  margin-left: -50px;
}


main h3 {
font-size: 64px;
}
@media screen and (max-width: 1200px) {
main h3 {
font-size: 60px;
}
}
 
footer {padding: 150px 0;
background-color: #efefef; flex-direction: column; gap: 15px 0;
}
@media screen and (max-width: 480px) {
footer {padding: 90px
}
}
footer a {
font-size: 48px;
    line-height: 1.23;
}
@media screen and (max-width: 1200px) {
footer a {
font-size: 44px;
}
}
@media screen and (max-width: 640px) {
main h3, footer a {
font-size: 30px;
}
}
a[href^="tel:"]:before {
  content: "\260e";
  margin-right: 0.5em;
}

menu {
 margin-left: -20px;
}
menu ul {
flex-direction: row ;
width: 270px; 
}
menu ul li {
width: 90px;
}
menu a {
        font-size: 18px;
    }