* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Manrope', sans-serif;
}

body {
    margin: 0;
    min-width: 320px;
}


div.services div.title {
    background-image: url('../images/int5.jpg');
    background-size: cover;
    height: 700px;
    position: relative;
}

div.services div.title h1 {
    position: absolute;
    left: 37%;
    top: 30%;
    color: white;
    font-size: 60px;
    text-shadow: dimgrey;
}

div.services div.main {
    padding-top: 50px;
    background: url('../images/pattern2.png') repeat-y, floralwhite;
    background-size: 50%;
    background-position: center;
}

div.services div.main img {
    max-width: 100%;
}

div.services div.main>div {
    margin: 50px;
}

div.services div.main div.projects {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 300px 350px;
    grid-template-rows: 300px 350px;
    margin-bottom: -150px;
    position: relative;
}

div.services div.main div.projects>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.projects>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.projects>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.projects>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.projects div.image {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
}

div.services div.main div.projects div.content {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    background-color: wheat;
    padding: 50px;
    margin-top: -100px;
}

div.services div.main div.projects div.draw {
    max-width: 300px;
    position: absolute;
    bottom: 0;
    right: 0;
}

div.services div.main div.lightning {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 500px 300px;
    grid-template-rows: 500px 300px;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;

}

div.services div.main div.lightning>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;

}

div.services div.main div.lightning>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;

}

div.services div.main div.lightning>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;

}

div.services div.main div.lightning>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;

}

div.services div.main div.lightning div.image {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 2;
    grid-column: 2;
    margin-top: -200px;
}

div.services div.main div.lightning div.content {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    background-color: lightgrey;
    padding: 50px;
    margin-top: 50px;
    position: relative;
}

div.services div.main div.lightning div.content div.draw {
    position: absolute;
    left: 45px;
    bottom: 40px;
    max-width: 230px;
}

div.services div.main div.lightning div.content h2,
div.services div.main div.lightning div.content p {
    text-align: end;
}

div.services div.main div.lightning div.content button {
    position: absolute;
    right: 52px;
}

div.services div.main div.furniture {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 200px 250px;
    grid-template-rows: 200px 250px;
    position: relative;
}

div.services div.main div.furniture>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.furniture>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.furniture>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.furniture>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.furniture div.image {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    margin-top: -250px;
}

div.services div.main div.furniture div.content {
    background-color: lightgrey;
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    padding: 50px;
    margin-top: -200px;
}

div.services div.main div.furniture div.content div.draw {
    max-width: 300px;
    position: absolute;
    bottom: 0;
    right: 0;
}

div.services div.main div.smart {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 220px 200px;
    grid-template-rows: 220px 200px;
}

div.services div.main div.smart>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.smart>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.smart>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.smart>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.smart div.image {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    margin-top: -100px;
}

div.services div.main div.smart div.content {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    background-color: wheat;
    margin-top: -200px;
    padding: 50px;
    position: relative;
}

div.services div.main div.smart div.content h2,
div.services div.main div.smart div.content p {
    text-align: end;
}

div.services div.main div.smart div.content button {
    position: absolute;
    right: 52px;
}

div.services div.main div.smart div.content div.draw {
    max-width: 300px;
    position: absolute;
    left: 0;
    bottom: 0;
}

div.services div.main div.sun {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 200px 420px;
    grid-template-rows: 200px 420px;
    position: relative;
}

div.services div.main div.sun>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.sun>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.sun>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.sun>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.sun div.image {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    margin-top: -100px;
}

div.services div.main div.sun div.content {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    background-color: lightgrey;
    margin-top: -50px;
    padding: 50px;
}

div.services div.main div.sun div.content div.draw {
    position: absolute;
    max-width: 150px;
    bottom: 0;
    right: 0;
}

div.services div.main div.doors {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 300px 200px;
    grid-template-rows: 300px 200px;
}

div.services div.main div.doors>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.doors>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.doors>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.doors>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.doors div.image {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    margin-top: -150px;
}

div.services div.main div.doors div.content {
    background-color: wheat;
    margin-top: -150px;
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    padding: 50px;
    position: relative;
}

div.services div.main div.doors div.content h2,
div.services div.main div.doors div.content p {
    text-align: end;
}

