/* Обнуление */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Подключение шрифта */
@font-face {
    font-family: 'Gotham Pro';
    src: url('../fonts/GothamPro.ttf');
}

@font-face {
    font-family: 'Gotham Pro Bold';
    src: url('../fonts/GothamPro-Bold.ttf');
}

@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/gilroy-black.ttf');
}

/* ROOT */
:root {
    --main-color: #106363;
}

/* body */
body {
    padding: 22px 0 20px 0;
    background: #FFFFFF;
    font-family: 'Gotham Pro';
}

body a {
    text-decoration: none;
}

/* header */
header {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 14px auto;
    padding: 0 28px;
    max-width: 1280px;
    align-items: center;
    background-color: #262936;
    border-radius: 15px;
}

header img {
    height: 35px;
    transition: .4s;
}

header img:hover {
    transform: scale(1.03);
}

header ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
}

header ul li {
    padding: 14px 5px;
    font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 11px;
    text-transform: uppercase;
    color: #FFFFFF;
    list-style: none;
    transition: .3s all linear;
    cursor: pointer;
}

header ul li:hover {
    background-color: #262626;
}

header ul li:first-child {
    margin: 0;
}

header ul li a {
    padding: inherit;
    color: inherit;
    text-decoration: none;
}

/* Intro */
.intro {
    display: flex;
    flex-direction: column;
    margin: 14px auto 0 auto;
    padding: 33px 0px;
    max-width: 1280px;

}

.main-intro{

     background: url('../img/pin-up-banner.webp') center left / cover no-repeat;
}


.intro h1 {
    margin: 0 0 15px 0;
    max-width: 876px;
    font-family: 'Gilroy';
    font-style: normal;
    font-weight: 900;
    font-size: 40px;
    line-height: 50px;
    /*text-align: center;*/
    /*align-self: center;*/
    text-transform: uppercase;
    color: #FFFFFF;
    text-shadow: 4px -2px 10px black;
}

.intro h1 span {
    color:#ff2301;
}

.intro p {
    margin: 0 0 30px 0;
    max-width: 876px;
    font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    /*text-align: center;*/
    /*align-self: center;*/
    color: #FFFFFF;
    text-shadow: 4px -2px 10px black;
}

.intro a {
    padding: 23px 45px;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 13px;
    text-align: center;
    align-self: center;
    text-transform: uppercase;
background: #ff2301;

border-radius: 8px;
    color: #FFFFFF;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: .5s;
}

.intro a:hover {
    background: #FFFFFF;
    color: #ff2301;
}

.content {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    padding: 54px 0 45px 0;
    max-width: 1280px;
}

.content h2 {
    margin: 10px 0 15px 0;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
    line-height: 31px;
    text-align: center;
    text-transform: uppercase;
    color: #292929;
}

.content h3 {
    margin: 10px 0 15px 0;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 29px;
    text-align: center;
    text-transform: uppercase;
    color: #292929;
}

.cover {
    margin: 30px auto 0 auto;
    border-radius: 7px;
    width: 200px;
    height: 200px;
    text-align: center;
}

.content h2 span {
    color: #0056B3;
}

.content p,
.content ul li,
.content ol li {
    font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    text-align: center;
    color: #292929;
}

table {
    margin: 30px auto;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0
}

table,
td,
th {
    font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    text-align: center;
    color: #292929;
    border: 1px solid #595959;
}

td,
th {
    padding: 3px;
    width: 30px;
    height: 25px;
}

th {
    background-color: #7accee !important;
}

.content p,
.content ul,
.content ol {
    max-width: 984px;
    margin: 0 auto 15px auto;
    list-style-position: inside;
}

.container-error {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: calc(100vh - 150px);
}

.container-error h3 {
    margin: 0;
    color: #292929;
    font-size: 8em;
    line-height: 150%;
}

.container-error h4 {
    margin: 0;
    color: #ff2301;
    font-size: 6em;
    line-height: 150%;
}

/* footer */
footer {
    max-width: 1280px;
    margin: 0 auto;
    background-color: #262626;
    border-radius: 15px;
}

footer ul {
    display: flex;
    justify-content: center;
    flex-wrap:wrap;
}

footer ul li {
    padding: 27px 5px;
    font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 11px;
    text-transform: uppercase;
    color: #FFFFFF;
    list-style: none;
    transition: .3s all linear;
    cursor: pointer;
}

footer ul li:hover {
    background-color: #ff2301;
}

footer ul li a {
    padding: 25px 9.25px;
    color: inherit;
    text-decoration: none;
}

/*promo style*/
.text-prom {
    color: #fff;
    margin:20px 0;
    text-transform: uppercase;
    font-style: italic;
    /*text-align:center;*/
}
/*.but-prom {*/
/*    max-width:229px;*/
/*    width:100%;*/
/*    color:#fff;*/
/*    padding: 15px 10px;*/
/*    border: 1px solid #ff2301;*/
/*    border-radius:10px;*/
/*    cursor:pointer;*/
/*    text-align: center;*/
/*    margin:20px auto;*/
/*     font-weight: 700;*/
/*    font-size: 14px;*/
/*    line-height: 13px;*/
/*}*/
/*.but-prom:hover {*/
/*    background:#ff2301;*/
/*}*/
.menu__link a {
   color: #292929;;
}
.menu__link a:hover {
    text-decoration: underline;
}
.faq__head, .faq__content {
        font-family: 'Gotham Pro';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    text-align: center;
    color: #292929;
    max-width: 984px;
    margin: 0 auto 15px auto;
}

