/* Control width: Normal on large screens, full-width on small screens */
@media (min-width: 768px) {
    .modal-right.large .modal-dialog {
        max-width: 65% !important; /* Half width on larger screens */
    }
}

@media (min-width: 768px) {
    .modal-right.medium .modal-dialog {
        max-width: 55% !important; /* Half width on larger screens */
    }
}

@media (max-width: 767px) {
    .modal-right.large .modal-dialog {
        max-width: 100% !important; /* Full width on small screens */
    }
}

.modal-backdrop {
    background-color: rgba(50, 155, 125, 0.6);
}

 .modal-backdrop.show {
        opacity: .8;
  }

.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content: "|";
    /*color: white;*/
}

/*html[data-placement=horizontal][data-dimension=mobile] main, html[data-placement=vertical][data-dimension=mobile] main {
    padding-left: 0 !important;
    padding-top: 64px !important;
}*/

/*Altura Menu*/
html[data-placement=horizontal] .nav-container {
    height: 5.5rem;
}

/*Altura Footer*/
html[data-footer=true] #root > footer {
    height: 5.5rem;
}

body {
    overflow-x: hidden;
}

/*PARA ANIMAÇÃO*/
/* DEMO GENERAL ============================== */
.hover {
    overflow: hidden;
    position: relative;
    padding-bottom: 53%;
 /*   padding-bottom: 60%; alterei para cursos*/ 
    cursor: pointer;
}

.hover-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    transition: all 0.4s;
}

.hover img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.3s;
}

.hover-content {
    position: relative;
    z-index: 99;
}


/* DEMO 1 ============================== */
.hover-1 img {
    width: 105%;
    position: absolute;
    top: 0;
    left: -5%;
    transition: all 0.3s;
}

.hover-1-content {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 99;
    transition: all 0.4s;
}

.hover-1 .hover-overlay {
    background: rgba(0, 0, 0, 0.5);
}

.hover-1-description {
    transform: translateY(0.5rem);
    transition: all 0.4s;
    opacity: 0;
}

.hover-1:hover .hover-1-content {
    bottom: 2rem;
}

.hover-1:hover .hover-1-description {
    opacity: 1;
    transform: none;
}

.hover-1:hover img {
    left: 0;
}

.hover-1:hover .hover-overlay {
    opacity: 0;
}


/* DEMO 2 ============================== */
.hover-2 .hover-overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.1));
}

.hover-2-title {
    position: absolute;
    top: 50%;
    left: 0;
    text-align: center;
    width: 100%;
    z-index: 99;
    transition: all 0.3s;
}

.hover-2-description {
    width: 100%;
    position: absolute;
    bottom: 0;
    opacity: 0;
    left: 0;
    text-align: center;
    z-index: 99;
    transition: all 0.3s;
}

.hover-2:hover .hover-2-title {
    transform: translateY(-1.5rem);
}

.hover-2:hover .hover-2-description {
    bottom: 0.5rem;
    opacity: 1;
}

.hover-2:hover .hover-overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1));
}


/* DEMO 3 ============================== */
.hover-3::after {
    content: '';
    width: calc(100% - 3rem);
    height: calc(100% - 3rem);
    border: 1px solid #fff;
    position: absolute;
    top: 1.5rem;
    left: 1.5rem;
    z-index: 90;
    transition: all 0.3s;
    transform: scale(1.1);
    opacity: 0;
    display: block;
    opacity: 0;
}

.hover-3-content {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    text-align: center;
    z-index: 99;
}

.hover-3-description {
    opacity: 0;
    transform: scale(1.3);
    transition: all 0.3s;
}

.hover-3 img {
    width: 110%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hover-3 .hover-overlay {
    background: rgba(0, 0, 0, 0.2);
}

.hover-3:hover img {
    width: 100%;
}

.hover-3:hover::after {
    opacity: 1;
    transform: none;
}

.hover-3:hover .hover-3-description {
    opacity: 1;
    transform: none;
}

.hover-3:hover .hover-overlay {
    background: rgba(0, 0, 0, 0.8);
}


/* DEMO 4 ============================== */
.hover-4 img {
    width: 110%;
   /* top: 50%; alterei para curos*/
   top:53%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.hover-4 .hover-overlay {
    /*//background: rgba(0, 0, 0, 0.4);*/
    z-index: 90;
}

.hover-4-title {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 1rem;
    z-index: 99;
    opacity: 0;
}

.hover-4-description {
    position: absolute;
    top: 2rem;
    left: 1rem;
    text-align: left;
    /*border-right: 3px solid #fff;*/
    padding: 0 1rem;
    z-index: 99;
    transform: translateX(-1.5rem);
    opacity: 0;
    transition: all 0.3s;
}

/*@@media (min-width: 992px) {
            .hover-4-description {
                width: 50%;
            }
        }*/

.hover-4:hover img {
    width: 100%;
}

.hover-4:hover::after {
    opacity: 1;
    transform: none;
}

.hover-4:hover .hover-4-description {
    opacity: 1;
    transform: none;
}

.hover-4:hover .hover-4-title {
    opacity: 1;
    transform: none;
}

.hover-4:hover .hover-overlay {
    background: rgba(50, 155, 125, 0.6);
}


/* DEMO 5 ============================== */
.hover-5::after {
    content: '';
    width: 100%;
    height: 10px;
    background: #47c650;
    position: absolute;
    bottom: -10px;
    left: 0;
    display: block;
    transition: all 0.3s;
    z-index: 999;
}

.hover-5 .hover-overlay {
    background: rgba(0, 0, 0, 0.4);
}

.hover-5-title {
    position: absolute;
    bottom: 1rem;
    left: 0;
    transition: all 0.3s;
    padding: 2rem 3rem;
    z-index: 99;
}

    .hover-5-title span {
        transition: all 0.4s;
        opacity: 0;
        color: #47c650;
    }

.hover-5:hover .hover-overlay {
    background: rgba(0, 0, 0, 0.8);
}

.hover-5:hover .hover-5-title {
    bottom: 0;
}

    .hover-5:hover .hover-5-title span {
        opacity: 1;
    }

.hover-5:hover::after {
    bottom: 0;
}


.swal2-popup {
    font-size: .9rem !important;
}

.swal-title-custom {
    font-size: 20px;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    background-color: #329a7d;
    color: #fff;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-deny {
    background-color: #dadada;
    color: #fff;
}

.select2-container .select2-selection--single {
    height: 52px;
}