div.services div.main div.doors div.content button {
    position: absolute;
    right: 52px;
}

div.services div.main div.doors div.content div.draw {
    position: absolute;
    max-width: 250px;
    left: 0;
    bottom: 0;
}

div.services div.main div.accessories {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 300px 200px;
    grid-template-rows: 300px 200px;
}

div.services div.main div.accessories>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.accessories>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.accessories>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.accessories>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.accessories div.image {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    margin-top: -150px;
}

div.services div.main div.accessories div.content {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    margin-top: -200px;
    background-color: lightgrey;
    padding: 50px;
    position: relative;
}

div.services div.main div.accessories div.content div.draw {
    position: absolute;
    max-width: 250px;
    bottom: 0;
    right: 0;
}

div.services div.main div.parket {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
    -ms-grid-rows: 300px 300px;
    grid-template-rows: 300px 300px;
    margin-bottom: 0;
}

div.services div.main div.parket>*:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

div.services div.main div.parket>*:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

div.services div.main div.parket>*:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
}

div.services div.main div.parket>*:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
}

div.services div.main div.parket div.image {
    -ms-grid-column: 2;
    grid-column: 2;
    -ms-grid-row: 2;
    grid-row: 2;
    margin-top: -150px;
}

div.services div.main div.parket div.content {
    -ms-grid-column: 1;
    grid-column: 1;
    -ms-grid-row: 1;
    grid-row: 1;
    background-color: wheat;
    padding: 50px;
    margin-top: -100px;
    position: relative;
}

div.services div.main div.parket div.content h2,
div.services div.main div.parket div.content p {
    text-align: end;
}

div.services div.main div.parket div.content button {
    position: absolute;
    right: 52px;
}

div.services div.main div.parket div.content div.draw {
    position: absolute;
    bottom: 0;
    left: 0;
    max-width: 200px;
}

div.services div.main p {
    font-weight: 600;
}

div.partners div.carousel {
    height: 150px;
    padding-top: 25px;
    padding-bottom: 25px;
}

div.partners div.text {
    text-align: center;
    padding: 50px;
    background-color: lightgray;
}

div.partners div.text h1 {
    color: dimgrey;
}

@media only all and (max-width: 1024px) {
    div.services div.title h1 {
        left: 30%;
        top: 24%;
    }

    div.services div.main div.projects div.content,
    div.services div.main div.lightning div.content,
    div.services div.main div.furniture div.content,
    div.services div.main div.smart div.content,
    div.services div.main div.sun div.content,
    div.services div.main div.doors div.content,
    div.services div.main div.accessories div.content,
    div.services div.main div.parket div.content {
        padding: 20px;
    }

    div.services div.main div.projects div.content div.draw {
        max-width: 200px;
    }

    div.services div.main div.lightning {
        -ms-grid-rows: 400px 300px;
        grid-template-rows: 400px 300px;
    }

    div.services div.main div.lightning div.content {
        margin-top: -150px;
    }

    div.services div.main div.lightning div.content div.draw {
        left: 0;
        max-width: 200px;
    }

    div.services div.main div.lightning div.image {
        margin-top: -100px;
    }

    div.services div.main div.furniture {
        -ms-grid-rows: 200px 200px;
        grid-template-rows: 200px 200px;
    }

    div.services div.main div.furniture div.content {
        margin-top: -250px;
    }

    div.services div.main div.furniture div.content div.draw {
        max-width: 200px;
    }

    div.services div.main div.smart {
        -ms-grid-rows: 300px 200px;
        grid-template-rows: 300px 200px;
    }

    div.services div.main div.sun {
        -ms-grid-rows: 200px 320px;
        grid-template-rows: 200px 320px;
    }

    div.services div.main div.sun div.content {
        margin-top: -200px;
    }

    div.services div.main div.sun div.image {
        margin-top: -150px;
    }

    div.services div.main div.doors div.content {
        margin-top: -250px;
    }

    div.services div.main div.doors div.image {
        margin-top: -100px;
    }

    div.services div.main div.accessories {
        -ms-grid-rows: 300px 150px;
        grid-template-rows: 300px 150px;
    }

    div.services div.main div.accessories div.content {
        margin-top: -280px;
    }

    div.services div.main div.parket {
        -ms-grid-rows: 200px 160px;
        grid-template-rows: 200px 160px;
    }

    div.services div.main div.parket div.content {
        margin-top: -200px;
    }
    div.services div.main div.parket div.content div.draw {
        max-width: 160px;
    }

    div.services div.main h2 {
        font-size: 25px;
    }
}

