@charset "utf-8";
/* CSS Document */

@media (min-width: 1400px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1400px;
    }
}
@media screen  and (max-width:1599px) {
    .decor-images {
        display: none;
    }
}
@media screen  and (min-width:1760px) and (max-width:1919px) {
    #BeforeFooter {
        padding-bottom: 110px !important;
    }
    .decor-left {
        width: 150px;
    }
    .decor-center {
        width: 260px;
    }
    .decor-right {
        width: 150px;
    }
}
@media screen  and (min-width:1680px) and (max-width:1759px) {
    #BeforeFooter {
        padding-bottom: 100px !important;
    }
    .decor-left {
        width: 115px;
        bottom: 15px;
    }
    .decor-center {
        width: 220px;
    }
    .decor-right {
        width: 115px;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 450px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 160px;
    }
}
@media screen  and (min-width:1600px) and (max-width:1679px) {
    #BeforeFooter {
        padding-bottom: 90px !important;
    }
    .decor-left {
        width: 95px;
        bottom: 15px;
    }
    .decor-center {
        width: 200px;
    }
    .decor-right {
        width: 85px;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 400px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 145px;
    }
}
@media screen  and (min-width:1440px) and (max-width:1599px) {
    #BeforeFooter {
        background-size: auto;
        background-image: url(../images/bg-form-get.png);
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 400px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 145px;
    }
}
@media screen  and (min-width:1400px) and (max-width:1439px) {
    .top-site {
        padding: 30px 10px 0;
    }
    #BeforeFooter {
        background-size: auto;
        background-image: url(../images/bg-form-get.png);
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 400px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 145px;
    }
    .custom-header-proj {
        margin: 20px 10px 100px;
    }
}
@media screen  and (min-width:1366px) and (max-width:1399px) {}

@media screen  and (min-width:1280px) and (max-width:1365px) {}

@media screen  and (min-width:1200px) and (max-width:1279px) {}

