@charset "UTF-8";
/*-----------------------*/
/*    divider-style-1    */
/*-----------------------*/
.section-divider-container{
    display: flex;
    position: relative;
    width: 100%;
    height: 300px;
    z-index: 2;
}
.divider{
    position: absolute;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.divider svg{
    position: relative;
    display: block;
    width: 100%;
    height: 300px;
}
.divider.up{
    transform: rotateX(0deg);
}
.divider.down{
    transform: rotateX(180deg);
}
#divider-2, #divider-3 {
    .divider path:nth-of-type(2) {
        fill: #FFFFFF;
    }
}

#divider-4 .divider {
    background-color: #EEEEEE;
}
#divider-4 .divider path:nth-of-type(1),
#divider-4 .divider path:nth-of-type(3) {
    fill: #FFFFFF;
}
#divider-4 .divider path:nth-of-type(2) {
    fill: #EEEEEE;
    transform: translateY(-1px);
}
#divider-5 .divider {
   filter: drop-shadow(0 -25px 10px rgba(31, 31, 31, 0.25));
}
#divider-5 .divider path:nth-of-type(1),
#divider-5 .divider path:nth-of-type(3) {
    fill: #FFFFFF;
}
#divider-5 .divider path:nth-of-type(2) {
    fill: #EEEEEE;
    transform: translateY(-1px);
}
#divider-6 .divider path:nth-of-type(1),
#divider-6 .divider path:nth-of-type(3) {
    fill: #FFFFFF;
}

@media (max-width: 767px) and (orientation: portrait) {
    .section-divider-container{
        display: flex;
        position: relative;
        width: 100%;
        height: 150px;
        z-index: 2;
    }
    .divider svg{
        position: relative;
        display: block;
        width: 100%;
        height: 150px;
    }
}
@media (max-width: 767px) and (orientation: landscape) {
    .section-divider-container{
        display: flex;
        position: relative;
        width: 100%;
        height: 200px;
        z-index: 2;
    }
    .divider svg{
        position: relative;
        display: block;
        width: 100%;
        height: 200px;
    }
}

/* ----------- */
/*   TABLETS   */
/* ----------- */
@media (min-width: 768px) and (max-width: 1200px) and (orientation: portrait) and (hover: none) and (pointer: coarse) {
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) {
}

/* ------------------- */
/*  DESKTOP & LAPTOPS  */
/* ------------------- */
/* Small Desktops and Laptops */
@media (max-width: 1200px) and (hover: hover) and (pointer: fine) {
    
}
@media (min-width: 1201px) and (max-width: 1680px) and (hover: hover) and (pointer: fine)  {
}