@font-face {
    font-family: 'ProbaPro Bold';
    src: url('../fonts_footer/ProbaPro-Bold.eot');
    src: url('../fonts_footer/ProbaPro-Bold.eot') format('embedded-opentype'),
    url('../fonts_footer/ProbaPro-Bold.woff2') format('woff2'),
    url('../fonts_footer/ProbaPro-Bold.woff') format('woff'),
    url('../fonts_footer/ProbaPro-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'ProbaPro Regular';
    src: url('../fonts_footer/ProbaPro-Regular.eot');
    src: url('../fonts_footer/ProbaPro-Regular.eot') format('embedded-opentype'),
    url('../fonts_footer/ProbaPro-Regular.woff2') format('woff2'),
    url('../fonts_footer/ProbaPro-Regular.woff') format('woff'),
    url('../fonts_footer/ProbaPro-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'ProbaPro Light';
    src: url('../fonts_footer/ProbaPro-Light.eot');
    src: url('../fonts_footer/ProbaPro-Light.eot') format('embedded-opentype'),
    url('../fonts_footer/ProbaPro-Light.woff2') format('woff2'),
    url('../fonts_footer/ProbaPro-Light.woff') format('woff'),
    url('../fonts_footer/ProbaPro-Light.ttf') format('truetype');
}

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700');
/*'OpenSans-Light', sans-serif*/

.footer a, .footer .link, .circle, .unit-is {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
}

/************************* common styles *************************/
.footer .holder {
    width: 100%;
    max-width: 1042px;
    margin: 0 auto;
}

.footer .holder:after {
    display: block;
    content: '';
    clear: both;
}

/****************** page *************************/


/******** footer-block *********/
.footer {
    font-family: "ProbaPro Light", sans-serif;
    font-size: 18px;
    padding: 85px 0;
    line-height: 1;
    background: url(../images/20/footer/fon.png) 0 0 no-repeat;
    background-size: cover;
}

.footer-left {
    font-size: 14px;
    line-height: 20px;
}

.footer-left > a {
    font-family: "ProbaPro Light";
    color: #09a3ff;
}

.footer-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.unit-is {
    display: inline-block;
}

.unit-is:hover {
    opacity: 0.7;
}

.footer-right-text {
    font-family: "ProbaPro Light";
    font-size: 12px;
    line-height: 1.2;
    margin-left: 6px;
    color: #000;

}

.foot-top, .foot-bottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.foot-top {
    margin-bottom: 45px;
}

.foot-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.f-social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.foot-icon a:not(:last-of-type) {
    margin-right: 13px;
}

.foot-icon a:hover {
    opacity: 0.7;
}

a.foot-logo {
    margin-right: 38px;
}

.foot-list li {
    margin-bottom: 10px;
}

.foot-list li a {
    display: block;
    color: #000000;
}

.footer-left {
    margin: 35px 0;
}

.foot-item {
}

.f-item5 {
    width: 100%;
    max-width: 480px;
}

.circle {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50px;
    margin-right: 12px;
    /*background-color: #ffffff;*/
    border: 2px solid #009fdf;
}

.foot-list li a:hover {
    color: #e6332a;
}

.foot-list li a:hover .circle {
    border: 2px solid #e6332a;
}

.foot-title {
    font-family: "ProbaPro Bold";
    font-size: 24px;
    margin-bottom: 25px;
    text-transform: uppercase;
}

.foot-logo img {
    width: 230px;
    height: 60px;
}

.f-serve {
    margin-left: 22px;
}

#map {
    width: 250px;
    height: 210px;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
}

/************************* media *************************/

@media screen and (max-width: 1024px) {

    .competition .video {
        width: 500px;
        height: 281px;
    }

    .animatable {
        visibility: visible;
    !important;
        animation: none;
    }

    .holder {
        padding: 0 20px;
    }

    .year {
        /*width: 35%;*/
        margin-left: 0;
        z-index: 12;
    }

    .girl {
        margin-left: -75px;
    }

    .head-wrap .anchors:nth-of-type(2) {
        position: absolute;
        left: 50%;
        right: 330px;
        margin-left: -64px;
    }

    .arror {
        top: 674px;
        margin-left: 287px;
        z-index: 12;
    }

    .hashteg-tv {
        width: 40%;
        margin-left: -337px;
    }

    .head-fon-bottom {
        display: none;
    }

    .header-main {
        margin-top: 0;
        background: url(../images/20/gratter/fon-up-up.png) 0 0 no-repeat;
        background-size: cover;
    }

    .year-20-img-l {
        display: none;
    }

    .circle1 {
        display: none;
    }

    .description {
        padding: 55px;
    }

    /*.year-20-img-l {*/
    /*width: 100%;*/
    /*display: block;*/
    /*position: relative;*/
    /*height: 260px;*/
    /*border-radius: unset;*/
    /*background-size: 125% 125%;*/
    /*}*/
    .year-right {
        margin-left: 0;
    }

    .years-20 .title {
        text-align: center;
    }

    .year-right .title {
        padding-top: 85px;
    }

    .image-block img {
        display: none;
    }

    .years-20 {
        margin-bottom: 85px;
    }

    #map {
        display: none;
    }

    .video-block {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .people-block {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .link {
        white-space: nowrap;
    }

    .gratter-top .bottom, .gratter-top .bottom-2 {
        padding: 55px;
    }

    .gratter-top .bottom-2 {
        padding-top: 0;
    }

    /*.gratter-top .bottom {*/
    /*margin-top: 108px;*/
    /*}*/
    .gratter-top .top-title {
        font-size: 46px;
    }

    .gratter-top .desc {
        font-size: 20px;
    }

    .present-1 img {
        margin-top: 10px;
        width: 280px;
        margin-left: 53px;
    }

    .present-2 img {
        margin-top: 10px;
        margin-left: -99px;
        width: 432px;
    }

    .present-3 img {
        margin-top: 10px;
        width: 323px;
        margin-left: 10px;
    }

    .present-4 img {
        margin-left: -19px;
        width: 352px;
        margin-top: 0;
    }

    .present-title{
        flex-wrap: wrap;
        justify-content: left;
    }

    /*.present-2 img {*/
    /*margin-left: -190px;*/
    /*}*/
    /*.present-3 img {*/
    /*margin-left: -17px;*/
    /*}*/
    /*.present-4 img {*/
    /*margin-left: -49px;*/
    /*margin-top: 0;*/
    /*}*/
    .gratter-top .bottom-3 .title {
        font-size: 46px;
        padding: 0 20px;
    }

    .descr {
        padding: 0 60px;
        line-height: 1.3;
    }

    .bottom-2 .link {
        margin-right: 20px;
    }

    .gratter-top .top {
        text-align: center;
        margin: 0;
        padding: 55px;
    }

    .top-girl {
        display: none;
    }

    .youtube {
        width: 100%;
        height: 100%;
    }

    .person:nth-of-type(6):after,
    .person:nth-of-type(7),
    .person:nth-of-type(8),
    .person:nth-of-type(9),
    .person:nth-of-type(10) {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .competition .video {
        width: 280px;
        height: 156px;
    }
    .link{
        display: none;

    }
    .link.mob{
        display: flex;
        border-bottom: 1px transparent;
        flex-direction: column;
        align-items: center;
    }

    .link.mob > p{
        border-bottom: 1px dashed #00aeef;
    }

    .video-block .video{
        margin-bottom: 15px;
    }

    .g-item-1 .disc,
    .g-item-3 .disc {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .foot-logo img,
    a.foot-logo{
        display: none;
    }

    .gratter-bottom > p {
        line-height: 20px;
        margin-bottom: 5px;
    }

    .gratter-bottom > p:last-of-type {
        margin-bottom: 0;
    }

    /*.mob_present{*/
    /*display: flex;*/
    /*justify-content: center;*/
    /*}*/
    /*.mob_present .count{*/
    /*margin-right: 15px;*/
    /*}*/
    .present .present-right .title {
        margin-bottom: 0;
    }

    .gratter-bottom .connect-hid {
        position: relative;
        width: 280px;
        font-size: 16px;
        line-height: 15px;
        margin-bottom: 10px;
    }

    .header-main {
        height: 500px;
    }

    .girl {
        width: 100%;
        max-width: 245px;
        top: 25px;
        left: 50%;
        margin-left: -116px;
    }

    .year {
        width: 170px;
        top: 385px;
        z-index: 22;
    }

    .arror {
        display: none;
    }

    .hashteg {
        width: 239px;
        top: 260px;
        margin-left: -64px;
        z-index: 21;
    }

    .head-20 {
        max-width: 280px;
        left: 50%;
        margin-left: -136px;
        top: 279px;
        z-index: 20;
    }

    .hashteg-tv {
        display: none;
    }

    .gratter-top {
        margin-bottom: 35px;
        background: #ffffff;
    }

    .gratter-top .top {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        background: url(../images/20/gratter/fon-up-up.png) 0 0 no-repeat;
        background-size: 100% 100%;
    }

    .form {
        width: 280px;
    }

    .form .holder, .form-bottom .holder {
        padding: 20px;
    }

    .submit {
        width: 100%;
    }

    body {
        font-size: 16px;
    }

    /*.year-20-img-l {*/
    /*height: 165px;*/
    /*}*/
    .gratter-top .bottom {
        margin-top: 0;
    }

    .foot-icon {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .foot-logo {
        margin-bottom: 15px;
    }

    .year-right .title {
        padding-top: 35px;
    }

    .years-20 .title,
    .present .title, .competition .title,
    .gratter .title {
        font-size: 34px;
    }
    .gratter-top .bottom-3 .title{
        font-size: 29px;
    }

    .gratter-top .bottom-3 .title,
    .descr {
        padding: 0;
    }

    .gratter-top .descr {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .years-20 .content p,
    .present-right .content {
        margin-top: 5px;
        line-height: 22px;
    }

    .description p {
        line-height: 24px;
    }

    .accordion-hid p:last-of-type {
        margin-bottom: 0;
    }

    .present-right {
        text-align: center;
    }

    .description p, .accordion-hid p,
    .present-right .content {
        margin-bottom: 5px;
    }

    .accordion-hid p {
        font-size: 12px;
        line-height: 15px;
    }

    .description .list > li {
        margin-bottom: 0;
    }

    .g-title {
        text-align: center;
        margin-bottom: 15px;
    }

    .disc {
        font-size: 55px;
        line-height: 24px;
    }

    .bottom > div {
        margin-bottom: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .bottom > div:last-of-type{
        margin-bottom: 0;
    }

    .g-item-1 .spincrement,
    .g-item-3 .spincrement{
        width: 100%;
    }

    .g-item-2 .disc {
        font-size: 22px;
        margin-bottom: 0;
    }

    .g-item-2 .disc .spincrement{
        line-height: 15px;
    }

    .g-item-2 .disc span:not(.spincrement) {
        font-size: 16px;
    }

    .person:nth-of-type(3):after,
    .person:nth-of-type(4),
    .person:nth-of-type(5),
    .person:nth-of-type(6),
    .person:nth-of-type(7),
    .person:nth-of-type(8),
    .person:nth-of-type(9),
    .person:nth-of-type(10) {
        display: none;
    }

    .gratter .title {
        margin: 0 0 20px 0;

    }

    .youtube-block {
        width: 100%;
    }

    .video > img:last-child {
        width: 100%;
    }

    .youtube-block {
        width: 100%;
    }

    .video-block .youtube-play {
        width: 30%;
    }

    .gratter-bottom {
        padding: 35px 0 35px 0;
        font-size: 16px;
    }

    .gratter {
        padding-bottom: 0;
    }

    .years-20 .article,
    .present .present-right {
        margin-bottom: 35px;
    }

    .present .present-right {
        margin-top: 35px;
    }

    .competition,
    .competition .title {
        margin-bottom: 35px;
    }

    .description,
    .gratter-top .bottom-3 {
        padding: 20px;
    }

    .description .list {
        padding: 0;
    }

    .description .list > li {
        line-height: 25px;
    }

    .phone-submenu li > a {
        padding-left: 30px;
    }

    .years-20 {
        margin-bottom: 35px;
    }

    .years-20 .title, .present .title, .competition .title {
        margin-bottom: 15px;
    }

    .present-block > div {
        overflow: hidden;
        position: relative;
    }

    .present-right {
        margin: 0 auto;
    }

    .present-left {
        margin: 0 auto;
        padding: 0;
        max-width: 230px;
        height: 140px;
    }

    .present-left img {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        margin: 0 auto;
    }

    .present-1 img {
        margin-top: 7px;
        /* width: 180px; */
        width: 138px;
        margin-left: 1px;
    }

    .present-2 img {
        margin-top: 7px;
        /* width: 277px; */
        width: 215px;
        margin-left: -75px;
    }

    .present-3 img {
        margin-top: 7px;
        /*margin-left: -49px;*/
        margin-left: -21px;
        /*width: 211px;*/
        width: 161px;
    }

    .present-4 img {
        /*width: 230px;*/
        /*margin-left: -68px;*/
        width: 180px;
        margin-left: -40px;
    }

    .present-title {
        margin-bottom: 0;
        padding-bottom: 25px;
    }

    .present-right .count {
        font-size: 54px;
        position: absolute;
        top: 39px;
        left: 0;
        right: 0;
        bottom: 0;
        margin-left: 169px;
    }

    .present .present-right .title {
        font-size: 24px;
        text-align: center;
    }

    .present-right .title, .present-right .content, .present-right .link {
        margin-left: 0;
        text-align: center;
    }

    .gratter {
        margin-top: 115px;
        padding-top: 0;
    }

    .gratter-top .top-title {
        font-size: 36px;
    }

    .gratter-top .desc {
        font-size: 20px;
        margin-bottom: 10px;
    }

    .gratter-top .top-title,
    .gratter-top .top-text {
        margin-bottom: 10px;
    }

    .gratter-top .top-text {
        font-size: 18px;
    }

    .top-text2 {
        font-size: 12px;
    }

    .bottom {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .g-item-2 .g-title {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    /***************footer**************/
    .footer {
        padding: 35px 0;
    }

    .foot-top, .foot-bottom {
       flex-direction: column-reverse;
        -webkit-box-align: left;
        -ms-flex-align: left;
        align-items: left;
    }

    .foot-item,
    .footer-right{
        margin-bottom: 15px;
    }
    .foot-bottom .foot-item:last-of-type{
        margin-bottom: 5px;
    }
    .foot-bottom .foot-item:nth-of-type(2){
        margin-bottom: 0;
    }
    .foot-top{
        margin-bottom: 0;
    }

    .footer-left {
        margin: 15px 0;
    }

    .foot-title,
    .foot-list li {
        margin-bottom: 10px;
    }

    a.foot-logo {
        margin-right: 0;
        /*padding-bottom: 15px;*/
    }

}