@charset "UTF-8";

progress,sub,sup {
vertical-align:baseline
}

button,hr,input {
overflow:visible
}

img,legend {
max-width:100%
}

body,mark {
color:#000
}

.container,.header {
-ms-flex-wrap:wrap
}

button,h1,select {
text-transform:none
}

.container__icons,sub,sup {
position:relative
}

html {
font-family:sans-serif;
line-height:1.15;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%
}

article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary {
display:block
}

audio,canvas,progress,video {
display:inline-block
}

audio:not([controls]) {
display:none;
height:0
}

[hidden],template {
display:none
}

a {
background-color:transparent;
-webkit-text-decoration-skip:objects;
text-decoration:none
}

a:active,a:hover {
outline-width:0
}

abbr[title] {
border-bottom:none;
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}

b,strong {
font-weight:bolder
}

dfn {
font-style:italic
}

mark {
background-color:#ff0
}

small {
font-size:80%
}

sub,sup {
font-size:75%;
line-height:0
}

sub {
bottom:-.25em
}

sup {
top:-.5em
}

img {
border-style:none;
height:auto
}

svg:not(:root) {
overflow:hidden
}

code,kbd,pre,samp {
font-family:monospace,monospace;
font-size:1em
}

figure {
margin:1em 40px
}

hr {
-webkit-box-sizing:content-box;
box-sizing:content-box;
height:0
}

button,input,optgroup,select,textarea {
font:inherit;
margin:0
}

optgroup {
font-weight:700
}

[type=reset],[type=submit],button,html [type=button] {
-webkit-appearance:button
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
border-style:none;
padding:0
}