@media screen  and (min-width:1200px) and (max-width:1399px) {
    body {
        font-size: 14px;
    }
    h1, .h1 {
        font-size: 35px;
    }
    h2, .h2 {
        font-size: 25px;
    }
    h3, .h3 {
        font-size: 21px;
    }
    h4, .h4 {
        font-size: 18px;
    }
    h5, .h5 {
        font-size: 16px;
    }
    h6, .h6 {
        font-size: 14px;
    }
    .btn,
    .link-anch a {
        font-size: 15px;
    }
    .custom-who-we-are .desc-who .row-count .block-count .digit {
        font-size: 35px;
    }
    .monstreak-promo {
        height: 570px;
    }
    .monstreak-promo-girl img {
        width: 450px;
    }
    .custom-news .mod-news ul {
        display: flex;
    }
    #BeforeFooter {
        background-size: auto;
        background-image: url(../images/bg-form-get.png);
    }
    .custom-before-footer .titles-form .big-title {
        font-size: 95px;
    }
    .footer-logo a img {
        width: 155px;
    }
    .footer-info .img-footer img {
        height: 155px;
    }
    .custom-techno .blocks-tech .block-tech .img img {
        width: 45px;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 300px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 120px;
    }
    .custom-header-proj .wrap-header {
        height: 500px;
    }
    .custom-header-proj .img-header-desktop img {
        width: 450px;
    }
    .custom-portal {
        height: 500px;
    }
}
@media screen  and (max-width:1199px) {
    body {
        font-size: 13px;
    }
    h1, .h1 {
        font-size: 25px;
    }
    h2, .h2 {
        font-size: 20px;
    }
    h3, .h3 {
        font-size: 17px;
    }
    h4, .h4 {
        font-size: 15px;
    }
    h5, .h5 {
        font-size: 15px;
    }
    h6, .h6 {
        font-size: 13px;
    }
    .btn,
    .link-anch a {
        font-size: 13px;
        font-weight: 600;
        height: 50px;
    }
    .top-site {
        padding: 15px 15px 0;
    }
    .logo a img {
        width: 145px;
    }
    .white-page .call-burger svg path {
        stroke: #212121;
    }
    .call-burger svg {
        width: 44px;
        height: 30px;
    }
    .breadcrumb {
        margin: 15px 0;
    }
    /*------- offcanvas ------*/
    .offcanvas-header {}
    .offcanvas-header .btn-close {
        background-image: none;
        opacity: 1;
        width: auto;
        height: auto;
        padding: 0;
    }
    .offcanvas-header .btn-close i {
        color: #ffffff;
        font-size: 60px;
    }
    .offcanvas-header a.brand-logo img {
        width: 145px;
    }
    .offcanvas-body {
        display: flex;
        align-items: center;
        justify-content: center;
        display: flex;
        flex-direction: column;
    }
    .offcanvas-body .mob-menu {
        height: 100%;
        display: flex;
        align-items: center;
    }
    .offcanvas-body .mob-menu ul {
        display: block;
    }
    .offcanvas-body .mob-menu ul li {
        line-height: 2;
        text-align: center;
    }
    .offcanvas-body .mob-menu ul li a {
        color: #ffffff;
        font-size: 20px;
        font-weight: 600;
        text-transform: uppercase;
    }
    .offcanvas-body .mob-menu ul li.active a {
        text-decoration: underline;
    }
    .offcanvas-body .offcanvas-bottom {
        margin-top: auto;
    }
    /*--------- pagination ----------*/
    .pagination .page-link,
    .pagination .page-item.active .page-link,
    .pagination .page-link:hover {
        width: 30px;
        height: 30px;
        padding: 0;
    }
    /*------- BeforeFooter --------*/
    #BeforeFooter {
        background-image: none !important;
    }
    /************ goTop **********/
    #goTop {
        padding: 2px 10px;
        bottom: 60px;
        right: 15px;
    }
    #goTop i {
        font-size: 28px;
    }
}
@media screen  and (min-width:992px) and (max-width:1199px) {
    /********** home ***********/
    /*------- header ----------*/
    /*-------- UnrealEngine ---------*/
    /*-------- WhoWeAre --------*/
    .custom-who-we-are .desc-who .row-count .block-count .digit {
        font-size: 35px;
    }
    /*-------- MonstreakPromo ------*/
    .monstreak-promo {
        height: 470px;
    }
    .monstreak-promo-content {
        padding: 145px 0 0 45px;
    }
    .monstreak-promo-girl img {
        width: 330px;
    }
    /*------ NowLooks ---------*/
    .custom-looks .desc-looks .block-looks .wrap {
        padding: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img {
        flex: 0 0 75px;
        margin-right: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img img {
        width: 75px;
        height: 75px;
    }
    /*-------- WeDo ---------*/
    .custom-we-do .h2 {
        margin: 30px 0;
    }
    /*-------- WhyChoose ------*/
    .custom-why-choose .row-top-choose {
        margin-bottom: 50px;
    }
    .custom-why-choose .row-bottom-choose .wrap {
        height: 190px;
    }
    /*-------- News -----------*/
    .custom-news .mod-news ul {
        display: flex;
    }
    /*-------- Before Footer ---*/
    .custom-before-footer .titles-form .big-title {
        font-size: 80px;
    }
    /********* footer *********/
    .footer-logo a img {
        width: 130px;
    }
    .footer-info .img-footer img {
        height: 120px;
    }
    /******** content **********/
    /*------- page services --*/
    .custom-blocks-servs .block-serv .wrap {
        height: 250px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 95px;
    }
    /*------ page about -------*/
    .custom-techno .blocks-tech .block-tech .img img {
        width: 45px;
    }
    .custom-about-why .desc-why .h2 {
        margin-bottom: 20px;
    }
    .custom-about-why .desc-why .block-why .wrap {
        padding: 15px;
        height: 150px;
    }
    /*-------- contacts ---------*/
    .item-contacts-page .form-cont .include-form .cf-form-wrap .confid {
        font-size: 14px;
    }
    #contact-map {
        height: 450px;
    }
    /******** pages projects *****/
    /*------ page monstreak ------*/
    .custom-header-proj {
        margin: 20px 15px 60px;
    }
    .custom-header-proj .wrap-header {
        height: auto;
    }
    .custom-header-proj .titles .wrap {
        padding: 30px 0;
    }
    .custom-header-proj .titles .wrap .play-now {
        margin-top: 20px;
    }
    .custom-header-proj .titles .wrap .play-now .link-play a img,
    .custom-play-now .wrap .play-now .link-play a img {
        width: 180px;
    }
    .custom-header-proj .img-header-desktop img {
        width: 290px;
    }
    .custom-portal {
        height: 410px;
    }
    /*------- blog -----------*/
    .blog,
    .blog-item-content {
        padding-bottom: 60px;
    }
    /*------ blog-item-content -----*/
    /*-------- modal ----------*/
    .form-modal-dialog .modal-body .include-form .cf-form-wrap .confid {
        font-size: 14px;
    }
    /*-------- other ----------*/
}
@media screen  and (min-width:768px) and (max-width:991px) {
    /********** home ***********/
    /*------- header ----------*/
    /*-------- UnrealEngine ---------*/
    /*-------- WhoWeAre --------*/
    .custom-who-we-are .img-who {
        text-align: center;
        margin-bottom: 25px;
    }
    .custom-who-we-are .desc-who .row-count .block-count .digit {
        font-size: 35px;
    }
    /*-------- MonstreakPromo ------*/
    .monstreak-promo {
        height: 400px;
    }
    .monstreak-promo-content {
        padding: 110px 0 0 35px;
        width: 50%;
    }
    .monstreak-promo-girl img {
        width: 300px;
    }
    /*------ NowLooks ---------*/
    .custom-looks .img-looks {
        margin-bottom: 25px;
    }
    .custom-looks .desc-looks .block-looks .wrap {
        padding: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img {
        flex: 0 0 75px;
        margin-right: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img img {
        width: 75px;
        height: 75px;
    }
    /*-------- WeDo ---------*/
    .custom-we-do .h2 {
        margin: 25px 0;
    }
    /*-------- WhyChoose ------*/
    .custom-why-choose .row-top-choose .titles-choose {
        margin-bottom: 25px;
    }
    .custom-why-choose .row-top-choose {
        margin-bottom: 50px;
    }
    .custom-why-choose .row-bottom-choose .wrap {
        height: 190px;
    }
    /*-------- News -----------*/
    .custom-news .titles {
        margin-bottom: 25px;
    }
    .custom-news .titles .h1 {
        margin-bottom: 8px;
    }
    .custom-news .mod-news ul {
        display: flex;
    }
    .custom-news .desc-teaser {
        bottom: 0;
        left: 15px;
    }
    /*-------- Before Footer ---*/
    .custom-before-footer .titles-form {
        margin-bottom: 30px;
    }
    .custom-before-footer .titles-form .big-title {
        font-size: 60px;
    }
    /********* footer *********/
    .footer-logo a img {
        width: 100px;
    }
    .footer-info .img-footer img {
        height: 120px;
    }
    .copyright-section .copyright {}
    .copyright-section .privacy ul {
        justify-content: flex-start;
    }
    /******** content **********/
    /*------- page services --*/
    .custom-header-sm-bl .title h1 br {
        display: none;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 250px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 95px;
    }
    /*------ page about -------*/
    .custom-about-what .desc-what .head {
        margin-bottom: 20px;
    }
    .custom-about-what .img-what {
        text-align: center;
    }
    .custom-techno .blocks-tech .block-tech .img img {
        width: 45px;
    }
    .custom-about-why .desc-why .h2 {
        margin-bottom: 20px;
    }
    .custom-about-why .desc-why .block-why .wrap {
        padding: 15px;
        height: 150px;
    }
    /*-------- contacts ---------*/
    .item-contacts-page .block-cont .wrap {
        padding: 30px;
    }
    .item-contacts-page .desc-cont {
        margin-bottom: 30px;
    }
    .item-contacts-page .desc-cont .block-address,
    .item-contacts-page .desc-cont .block-mail {
        margin-bottom: 20px;
    }
    .item-contacts-page .form-cont .include-form .cf-form-wrap .confid {
        font-size: 13px;
    }
    #contact-map {
        height: 350px;
    }
    /******** pages projects *****/
    /*------ page monstreak ------*/
    .custom-header-proj {
        margin: 20px 15px 60px;
    }
    .custom-header-proj .wrap-header {
        height: auto;
    }
    .custom-header-proj .titles .wrap {
        padding: 30px 0;
    }
    .custom-header-proj .titles .wrap .play-now {
        margin-top: 20px;
    }
    .custom-header-proj .titles .wrap .play-now .link-play a img,
    .custom-play-now .wrap .play-now .link-play a img {
        width: 180px;
    }
    .custom-header-proj .img-header-mob {
        text-align: center;
    }
    .custom-header-proj .img-header-mob img {
        width: 290px;
    }
    .custom-seo-proj .img-seo,
    .custom-portal .img-port {
        text-align: center;
    }
    .custom-portal {
        height: auto;
    }
    .custom-companion .block-compan .img img {
        width: 100%;
    }
    /*------- blog -----------*/
    .blog,
    .blog-item-content {
        padding-bottom: 60px;
    }
    /*------ blog-item-content -----*/
    /*-------- modal ----------*/
    .form-modal-dialog .modal-body .include-form .cf-form-wrap .confid {
        font-size: 13px;
    }
    /*-------- other ----------*/
}
@media screen  and (max-width:767px) {
    /********** home ***********/
    /*------- header ----------*/
    /*-------- UnrealEngine ---------*/
    /*-------- WhoWeAre --------*/
    .custom-who-we-are .img-who {
        text-align: center;
        margin-bottom: 25px;
    }
    .custom-who-we-are .desc-who .row-count .block-count .digit {
        font-size: 35px;
    }
    /*-------- MonstreakPromo ------*/
    .monstreak-promo {
        height: auto;
    }
    .monstreak-promo-content {
        padding: 25px 0 25px 15px;
        width: 100%;
    }
    .monstreak-promo-girl {
        position: relative;
        right: auto;
        text-align: center;
    }
    .monstreak-promo-girl img {
        width: 290px;
        margin: 0 auto;
    }
    /*------ NowLooks ---------*/
    .custom-looks .h1 {
        margin-bottom: 15px;
    }
    .custom-looks .img-looks {
        margin-bottom: 25px;
    }
    .custom-looks .desc-looks .block-looks .wrap {
        padding: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img {
        flex: 0 0 60px;
        margin-right: 10px;
    }
    .custom-looks .desc-looks .block-looks .wrap .img img {
        width: 60px;
        height: 60px;
    }
    .custom-looks .desc-looks .block-looks .wrap .text .h4 {
        margin-bottom: 0;
    }
    /*-------- WeDo ---------*/
    .custom-we-do .h2 {
        margin: 25px 0;
    }
    .custom-we-do .block-we-do .img {
        text-align: center;
    }
    /*-------- WhyChoose ------*/
    .custom-why-choose .row-top-choose .titles-choose {
        margin-bottom: 25px;
    }
    .custom-why-choose .row-top-choose {
        margin-bottom: 50px;
    }
    .custom-why-choose .row-bottom-choose .wrap {
        height: 165px;
        padding: 15px;
    }
    .custom-why-choose .row-bottom-choose .wrap .img {}
    /*-------- News -----------*/
    .custom-news .titles {
        margin-bottom: 25px;
    }
    .custom-news .titles .h1 {
        margin-bottom: 8px;
    }
    .custom-news .mod-news ul {
        display: flex;
    }
    .custom-news .desc-teaser {
        bottom: 0;
        left: 15px;
    }
    /*-------- Before Footer ---*/
    .custom-before-footer .titles-form {
        margin-bottom: 15px;
    }
    .custom-before-footer .titles-form .big-title {
        font-size: 42px;
    }
    .form-get .include-form .cf-form-wrap .confid {
        text-align: center;
    }
    /********* footer *********/
    .footer-main {
        padding: 40px 0;
    }
    .footer-logo a img {
        width: 80px;
    }
    .footer-info .img-footer img {
        height: 100px;
    }
    .copyright-section .copyright {}
    .copyright-section .privacy ul {
        justify-content: flex-start;
    }
    /******** content **********/
    /*------- page services --*/
    .custom-header-sm-bl .title h1 br {
        display: none;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 250px;
        padding: 15px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {
        width: 85px;
    }
    /*------ page about -------*/
    .custom-about-what .desc-what .head {
        margin-bottom: 20px;
    }
    .custom-about-what .img-what {
        text-align: center;
    }
    .custom-techno .blocks-tech .block-tech .img img {
        width: 45px;
    }
    .custom-about-why .desc-why .h2 {
        margin-bottom: 20px;
    }
    .custom-about-why .desc-why .block-why .wrap {
        padding: 15px;
        height: 150px;
    }
    /*-------- contacts ---------*/
    .item-contacts-page .page-header {
        margin-bottom: 15px;
    }
    .item-contacts-page .row-data {
        padding-bottom: 40px;
    }
    .item-contacts-page .block-cont .wrap {
        padding: 15px;
    }
    .item-contacts-page .desc-cont {
        margin-bottom: 30px;
    }
    .item-contacts-page .desc-cont .block-info .wrap-info .desc-info .h5 {
        margin-bottom: 3px;
    }
    .item-contacts-page .desc-cont .block-address,
    .item-contacts-page .desc-cont .block-mail {
        margin-bottom: 20px;
    }
    .item-contacts-page .form-cont .include-form .cf-form-wrap .confid {
        font-size: 13px;
    }
    #contact-map {
        height: 300px;
    }
    /******** pages projects *****/
    /*------ page monstreak ------*/
    .custom-header-proj {
        margin: 20px 15px 40px;
    }
    .custom-header-proj .breadcrumb {
        padding: 15px 0 0;
    }
    .custom-header-proj .wrap-header {
        height: auto;
    }
    .custom-header-proj .titles .wrap {
        padding: 15px 0;
    }
    .custom-header-proj .titles .wrap .play-now {
        margin-top: 20px;
    }
    .custom-header-proj .titles .wrap .play-now .link-play a img,
    .custom-play-now .wrap .play-now .link-play a img {
        width: 180px;
    }
    .custom-header-proj .img-header-mob {
        text-align: center;
    }
    .custom-header-proj .img-header-mob img {
        width: 290px;
    }
    .custom-seo-proj .img-seo,
    .custom-portal .img-port {
        text-align: center;
    }
    .custom-look-game .h1,
    .custom-companion .h1 {
        margin-bottom: 15px;
    }
    .custom-portal {
        height: auto;
        padding: 15px;
    }
    .custom-companion .block-compan .img img {
        width: 100%;
    }
    .custom-play-now .wrap .play-now {
        left: 15px;
        bottom: 15px;
    }
    /*------- blog -----------*/
    .blog,
    .blog-item-content {
        padding-bottom: 40px;
    }
    /*------ blog-item-content -----*/
    /*-------- modal ----------*/
    .form-modal-dialog .modal-body .include-form .cf-form-wrap .confid {
        font-size: 13px;
    }
    /*-------- other ----------*/
}
@media screen  and (max-width:575px) {
    .custom-who-we-are .desc-who .row-count .block-count {
        flex: 1 0 0;
    }
    .custom-why-choose .row-bottom-choose .wrap {
        height: 100%;
    }
    .custom-why-choose .row-bottom-choose .wrap .img {
        margin-bottom: 6px;
    }
    .custom-news .mod-news ul {
        display: grid;
    }
    .footer-info .img-footer img {
        height: 80px;
    }
    .copyright-section .privacy ul {
        display: block;
    }
    .copyright-section .privacy ul li {
        display: inline-block;
        margin-right: 10px;
    }
    .custom-about-why .desc-why .block-why .wrap {
        height: 100%;
    }
    .custom-about-why .desc-why .block-why .wrap .img {
        margin-bottom: 6px;
    }
    .custom-blocks-servs .block-serv .wrap {
        height: 100%;
    }
    .custom-blocks-servs .block-serv .wrap .img {
        margin-bottom: 10px;
    }
    .custom-blocks-servs .block-serv .wrap .img img {}
    .custom-play-now .wrap .play-now {
        position: relative;
        left: 0;
        bottom: 0;
        margin-top: 15px;
    }
}