/* Required height of parents of the Half Page Carousel for proper displaying carousel itself */
html,
body,
.view {
    height: 100%; }

/* Half Page Carousel itself*/
.carousel {
    height: 50%; }
.carousel .carousel-inner {
    height: 100%; }
.carousel .carousel-inner .carousel-item,
.carousel .carousel-inner .active {
    height: 100%; }

/* Adjustment for mobile devices*/
@media (max-width: 776px) {
    .carousel {
        height: 100%; } }

/* Navbar animation */
.navbar {
    background-color: rgba(13, 24, 179, 0.8); }

.top-nav-collapse {
    background-color: darkblue; }

/* Adding color to the Navbar on mobile */
@media only screen and (max-width: 768px) {
    .navbar {
        background-color: darkblue; } }

/* Footer color for sake of consistency with Navbar */
.page-footer {
    background-color: #929FBA; }
.btn-outline {
    color: inherit;
    background-color: transparent;
    transition: all .5s; }

.btn-rounded {
    border-radius: 60px;
    padding: 7px 18px; }
.btn-rounded.btn-lg {
    padding: .75rem 1.5rem; }
.btn-rounded.btn-sm {
    padding: .25rem .5rem;
    font-size: 12px; }
.btn-rounded.btn-xs {
    padding: .25rem .5rem;
    font-size: 10px; }
.btn-rounded.btn-md {
    padding: 12px 35px;
    font-size: 16px; }

.avisos{
    background-color: #00c292;
}
.avisos:hover {
    background-color: #00997B;
}

.leituras{
    background-color: #4527a0;
}
.leituras:hover {
    background-color: #6200ea;
}

.handebol{
    background-color: #b71c1c;
}
.handebol:hover {
    background-color: #990000;
}

.xadrez{
    background-color: #000000;
}
.xadrez:hover {
    background-color: #777;
}

.futsal{
    background-color: coral;
}
.futsal:hover {
    background-color: #fb8c00;
}

.danca{
    background-color: #e83e8c;
}
.danca:hover {
    background-color: #e84158;
}

.volei{
    background-color: #E67E22;
}
.volei:hover {
    background-color: #d58512;
}

.basquete{
    background-color: #FFC107;
}
.basquete:hover {
    background-color: #c80;
}

.ginastica{
    background-color: aquamarine;
}
.ginastica:hover {
    background-color: darkturquoise;
}

.patinacao{
    background-color: #00acee;
}
.patinacao:hover {
    background-color: #028ee1;
}

.robotica{
    background-color: #7639da;
}
.robotica:hover {
    background-color: #7460ee;
}

.motriz{
    background-color: #996000;
}
.motriz:hover {
    background-color: saddlebrown;
}