@font-face {
    font-family: WorkSans;
    src: url('../css/Work_Sans/static/WorkSans-Regular.ttf');
}

@font-face {
    font-family: WorkSansBold;
    src: url('../css/Work_Sans/static/WorkSans-Bold.ttf');
  }

.mmenu-trigger-home {
    display: none;
}

a.header-login {
    color: #ffffff !important;
    font-size: 16px;
    padding-left: 15px !important;
    padding-right: 15px !important;
    font-family: 'WorkSans';
}

.demo-banner {
    font-family: 'WorkSans';
    height: 50px;
}

.demo-banner span.demo-text {
    font-family: 'WorkSans';
    font-size: 17px;
}

.demo-banner .btnDemo {
    font-family: 'WorkSans';
    font-size: 13px;
    min-width: 50px;
    padding: 6px 1px 5px 5px;
    width: 100px;
}

#navigation ul a {
    font-family: 'WorkSans';
}

#logo img {
    height: 57px !important;
}

#logo {
    border-right: none !important;
}

#header {
    height: 69px !important;
    box-shadow: none !important;
}

#header-container {
    position: relative !important;
    top: 0;
    width: 100%;
    z-index: 1000;
    box-shadow: 3px 5px 9px -10px #888888;
}

.header-container {
    margin-left:auto;
    margin-right: auto;
}

#header .left-side {
    float: left;
    width: 93%;
    display: inline-block;
    position: relative;
    flex: 1;
}

#header .right-side {
    float: right;
    text-align: right;
    width: auto;
    right: inherit;
    display: inline-block;
    position: absolute;
    background-color: #fff;
    flex: 1;
    top: 0;
}

.section1-box {
    background: URL('/assets/images/home/dmp_gradient.png');
    background-repeat: no-repeat;
    background-size: 283% 100%;
    margin-bottom: 20px;
}

.section2-box, .section3-box, .section4-box, .section5-box, .section6-box {
    margin-top: 55px;
    margin-bottom: 55px;
}

.section1 {
    padding-top: 60px;
    padding-bottom: 20px;
}

.section2 {
    padding-top: 20px;
    padding-bottom: 10px;
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    box-shadow: 3px 0px 15px -7px #888888;
}

.section1 h1{
    font-family: 'WorkSansBold';
    color: #1C1C1C;
}

.section2 h3{
    font-family: 'WorkSansBold';
    font-size: 17px;
    margin-bottom:10px;
    margin-top:8px;
    color: #1C1C1C;
}

.section1 p {
    font-family: 'WorkSans';
    font-size: 18px;
    margin-bottom: 43px;
    color: #535353;
}

.section2 p {
    font-family: 'WorkSans';
    font-size: 18px;
    margin-bottom: 43px;
    color:#535353;
}

.section-text-1 {
    margin-top:auto;
    margin-bottom:auto;
}

.section1 h1{
    font-weight: 700;
    font-size: 45px;
    margin-bottom: 15px;
    width: 80%;
}

.section2-box h4{
    font-family: 'WorkSans';
    color: #3884D2;
    font-weight: 700;
    font-size: 18px;
}

.section2-box h2{
    font-family: 'WorkSansBold';
    margin-top:15px;
    margin-bottom:15px;
    font-size: 28px;
    color: #1C1C1C;
}

.section2-box .section2{
    padding:20px;
    width: 89%;
    margin-left: auto;
    margin-right:auto;
    padding-left: 18px;
}

.section2-box a.header-login {
    font-size: 13px;
    padding-left: 11px !important;
    padding-right: 11px !important;
}

.section3 ul {
    list-style: none;
    font-family: WorkSans;
    color: #535353;
}

.section3 ul p {
    line-height: 25px;
    font-family: WorkSans;
    color: #535353;
}

.pheader {
    color: #1C1C1C !important;
    margin-top: 18px;
}

.section3-box h2{
    font-family: 'WorkSansBold';
    margin-bottom:15px;
    color: #1C1C1C;
    font-size: 34px;
}

