﻿
@import url('/Components/Estates/TopEstates/wucTopEstates.css?date=2022-06-15--14');


#DefaultPage { padding-top:190px; }
.header-strip-bg { background-image:url(/Images/header-strip-bg-left.png),url(/Images/header-strip-bg-right.png); 
                   background-repeat:no-repeat; 
                   background-position:left -5% top -90px,right top -20px; 
                   background-size:auto 800px,auto 600px;
                   max-width:1800px; margin:0 auto;
                   padding-bottom:0; display:table; width:100%;
}
.header-strip-bg .header-strip { width:100%; height:600px; display:block; position:relative; }
.header-strip-bg .strip-left { width:55%; height:100%; position:absolute; left:0; top:0; display:flex; z-index:2; }
.header-strip-bg .strip-left .txt-content{ width:calc(100% - 201px); }
.header-strip-bg .strip-left .txt-content .txt-wrapper{ width:100%; height:448px; margin-top:60px;
                                                        background: #ffffff;
                                                        background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(249, 249, 249, 1) 100%);
}
.header-strip-bg .strip-left .txt-content .txt-wrapper .user-text h1{ }
.header-strip-bg .strip-left .txt-content .txt-wrapper .user-text { display:block; padding:60px; max-width:400px; }
.header-strip-bg .strip-left .separator{ width:201px; height:600px; 
                                         display:block;
                                         background-image:url(/Images/default-separator.svg); background-repeat:no-repeat;
                                         background-size:auto 100%; background-position:left top;
}
.header-strip-bg .strip-right { position:absolute; width:57%; height:500px; background-image:url(/Images/header-strip.jpg);
                                background-position:left center; background-repeat:no-repeat; background-size:cover;
                                right:0; top:30px; z-index:1;
}
.top-estates a.button.all-estates { width:auto; display:table; padding:0 45px; margin:0 auto 30px auto; }
.about-us { background-image:url(/Images/header-bg.svg); background-repeat:no-repeat; background-position:right top; background-size:800px }
.reference { margin-bottom:4rem; }


@media all and (max-width: 1556px) {

    /*.header-strip-bg .strip-right { height:480px; }
    .header-strip-bg .strip-left .txt-content .txt-wrapper { height:418px; }
    .header-strip-bg .strip-left .separator { height:564px; width:190px; }*/
    .header-strip-bg .strip-right { width:58%; }
}

@media all and (max-width: 1420px) {

    /*.header-strip-bg .strip-right { height:480px; }
    .header-strip-bg .strip-left .txt-content .txt-wrapper { height:418px; }
    .header-strip-bg .strip-left .separator { height:564px; width:190px; }*/
    .header-strip-bg .strip-right { width:59%; }
}



@media all and (max-width: 85em) {

    .header-strip-bg .strip-right { width:55%; z-index:2; }
    .header-strip-bg .strip-left { z-index:1; }
    .header-strip-bg .strip-left .separator { display:none; }
    .header-strip-bg .strip-left .txt-content { width:100%; }
    
}

@media all and (max-width: 75em) {

    .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text h1 { font-size:1.7rem; }
}

@media all and (max-width: 68em) {
    #DefaultPage { padding-top:100px; }
    .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text { padding:60px 30px; }
}

@media all and (max-width: 61em) {
    #DefaultPage { padding-top:100px; }
    .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text { padding:60px 0; }
    .header-strip-bg .strip-left { z-index:2; }
    .header-strip-bg .strip-right { z-index:1; }
}

@media all and (max-width: 54em) {
    .header-strip-bg .strip-left { width:100%; top:0; }
        .header-strip-bg .strip-left .txt-content .txt-wrapper { margin:0; height:auto; width:auto; display:table; background:none; }
        .header-strip-bg .strip-left { z-index:2; }
    .header-strip-bg .strip-right { z-index:1; width:80%; top:200px; height:300px; }
    .header-strip-bg { background:none; }
        .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text { padding-top:0; }
        .header-strip-bg .header-strip { height:500px; }
        .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text h1 { font-size:2rem; }
}

@media all and (max-width: 48em) {
    .header-strip-bg .header-strip { height:550px; }
    .header-strip-bg .strip-right { top:250px; }
}

@media all and (max-width: 36em) {
    .header-strip-bg .strip-right { width:100%; height:200px; }
    .header-strip-bg .header-strip { height:460px; }
}

@media all and (max-width: 27em) {
    .header-strip-bg .strip-left .txt-content .txt-wrapper .user-text h1 { font-size:1.6rem; }
    h2 {
        font-size: 1.3rem;
    }
}

