/*Import fonts*/

/* merriweather-700 - latin_cyrillic */

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/merriweather-v22-latin_cyrillic-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/merriweather-v22-latin_cyrillic-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/merriweather-v22-latin_cyrillic-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/merriweather-v22-latin_cyrillic-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/merriweather-v22-latin_cyrillic-700.ttf') 
    at('truetype'), /* Safari, Android, iOS */
       url('fonts/merriweather-v22-latin_cyrillic-700.svg#Merriweather') format('svg'); /* Legacy iOS */
}

/* merriweather-900 - latin_cyrillic */

@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/merriweather-v22-latin_cyrillic-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/merriweather-v22-latin_cyrillic-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/merriweather-v22-latin_cyrillic-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/merriweather-v22-latin_cyrillic-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/merriweather-v22-latin_cyrillic-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/merriweather-v22-latin_cyrillic-900.svg#Merriweather') format('svg'); /* Legacy iOS */
}

/* roboto-slab-900 - latin */

@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-slab-v13-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-slab-v13-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-slab-v13-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-slab-v13-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-slab-v13-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-slab-v13-latin-900.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}

/* montserrat-regular - latin_cyrillic */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat-v15-latin_cyrillic-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin_cyrillic-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-500 - latin_cyrillic */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/montserrat-v15-latin_cyrillic-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin_cyrillic-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin_cyrillic-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin_cyrillic-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-600 - latin_cyrillic */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/montserrat-v15-latin_cyrillic-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin_cyrillic-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin_cyrillic-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin_cyrillic-600.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-700 - latin_cyrillic */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/montserrat-v15-latin_cyrillic-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin_cyrillic-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin_cyrillic-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin_cyrillic-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin_cyrillic-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/**/

/*Box model*/

*,
*::before,
*::after {
    box-sizing: border-box;
}

/*Basic*/

html,
body {
    min-height: 100vh;
    margin: 0;
    padding: 0;   
}

body {
    font-family: Montserrat, sans-serif;
    font-style: normal;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
    background: #fff;
    overflow-x: hidden;   
}

header,
main,
footer {
    width: 100vw;
}

h1 {
    font-family: Merriweather, serif;
    font-style: normal;
    font-size: 50px;    
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1.25;
    text-align: center;
    color: #656f57;
    margin: 0;
    padding: 0;
}

h2 {
    font-style: normal;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.06em;
    text-align: center;
    text-transform: uppercase;
}

p {
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.5;
}

input,
button,
textarea,
select {
    font: inherit;
}

button, 
button:active, 
button:focus {
    outline: none;
}

ul,
ol {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

a,
a:focus,
a:hover,
a:active  {
    text-decoration: none;  
}
/**/

/* Toggle view of elements */

.show {
    display: block !important;
}

.hide {    
    display: none !important;
}
/*  */

/*Header styles*/

.header-wrapper {
    height: 90px;
    width: 1440px;
    margin: 0 auto; 
    background: #efd9d1;    
}

/*Styles nav-bar for dekstop version*/

.nav-wrapper {
    display: flex;
    height: inherit;
    margin: 0 150px;
    align-items: center;
    line-height: 90px;    
}

#nav-wrapper-768w {
    display: none;
}

#nav-wrapper-mobile {
    display: none;
}

.top-nav {    
    margin-left: auto;
    margin-right: 0;
}

.nav-list {
    float: left;
    display: inline;
    margin-left: 68px;
}   

#nav-services {
    margin-left: 144px;
}

#phone-number {
    margin-left: 109px;    
}

.nav-link {
    position: relative;
    font-weight: 500;   
    font-size: 16px;
    line-height: 1.25;  
    text-transform: uppercase;      
    color: #656f57;
}

    .nav-link:hover {
        font-size: 18px;
    }

    .nav-link:not(#location, #bars-btn):hover {
        border-bottom: 2px solid #656f57;
    }

    #location:hover::after {
        content: "";
        position: absolute;
        background: #656f57;
        width: 76px;
        height: 2px;        
        left: -22px;
        bottom: -2.5px;
    }

    #location:hover::before {
        font-size: 20px; 
    }       

    .nav-link:active {
        color: #000;
    }

    .nav-link:not(#location, #bars-btn):active {
        border-bottom: 2px solid #000;
    }

    #location:active::after{
        background: #000;        
    }   

    #location::before {
        content: "\f3c5";
        font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
        font-weight: 900; 
        font-size: 18px;        
        position: absolute;
        left: -22px;
        bottom: 2px;
    }
/**/

/*Toogling navbar styles*/

.toggle-nav-bar {
    display: block !important;    
}

#site-nav-list-head-mobile{
    position: absolute;    
    background: #efd9d1;    
    z-index: 3;    
}

.nav-list-mobile{
    float: none;
    display: block;        
    padding: 0;    
}

/*Main frame styles*/

.main-frame-wrapper {
    position: relative;
    display: flex; 
    width: 1440px;
    height: 760px;
    margin: 0 auto;
}

.page-title-wrap {
    width: 420px;
    margin-left: 150px;
    margin-top: 103px;
    z-index: 2;
}

.page-title {    
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.1em;
    text-align: left;    
}

#salon-name {   
    font-size: 90px;    
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 1;
    text-align: left;
    margin-top: 30px;
}

    #salon-name span {
        color: #e7967d;
    }

.main-frame-pic img {
    position: absolute;
    top: -90px;
    right: 0;
    z-index: -1;
}

.main-offer {   
    font-size: 22px;
    font-weight: 500;    
    line-height: 1.4;
    letter-spacing: 0;
    margin-bottom: 80px;
}

    .main-offer:first-of-type {
        margin-bottom: -15px;        
    }

.signup-button {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2;    
    padding: 19px 50px;   
    background-color: #e7967d;
    border-radius: 10px;
    color: #fff;
}

    .signup-button:hover {        
        background-color: #ffad94;
        cursor: pointer;
    }

    .signup-button:active {
        background-color: #ed8b6d;
    }
