body {
    position: relative;
}

#inner-page-wrapper .inner-page-container {
    padding: 0
}

.aiosCommunitiesElevate__item {
    width: calc(100% /4);
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding: 10px;
}

.aiosCommunitiesElevate__item--title {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) scale(1);
    width: 100%;
    text-align: center;
    z-index: 10;
    font-family: var(--font-family-title);
    font-size: 18px;
    letter-spacing: 1.25px;
    padding: 25px 0;
    text-transform: uppercase;
    transition: var(--default-transition);
    -webkit-transition: var(--default-transition);
}

.aiosCommunitiesElevate__item a .global-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    z-index: 11;
    margin: 0 auto;
    justify-content: center;
    opacity: 0;
    transition: var(--default-transition);
    -webkit-transition: var(--default-transition);
}

.aiosCommunitiesElevate__item a:hover .global-btn {
    opacity: 1;
}


.aiosCommunitiesElevate__item a:hover .aiosCommunitiesElevate__item--title {
    opacity: 0;
    transform: translateY(-50%) scale(0.8);
}

.aiosCommunitiesElevate__item--subtitle {
    -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
    position: absolute;
    color: #fff;
    z-index: 10;
    text-align: center;
    font-family: var(--global-secondary-font-family);
    font-size: 16px;
    font-style: italic;
    letter-spacing: 1px;
    line-height: 1.4;
}

a:hover .aiosCommunitiesElevate__item--subtitle {
    opacity: 1;
}

.aiosCommunitiesElevate__item--readmore {
    -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0 34px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
    position: absolute;
    letter-spacing: 1.5px;
    font-size: 12px;
    text-shadow: .5px 0 0 currentColor;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700;
    line-height: 1;
    z-index: 10;
}

a:hover .aiosCommunitiesElevate__item--readmore {
    opacity: 1;
    -webkit-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -ms-transform: translateY(90px);
    transform: translateY(90px);
}

a:hover .no-subtitle .aiosCommunitiesElevate__item--readmore {
             -webkit-transform: translateY(30px);
        -moz-transform: translateY(30px);
        -ms-transform: translateY(30px);
        transform: translateY(30px);
 }

.aiosCommunitiesElevate__item.aios-communities-has-text-shadow {
    text-shadow: 2px 2px 2px rgba(0,0,0,.5)
}

.aiosCommunitiesElevate__item a {
    display: block;
    position: relative;
    width: 100%;
    color: #fff;
    overflow: hidden;
}

.aiosCommunitiesElevate__item a canvas {
    width: 100%;
    height: auto;
    display: block;
    z-index: 1;
    height: 207px
}

.aiosCommunitiesElevate__item a img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-position: center;
    object-position: center;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: 3;
   -webkit-transition: var(--default-transition);
    transition: var(--default-transition);
}

.aiosCommunitiesElevate__item a:hover img {
    transform: scale(1.12);
}

.aiosCommunitiesElevate__item a:after {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--aios-communities-primary-color, #000);
    height: 100%;
    z-index: 8;
    opacity: 0.3;
    transition: all .4s ease-in-out
}

.aiosCommunitiesElevate__item a:hover:after {
    opacity: .7
}

.aiosCommunitiesElevate__item.aios-communities-show-overlay a:before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--aios-communities-overlay-color, #000);
    height: 100%;
    z-index: 7;
    opacity: var(--aios-communties-overlay-opacity, .8);
    transition: all .4s ease-in-out
}

.aiosCommunitiesElevate__item.aios-communities-show-overlay a:hover a {
    opacity: 0
}

.aiosCommunitiesElevate__pagination {
    padding: 60px 0 20px
}

.aiosCommunitiesElevate ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px
}

.aiosCommunitiesElevate ul li .page-numbers {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: var(--pagination-font-weight, 600);
    font-size: var(--pagination-font-size, 16px);
    line-height: var(--pagination-line-height, 12%);
    color: var(--pagination-color, #000000);
    text-align: center;
    border: 1px solid #AAAAAA;
    border-color: var(--pagination-border-color, #AAAAAA);
    transition: var(--transition, all .4s ease-in-out)
}

.aiosCommunitiesElevate ul li .page-numbers.current,
.aiosCommunitiesElevate ul li .page-numbers:not(.dots):hover {
    background: var(--pagination-background-hover, #000000);
    color: var(--pagination-color-hover, #fff);
    border-color: var(--pagination-border-color-hover, #000000)
}

.aiosCommunitiesElevate ul li .page-numbers.prev,
.aiosCommunitiesElevate ul li .page-numbers.next {
    font-size: var(--pagination-arrow-font-size, 14px)
}

.aiosCommunitiesElevate__items {
    display: flex;
    flex-flow: row wrap;
    margin: -10px;
    position: relative;
}

@media screen and (max-width: 1199px) {
    .aiosCommunitiesElevate__item--title {
        font-size: 16px;
    }
    
    .aiosCommunitiesElevate__item {
        padding: 5px;
    }
    
    .aiosCommunitiesElevate__items {
        margin: -5px;
    }
}
@media screen and (max-width: 991px) {
     .aiosCommunitiesElevate__item {
        width: 100%;
        display: block;
        max-width: 420px;
        margin: 0 auto;
    }

    .aiosCommunitiesElevate__items {
        display: block;
    }

    .aiosCommunitiesElevate__item a canvas {
        height: 250px;
    }
}


@media screen and (min-width: 1024px) {
    .aiosCommunitiesElevate__item a canvas {
        height:284px
    }
}

@media screen and (min-width: 1280px) {

    .aiosCommunitiesElevate__item a canvas {
        height: 400px
    }
}

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