.accordion {
    letter-spacing: 0.1px !important;
    background-color: transparent;

    .card {
        background-color: #FFFFFFCC;
        .card-header {
            background-color: #d08e78;
            padding: 16px 0px;

            .card-title {
                color: $white;
                text-shadow: none;
                font-weight: 700;
                padding: 18px 8%;
                @include media-breakpoint-down(md){
                    padding:0 30px;
                }

                .accordion-toggle {
                    &:hover{
                        text-decoration: none;
                    }

                    &:after {
                        content: "\f078";
                    }
                }
            }
        }

        .iconbox {
            background-color: transparent;
            border: none;
            color: $quaternary-color;
            text-transform: none;
            height: auto;
            // pointer-events: none;
            @include media-breakpoint-down(sm){
                padding: 0px;
            }

            &.rounded {
                border-radius: 360px;
            }
            >.icon {
                position: relative;
                top: 0px;
                left: 0px;
                height: 100px;
                width: 100px;
                margin-bottom: 40px;
                @include media-breakpoint-down(sm){
                    margin-bottom: 10px;
                }
                &:before {
                    content: "\00a0";
                    position: absolute;
                    width: 130px;
                    height: 130px;
                    top: 0px;
                    left: 0px;
                    background-color: $primary-bg;
                    transform: translate(-15px, -15px);
                    border-radius: 360px;
                }
                .icon-image {
                    position: absolute;
                    top:50%;
                    left:50%;
                    transform: translate(-50%, -50%);
                    height:80%;
                    width:80%;
                    background: $quaternary-color;
                }
            }
        }
    }

    .card-body {
        padding-top: 0;

        .frame-type-text {
            p,li{
                color: #444444;
            }
        }

        .container {
            padding: 0px 120px;
            @include media-breakpoint-down(md){
                padding:0 30px;
            }
        }
        h3 {
            color: #444444;
        }
        //figure.image:before {
        //    content: "";
        //    width: 100%;
        //    height: 80%;
        //    float: left;
        //    position: absolute;
        //    bottom: 0;
        //    left: 0;
        //    z-index: 1;
        //    background: transparent linear-gradient(180deg, #00000000 0%, #00273380 81%, #000a0eb4 100%) 0% 0%;
        //}

        .row {
            .col-sm-12 {
                &:nth-of-type(1) {
                    .icon {
                        .icon-image {
                            background: $quaternary-color;
                        }
                    }
                }
                &:nth-of-type(2) {
                    .icon {
                        .icon-image {
                            background: $tertiary-color;
                        }
                    }
                }

                &:nth-of-type(3) {
                    .icon {
                        .icon-image {
                            background: $tertiary-bg;
                        }
                    }
                }
            }
        }
    }

    ul {
        color: $black;
        line-height: 1.3;
        li {
            padding-bottom: 7px;
        }
    }
}