/**/

/*Messenger links styles*/

.messenger-wrapper {
    position: absolute;
    bottom: 118px;
    left: 1160px;
}

.messenger-list {
    float: left;
    display: inline-block;
    margin-left: 23px;      
}

.messenger-link {
    font-size: 25px;
    color: #656F57;
}

.viber-mobile {
    display: none;
}

.mobile-messenger-list {
    margin-left: 28%;
}
/**/

/*Services frame styles*/

.services-frame-wrapper {
    position: relative;
    width: 1440px;
    margin: 0 auto;
}

#services-introduction-wrapper {
    margin: 140px 150px 120px 150px;
}

    #services-introduction-wrapper h1 {
        margin-bottom: 74px;
    }

#services-introduction {
    display: flex;
    justify-content: space-between;
}

    #services-introduction p {
        width: 545px;
        margin-top: 0;
    }

#services-wrapper {
    margin-bottom: 150px;
}

    #services-wrapper h1 {
        margin-top: 80px;       
    }

#services {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 150px 0 220px;
}

.service-wrap {
    position: relative;    
    width: 290px;
    height: 340px;
    border: 3px solid #e6967d;
    background: #fff;
    text-align: center;
    margin-top: 75px;
}
    
    .service-title {
        width: 165px;
        margin: 36px auto 0 auto;        
    }

    .service-description p {
        height: 125px;
        text-align: left;
        font-size: 13px;    
        letter-spacing: 0;
        line-height: 1.25;
        margin: 29px 15px -20px 117px;
    }

    .service-description p:nth-child(3) {
        height: 18px;
        margin-bottom: 25px;
    }

    .service-description span {         
        font-size: 15px;
        font-weight: 700;        
        line-height: 1.2;
        color: #656f57;
        margin: 29px 41px 12px -45px;
    }

    .service-description .signup-button {
        font-weight: 500;
        font-size: 14px;    
        padding: 11px 30px;
    }

.service-img {
    position: absolute;
    border: 3px solid #e6967d;
    border-radius: 85px;
    left: -70px;
    top: 75px;
}
/**/

/*About us frame styles*/

#about-us-wrapper {
    position: relative;
    width: 1440px;    
    margin: 230px auto 0 auto;
}

.about-us {
    margin: 0 150px 170px 150px;
}

/*Our employees*/

#our-employees {
    display: flex;
    justify-content: space-between;
    margin: 0 50px;
}

#owl-carousel-masters {
    display: none;
}

.person-wrapper {
    position: relative;
    margin-top: 115px;    
}

    .person-wrapper p {
        margin: 35px 0 0 0;       
        text-align: center;
        line-height: 1.4;    
    }

    .photo-wrapper::before {
        content: "";
        position: absolute;
        width: 153px;
        height: 187px;
        left: -16px;
        bottom: 70px;
        background: #e6967d;
        z-index: -1;
    }

    .photo-wrapper::after {
        content: "";
        position: absolute;
        width: 126px;
        height: 47px;
        right: -26px;
        top: -24px;
        background: #ebd7cf;
        z-index: -1;
    }

    .title-span {
        position: absolute;
        width: 300px;
        height: 33px;
        bottom: 148px;
        left: 21px;
        font-family: Roboto Slab, sans-serif;        
        font-weight: 900;
        font-size: 23px;        
        letter-spacing: 0.03em;
        transform: rotate(-90deg);
        background: linear-gradient(#ebd7cf, #e6967d);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #e6967d;
        opacity: 0.7;
    }
    /**/

/* FAQ styles */

#faq-wrapper {
    display: flex;
    margin-top: 110px;
}

.youtube-video {
    width: 465px;
    height: 309px;    
}

#faq {
    margin-left: 60px;
}

/* Dropdown FAQ */

.dropdown {
    position: relative;
    margin-bottom: 22px;
    color: #656F57;
    width: 617px;
}

    .dropdown p {
        margin: 0;        
    }

.drop-question {   
    border: 1px solid #656F57;
    border-radius: 10px;  
    height: 44px;    
    line-height: 44px;
    padding-left: 12px;    
}

    .drop-question:hover,
    .drop-question:active {
        color: #000;
        border: 1px solid #000;
    }

    .drop-question::after {
        content: "\f0d7";
        font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
        font-weight: 900;
        font-size: 30px; 
        opacity: 0.7;           
        position: absolute;
        right: 15px;        
    }

.drop-content {
    display: none;        
    font-size: 18px;
    padding: 35px 35px 50px 45px;    
    color: #000;
    border: 1px solid #656F57;
    border-radius: 10px; 
}

    .drop-content::after {
        content: "\f0d8";
        font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
        font-weight: 900;
        font-size: 30px; 
        opacity: 0.7;           
        position: absolute;
        right: 15px;
        top: 0;        
    }

    .drop-content span {
        font-weight: 500;
        font-size: 20px;
        line-height: 3;
    }

    .drop-content:not(.drop-content-first) {
        position: absolute;        
        top: -22px;
    }

/* Contacts frame styles */

#contacts-frame-wrapper {
    position: relative;
    width: 1440px;    
    margin: 100px auto 0 auto;
}

.offer-wrapper {
    padding: 90px 585px 140px 150px;    
}

    .offer-wrapper h1, p {
        text-align: left;
    }

    .offer-wrapper p {
        width: 470px;        
    }

    .offer-wrapper p:nth-child(3) {
        margin-bottom: 80px;        
    }

#contacts-wrapper {
    display: flex;
    margin: 150px 150px 100px 150px;
}

#map {
    width: 580px;
    height: 600px;
    border: 1px solid #656F57;
}

.contacts {
    width: 500px;
    margin-left: 85px;    
}

    .contacts h1 {
        width: 475px;
        text-align: left;
        margin-bottom: 45px;
    }

    .contacts p {
        margin: 7px 0;
        line-height: 1.7;
    }

    .contacts p:nth-child(6) {
        margin-top: 25px;       
    }

    .contacts p:nth-child(7) {
        margin-bottom: 25px;        
    }

