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

@media screen  and (min-width:1200px) and (max-width:1430px) {
    .free-consult a {
        font-size: 185%;
    }
    .slogan-site .slogan h1 {
        font-size: 670%;
        letter-spacing: 6px;
    }
    .slogan-site .slogan {
        background-size: 100% 100%;
    }
    .slogan-site span {
        font-size: 160%;
    }
    .wrap-2-promo-block {
        height: 160px;
    }
    .img-promo-block {
        margin-right: 0;
    }
    .img-promo-block img {
        max-width: 80%;
    }
    .left-promo-block .wrap-2-promo-block p {
        padding-top: 26px;
    }
    .promo-block p {
        font-size: 150%;
    }
    .top-we-work .title-we-work h1 {
        font-size: 520%;
    }
    .top-we-work .small-desc-we-work p {
        font-size: 125%;
        line-height: 1.2;
    }
    .bottom-we-work .block-desc-we-work .title-block-desc-we-work h3 {
        font-size: 185%;
    }
    .bottom-we-work .block-desc-we-work p {
        font-size: 105%;
        line-height: 1.2;
    }
    .hidden-big-portfolio h2 {
        margin-top: 90px;
    }
    .hidden-big-portfolio a {}
    .hidden-small-portfolio h2 {
        font-size: 168%;
        margin-bottom: 4px;
        margin-top: 6px;
    }
    .hidden-small-portfolio p {
        font-size: 155%;
        line-height: 1.1;
        padding-left: 20px;
        padding-right: 20px;
    }
    .hidden-small-portfolio a {
        margin-top: 20px;
        height: 50px;
        font-size: 130%;
        padding-top: 12px;
        width: 230px;
    }
    .package-offers h3 {
        margin-top: 70px;
    }
    .block-package-offers .price-package-offers {
        font-size: 235%;
    }
    .title-our-clients h2 {
        font-size: 400%;
    }
    #carousel-example-generic1 .carousel-inner .item .col-lg-3 {
        width: 23%;
    }
    #carousel-example-generic1 .carousel-inner > .item {
        padding-left: 94px;
    }
    .block-choose-present .wrap-choose-present-1 h3,
    .block-choose-present .wrap-choose-present-2 h3,
    .block-choose-present .wrap-choose-present-3 h3 {
        font-size: 230%;
    }
    .block-choose-present .wrap-choose-present-1 p,
    .block-choose-present .wrap-choose-present-2 p,
    .block-choose-present .wrap-choose-present-3 p {
        font-size: 170%;
    }
    .block-choose-present .wrap-choose-present-1 .give-present a,
    .block-choose-present .wrap-choose-present-2 .give-present a,
    .block-choose-present .wrap-choose-present-3 .give-present a {
        width: 90%;
    }
    .block-choose-present .bg-choose-present-2 {
        background-position: -24px bottom;
        width: 430px;
    }
    .block-choose-present .wrap-choose-present-1 {
        width: 360px;
        padding-left: 104px;
    }
    .block-choose-present .wrap-choose-present-2 {
        padding-left: 64px;
    }
    .block-choose-present .bg-choose-present-3 {
        width: 396px;
    }
    .block-choose-present .wrap-choose-present-3 {
        padding-left: 74px;
        padding-right: 14px;
    }
    .block-choose-present .wrap-choose-present-3 p {
        margin-bottom: 130px;
    }
}
@media screen  and (min-width:992px) and (max-width:1199px) {
    .free-consult a {
        font-size: 185%;
    }
    .slogan-site .slogan h1 {
        font-size: 600%;
        letter-spacing: 0;
        line-height: 0.9;
    }
    .slogan-site .slogan {
        background-size: 100% 100%;
    }
    .slogan-site .slogan p {
        font-size: 205%;
    }
    .slogan-site span {
        font-size: 130%;
    }
    .wrap-2-promo-block {
        height: 160px;
    }
    .promo-block h2 {
        font-size: 210%;
    }
    .promo-block p {
        font-size: 135%;
    }
    .img-promo-block img {
        max-width: 80%;
    }
    .top-we-work .title-we-work h1 {
        font-size: 425%;
    }
    .top-we-work .small-desc-we-work p {
        font-size: 125%;
    }
    .bottom-we-work .block-desc-we-work .title-block-desc-we-work h3 {
        font-size: 150%;
    }
    .bottom-we-work .block-desc-we-work p {
        font-size: 85%;
        line-height: 1.2;
        font-weight: 700;
    }
    .cenral-img-effect-lp {
        width: 490px;
    }
    .cenral-img-effect-lp .cenral-img-effect-2 {
        margin-top: -310px;
    }
    .cenral-img-effect-lp .cenral-img-effect-3 {
        margin-top: -280px;
    }
    .cenral-img-effect-lp .cenral-img-effect-4 {
        margin-top: -264px;
    }
    .effect-lp .block-effect-lp h3 {
        font-size: 115%;
    }
    #Portfolio #titlePortfolio {
        background-size: 90% 90%;
    }
    #Portfolio #titlePortfolio h1 {
        font-size: 400%;
        padding-top: 22px;
    }
    .hidden-big-portfolio h2 {
        margin-top: 40px;
        margin-bottom: 30px;
    }
    .hidden-big-portfolio p {
        font-size: 180%;
        padding-left: 70px;
        padding-right: 70px;
    }
    .hidden-big-portfolio a {}
    .hidden-small-portfolio {
        padding-top: 4px;
    }
    .hidden-small-portfolio h2 {
        font-size: 150%;
        margin-bottom: 4px;
        margin-top: 6px;
    }
    .hidden-small-portfolio p {
        font-size: 145%;
        line-height: 1.1;
        padding-left: 14px;
        padding-right: 14px;
    }
    .hidden-small-portfolio a {
        font-size: 130%;
        height: 44px;
        margin-top: 20px;
        padding-top: 8px;
        width: 200px;
    }
    .package-offers h3 {
        font-size: 300%;
    }
    .block-package-offers .title-package-offers h3 {
        width: 210px;
    }
    .block-package-offers .short-desc-package-offers {
        font-size: 135%;
    }
    .block-package-offers p {
        font-size: 150%;
    }
    .block-package-offers .price-package-offers {
        font-size: 190%;
        margin-top: 20px;
    }
    .block-package-offers .to-order-package-offers a {
        height: 46px;
        padding-top: 4px;
    }
    .title-our-clients h2 {
        font-size: 400%;
    }
    #carousel-example-generic1 .carousel-inner .item .col-lg-3 {
        width: 23%;
    }
    #carousel-example-generic1 .carousel-inner > .item {
        padding-left: 94px;
    }
    .block-choose-present .wrap-choose-present-1 h3,
    .block-choose-present .wrap-choose-present-2 h3,
    .block-choose-present .wrap-choose-present-3 h3 {
        font-size: 180%;
    }
    .block-choose-present .wrap-choose-present-1 p,
    .block-choose-present .wrap-choose-present-2 p,
    .block-choose-present .wrap-choose-present-3 p {
        font-size: 140%;
    }
    .block-choose-present .wrap-choose-present-1 .give-present a,
    .block-choose-present .wrap-choose-present-2 .give-present a,
    .block-choose-present .wrap-choose-present-3 .give-present a {
        font-size: 110%;
        width: 95%;
    }
    .block-choose-present .bg-choose-present-1 {
        background-position: -100px bottom;
        width: 320px;
    }
    .block-choose-present .bg-choose-present-2 {
        background-position: -66px bottom;
        width: 366px;
    }
    .block-choose-present .wrap-choose-present-1 {
        width: 300px;
        padding-left: 60px;
    }
    .block-choose-present .wrap-choose-present-1 p {
        margin-bottom: 60px;
    }
    .block-choose-present .wrap-choose-present-1 h3 {
        width: 180px;
    }
    .block-choose-present .wrap-choose-present-2 {
        padding-left: 30px;
    }
    .block-choose-present .wrap-choose-present-2 p {
        margin-bottom: 80px;
    }
    .block-choose-present .bg-choose-present-3 {
        width: 370px;
        background-position: -30px bottom;
    }
    .block-choose-present .wrap-choose-present-3 {
        padding-left: 45px;
        padding-right: 34px;
    }
    .block-choose-present .wrap-choose-present-3 p {
        margin-bottom: 130px;
    }
}
@media screen  and (min-width:768px) and (max-width:991px) {
    #header {
        background-position: left center;
    }
    .row-header-1 {
        padding-top: 20px;
    }
    .header-form #formClients {
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
    }
    .row-header-2 {
        margin-top: 55px;
    }
    .left-promo-block {
        margin-bottom: 20px;
    }
    .block-desc-we-work {
        height: 366px;
    }
    .effect-lp h2 {
        font-size: 370%;
    }
    .cenral-img-effect-lp {
        width: 400px;
        height: 180px;
        margin-top: 590px;
    }
    .cenral-img-effect-lp .cenral-img-effect-2 {
        margin-left: 18px;
        margin-top: -250px;
    }
    .cenral-img-effect-lp .cenral-img-effect-3 {
        margin-left: 40px;
        margin-top: -240px;
    }
    .cenral-img-effect-lp .cenral-img-effect-4 {
        margin-left: 60px;
        margin-top: -230px;
    }
    #Portfolio {
        padding-top: 12px;
    }
    #Portfolio #titlePortfolio {
        background-size: 100% 80%;
    }
    #Portfolio #titlePortfolio h1 {
        font-size: 330%;
        margin-top: 36px;
    }
    .my-modal-photo {
        width: 90%;
    }
    .visible-sm .left-side-right-portfolio {
        margin-bottom: 24px;
    }
    .visible-sm .right-portfolio,
    .visible-xs .right-portfolio {
        text-align: center;
    }
    .visible-sm .right-portfolio span,
    .visible-xs .right-portfolio span {
        color: white;
        font-weight: 700;
        font-size: 130%;
    }
    .visible-sm .right-portfolio p,
    .visible-xs .right-portfolio p {
        color: white;
        font-size: 120%;
    }
    .visible-sm .right-portfolio a,
    .visible-xs .right-portfolio a {
        background-color: #fdc00f;
        padding: 8px 20px;
        color: #2a2b2f;
    }
    .wrap-head-package-offers {
        background-size: 100% 100%;
    }
    /*.bg-choose-present-1,
    .bg-choose-present-2,
    .bg-choose-present-3 {
        background-image: url(../images/box-2-2.png)!important;
        background-size: 100% 100%!important;
    }  */
    .choose-present {
		padding-bottom: 50px;
	}
	.bg-choose-present-1,
    .bg-choose-present-2,
    .bg-choose-present-3 {
		background-image: url(../images/box-2-mob.png)!important;
        background-size: 100% 100%!important;
		margin: 10px auto;
		width: 520px;
    }
    .block-choose-present .bg-choose-present-1 {
        background-position: center bottom;
    }
    .block-choose-present .wrap-choose-present-1 h3,
    .block-choose-present .wrap-choose-present-0 h3,
    .block-choose-present .wrap-choose-present-1 p,
    .block-choose-present .wrap-choose-present-3 p,
    .block-choose-present .wrap-choose-present-1 .give-present,
    .block-choose-present .wrap-choose-present-3 .give-present {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    .block-choose-present .wrap-choose-present-3 {
        margin-left: auto;
        margin-right: auto;
        padding-left: 28px;
        padding-top: 10px;
        padding-right: 0;
        width: 320px;
    }
    .footer #formClients {
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
    }
    .footer .contacts .wrap-contacts h2 {
        font-size: 240%;
    }
    .footer .contacts .wrap-contacts .footer-adress h3,
    .footer .contacts .wrap-contacts .footer-mail h3,
    .footer .contacts .wrap-contacts .footer-phone h3 {
        font-size: 165%;
    }
    .footer .contacts .wrap-contacts .footer-adress p,
    .footer .contacts .wrap-contacts .footer-mail p,
    .footer .contacts .wrap-contacts .footer-phone p {
        font-size: 160%;
    }
}
@media screen and (max-width:767px) {
    #header {
        background-position: left center;
        background-image: none;
        background-color: #a8a8a8;
    }
    .logo {
        background-position: center center;
        margin-top: 10px;
        background-size: 100% 100%;
        height: 100px;
        width: 160px;
        margin-left: auto;
        margin-right: auto;
        float: none!important;
    }
    .top-phone {
        text-align: center;
        padding-top: 0;
    }
    .top-phone h2 {
        font-size: 150%;
    }
    .slogan-site span {
        display: block;
        padding: 0;
        text-align: center;
        font-size: 145%;
        line-height: 1;
        padding-top: 10px;
    }
    .row-header-1 {
        padding-top: 20px;
    }
    .slogan-site .slogan {
        background-image: none;
        height: auto;
        padding: 0 0 10px;
        background-color: #ff181f;
    }
    .slogan-site .slogan p {
        font-size: 135%;
        text-align: center;
        padding-left: 0;
    }
    .for-mobile {
        line-height: 1;
    }
    .slogan-site .slogan h1 {
        font-size: 300%;
        line-height: 0.8;
        text-align: center;
        padding-left: 0;
        letter-spacing: 2px;
    }
    .header-form #formClients {
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
        width: 270px;
    }
    .header-form #formClients input,
    .header-form #formClients .btn {
        width: 240px;
        margin-left: auto;
        margin-right: auto;
    }
    .row-header-2 {
        margin-top: 10px;
    }
    .img-promo-block {
        display: none;
    }
    .wrap-2-promo-block {
        height: auto;
    }
    .left-promo-block {
        margin-bottom: 14px;
    }
    .left-promo-block .wrap-2-promo-block p {
        padding: 5px 0 8px;
    }
    .promo-block p {
        font-size: 150%;
        margin-bottom: 0;
    }
    .right-promo-block .wrap-2-promo-block {
        padding-top: 5px;
        padding-bottom: 8px;
    }
    .promo-block h2 {
        font-size: 180%;
    }
    .my-modal-text {
        width: 94%;
    }
    .top-we-work .title-we-work h1 {
        font-size: 300%;
    }
    .top-we-work {
        padding-bottom: 20px;
    }
    .block-desc-we-work {
        padding-bottom: 30px;
    }
    .effect-lp h2 {
        font-size: 300%;
    }
    .cenral-img-effect-lp {
        display: none;
    }
    .effect-lp .block-effect-lp-1 .desc-effect-lp-1 {
        padding-left: 0;
    }
    #Portfolio {
        padding-top: 12px;
    }
    #Portfolio #titlePortfolio {
        background-image: none;
        background-color: #ff181f;
        height: auto;
        padding: 10px;
    }
    #Portfolio #titlePortfolio h1 {
        font-size: 200%;
        margin-top: 4px;
    }
    .my-modal-photo {
        width: 90%;
    }
    .visible-sm .left-side-right-portfolio {
        margin-bottom: 24px;
    }
    .visible-sm .right-portfolio,
    .visible-xs .right-portfolio {
        text-align: center;
    }
    .visible-sm .right-portfolio span,
    .visible-xs .right-portfolio span {
        color: white;
        font-weight: 700;
        font-size: 130%;
    }
    .visible-sm .right-portfolio p,
    .visible-xs .right-portfolio p {
        color: white;
        font-size: 120%;
    }
    .visible-sm .right-portfolio a,
    .visible-xs .right-portfolio a {
        background-color: #fdc00f;
        padding: 8px 20px;
        color: #2a2b2f;
    }
    .want-lp a {
        background-position: 210px center;
        font-size: 100%;
    }
    .wrap-head-package-offers {
        background-image: none;
        height: auto;
    }
    .package-offers h2 {
        font-size: 250%;
        margin-top: 0;
    }
    .package-offers h3 {
        font-size: 200%;
    }
    .block-package-offers {
        margin-top: 30px;
        margin-bottom: 40px;
    }
    .my-modal-dialog {
        margin-left: auto;
        margin-right: auto;
    }
    .block-package-offers .price-package-offers {
        font-size: 240%;
    }
    .choose-package h2 {
        font-size: 200%;
    }
    .choose-package p {
        font-size: 160%;
    }
    .choose-package a {
        font-size: 120%;
        padding: 4px 10px;
    }
    .visible-xs .item-block-img-client {
        display: block;
        width: 120px;
        float: left;
        margin: 0 10px;
    }
    .visible-xs .item-block-img-client img {
        display: block;
        width: 100px;
        margin-left: auto;
        margin-right: auto;
    }
    #ChoosePresent {
        padding-bottom: 70px;
    }
    .choose-present .wrap-title-choose-present {
        background-image: none;
        background: rgba( 255, 255, 255, 0.8);
        height: auto;
        padding-bottom: 10px;
    }
    .choose-present h2 {
        font-size: 260%;
        line-height: 1;
    }
    .bg-choose-present-1,
    .bg-choose-present-2,
    .bg-choose-present-3 {
        background-image: none!important;
        background-color: #f1fcff;
    }
    .block-choose-present .bg-choose-present-1,
    .block-choose-present .bg-choose-present-2,
    .block-choose-present .bg-choose-present-3 {
        background-position: center bottom;
        height: auto;
        margin-bottom: 20px;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
        padding-bottom: 20px;
        width: 320px;
    }
    .block-choose-present .wrap-choose-present-1 h3,
    .block-choose-present .wrap-choose-present-0 h3,
    .block-choose-present .wrap-choose-present-1 p,
    .block-choose-present .wrap-choose-present-3 p,
    .block-choose-present .wrap-choose-present-1 .give-present,
    .block-choose-present .wrap-choose-present-3 .give-present {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    .block-choose-present .wrap-choose-present-3 {
        margin-left: auto;
        margin-right: auto;
        padding-left: 28px;
        padding-top: 10px;
        padding-right: 0;
        width: 320px;
    }
    .block-choose-present .wrap-choose-present-1 p {
        margin-bottom: 50px;
    }
    .block-choose-present .wrap-choose-present-3 p {
        margin-bottom: 56px;
    }
    #Footer .row {
        background-position: left bottom;
    }
    .footer .contacts {
        padding-left: 0;
        padding-right: 0;
    }
    .footer #formClients {
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
        width: 270px;
    }
    .footer #formClients input,
    .footer #formClients .btn {
        width: 240px;
        margin-left: auto;
        margin-right: auto;
    }
    .footer .contacts .wrap-contacts {
        margin-top: 0;
        width: 100%;
    }
    .footer .contacts .wrap-contacts h2 {
        font-size: 240%;
    }
    .footer .contacts .wrap-contacts .footer-adress h3,
    .footer .contacts .wrap-contacts .footer-mail h3,
    .footer .contacts .wrap-contacts .footer-phone h3 {
        font-size: 165%;
    }
    .footer .contacts .wrap-contacts .footer-adress p,
    .footer .contacts .wrap-contacts .footer-mail p,
    .footer .contacts .wrap-contacts .footer-phone p {
        font-size: 160%;
    }
}