@media screen and (max-width:600px) {
.text-prom, .but-prom {
font-size:12px;

}
.but-prom {
    width:8%;
}

.faq__head, .faq__content {
    margin: 0 auto 8px auto;
    font-size: 12px;
    line-height: 15px;
}

}


 .button__link {
    position:fixed;
    z-index:1000;
    right: 0%;
    /*bottom: 10px;*/
    bottom: 80px;
    transform: translate(-50%, -50%);
    padding: 15px 45px;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 13px;
    text-align: center;
    align-self: center;
    text-transform: uppercase;
   background: #ff2301;

border-radius: 8px;
    color: #FFFFFF;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: .5s;
     animation: pulse 2s infinite;

         }


@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0.8);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.8);
    box-shadow: 0 0 0 0 rgba(204,169,44, 0.8);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
      box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
      box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}



.promo__link {
    display:flex;
    justify-content: space-between;
    max-width: 500px;
}
.link__pp a {
    display:block;
}
.copy-promo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width:50%;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 19px;
    color:#ff2301;
    background-color:#ffffff;
    border-radius:8px;
    padding:5px 5px 5px 20px;
}

.copy-promo img {
   cursor: pointer;
}

@media screen and (max-width:1000px) {
    .button__link {
    bottom: 0;
     right: 0;
    left: 0;
    top:unset;
    max-width: 800px;
    margin:0 auto;
  transform: none;
      border-radius: 0;
    }
   footer ul li {
       padding:4px 5px 50px 5px !important;
   }
}

@media screen and (max-width:600px)  {
    .promo__link {
        flex-direction:column;
    }
    .copy-promo {
        margin-bottom:15px;
        width:70%;
        justify-content: space-around;
        margin-left:auto;
        margin-right:auto;
        /*max-width:190px;*/
    }
    .promo-code-text {
        font-size:14px;
    }
    .link__pp a {
          margin-left:auto;
        margin-right:auto;
              width:70%;
        padding:12px ;
    /*display: inline;*/
    /*max-width:207px;*/
}
}

.main-image {
    max-width: 984px;
    width:100%;
    border-radius: 20px;
    text-align: center;
    margin: 20px auto;
}

.menu__link li {
    text-transform: lowercase;
}

.block-date {
    background: #F5F5F5;
    border-radius: 8px;
    margin-bottom:40px;
}

.block-date p {
    padding:19px 0;
    margin:auto;
    font-family: 'Gotham Pro Bold';
    font-weight: 700;
    font-size: 18px;
    line-height: 17px;
    text-align: center;
    text-transform: uppercase;
    color: #292929;
}
.block-date p span {
    color:#ff2301;
}

/*expert*/
.block__expert {
    display: flex;
    background-color: #F5F5F5;
    justify-content: space-around;
    /*align-items: center;*/
    border-radius:10px;
    border-left:11px solid #ff2301;
    margin:100px auto;
    padding:20px 15px;
}
.block__expert__data-mobile {
    display:none;
}
.block__expert__text {
    width:80%;
}
.block__expert-name {
    font-family: 'Gotham Pro';
font-style: normal;
font-weight: 800 !important;
font-size: 16px;
line-height: 130%;
text-transform: uppercase;
color: #292D38 !important;
text-align:left !important;
}
.block__expert-prof {
    font-family: 'Gotham Pro';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 130%;
color: #797979 !important;
text-align:left !important;
}
.block__expert-descr {
    text-align:left !important;
}
.block__expert-img img {
    max-width:180px;
    width:90%;
    border-radius:50%;
}


@media screen and (max-width:600px) {
    .block__expert-name, .block__expert-prof{
    display:none;
}
.block__expert__data-mobile {
    display:block;
    margin-left:15px;
}
.block__expert {
       border-left:5px solid #ff2301;
       flex-direction:column;

}
.block__expert__text {
    width:100%;
}
.block__expert-img img {
    max-width:65px;
}
.block__expert-img {
    display:flex;
}
.block__name-mobile {
    font-family: 'Gotham Pro';
font-style: normal;
font-weight: 800 !important;
font-size: 14px !important;
line-height: 17px;
text-transform: uppercase;
color: #292D38 !important;
text-align:left !important;
}
.block__prof-mobile {
    font-family: 'Gotham Pro';
font-style: normal;
font-weight: 400;
color: #797979 !important;
text-align:left !important;
}
.block__expert-descr {
    margin-top:15px !important;
}
}


.main-author {
    text-align:center;
}
.main-author h1 {
    margin:20px auto;
    color:#292929;
}
.main-author p {
    margin:20px auto;
    color:#292929;
}
.main-author img {
    max-width:225px;
}
.content-author {
    padding-top:0 !important;
}

@media screen and (max-width: 600px) {
    .main-author img {
    max-width:125px;
}
.intro-author {
    padding-top: 30px !important;
}
}
.button__social {
    display:block;
    max-width:230px;
    margin:20px auto;
    padding: 15px 45px;
    font-family: 'Gotham Pro Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 13px;
    text-align: center;
    align-self: center;
    text-transform: uppercase;
    background: #ff2301;

    border-radius: 8px;
    color: #FFFFFF;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: .5s;

}

picture {
    text-align:center;
}

/*кукисы*/
#cookie-banner {
  background-color: #ffffff;
  padding: 10px;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  color:#292929;
  display:flex;
justify-content: space-around;
    align-items: center;

}

#accept-cookies {
  background:#ff2301;
  color: white;
  padding: 10px;
  border: none;
  cursor: pointer;
  border-radius: 8px;
}
@media screen and (max-width:1000px){
    #cookie-banner  {
        flex-wrap:wrap;
        bottom: 50px;
    }
}