.contacts-text {
    font-size: 20px;
    font-weight: 600;    
    color: #000;
}

/*Testimonials styles*/

#testimonials-wrapper {
    width: 1440px;
}

.testimonial {
    width: 475px;
    padding: 40px 30px 30px 40px;   
    background: #fff2f2;
    border: 1px solid #656f57;
    border-radius: 10px;
}

.client-wrap {
    display: flex;
    margin-left: 15px;
}

.client-photo {
    width: 58px;
    height: auto;
}

.testimonial-p {
    font-weight: 500 !important;
    font-size: 22px;
    line-height: 1 !important;
    margin: 10px 0 10px 40px;
}

.b-a-photo-wrapper-768w,
.b-a-photo-wrapper-mobile {
    display: none;
}

.b-a-photo-wrapper {    
    position: relative;
    margin-left: 80px;    
}

    .b-a-photo-wrapper a:hover::after {
        content: "\f00e";
        font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
        font-weight: 900; 
        font-size: 30px;        
        position: absolute;
        bottom:180px;
        left: 150px;   
        color: #4f514d;
        z-index: 1;
    }

.b-a-photo,
.b-a-text {
    position: absolute;
}

.before-photo {
    bottom: 0;
    left: 0;   
}

.after-photo {
    top: 0;
    left: 80px;    
}

.before-text {
    bottom: 5px;
    left: -15px;
}

.after-text {
    bottom: 25px;
    left: 60px;
}

/*Carousel styles*/

.owl-carousel {    
    width: 90%;
    margin: 80px auto;
}

.carousel-item {
    display: flex;
    position: relative;
    width: 100%;    
    margin: 0 auto 0 200px; 
    cursor: grab;  
    overflow-wrap: break-word;
}

/* Container with markers */
.owl-dots {
    display: block;
    text-align: center;
    margin-top: 65px;
}

    /* Marker page */
    .owl-carousel button.owl-dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #656f57;
        margin: 0 10px;
    }

    /* Active marker */
    .owl-carousel button.owl-dot.active {
        width: 15px;
        height: 15px;
    }

/*Carousel arrow*/
.owl-nav {
    position: absolute;
    text-align: center;   
    font-size: 5em;
    top: 130px;
    left: 130px;    
}
    .owl-nav button.disabled {
        color: black;
        opacity: .5;
    }

.owl-next {    
    position: absolute;
    right: -1030px;
}

.owl-carousel button.owl-dot:not(.active):hover {
    background: #3e3e3d;
}

/*Footer styles*/

.footer-wrapper {
    height: 112px;
    width: 1440px;
    margin: 0 auto; 
    background: #656f57;
}

    .footer-wrapper .nav-wrapper {    
        line-height: 112px;        
    }

#link-to-start img{
    vertical-align: middle;
}

.footer-nav {
    margin-left: 200px;               
}

    .footer-nav .nav-list{        
        margin-left: 80px;        
    }

    .footer-nav .nav-link {         
        color: #fff;
    }

    .footer-nav .nav-link:hover {       
        border-bottom: 2px solid #fff !important;
    }

    .footer-nav .nav-link:active {
        color: #000;
        border-bottom: 2px solid #000 !important;
    }   
/**/

/*Social links styles*/

.social-wrapper {
    margin-left: auto;
    margin-right: 0;
    line-height: 112px;    
}

    .social-wrapper li {
        float: left;
        display: inline;
        margin-left: 57px;      
    }

.social-link {
    font-size: 27px;    
    color: #fff;
}
/**/

/* Background images styles */

.back-img {
    position: absolute;
    z-index: -1;
}

#services-back {
    top: -180px;        
    z-index: -2;
}

#back-flowers-serv {
    top: -660px;       
}

#back-flowers-serv2 {
    top: 520px;
    right: 0;        
}

#back-flowers-about {
    top: 450px;
    left: 0;   
}

#back-flowers-contacts {
    bottom: -180px;
    right: 0;
}

#back-flowers-serv3,
#back-flowers-serv4,
#back-flowers-serv5,
#back-flowers-serv6,
#back-flowers-serv7,
#services-back2,
#services-back3,
#services-back4,
#back-flowers-about2,
#back-flowers-about3,
#back-flowers-contacts2,
#back-flowers-contacts3 {
    display: none;
}

/*Scroll up button*/

.scrollup{
    width: 45px;
    height: 45px;    
    position: fixed;
    bottom: 50px;
    right: 70px;
    display: none;    
    background: url('../images/scroll-up.svg') no-repeat;
    z-index: 1;
}
/**/

/* Feedback form styles */

.feedback-form {
    display: none;   
    position: relative;
    width: 790px;
    height: 626px;
    padding: 55px 180px 55px 180px;   
    background: #ebd7cf;
    border-radius: 15px;
}

.form-title {
    margin: 0 0 45px 0;
    font-size: 30px;    
    line-height: 1.2;
    letter-spacing: 0.02em;    
    text-transform: none;
}

.form-label {
    width: 100%;
    text-align: left;
    font-weight: 400;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0.02em;
}

.form-field {
    width: 100%;
    height: 43px;
    margin: 12px 0 20px 0;
    padding: 11px 16px 8px 16px;
    font-family: Montserrat, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.3;
    border: 1px solid #656f57;
    border-radius: 10px;
    outline:none;
}

    .form-field:hover {
        border: 1px solid #ffad94;
    }

    .form-field:focus {
        border: 1px solid #ed8b6d;
    }

.form-area {
    height: 68px;
    margin-bottom: 0;
    resize: none;
}

