[data-component="create-a-report"] {
    margin-left: 15px;
    margin-right: 15px;
}

.create-report-cmpnt{
    margin-bottom:3rem;
    .highlight-container{
        background:#e8e8e8;
        padding:3rem 1rem 1rem 1rem;
        margin-top:-1rem;
        text-align:center;
        @media (max-width:991px){
            margin-top:-0.5rem;
        }
        @media (max-width:767px){
            margin-top:-1.4rem;
        }
    }

    .cr-spacer{
        margin-bottom:3.6rem;
        @media (max-width:991px){
            margin-bottom:2rem;
        }
    }
    .add-subsection{
        @media (max-width:991px){
            margin-bottom:2.6rem;
        }
    }
    h3, h4, h5{
        color:#00A982;
        line-height:2;
        @media (max-width:991px){
            margin-bottom:1.4rem;
        }
    }
    h5{
        border-bottom:2px solid #00A982;
    }
    h6{
        &.head-count{
            padding-right:22px;
        }
    }
    button, .btn{
        border:0;
        display:block;
        margin:0 auto;
        width:70%;
    }
    .form-group.has-float-label{
        margin-top:1rem;
        margin-bottom:0.4rem;
    }
    input[type=checkbox]:not(old)+label span {
        line-height:0.7;
    }
    .form-group.has-float-label .invalid-feedback{
        margin-top:0;
        margin-bottom:0;
        display:none;
    }
    input:user-invalid {   border: 2px solid red; }

    input:user-invalid ~ .invalid-feedback { display:inline; }

    a{
        &.add-link{
            &:before{
                content:"\e61a";
                position:relative;
                display:inline-block;
                font-family: themify;
                margin-right:0.4rem;
                top:1px;

            }
        }
    }
    p{
        &.empty-msg{
            margin-top:1rem;
        }
    }
    .count{
        background:blue;
        border-radius:50%;
        width:24px;
        height:24px;
        font-size:12px;
        color: #ffffff;
        position:absolute;
        top:9px;
        right:14px;
        line-height:24px;
        text-align:center;
        &.zero{
            background:#cccccc;
            color: #002677;
        }
    }
    .list{
        list-style:none;
        padding:0;
        margin-top:1.2rem;
        li{
            position:relative;
            padding:0.6rem 1.5rem 0.6rem 0;
            position:relative;
            margin-bottom:0;
            border-top:1px solid #cccccc;
            &:last-child{
                border-bottom:1px solid #cccccc;
            }
            label{
                margin:0;
                width:100%;
                padding-right:24px;
                font-size:1rem;
            }
        }
    }
    .list-close{
        background:transparent;
        width:24px;
        height:24px;
        margin:auto;
        position:absolute;
        right:0;
        top:0;
        bottom:0;
        text-align:center;
        &:before{
            content:"\e646";
            font-family: themify;
            font-style: normal;
            font-weight: 400;
            color:#cccccc;
        }
        &:hover{
            &:before{
                color:blue;
            }
        }
    }
}