* {
        box-sizing: border-radius;
        font-size: 1rem;
    }
    
    .items {
        width: 95%;
        background: #fffffe;
        /* box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    border-top: 10px solid #095e80; */
        height: 82%
    }
    
    .items-head p {
        padding: 5px 20px;
        margin: 10px;
        color: var(--button_text_color_invert);
        font-weight: bold;
        font-size: var(--size_body);
    }
    
    .items-head hr {
        width: 20%;
        margin: 0px 30px;
        border: 1px solid var(--button_color);
    }
    
    .items-body {
        padding: 10px;
        margin: 10px;
        display: grid;
        grid-gap: 10px;
    }
    
    .items-body-content {
        padding: 10px;
        padding-right: 0px;
        display: grid;
        grid-template-columns: 10fr 1fr;
        font-size: 13px;
        grid-gap: 10px;
        border: 1px solid transparent;
        cursor: pointer;
        border-radius: 15px;
        border: 1px solid var(--button_color);
    }
    
    .items-body-content:hover,
    .items-body-content:active {
        background-color: var(--button_color);
        border: 1px solid var(button_color_invert);
        color: var(--button_text_color);
    }
    
    .items-body-content:hover i,
    .items-body-content:active i {
        color: var(--button_text_color);
        animation: None;
    }
    
    .items-body-content i {
        align-self: center;
        font-size: 15px;
        color: var(--button_text_color_invert);
        font-weight: bold;
        animation: icon 1.5s infinite forwards;
    }
    
    .video {
        background-color: var(--button_color_invert);
        color: var(--button_text_color_invert);
        border-radius: 15px;
        border: 1px solid var(--button_color);
    }
    
    .video:hover {
        background-color: var(--button_color);
        border: 1px solid var(--button_color_invert);
        color: var(--button_text_color);
    }
    
    @keyframes icon {
        0%,
        100% {
            transform: translate(0px);
        }
        50% {
            transform: translate(3px);
        }
    }
    
    .plan_detail {
        font-size: 18px;
        color: maroon;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    
    @media (max-width: 320px) {}
    
    @media (max-width: 767px) {}
    
    @media (min-width: 768px) and (max-width: 991px) {}
    
    @media (min-width: 992px) and (max-width: 1199px) {}
    
    @media (min-width: 1200px) {}

    .al32db {
        margin-top: 10px;
        color: #2e3135;
    }
    .al32db:hover {
        color: white;
    }
    .items-body {
        margin-top: 5px;
        margin-bottom: 0px;
    }