@media only all and (max-width: 768px) {
    div.services div.title {
        position: relative;
    }

    div.services div.title h1 {
        bottom: 50%;
        left: 25%;
        top: auto;
    }

    div.services div.main {
        padding-top: 1px;
    }

    div.services div.main div.projects,
    div.services div.main div.lightning,
    div.services div.main div.furniture,
    div.services div.main div.sun,
    div.services div.main div.smart,
    div.services div.main div.doors,
    div.services div.main div.accessories,
    div.services div.main div.parket {
        display: block;
    }

    div.services div.main div.projects div.content h2,
    div.services div.main div.lightning div.content h2,
    div.services div.main div.furniture div.content h2,
    div.services div.main div.smart div.content h2,
    div.services div.main div.sun div.content h2,
    div.services div.main div.doors div.content h2,
    div.services div.main div.accessories div.content h2,
    div.services div.main div.parket div.content h2 {
        text-align: left;
    }

    div.services div.main div.projects div.content,
    div.services div.main div.lightning div.content,
    div.services div.main div.furniture div.content,
    div.services div.main div.smart div.content,
    div.services div.main div.sun div.content,
    div.services div.main div.doors div.content,
    div.services div.main div.accessories div.content,
    div.services div.main div.parket div.content,
    div.services div.main div.projects div.image,
    div.services div.main div.lightning div.image,
    div.services div.main div.furniture div.image,
    div.services div.main div.smart div.image,
    div.services div.main div.sun div.image,
    div.services div.main div.doors div.image,
    div.services div.main div.accessories div.image,
    div.services div.main div.parket div.image {
        margin: auto;
    }

    div.services div.main div.projects {
        margin-bottom: 0;
    }

    div.services div.main div.projects div.content p,
    div.services div.main div.lightning div.content p,
    div.services div.main div.furniture div.content p,
    div.services div.main div.smart div.content p,
    div.services div.main div.sun div.content p,
    div.services div.main div.doors div.content p,
    div.services div.main div.accessories div.content p,
    div.services div.main div.parket div.content p {
        margin-bottom: 50px;
        text-align: left;
    }

    div.services div.main div.projects div.content button,
    div.services div.main div.lightning div.content button,
    div.services div.main div.furniture div.content button,
    div.services div.main div.smart div.content button,
    div.services div.main div.sun div.content button,
    div.services div.main div.doors div.content button,
    div.services div.main div.accessories div.content button,
    div.services div.main div.parket div.content button {
        position: relative;
        left: 0;
    }

    div.services div.main div.lightning div.content div.draw {
        opacity: 0.5;
        right: 0;
        left: auto;
    }

    div.services div.main div.smart div.content div.draw,
    div.services div.main div.doors div.content div.draw,
    div.services div.main div.parket div.content div.draw {
        left: auto;
        right: 0;
    }

    div.services div.main div.doors div.content div.draw,
    div.services div.main div.accessories div.content div.draw,
    div.services div.main div.furniture div.content div.draw {
        max-width: 150px;
    }
    div.services div.main div.smart div.content div.draw {
        max-width: 200px;
    }
    div.services div.main div.sun div.content div.draw {
        max-width: 80px;
    }
}

@media only all and (max-width: 576px) {
    div.services div.main {
        background: none;
    }
    div.services div.main div {
        margin: 10px;
    }

    div.services div.main div div.content div.draw img {
        opacity: 0.4;
        max-width: 150px;
    }
    div.services div.main div.sun div.content div.draw {
        display: none;
    }

    div.partners div.text {
        padding: 10px;
    }

    div.partners div.text h1 {
        font-size: 26px;
    }

    div.partners div.carousel {
        height: auto;
        padding-bottom: 0;
    }

    div.partners div.carousel div.carousel-inner {
        margin: 0;
    }

    div.services div.top div.title h1 {
        top: 40%;
    }
}