.form-button {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2;    
    padding: 19px 50px;   
    background-color: #e7967d;
    border-radius: 10px;
    color: #fff;
    width: 100%;
    margin-top: 39px;
    border: none;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.form-span {
    position: absolute;
    width: 453px;
    height: 49px;
    bottom: 225px;
    right: -170px;
    font-family: Roboto Slab, sans-serif;        
    font-weight: 900;
    font-size: 45px; 
    line-height: 1.5;
    letter-spacing: 0.015em;
    text-align: center;
    transform: rotate(-90deg);
    text-transform: uppercase;    
    color: #fff6f2;    
}

#submit-form {
    text-align: center;
    padding: 160px 185px 170px 185px; 
}

.submit-form-p {
    text-align: center;
    margin-bottom: 80px;
}

.submit-form-btn {
    padding: 17px 84px;
}

/*Media queries*/

@media only screen and (max-width: 1280px) {
    
    .header-wrapper,
    .main-frame-wrapper,
    .services-frame-wrapper,
    #about-us-wrapper,
    #contacts-frame-wrapper,
    #testimonials-wrapper,
    .footer-wrapper,
    .main-frame-wrapper {
        width: 1280px;
    }

    .nav-wrapper {    
        margin: 0 80px;     
    }
    
        /*Main frame styles*/

    .page-title-wrap {
        width: 400px;
        margin-left: 80px;
        margin-top: 80px;    
    } 

    .main-offer {   
        font-size: 20px;    
        margin-bottom: 50px;
    }

    /*Messenger links styles*/

        .messenger-wrapper {    
            left: 1000px;
        }

    /*Services frame styles*/

    #services-introduction-wrapper {
        margin: 140px 80px 120px 80px;
    }

    #services {   
        margin: 0 80px 0 120px;
    }

    /*About us frame styles*/

    .about-us {
        margin: 0 80px 170px 80px;
    }

    /*Carousel styles*/

    .carousel-item {       
        margin: 0 auto 0 100px;    
    }

    .owl-nav {    
        left: 30px;    
    }    

    .owl-next {   
        right: -1035px;
    }

    /* Contacts frame styles */

    .offer-wrapper {
        padding: 90px 585px 140px 80px;    
    }

    #contacts-wrapper {    
        margin: 150px 80px 100px 80px;
    }

    /*Footer styles*/

    .footer-nav {
        margin-left: 150px;               
    }
}

@media only screen and (max-width: 1024px) {
    
    .header-wrapper,
    .main-frame-wrapper,
    .services-frame-wrapper,
    #about-us-wrapper,
    #contacts-frame-wrapper,
    #testimonials-wrapper,
    .footer-wrapper,
    .main-frame-wrapper {
        width: 1024px;
    }    

    .nav-wrapper {    
        margin: 0 60px;     
    }

    .nav-list {    
        margin-left: 50px;
    }   

    #nav-services {
        margin-left: 50px;
    }

    #phone-number {
        margin-left: 70px;    
    }    
    
    /*Main frame styles*/

    .page-title-wrap {        
        margin-left: 60px;
        margin-top: 60px;    
    } 

    /*Messenger links styles*/

        .messenger-wrapper {    
            left: 740px;
        }

    /*Services frame styles*/

    #services-introduction-wrapper {
        margin: 140px 60px 120px 60px;
    }

    #services {   
        margin: 0 80px 0 120px;
    }

    #services-introduction-wrapper h1 {
        margin-bottom: 50px;
    }

    #services-introduction p {
        width: 350px;
        font-size: 16px;        
    }

    #services-wrapper h1 {
        margin-top: 50px;       
    }

    #services {    
        margin: 0 150px 0 150px;
    }

    #services-back {
        height: 2300px;
    }

    /*About us frame styles*/

    .about-us {
        margin: 0 40px 170px 40px;
    }

    .youtube-video {
        width: 350px;        
    }

    #faq {
        margin-left: 30px;    
    }

    .dropdown {    
        width: 600px;
    }

    .testimonial {
        width: 400px;
        padding: 40px 20px 30px 30px;    
    }

    .b-a-photo-wrapper {   
        margin-left: 40px;    
    }

    .after-photo {    
        left: 50px;    
    }

    .after-text {
        bottom: 55px;
        left: 35px;
    }
    
    .owl-nav {
        top: 150px;    
        left: 40px;    
    }    

    .owl-next {   
        right: -860px;
    }

    /* Contacts frame styles */

    .offer-wrapper {
        padding: 70px 400px 140px 60px;    
    }

    #contacts-wrapper {    
        margin: 100px 60px 100px 60px;
        justify-content: space-between;
    }

    .contacts {
        width: 400px;
        margin-left: 50px;    
    }

    /*Footer styles*/

    .footer-nav {
        margin-left: 90px;               
    }
}

