* {
  box-sizing: border-box !important;
  scrollbar-width: thin;
  scrollbar-color: #90A4AE white;
}
*::-webkit-scrollbar {
  width: 11px;
}
*::-webkit-scrollbar-track {
  background: white;
}
*::-webkit-scrollbar-thumb {
  background-color: #90A4AE;
  border-radius: 6px;
  border: 3px solid white;
}

:root{
  --font-regular: 'Trajan Pro', times;
  --font-decorative: 'Amatic SC', sans-serif;
  --light-gray-bg: #f5f5f5;
  --medium-gray-bg: #eaeaea;
  --darker-gray-bg: #dcdcdc;
  --light-pink: #fce4ea;
  --medium-pink: #f1858b;
}

html {
  scroll-behavior: smooth;
  font-size: 26px;
  font-family: var(--font-decorative);
  font-weight: bold;
}

img{
  max-width: 100%;
}

.message {
  position: fixed;
  bottom: 0;
  text-align: center;
  display: block;
  margin: auto;
  z-index: 100;
  width: 100%;
  padding: 20px 0;
  background: #009882;
  color: white;
  font-family: 'Museo500';
}

.error {
  position: fixed;
  bottom: 0;
  text-align: center;
  display: block;
  margin: auto;
  z-index: 100;
  width: 100%;           
  padding: 20px 0;
  background: #d63636;
  font-family: 'Museo500';
}

.message p, .error p{
  font-size: 1.1rem;
}

body{
  /* overflow-x: hidden; */
}

strong,b,i,em{
  font-weight: bold;
}

h1{
  display: block;
  font-size: 2rem;
  margin-block-start: 0.67em;
  margin-block-end: 0.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.2;
}
h2{
  display: block;
  font-size: 1.75rem;
  margin-block-start: 0.83em;
  margin-block-end: 0.83em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.1;
}
h3{
  display: block;
  font-size: 1.5rem;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.1;
}
h4{
  display: block;
  font-size: 1.25rem;
  margin-block-start: 1.33em;
  margin-block-end: 1.33em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.1;
}
h5{
  display: block;
  font-size: 1.1rem;
  margin-block-start: 1.67em;
  margin-block-end: 1.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.1;
}
h6{
  display: block;
  font-size: 1.05rem;
  margin-block-start: 2.33em;
  margin-block-end: 2.33em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.1;
}
p{
  display: block;
  margin-block-start: .5em;
  margin-block-end: .5em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 1.2;
}
ul{
  display: block;
  list-style-type: none;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 30px;
}
ol{
  display: block;
  list-style-type: decimal;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 1em;
}
li{
  margin-block-start: .2em;
  margin-block-end: .2em;
}
ul li{
  position: relative;
}
ul li::before{
  content: "-";
  font-size: 2em;
  position: absolute;
  left: -.375em;
  top: -0.25em;
}
a{
  text-decoration: none;
  color: var(--medium-pink);
}
.bk{
  color: black;
}
.underline{
  text-decoration: underline;
}

.content-width{
  max-width: 50rem;
  margin: auto;
}
.content-margin{
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
.block-margin{
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.block-padding{
  padding-top: 2rem;
  padding-bottom: 2rem;
}

button, .button{
  display: inline-block;
  font-family: var(--font-decorative);
  font-weight: bold;
  background-color: var(--medium-pink);
  border: 2px solid var(--medium-pink);
  color: white;
  text-decoration: none;
  padding: .4em .6em;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}
button:hover,
.button:hover{
  color: var(--medium-pink);
  background-color: transparent;
}

.header__content{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .5em 0;
}
.header__logo{
  width: 11rem;
}
.header__logo a{
  display: block;
}
.header__logo__img{
  width: 100%;
  height: auto;
  padding: .7rem 0;
}
.menu__content{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}
.menu__item{
  font-size: 1.4rem;
  text-decoration: none;
  margin-left: .5em;
  text-align: center;
}
.resp-menu{
  display: none;
}

.hp-top__upper{
  background-color: var(--light-gray-bg);
}
.hp-top__lower{
  background-color: var(--darker-gray-bg);
}
.hp-top__headline{
  font-size: 2.9rem;
}
.hp-top__subheadline{
  font-size: 2rem;
  margin-bottom: .4em;
}
.hp-top__left{
  width: 60%;
  padding: 1em;
}
.hp-top__upper__content{
  position: relative;
}
.hp-top__upper__img{
  position: absolute;
  right: 0;
  top: -30px;
  width: 40%;
  height: auto;
}
.hp-top__lower__left{
  position: relative;
  display: flex;
  align-items: center;
  overflow: visible;
}
.hp-top__lower__left__content{
  margin-left: 9rem;
  max-width: 14rem;
}
.hp-top__lower__left__img{
  position: absolute;
  left: 0;
  top: -2rem;
  width: 9rem;
  height: auto;
}

.hp-about__headline{
  margin-top: 3em;
  margin-left: 8rem;
}
.hp-about__layout{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-about__left-img{
  width: 36%;
}
.hp-about__right{
  position: relative;
}
.hp-about__right__content{
  display: flex;
  justify-content: space-between;
}
.hp-about__right__par{
  margin: 0;
  padding: 0 2em 2em;
}
.hp-about__right__button{
  white-space: nowrap;
}
.hp-about__right__images{
  position: relative;
}
.hp-about__right__img{
  position: relative;
  left: -2rem;
  width: 65%;
}
.hp-about__right__graphic{
  position: absolute;
  right: 0;
  top: -2rem;
  width: 30%;
}

.info-block__content{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.info-block__img-cover{
  width: 28%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.info-block__img{
  margin: .8rem;
  width: 100%;
  height: auto;
  max-width: 6rem;
}
.info-block__block{
  margin: 1em;
  flex-grow: 1;
}
.info-block__headline{
  font-size: 1.6rem;
}
.info-block__contacts__tel-mail{
  margin: 1em 0;
}
.info-block__contacts__tel-mail__line{
  margin: 0;
}

.footer{
  background-color: var(--medium-gray-bg);
}
.footer__content{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .5em 0;
}
.footer__logo{
  height: auto;
  max-width: 5em;
}
.footer__rights{
  margin-left: 3em;
}
.footer p{
  margin: 0;
}
.footer__fb-link{
  max-width: 5em;
  height: auto;
  margin-left: 2em;
  transition: all .3s;
}
.footer__fb-link:hover,
.footer__fb-link:focus{
  transform: scale(1.02);
  outline: unset;
}
.footer__synapse{
  flex-grow: 1;
  text-align: right;
}


.ug-thumb-wrapper.ug-tile .ug-tile-icon{
  width: 80px;
  height: 80px;
}
.ug-thumb-wrapper.ug-tile .ug-tile-icon.ug-icon-zoom{
  background-image: url('../img/icons/zoom-hw.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}