[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring {
outline:ButtonText dotted 1px
}

fieldset {
border:1px solid silver;
margin:0 2px;
padding:.35em .625em .75em
}

legend {
-webkit-box-sizing:border-box;
box-sizing:border-box;
color:inherit;
display:table;
padding:0;
white-space:normal
}

textarea {
overflow:auto
}

[type=checkbox],[type=radio] {
-webkit-box-sizing:border-box;
box-sizing:border-box;
padding:0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
height:auto
}

[type=search] {
-webkit-appearance:textfield;
outline-offset:-2px
}

[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
-webkit-appearance:none
}

::-webkit-input-placeholder {
color:inherit;
opacity:.54
}

::-webkit-file-upload-button {
-webkit-appearance:button;
font:inherit
}

@font-face {
font-weight:400;
font-family:Roboto;
font-style:normal;
src:url(../fonts/Roboto-Regular.ttf)
}

@font-face {
font-weight:700;
font-family:Roboto;
font-style:normal;
src:url(../fonts/Roboto-Bold.ttf)
}

@font-face {
font-weight:400;
font-family:ElMessiri-Bold;
font-style:normal;
src:url(../fonts/ElMessiri-Bold.ttf)
}

@font-face {
font-weight:400;
font-family:Russo;
font-style:normal;
src:url(../fonts/RussoOne-Regular.ttf)
}

@font-face {
font-weight:400;
font-family:Exo;
font-style:normal;
src:url(../fonts/Exo2-Regular.ttf)
}

@font-face {
font-weight:700;
font-family:Exo;
font-style:normal;
src:url(../fonts/Exo2-Bold.ttf)
}

@font-face {
font-weight:400;
font-family:GoogleSans;
font-style:normal;
src:url(../fonts/googlesans_regular.ttf)
}

body {
margin:0;
padding:0;
font-family:Roboto;
font-size:15px;
font-weight:400;
line-height:23px
}

.wrapper {
width:320px;
margin:0 auto;
background-color:#fff
}

.header {
display:-ms-flexbox;
display:-webkit-box;
display:flex;
flex-wrap:wrap;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
-ms-flex-align:center;
-webkit-box-align:center;
align-items:center
}

.header__left,.header__title {
display:-ms-flexbox;
display:-webkit-box
}

h1 {
font-family:Russo;
margin:5px 0;
font-size:28px;
line-height:24px;
font-weight:100
}

.header__contacts,.header__title-top {
font-family:Russo;
font-size:20px
}

.memo__list,.problem__name {
font-size:17px;
font-weight:700
}

.memo li {
margin-top:5px;
margin-bottom:5px
}

ul {
padding-left: 10px;
}

.problem ul {
 padding-left: 25px;
}

.header__left {
display:flex;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
background-color:#0099da;
background-image: url(../img/mayak.jpg);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
min-height: 60px;
background-position: 0% 45%;
background-size: 175%;
}

.header__title-top {
margin-top:10px;
margin-bottom:10px;
line-height:20px;
color:#fff;
text-shadow: 2px 0px 5px black;
}

.header__title {
display:flex;
-ms-flex-direction:column;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
flex-direction:column;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
text-align:center
}

.container,.header__contacts {
display:-ms-flexbox;
display:-webkit-box
}

.footer,.footer__left {
-webkit-box-orient:horizontal;
-webkit-box-direction:normal
}

.header__contacts {
display:flex;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
-ms-flex-wrap:wrap;
flex-wrap:wrap
}

.header__contacts a {
color:rgba(0,0,0,.7)
}

.header__contacts-mail,.header__contacts-tel {
margin:0
}

.header__right {
border-bottom:1px solid rgba(0,0,0,.1);
border-top:1px solid rgba(0,0,0,.1)
}

.container {
padding-bottom:30px;
display:flex;
flex-wrap:wrap
}

.container__contacts,.nav__list {
display:-ms-flexbox;
display:-webkit-box
}

.container__contacts {
display:flex;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
padding:10px;
width:100%;
font-size:16px;
}

.container__contacts a {
color:#5181B8
}

.nav__item,.nav__item a {
color:#fff
}

.container__contacts-left,.container__contacts-right {
padding-left:70px
}

.container__icons::before {
position:absolute;
left:-46px;
top:-6px;
content:'';
width:32px;
height:32px
}

.container__icons--address::before {
background-image:url(../img/home.svg);
background-repeat:no-repeat
}

.container__icons--tel::before {
background-image:url(../img/phone.svg);
background-repeat:no-repeat
}

.container__icons--email::before {
background-image:url(../img/mail.svg);
background-repeat:no-repeat
}

.container__icons--duty::before {
background-image:url(../img/clock.svg);
background-repeat:no-repeat
}

.container__icons--skype::before {
background-image:url(../img/skype.svg);
background-repeat:no-repeat
}

.container__icons--vk::before {
background-image:url(../img/vk.svg);
background-repeat:no-repeat
}

.container__icons--fb::before {
background-image:url(../img/fb.svg);
background-repeat:no-repeat
}

.container__icons--insta::before {
background-image:url(../img/insta.svg);
background-repeat:no-repeat
}

.container__icons--tg::before {
background-image:url(../img/tg.svg);
background-repeat:no-repeat
}

.container__map {
width:100%;
min-height:400px;
margin-top:30px;
padding-left:10px;
padding-right:10px
}

.nav {
background-color:white;
padding: 1px 0px 2px;
}

.nav__list {
list-style:none;
margin:0;
padding:0;
display:flex;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

.features__title,.nav__item {
display:-ms-flexbox;
display:-webkit-box;
width:100%
}

.nav__item {
display:flex;
-ms-flex-align:center;
-webkit-box-align:center;
align-items:center;
margin-bottom:2px;
margin-right:0;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
background-color: rgba(138, 164, 181, 1);  
border-radius:1px;
flex-grow: 1;   
}

.nav__item:hover {
background-color:#007bda
}

.nav__item__last {
margin-bottom:0
}

.nav__link {
display:block;
font-size:18px;
color:#000;
padding:1px;
width:100%;
text-align:center;
margin-top:4px;
margin-bottom:4px
}

.nav__link:hover {
color:#fff
}

.nav__link--active {
text-decoration:underline;
text-underline-position:under;
text-decoration-thickness: 2px;
border-radius:5px
}

.footer,.foto__left,.mayak,.problem {
background-color: rgba(138, 164, 181, 0.05);
}

.quote {
display:none
}

.mayak {
background-image: url(../img/mayak.jpg);
min-height: 232px;
background-position:40% 70%;
background-size:110%;  
width:100%;  
position:relative;
}

.foto__left {
background-image:url(../img/foto.jpg);
background-size:cover;
min-height:400px;
background-position:100% 43%
}

.hiddenh1 {
visibility:hidden;
position:absolute
}

.features__title {
font-size:25px;
line-height:28px;
font-weight:700;
margin:10px auto 20px;
text-align:center;
font-family:Exo;
display:flex;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center;
-ms-flex-align:center;
-webkit-box-align:center;
align-items:center
}

.features__title--padd {
margin-bottom:15px
}

.features__images {
display:-ms-flexbox;
display:-webkit-box;
display:flex;
-ms-flex-pack:distribute;
justify-content:space-around;
margin-bottom:10px;
-ms-flex-wrap:wrap;
flex-wrap:wrap
}

.features__link {
padding:0 50px;
margin:15px 0;
position:relative;
color:#1091c7;
display:block
}

.features__about,.responds {
display:-ms-flexbox;
display:-webkit-box;
-ms-flex-wrap:wrap
}

.features__about {
display:flex;
flex-wrap:wrap;
width:100%;
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between
}

.features__about-text {
font-size:15px;
padding-right:0;
text-align:justify;
margin-bottom:0
}

.features__about-text h4 {
font-size:17px;
text-align:center
}

.extrawords {
border-top:1px solid #000
}

.footer,.problem__name__withborder {
border-top:1px solid rgba(0,0,0,.1)
}

.problem {
padding:5px 10px;
border:1px solid rgba(0,0,0,.1);
margin-bottom:5px
}

.problem__name {
font-size:20px;
margin:10px 0;
text-align:center
}

.problem__name__withborder {
padding-top:15px
}

.memo {
margin-bottom:30px
}

.responds {
display:flex;
flex-wrap:wrap;
margin:20px 0;
-ms-flex-pack:distribute;
justify-content:space-around;
-ms-flex-align:center;
-webkit-box-align:center;
align-items:center
}

.footer {
display:-ms-flexbox;
display:-webkit-box;
display:flex;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-ms-flex-direction:row;
flex-direction:row;
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between;
padding:10px
}

.footer p {
margin:0
}

.footer__contacts-mail a {
text-decoration:underline
}

.footer__contacts-tel a {
color:#000
}

.footer__logo {
display:none
}

.footer__left {
display:-ms-flexbox;
display:-webkit-box;
display:flex;
-ms-flex-direction:row;
flex-direction:row;
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between
}

@media (min-width:768px) {
.foto__left,.mayak {
background-color:#f8f8ff
}

.wrapper {
width:768px
}

.header {
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between
}

.header__left {
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
-ms-flex-pack:start;
-webkit-box-pack:start;
justify-content:flex-start;
min-height:70px;
background-image: url(../img/mayak.jpg);
background-position: 0% 49%;
background-size: 155%;    
}

.header__contacts {
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
-ms-flex-pack:start;
-webkit-box-pack:start;
justify-content:flex-start;
font-size:20px
}

.header__contacts p {
margin-top:20px;
margin-bottom:20px
}

.header__contacts-tel {
margin-right:30px
}

.header__title {
text-align:left;
padding:0 10px
}

.header__title-top {
font-size:23px;
width:100%;
line-height:23px;
text-shadow: 1px 0px 5px black;
}

h1 {
font-size:34px;
line-height:36px
}

.header__right {
width:100%
}

.background {
min-height:290px;
background-position:50% 15%
}

.container__contacts-left {
margin-right:20px
}

.nav {
padding:5px 0px 2px
}

.nav__item {
width:auto;
margin-bottom:3px;
border-radius:2px;
margin-right:10px;
background-color: #8aa4b5;
}

.nav__item:hover {
background-color: #80909b;
}  
  
.nav__item__last {
margin-right:0
}

.nav__link {
font-size:20px;
font-weight:700;
padding:10px;
padding-top:8px;
padding-left:20px;
padding-right:20px;
margin-top:0;
margin-bottom:0
}

.nav__list {
-ms-flex-wrap:nowrap;
flex-wrap:nowrap;
 }    
  
.quote {
display:block;
font-family:Exo,Arial,sans-serif;
position:absolute;
right:20px;
bottom:-10px;
font-size:18px;
text-align:end;
font-style:italic;
font-weight:600;
color: white;
text-shadow: 1px 0px 5px black;
background-color: rgba(0, 0, 0, 0.05);
}

.features__main,.features__problems {
display:-ms-flexbox;
display:-webkit-box
}

.mayak {
background-image:url(../img/mayak.jpg);
width:100%;
min-height:480px;
background-position:0% 5%;
background-size:100%
}

.features {
margin:0 10px
}

.features__title {
font-size:35px;
line-height:50px
}

.features__title--padd {
margin-top:10px;
margin-bottom:15px
}

.features__about-text {
font-size:16px;
line-height:26px
}

.features__about-text h4 {
font-size:18px;
margin-bottom:0;
text-align:left
}

.problem {
width:45%;
margin-right:5px
}

.features__problems {
display:flex;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-ms-flex-pack:center;
-webkit-box-pack:center;
justify-content:center
}

.features__main {
display:flex;
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
margin-bottom:20px
}

.features__doki {
display:-ms-flexbox;
display:-webkit-box;
display:flex;
-ms-flex-pack:distribute;
justify-content:space-around;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
margin:20px 0;
-ms-flex-align:center;
-webkit-box-align:center;
align-items:center
}

.features__less {
width:55%;
margin-left:10px
}

.foto__left {
background-image:url(../img/fotoplanw.jpg);
background-size:cover;
min-height:613px;
width:43%;
-webkit-align-self:center;
-ms-flex-item-align:center;
-ms-grid-row-align:center;
align-self:center;
background-position: 53% 100%;
}

.features__paper {
width:45%
}

.responds__block {
width:31%;
margin:5px
}

.responds__block__big {
width:48%;
margin:5px
}

.footer {
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between
}

.footer__logo {
margin-right:20px;
display:block
}
  
.container__contacts {
min-height: 600px;    
}

@media (min-width:1200px) {
.wrapper {
width:1200px
}

.header {
flex-wrap:wrap;
-webkit-flex-wrap:wrap;
-ms-flex-wrap:wrap
}

.header__title-top {
font-size:25px;
}      
    
h1 {
font-size:34px;
line-height:36px
}

.background {
min-height:380px;
background-position:50% 20%
}

.container__contacts {
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap;
-ms-flex-pack:distribute;
justify-content:space-around
}

.nav {
padding:5px 0
}

.nav__item {
margin-right:5px;
margin-bottom:0
}

.nav__item__last {
margin-right:0
}

.nav__list {
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between;
}

.quote {
right:30px;
bottom:10px;
font-size:21px;
line-height:26px;
text-align:right;
color: white;
text-shadow: 2px 0px 5px black;
}

.mayak {
background-color:#f8f8ff;
background-image:url(../img/mayak.jpg);
width:100%;
min-height:740px;
background-position: 0% -61px;
background-size:100%
}

.features__main {
-ms-flex-pack:justify;
-webkit-box-pack:justify;
justify-content:space-between
}

.features__doki {
margin:20px 0
}

.features__less {
width:63%;
margin-left:10px
}

.foto__left {
background-image:url(../img/foto.jpg);
background-size:cover;
min-height:590px;
background-position:50% 50%;
width:35%;
-webkit-align-self:center;
-ms-flex-item-align:center;
-ms-grid-row-align:center;
align-self:center;
    
image-rendering: -webkit-optimize-contrast;
image-resolution: from-image;    
}

.features__paper {
width:40%
}

.responds__block {
width:23%
}

.footer {
flex-wrap:nowrap;
-webkit-flex-wrap:nowrap;
-ms-flex-wrap:nowrap
}