h1,h2,h3,h4,h5,h6,p,a,input,div,span, li, ul, label, span, button {
    font-family: Rubik, sans-serif;
}

#logo-div{
    margin-bottom: 25px;
}

a {
    color:white!important;
    text-decoration:none!important;
}
a:hover{
    text-decoration: underline!important;
    color:white!important;
}

#family-content{
    margin-top: 12rem;margin-bottom: 2rem;
}

#header-logo{
    width:100%; height:100%
}

#banner-title{
    font-size:25px
}

h1{
    font-size:60px;
    font-weight:bolder;
    line-height:71px;
}

h3{
    font-size:33px;
    display:inline-block;
}

p {
    font-size:16px;
    line-height:26px;
}

ul{
    list-style:none;
    padding-left:0;
}

li {
    line-height:33px;
    font-size:16px;
}

ul {
    padding-left:30px;
    list-style-image: url('/images/icons/Vector.png')
}

#whatis {
    list-style-image:none;
}

#whatis svg{
    margin-right:5px;
}

li::marker {
   vertical-align: text-bottom;
}

.basic-shadow {
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.21);
}

.container {
    border-radius: 10px;
}

.list-item h3{
    margin-bottom:30px;
    font-weight:bolder;
}

.list-item {
    margin-bottom: 20px;
}


.list-item img{
    padding-bottom: 15px;
}

#functions-list li{
    line-height:25px;
    margin-bottom: 10px;
}

#contactUs input{
    margin-bottom:20px;
}

.footer-list p {
    font-size: 18px;
    margin-bottom: 2rem;
    line-height: 20px;
}


#functions img {
    border-bottom-left-radius:10px;
    border-top-left-radius:10px;
}

#broker-text {
    padding:3rem;
}

#second-list {
    height:81rem;
}

#second-list li {
    line-height: 25px;
    margin-bottom: 10px;
}

#family-row {
    display:flex;

}
#family-image-mobile{
    display:none;
}

#family-fluid {
    position:relative;
    padding:0;

}

#manager-section li {
    line-height:25px;
    margin-bottom: 1rem;

}

@media screen and (max-width: 1200px) {
    #family-content{
        width:70% !important;
        margin-top: 12rem;margin-bottom: 2rem;
    }

    #banner-title{
        font-size:20px
    }

    #family-image {
        display: none;
    }

    #family-image-mobile {
        display: block;
    }

    #family-fluid div.col-lg-7 {
        width: 100%;
        display: flex;
        flex-direction: column;
        /*align-items: center;*/
    }

    #family-fluid div.col-lg-7 h3 {
        /*text-align: center;*/
    }

    /*#family-fluid {*/
    /*    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("/images/family.png") !important;*/
    /*    background-position-x: -46rem!important;*/

    /*}*/
}


.list-item img{
    margin-right: 10px;
}