@media only screen and (max-width: 768px) {

    .header-wrapper,
    .main-frame-wrapper,
    .services-frame-wrapper,
    #about-us-wrapper,
    #contacts-frame-wrapper,
    #testimonials-wrapper,
    .footer-wrapper {
        width: 768px;
    }
    
    .viber-pc,
    #nav-wrapper-desktop,
    #site-nav-mobile-768w,
    #services-back,
    #back-flowers-serv,
    #back-flowers-serv2,
    #back-flowers-about,
    #back-flowers-contacts,
    #our-employees {
        display: none;
    }

    /* Header */

    .header-wrapper {
        height: 60px;
    }

    .nav-wrapper {           
        line-height: 60px;    
    }
    
    .viber-mobile {
        display: inline-block;
    }

    .logo {
        width: 40px;
        height: 40px;
        margin-left: 150px;
        margin-right: 192px;
    }

    #nav-wrapper-768w {
        display: flex;        
        margin: 0 30px;
        position: relative;
        justify-content: flex-end;
    }

    #site-nav-list-head-mobile {   
        top: 60px;
        left: -30px;    
        width: 170px;    
        text-align: left ;
    }

    .nav-list-mobile{              
        margin: -15px  30px !important;  
    }

        .nav-list-mobile:first-child {
            margin-top: 0 !important;
        }

        .nav-list-mobile:last-child {
            margin-bottom: 15px !important;
        }

    #bars-btn {
        margin-left: 0;
        margin-right: auto;        
        font-size: 30px;        
    }

    .main-frame-wrapper {         
        flex-wrap: wrap;
        height: 900px;    
    }

        .page-title-wrap {
            width: 510px;
            margin: 65px 30px;   
            order: 1;
        }

        .main-frame-pic img {
            position: static;
            order: 0;
        }

        .messenger-wrapper {    
            top: 530px;
            left: 600px;
        }

        #salon-name {   
            font-size: 60px;            
            margin-top: 34px;
        }

        .main-offer {   
            font-size: 18px;       
            line-height: 1.4;            
            margin-top: 35px;    
            margin-bottom: 60px;
        }

        .main-offer:first-of-type {
            margin-bottom: -25px;        
        }

        .signup-button {
            font-weight: 600;            
            padding: 16px 55px;   
        }

    /* Services frame */

    #back-flowers-serv6,
    #back-flowers-serv7,    
    #services-back3 {
        display: block;
    }

    #services-back3 {
        top: -170px;        
        z-index: -2;
    }

    #back-flowers-serv6 {
        top: -430px;
        right: 0;       
    }

    #back-flowers-serv7 {
        top: 630px;
        left: 0;       
    }

    .services-frame-wrapper {    
        margin: 200px auto;
    }

    #services-introduction-wrapper {
        margin: 0 30px;
    }

        #services-introduction-wrapper h1 {
            width: 360px;            
            margin: 0 auto 52px auto;    
            font-size: 35px;            
        }

    #services-introduction {
        display: flex;   
    }

        #services-introduction p {
            width: 330px;
            margin-top: 0;
            font-size: 16px;   
            line-height: 1.4;
        }
        
    #services-wrapper {
        margin-top: 160px;
        margin-bottom: 0;
    }

    #services-wrapper h1 {
       margin-top: 100px;
       font-size: 35px;       
    }

    #services {        
        margin: 0 60px;
    }

        .service-wrap {           
            width: 280px;
            height: 360px;    
            margin-top: 125px;       
        }
    
            .service-title {
                width: 242px;
                margin: 75px auto 0 auto;
                font-size: 18px;        
            }

            .service-description p {
                height: 120px;           
                font-size: 16px;
                text-align: center;                  
                margin: 10px 15px;
            }

            .increased-margin {
                margin-top: 35px !important;            
            }        

            .service-description span {        
                margin: 0;
            }

            .service-description .signup-button {        
                font-size: 15px;    
                padding: 10px 32px;
            }

            .service-img {
                top: -65px;    
                left: 75px;    
            }

    /* About us */

    #back-flowers-about3 {        
        display: block;
        top: 650px;
        left: 0;   
    }

    #about-us-wrapper {      
        margin: 200px auto 0 auto;
    }

    .about-us {
        margin: 0 60px 150px 60px;
    }

        .about-us h1 {
            font-size: 35px;
        }    

    .person-wrapper {    
        margin-top: 75px; 
        text-align: center;   
    }

    .person-wrapper p {
        margin: 35px 0 0 0;
        font-size: 16px;    
    }

        .photo-wrapper::before {        
            width: 153px;
            height: 187px;
            left: 60px;
            bottom: 60px;        
        }

        .photo-wrapper::after {        
            width: 126px;
            height: 47px;
            right: 55px;
            top: -15px;        
        }

        .title-span {       
            width: 225px;
            height: 35px;
            bottom: 135px;
            left: 155px;                 
            letter-spacing: 0.015em;        
        }
    
    /*Carousel styles*/

    #owl-carousel-masters {
        display: block;
        width: 100%;
        margin-top: 0;
    }

    .carousel-masters-item {    
        width: 100%;    
    }

    #owl-carousel-masters .owl-dots {       
        margin-top: 25px;
    }

    #owl-carousel-masters button.owl-dot {
        width: 10px;
        height: 10px;       
    }

    #owl-carousel-masters button.owl-dot.active {
        width: 15px;
        height: 15px;
    }

    #owl-carousel-masters .owl-nav {    
        top: 150px;
        left: -10px;    
    }
    
    #owl-carousel-masters .owl-next {    
        right: -655px;
    }

    #faq-wrapper {
        flex-wrap: wrap;
        margin-top: 60px;
    }   

        .youtube-video {    
            order: 1;
            width: 700px;
            height: 465px;
            margin-top: 50px;    
        }

        #faq {
            width: 100%;
            order: 0;
            margin-left: 0;
        }

        /* Dropdown FAQ */

        .dropdown {
            width: 100%;
            margin-bottom: 22px;
            background-color: #fff;    
        }

        .dropdown p {
            margin: 0;        
        }

        .drop-question {
            height: 50px;  
            font-size: 16px;  
            line-height: 1.4;
            padding: 14px 75px 11px 17px;             
        }

            .drop-question::after {           
                top: 5px;              
            }

            .drop-content {
                font-size: 16px;
                padding: 15px 20px 30px 25px;    
            }

                .drop-content::after {        
                    right: 15px;              
                }

                .drop-content span {        
                    font-size: 16px;
                    line-height: 3;        
                }

                .drop-content:not(.drop-content-first) {
                    position: static;        
                }

    /*Testimonials styles*/

    #testimonials-wrapper {
        margin-top: -50px;
    }    

        #testimonials-wrapper h1 {
            font-size: 35px;        
        }

    .testimonial {        
        width: 335px;
        height: 330px;
        padding: 30px 35px;
        margin-top: 20px;    
    }

        .client-wrap {    
            margin-left: 50px;
        }

        .client-photo {
            width: 25px;    
        }

        .testimonial p {
            font-size: 16px;
            line-height: 1.4;
        }

    .b-a-photo-wrapper {
        display: none;
    }

    .b-a-photo-wrapper-768w {
        display: block;
        position: relative;
        margin: 0 380px;        
    }

        .b-a-photo-wrapper-768w a::after {
            content: "\f00e";
            font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
            font-weight: 900; 
            font-size: 20px;        
            position: absolute;
            bottom:150px;
            left: 80px;   
            color: #4f514d;
            z-index: 1;
        }

        .before-photo {
            bottom: 20px;
            left: 0;   
        }

        .after-photo {
            top: -310px;
            left: 30px;    
        }

        .before-text {
            font-size: 16px;
            bottom: 25px;
            left: -20px;
        }

        .after-text {
            font-size: 16px;
            bottom: 65px;
            left: 5px;
        }

    .owl-carousel {    
        width: 100%;
        margin: 50px auto;
    }

        .carousel-item {
            display: block;           
            margin: 0 70px;    
        }

        .owl-dots {    
            margin-top: 40px;
        }

        .owl-carousel button.owl-dot {
            width: 8px;
            height: 8px;        
            margin: 0 8px;
        }

        .owl-carousel button.owl-dot.active {
            width: 12px;
            height: 12px;
        }

        .owl-nav {     
            top: 130px;
            left: 20px;    
        }
    
        .owl-next {            
            right: -690px;
        }

    /*Contacts*/

    #back-flowers-contacts3 {
        display: block;
        top: 450px;
        right: 0;
    }

    #contacts-frame-wrapper {    
        margin: 90px auto 0 auto;
    }

    .offer-wrapper {
        padding: 60px 30px;    
    }

        .offer-wrapper h1 {
            font-size: 35px;
        }

        .offer-wrapper p {
            width: 372px;
            font-size: 16px;        
        }

            .offer-wrapper p:nth-child(2) {
                margin-top: 30px;
            }

            .offer-wrapper p:nth-child(3) {
                margin-bottom: 40px;        
            }

            .offer-wrapper .signup-button {
                font-size: 15px;
                padding: 16px 55px;
            }

    #contacts-wrapper {    
        margin: 100px 30px 30px 30px;        
    }

        #map {
            width: 320px;
            height: 360px;
            margin-top: 5px;           
        }

    .contacts {
        width: 320px;
        margin-left: 50px;    
    }

        .contacts h1 {
            width: auto;
            font-size: 35px;            
            margin-bottom: 20px;            
        }

        .contacts p {        
            font-size: 16px;
            line-height: 1.25;
            margin-bottom: 0;            
        }    

            .contacts p:nth-child(6) {
                margin-top: 15px;       
            }

            .contacts p:nth-child(7) {
                margin-bottom: 15px;        
            }   

        .contacts-text {
            font-size: 16px;    
        }

    /*Footer styles*/

    .footer-wrapper {
        height: 80px;
    }    

        .footer-wrapper .nav-wrapper {    
            line-height: 80px;       
            margin: 0 30px;       
        }

    .footer-nav {
        margin-left: 80px;               
    }

    .footer-nav .nav-list{        
        margin-left: 60px;        
    }

    .white-logo {
        width: 30px;
        height: 30px;
    }          

    .social-wrapper {    
        line-height: 80px;    
    }

        .social-wrapper li {        
            margin-left: 17px;      
        }

        .social-link {
            font-size: 18px;   
        }

    .scrollup {   
        right: 25px;    
    }

    /* Feedback form styles */

    .feedback-form {
        width: 650px;
        height: auto;
        padding: 40px 80px;    
    }

    .form-label {
        font-size: 20px;
    }

    .form-span {   
        bottom: 170px;
        right: -185px;
        font-size: 40px;    
    }

    #submit-form {
        text-align: center;
        padding: 40px 80px;
    }

    .submit-form-p {    
        margin-bottom: 60px;
    }   

    .form-span-submit {
        display: none;
    }    
}

