top@charset "utf-8";
/* CSS Document */
.navbar{
	padding-top: 0;

}

/* Animation to fade in the dropdown menus*/
@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Assigning the above animation to all dropdown menus*/
.dropdown-menu{
    &.show{
        -webkit-animation: fadeIn 0.3s alternate; /* Safari 4.0 - 8.0 */
         animation: fadeIn 0.3s alternate;
		background-color: #f9f9f9;
    }
}

/* Mega Menu adjustments*/
.nav-item.dropdown.dropdown-mega{
    position: static;
    .dropdown-menu{
        width: 90%;
        top: auto;
        left: 5%;
		border-bottom: 8px solid black;
    }
}

/* Complete styles for main navbar toggler and hamburger menu*/
.navbar-toggler{
    border: none;
    padding: 0;
    outline: none;
    &:focus{
        box-shadow: none;
    }
    .hamburger-toggle{
        position: relative;
        display: inline-block;
        width: 50px;
        height: 50px;
        z-index: 11;
        float: right;
        .hamburger {
            position: absolute;
            transform: translate(-50%, -50%) rotate(0deg);
            left: 50%;
            top: 50%;
            width: 50%;
            height: 50%;
            pointer-events: none;
            span {
                width: 100%;
                height: 2.5px;
                position: absolute;
                background: #333;
                border-radius: 2px;
                z-index: 1;
                transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0), background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), all 0.2s ease-in-out;
                left: 0px;
                &:first-child{
                    top: 10%;
                    transform-origin: 50% 50%;
                    transform: translate(0% -50%) !important;
                }
                &:nth-child(2){
                    top: 50%;
                    transform: translate(0,-50%);
                }
                &:last-child{
                    left: 0px;
                    top: auto;
                    bottom: 10%;
                    transform-origin: 50% 50%;
                }
            }
            &.active{
                span {
                    position: absolute;
                    margin: 0;
                    &:first-child{
                        top: 45%;
                        transform: rotate(45deg);
                    }
                    &:nth-child(2){
                        left: 50%;
                        width: 0px;
                    }
                    &:last-child{
                        top: 45%;
                        transform: rotate(-45deg);
                    }
                }
            }
        }
    }
}


.icons{
  display: inline-flex;
  margin-left: auto;
  a{
    transition: all 0.2s ease-in-out;
    padding: 0.2rem 0.4rem;
    color: #ccc !important;
    text-decoration: none;
    &:hover{
      color: white;
      text-shadow: 0 0 30px white;
    }
  }
}



.navbar .navbar-nav .nav-link {
  font-size: 1em;
  padding: 0.75em 0.5em 0.25em;
}
@media screen and (min-width: 768px) {

  .navbar-brand {
    margin-right: 0;
    padding: 0 1em;
	  max-width: 80%;
	  font-size: 1em;
  }
	
	.navbar .navbar-nav .nav-link {
  font-size: 1em;
  padding: 0.75em 0.5em 0.25em;
}
}

.toptext{
	text-align: center;
	background-color: #ae122a;
	color:#fff;
	margin-bottom: 0;
	padding: 1%;
	/*text-transform: uppercase;
	! border-top: 5px solid #ffd619; */
	font-size: 1.75em;
}



@media screen and (max-width: 1199px) {
	.toptext{
		font-size: 1.35em;
	}
}

@media screen and (max-width: 767px) {
	.toptext{
		font-size: 1.15em;
	}
}



a .nav-link .active {
	color: #ae122a;
	font-weight: 800;
}