@media screen and (max-width: 991px) {

    #logo-div{
        margin-bottom: 30px !important;
    }

    #family-fluid {
        height:30rem;
        position:relative;
        background: none !important;
    }

    #header-logo{
        width:80%; height:65%;margin-top: 2rem;
    }

    #family-content {
        width:100% !important;
        margin-top: 15rem;margin-bottom: 2rem;
    }
    #family-mobile {
        position:absolute;
        top:0;
        display:block!important;
        width:100%;
    }

    #family-fluid {
        background-position-x: -58rem!important;
    }

    #functions img {
        border-bottom-left-radius:0px;
        border-top-left-radius:10px;
        border-top-right-radius:10px;
    }
    #second-list {
        height:unset;
    }

    header h3{
        font-size:24px;
    }
    #broker-text {
        padding-top:0;
    }
    h1{
        font-size:35px;
    }

    #family-fluid{
        margin-bottom: 3rem!important;
    }
    #family-fluid h3{
        text-align: center;
    }
    #family-fluid div.row.w-50.mb-3 {
        width:100%!important;

    }
    @media screen and (max-width: 991px) {
        /*#family-fluid {*/
        /*    height: 45rem;*/
        /*}*/
        #family-content{
            width: 90% !important;
        }
    }

    @media screen and (max-width: 936px) {

        /*#header-logo{*/
        /*    display: none;*/
        /*}*/
        #family-content{
            width: 90% !important;
        }
        /*#banner-title{*/
        /*    display: none;*/
        /*}*/

    }

    @media screen and (max-width: 800px) {

        #header-logo{
            width:80%; height:100%;margin-top: 0rem;
        }
    }


    @media screen and (max-width: 668px) {
        #logo-div{
            margin-bottom: 10px !important;
        }

        #family-fluid {
            height:20rem;
            position:relative;
            background: none !important;
        }
        #family-content{
            width: 90% !important;
        }

        #header-logo{
            width:60%; height:100%;margin-top: 0rem;
        }

        #family-content {
            width:100% !important;
            margin-top: 12rem;margin-bottom: 2rem;
        }
        #banner-title{
            font-size: 15px;
        }

    }

    @media screen and (max-width: 576px) {

        #family-fluid {
            height:15rem;
            position:relative;
            background: none !important;
        }

        #family-content {
            width:100% !important;
            margin-top: 10rem;margin-bottom: 2rem;
        }

        /*#family-content{*/
        /*    !*width: 100% !important;*!*/
        /*    margin: 0 2rem 0 2rem!important;*/
        /*    margin-top: 2rem!important;*/
        /*}*/
        /*#family-fluid {*/
        /*    height:35rem!important;*/
        /*}*/
        #whatis li {
            display: flex;
        }
        .smaller-svg{
            height: 21px;
            width: 21px;
        }


        ul li {
            line-height:19px!important;
            padding-bottom: 15px;
        }

        #second-logo img {
            height: 30px;
            margin-top: 13px;
        }
    }

    @media screen and (max-width: 500px) {
        #family-content {
            width:100% !important;
            margin-top: 10rem;margin-bottom: 2rem;
        }
        #header-logo{
            width:50%; height:100%;margin-top: 0rem;
        }
        #banner-title{
            font-size: 12px;
        }
    }
    @media screen and (max-width: 444px) {
        #family-content {
            width:100% !important;
            margin-top: 8rem;margin-bottom: 2rem;
        }
        #header-logo{
            width:80%; height:100%;margin-top: 0rem;
        }
        #banner-title{
            font-size: 10px;
        }
    }
    @media screen and (max-width:400px) {
        #family-fluid {
            height: 12rem;
            position: relative;
            background: none !important;
        }
    }

    @media screen and (max-width:380px) {
        #family-fluid {
            height: 10rem;
            position: relative;
            background: none !important;
        }

        #logo-div{
            margin-bottom: 10px !important;
        }
    }

    @media screen and (max-width: 350px) {

        #logo-div{
            margin-bottom: 10px !important;
        }


        #family-fluid {
            height: 10rem;
            position: relative;
            background: none !important;
        }

        #family-content{
            margin-top:7rem !important;
            padding-left: 35px;
        }

        #banner-title{
            font-size: 10px !important;
        }
        #second-logo  {
            padding: 0;
            margin-left:7px
        }

        #second-logo img {
            height: 20px;
            margin-top: 0px;
        }

        h1 {
            font-size: 30px !important;
            line-height: 40px;
        }

        h2 {
            font-size: 25px !important;
        }

        h3 {
            font-size: 20px !important;
        }

        p, li {
            font-size: 10px !important;
        }

        li::before {
            width: 2.5em;
        }

        .list-item img {
            height: 40px;
            margin-top: 10px;
        }
    }

    @media screen and (max-width: 320px) {

        #logo-div{
            margin-bottom: 10px !important;
        }

        #family-content{
            margin-top:6rem !important;
            padding-left: 30px;
        }

        #banner-title{
            font-size: 10px !important;
        }
        #second-logo  {
            padding: 0;
            margin-left:7px
        }

        #second-logo img {
            height: 20px;
            margin-top: 0px;
        }

        h1 {
            font-size: 30px !important;
            line-height: 40px;
        }

        h2 {
            font-size: 25px !important;
        }

        h3 {
            font-size: 20px !important;
        }

        p, li {
            font-size: 10px !important;
        }

        li::before {
            width: 2.5em;
        }

        .list-item img {
            height: 40px;
            margin-top: 10px;
        }
    }
}