@media only screen and (max-width: 414px) {
    
    .header-wrapper,
    .main-frame-wrapper,
    .services-frame-wrapper,
    #about-us-wrapper,
    #contacts-frame-wrapper,
    #testimonials-wrapper,
    .footer-wrapper,
    .main-frame-wrapper {
        width: 414px;
    }

    #nav-wrapper-desktop,
    #site-nav-mobile,
    #services-back,
    #services-back3,
    #back-flowers-serv,
    #back-flowers-serv2,
    #back-flowers-serv6,
    #back-flowers-serv7,
    #back-flowers-about,
    #back-flowers-about3,
    #back-flowers-contacts,
    .messenger-wrapper,
    #our-employees,
    #nav-wrapper-768w {
        display: none;
    }    

    /* Main frame and header */

    #nav-wrapper-mobile {
        display: flex;        
        margin: 0 30px;
        position: relative;
    }

    #site-nav-list-head-mobile {        
        top: 60px;
        left: -30px;    
        width: 414px;
        text-align: center;    
    }

    .nav-list-mobile{            
        margin: -8px  25px !important;  
    }

    .nav-list-mobile:first-child {
        margin-top: 3px !important;  
    }

    .mobile-messenger-list {
        margin-top: 20px;
        margin-left: 125px;
    }

    .logo {        
        margin-left: 0;
        margin-right: 0;
    }    

    #location {
        margin-left: 120px;
        margin-top: 20px;
    }

    #bars-btn {
        margin-left: 130px;
        font-size: 30px;        
    }

    .main-frame-pic {
        height: 250px;
    }

        .main-frame-pic img {
            position: static;
            order: 0;
        }

    .main-frame-wrapper {
        height: 650px;    
        flex-wrap: wrap;    
    }

    .page-title-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width: 335px;
        margin: 50px auto;    
        order: 1;
    }

        .page-title {
            letter-spacing: 0.05em;
            text-align: center;    
        }

        #salon-name {   
            font-size: 40px;   
            text-align: center;
            letter-spacing: 0.01em;
            margin-top: 10px;
        }

        .main-offer {   
            font-size: 16px;       
            line-height: 1.4;
            text-align: center;
            margin-top: 44px;    
            margin-bottom: 40px;
        }

        .main-offer:first-of-type {
            margin-bottom: -35px;        
        }

        .signup-button {
            font-weight: 600;
            font-size: 16px;
            height: 56px;
            padding: 18px 115px;   
        }

    /* Services frame */

    #back-flowers-serv3,
    #back-flowers-serv4,
    #back-flowers-serv5,
    #services-back4 {
        display: block;
    }

    #services-back4 {
        top: 20px;        
        z-index: -2;
    }

    #back-flowers-serv3 {
        top: -210px;
        right: 0;       
    }

    #back-flowers-serv4 {
        top: 1160px;
        left: 0;       
    }

    #back-flowers-serv5 {        
        top: 2140px;
        right: 0;       
    }

    .services-frame-wrapper {    
        margin: 0 auto;
    }

    #services-introduction-wrapper {
        margin: 0 30px;
    }

        #services-introduction-wrapper h1 {
            width: 300px;
            padding-top: 120px;
            margin-bottom: 26px;
            margin-left: 0;    
            font-size: 25px;    
            text-align: left;    
        }

    #services-introduction {
        display: block;   
    }

        #services-introduction p {
            width: 330px;
            margin-top: 0;
            font-size: 16px;   
            line-height: 1.4;
        }

        #services-introduction img {
            margin-top: 20px;
        }

    #services-wrapper {
        margin-top: 0;
        margin-bottom: 0;
    }

    #services-wrapper h1 {
       margin-top: 100px;
       font-size: 25px;       
    }

    #services {        
        margin: 0 40px;
    }

    .service-wrap {           
        width: 275px;
        height: 327px;    
        margin-top: 55px;
        margin-right: 0;
        margin-left: auto;
    }
    
        .service-title {
            width: 200px;
            margin: 32px auto 0 auto;
            font-size: 15px;        
        }

        .service-description p {
            font-size: 13px;
            text-align: left;
            height: 115px;            
            margin: 25px 15px 10px 125px;
        }

        .increased-margin {
            margin-top: 40px !important;
            height: 122px !important;
        }

            .service-wrap:nth-child(3) .increased-margin {
                margin-top: 20px !important;              
            }          

        .service-description p:nth-child(3) {
            margin-bottom: 20px;
        }

        .service-description span {        
            margin: 0 0 12px -65px;
        }

        .service-description .signup-button {        
            font-size: 16px;    
            padding: 10px 32px;
        }

        .service-img {
            top: 70px;
            left: -60px;    
        }

    /* About us */

    #back-flowers-about2 {        
        display: block;
        top: 480px;
        left: 0;   
    }

    #about-us-wrapper {      
        margin: 200px auto 0 auto;
    }

    .about-us {
        margin: 0 30px 70px 30px;
    }

        .about-us h1 {
            font-size: 25px;
        }    

    .person-wrapper {    
        margin-top: 60px; 
        text-align: center;   
    }

    .person-wrapper p {
        margin: 15px 0 0 0;            
    }

        .photo-wrapper::before {        
            width: 104px;
            height: 126px;
            left: 20px;
            bottom: 50px;        
        }

        .photo-wrapper::after {        
            width: 83px;
            height: 32px;
            right: 12px;
            top: -12px;        
        }

        .title-span {       
            width: 145px;
            height: 22px;
            bottom: 100px;
            left: 83px;              
            font-weight: 700;
            font-size: 15px;                   
        }
    
    /*Carousel styles*/

    #owl-carousel-masters {
        display: block;
        width: 100%;
        margin-top: 0;
    }

    .carousel-masters-item {    
        width: 100%;    
    }

    #owl-carousel-masters .owl-dots {       
        margin-top: 35px;
    }

    #owl-carousel-masters button.owl-dot {
        width: 8px;
        height: 8px;       
    }

    #owl-carousel-masters button.owl-dot.active {
        width: 12px;
        height: 12px;
    }

    #owl-carousel-masters .owl-nav {    
        top: 90px;
        left: -18px;    
    }
    
    #owl-carousel-masters .owl-next {    
        right: -365px;
    }    

    #faq-wrapper {
        flex-wrap: wrap;
        margin-top: 40px;
    }   

        .youtube-video {    
            order: 1;
            width: 375px;
            height: 250px;
            margin-top: 28px;    
        }

        #faq {
            order: 0;
            margin-left: 0;
        }

        /* Dropdown FAQ */

        .dropdown {
            width: 100%;
            margin-bottom: 22px;    
        }

        .dropdown p {
            margin: 0;        
        }

        .drop-question {
            height: 60px;  
            font-size: 16px;  
            line-height: 1.2;
            padding: 11px 75px 0 17px;              
        }

            .dropdown:nth-of-type(4) .drop-question {
                padding-top: 20px;
            }

            .drop-question::after {           
                top: 12px;              
            }

            .drop-content {
                font-size: 15px;
                padding: 30px 20px 30px 25px;    
            }

                .drop-content::after {        
                    right: 10px;              
                }

                .drop-content span {        
                    font-size: 16px;
                    line-height: 1.5;        
                }

                .drop-content:not(.drop-content-first) {
                    position: static;        
                }

    /*Testimonials styles*/

    #testimonials-wrapper {
        margin-top: 80px;
    }    

        #testimonials-wrapper h1 {
            font-size: 25px;        
        }

    .testimonial {        
        width: 320px;
        height: 440px;
        padding: 30px 15px;
        margin-top: 10px;    
    }

        .client-wrap {    
            margin-left: 50px;
        }

        .client-photo {
            width: 25px;    
        }

        .testimonial p {
            font-size: 16px;
            line-height: 1.4;
        }

    .b-a-photo-wrapper,
    .b-a-photo-wrapper-768w {
        display: none;
    }

    .b-a-photo-wrapper-mobile {
        display: block;
        position: relative;
        margin: 0 110px;        
    }

        .b-a-photo-wrapper-mobile a::after {
            content: "\f00e";
            font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';
            font-weight: 900; 
            font-size: 15px;        
            position: absolute;
            bottom:70px;
            left: 40px;   
            color: #4f514d;
            z-index: 1;
        }

        .before-photo {
            bottom: 20px;
            left: 0;   
        }

        .after-photo {
            top: -140px;
            left: 25px;    
        }

        .before-text {
            font-size: 12px;
            bottom: 20px;
            left: -30px;
        }

        .after-text {
            font-size: 12px;
            bottom: 30px;
            left: 25px;
        }

    .owl-carousel {    
        width: 100%;
        margin: 50px auto;
    }

        .carousel-item {
            display: block;           
            margin: 0 45px;    
        }

        .owl-dots {    
            margin-top: 25px;
        }

        .owl-carousel button.owl-dot {
            width: 8px;
            height: 8px;        
            margin: 0 8px;
        }

        .owl-carousel button.owl-dot.active {
            width: 12px;
            height: 12px;
        }

        .owl-nav {     
            top: 150px;
            left: 10px;    
        }
    
        .owl-next {            
            right: -365px;
        }

    /*Contacts*/

    #back-flowers-contacts2 {
        display: block;
        top: 370px;
        right: 0;
    }

    #contacts-frame-wrapper {    
        margin: 60px auto 0 auto;
    }

    .offer-wrapper {
        padding: 25px 16px 46px 30px;    
    }

        .offer-wrapper h1 {
            font-size: 25px;
        }

        .offer-wrapper p {
            width: 244px;
            font-size: 14px;        
        }

            .offer-wrapper p:nth-child(2) {
                margin-top: 30px;
            }

            .offer-wrapper p:nth-child(3) {
                margin-bottom: 40px;        
            }

            .offer-wrapper .signup-button {
                padding: 10px 30px;
            }

    #contacts-wrapper {    
        margin: 50px 20px 30px 20px;
        flex-wrap: wrap;
        text-align: center;
    }

        #map {
            width: 375px;
            height: 330px;    
            order: 2;
            margin-top: 30px;
        }

    .contacts {
        width: 320px;
        margin-left: 30px;    
    }

        .contacts h1 {
            width: auto;
            font-size: 25px;
            text-align: center;
            margin-bottom: 30px;
            margin-left: 20px;
        }

        .contacts p {        
            font-size: 16px;
            line-height: 1.25;
            text-align: center;
        }    

            .contacts p:nth-child(6) {
                margin-top: 25px;       
            }

            .contacts p:nth-child(7) {
                margin-bottom: 25px;        
            }   

        .contacts-text {
            font-size: 16px;    
        }

    /*Footer styles*/

    .footer-wrapper {
        height: 60px;
    }    

        .footer-wrapper .nav-wrapper {    
            line-height: 60px;       
            margin: 0 30px;       
        }

    .white-logo {
        width: 30px;
        height: 30px;
    }

    .footer-nav {
        display: none;
    }      

    .social-wrapper {    
        line-height: 60px;    
    }

        .social-wrapper li {        
            margin-left: 17px;      
        }

        .social-link {
            font-size: 18px;   
        }

    /* Feedback form styles */

    .feedback-form {    
        width: 350px;
        height: auto;
        padding: 30px 20px;   
    }   

    .form-title {
        margin: 0 0 25px 0;
        font-size: 20px;
    }

    .form-label {
        font-size: 16px;
        line-height: 1;    
    }

    .form-field {
        height: 35px;
        margin: 10px 0 15px 0;
        padding: 10px 10px;
        font-size: 16px;    
    }

    .form-area {
        height: 68px;       
    }    

    .form-span {
        display: none;
    }

    #submit-form {
        padding: 30px 25px 50px 25px; 
    }

    .submit-form-p {
        font-size: 16px;    
        margin-bottom: 60px;
    }

    .submit-form-btn {
        padding: 15px 20px;
    }
}

