/*Section Pools and Beaches*/

.icbig {
    width: 50px;
    height: 50px;
    display: inline-block;
    vertical-align: -webkit-baseline-middle;
}

    .icbig.beach1 {
        background: url('/site/common/icons/beach01.png') no-repeat;
    }

    .icbig.beach2 {
        background: url('/site/common/icons/beach02.png') no-repeat;
    }

    .icbig.beach3 {
        background: url('/site/common/icons/beach03.png') no-repeat;
    }

.carousel-control-next, .carousel-control-prev {
    opacity: 1;
}

.pool-slider .bi-chevron-right {
    margin-right: -100%;
}

.pool-slider .bi-chevron-left {
    margin-left: -100%;
}

.pool-slider i {
    color: black;
    font-size: 1.5em;
    padding: 15px 17px;
    background-color: white;
    border: solid 2px white;
    border-radius: 50%;
}

.swiper-button-next:after {
    content: '\f285';
}

.swiper-button-prev:after {
    content: '\f284';
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-family: bootstrap-icons !important;
    font-size: 1.5em;
    color: black;
    border: solid 2px white;
    border-radius: 50%;
    background-color: white;
    padding: 15px 17px;
}

/*RESPONSIVE SETTINGS*/

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
}


/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {

    .swiper-button-next {
        right: 18%;
    }

    .swiper-button-prev {
        left: 14.5%;
    }
}

/*X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .swiper-button-next {
        right: 17.5%;
    }

    .swiper-button-prev {
        left: 15%;
    }
}

/*XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    .swiper-button-next {
        right: 17.5%;
    }

    .swiper-button-prev {
        left: 15.5%;
    }
}

/*XXX-Large devices (larger desktops, 1900px and up)*/
@media (min-width: 1920px) {
    .swiper-button-next {
        right: 19.5%;
    }

    .swiper-button-prev {
        left: 17.5%;
    }
}
                                        