.section3-box p{
    font-family: 'WorkSans';
    margin-bottom:15px;
    color: #535353;
    font-size: 18px;
}

.section4 .section2 {
    min-height: 253px;
    padding:12px;
}

.section4 h3, .section2-box h3{
    font-family: 'WorkSansBold';
    font-size: 17px;
}

.section2-box h3{
    margin-top: 23px;
}

.section4 p{
    font-family: 'WorkSans';
} 

.section4-box h2 {
    font-family: 'WorkSansBold';
    margin-bottom: 30px;
}

.section4-box {
    background: URL('/assets/images/home/dmp_gradient2.png');
    background-repeat: no-repeat;
    background-size: 71% 55%;
    background-position-y: 81px;
    background-position-x: 338px;
}

.section4-box .section2{
    z-index: 999;
}

.section4-box .section2 {
    z-index: 999999 !important;
    position: relative;
    background: #ffffff;
    padding: 30px;
    text-align: center;
}

.header-knowledge-base {
    font-family: 'WorkSans';
    color: #3884D2;
    font-weight: 700;
    font-size: 18px!important;
}

.section6 .section2, .section7 .section2 {
    padding-top: 0px;
    padding-bottom: 0px;
}

.section5-container {
    padding: 15px;
}

.section5-container ul {
    list-style: none;
    display: inline;
}

.section5-container p{
    font-weight: bold;
}

.section5-container p, .section5-container a {
    font-family: 'WorkSans';
}

.section5-container h3, .section5-container h2{
    font-family: 'WorkSansBold';
}

.section5-container h3 {
    margin-bottom:20px;
    color: #3884D2;
}

.section5-container h2 {
    margin-bottom:25px;
    margin-top:25px;
}

.section5-box.mobile{
    display:none;
}

.section5-box.desktop{
    display:block;
}

.section5-container  p.text {
    font-weight: normal;
}

.col-lg-12.divider {
    border-top: 1px solid #535353;
    margin: 20px 10px;
    padding-top:10px;
}

.col-lg-12.divider1{
    text-align: left;
}
.col-lg-6.divider2 {
    text-align: right;
}

.videocenter {
    display: flex;
    justify-content: center;
}

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 

    .section4-box h2{
        font-size:29px !important;
    }

    .section6-box h2, .section5-box h2, .section3-box h2, .section2-box h2 {
        font-size: 28px !important;
    }

    .section1 h1 {
        font-size: 36px !important;
    }    

    .section5-box.mobile{
        display:block;
    }
    

    .section4-box .section2 {
        background:none;
    }

    .section4-box {
        background-position-y: 118px;
        background-size: 102% 49%;
        background-position-x: -1px;        
    }    

    .section2 {
        margin: 14px;
    }

    .section2-box .section2 {
        width: 92%;
    }    

    .section3 ul {
        padding-left: 0px !important;
    }    

    .col.marker {
        max-width: 23% !important;
    }

    #logo img {
        height: 44px !important;
        width: 100%;
    }

    .demo-banner span.demo-text {
        font-family: 'WorkSans';
        font-size: 14px;
        padding-top: 0px !important;
        padding-right:10px;
    }
    
    .demo-banner .btnDemo {
        font-family: 'WorkSans';
        font-size: 12px;
        min-width: 50px;
        padding: 4px 1px 4px 4px;
        width: 100px;
    }    

    .demo-label {
        margin-top: 0px !important;
        display: inline-flex !important;
        padding-top: 17px;
    }

    .mmenu-trigger-home {
        display: block;
    }    

    /*when menu on mobile*/
    #header .right-side{
        display: none;
    }
    #navigation{
        display:none;
    }
    #navigation ul{
        display: inline-grid;
    }
    #header-container {
        width: 95%;
        /*height: 200px;*/
        box-shadow: none;
    }
    /*when menu on mobile*/

    

    .home-glazier, .home-drafter, .home-engineer {
        margin-top: 12px !important;
    }

}

.section6-box h2, .section5-box h2, .section4-box h2,
.section3-box h2, .section2-box h2{
    font-size:45px;
}