@media only screen and (max-width: 375px) {
    
    .header-wrapper,
    .main-frame-wrapper,
    .services-frame-wrapper,
    #about-us-wrapper,
    #contacts-frame-wrapper,
    #testimonials-wrapper,
    .footer-wrapper,
    .main-frame-wrapper {
        width: 375px;
    }       

    /* Main frame and header */

    #nav-wrapper-mobile {               
        margin: 0 20px;        
    }

    #site-nav-list-head-mobile {            
        width: 375px;
        left: -20px;         
    }    

    #bars-btn {
        margin-left: 112px;             
    }
  
    #location {
        margin-left: 112px;        
    }
  
    .mobile-messenger-list {        
        margin-left: 105px;
    } 

    /* Services frame */

    #services-back4 {
        display: none;
    }

    #services-back2 {
        display: block;
    }

    #services-back2 {
        top: 20px;        
        z-index: -2;
    }

    #services-introduction-wrapper {
        margin: 0 20px;
    }
        
    #services {        
        margin: 0 23px;
    }        

    /* About us */

    .about-us {
        margin: 0 20px 70px 20px;
    }

        .title-span {            
            left: 74px;                           
        }
    
    /*Carousel styles*/    

    #owl-carousel-masters .owl-nav {        
        left: -12px;    
    }
    
    #owl-carousel-masters .owl-next {    
        right: -340px;
    } 

    /*Testimonials styles*/
        
    .testimonial {        
        width: 284px;          
    }        

        .before-photo {            
            left: -20px;   
        }

        .after-photo {            
            left: 5px;    
        }

        .before-text {            
            left: -50px;
        }

        .after-text {            
            left: 5px;
        }

        .owl-nav {            
            left: 10px;    
        }
    
        .owl-next {            
            right: -330px;
        }

    /*Contacts*/

    .offer-wrapper {
        padding: 25px 16px 46px 20px;    
    }
        
    #contacts-wrapper {    
        margin: 50px 20px 30px 20px;        
    }        

    .contacts {       
        margin-left: 5px;    
    }        

    /*Footer styles*/    

    .footer-wrapper .nav-wrapper {                
        margin: 0 20px;       
    }    
}


