/* Nav - CSS */
#nav
{
	display: grid;
		
	align-self: start;
	
	grid-template-columns: auto;
	
	padding: 16px 0;
	
	background-color: #784c57;
	
	z-index: 4;
}

#nav-inner
{
	display: grid;
	justify-self: center;
}

@media( min-width: 768px )
{
	#nav
	{
		grid-template-columns: auto 768px auto;
	}
	
	#nav-inner
	{
		grid-column: 2;
	}
}

@media( min-width: 992px )
{
	#nav
	{
		grid-template-columns: auto 992px auto;
	}
}

@media( min-width: 1200px )
{
	#nav
	{
		grid-template-columns: auto 1200px auto;
	}
}

@media( min-width: 1600px )
{
	#nav
	{
		grid-template-columns: auto 1500px auto;
	}
}

/* - */

#nav-inner
{
	justify-content: center;
	align-content: center;
	grid-gap: 32px;
}

	
@media( min-width: 992px )
{
	#nav-inner
	{		
		justify-content: space-between;
		grid-template-columns: max-content auto max-content;
	}
}


#nav-links
{
	display: none;
	grid-gap: 16px;	
}

@media( min-width: 992px )
{
	#nav-links
	{
		display: grid;
		grid-column: 3;	
		align-self: center;		
		grid-gap: 32px;
	}
	
}

#nav-links a
{
	text-decoration: none;
	color: #eee;
	text-transform: uppercase;	
	font-weight: bold;
}

@media( min-width: 992px )
{
	#nav-links a
	{
		grid-row: 1;
		font-size: 15px;
		letter-spacing: 3px;
		transition: border ease .5s;
		padding: 8px 16px;
	}	
	.active-link
	{
		color: #fff!important;
		background-color: #111;
	}
	.active-link a
	{
		color: #fff!important;
	}	
}

#nav-links a
{
	transition: ease .5s color;
}

#nav-links a:hover
{
	color: #fff!important;
	cursor: pointer;
}






.show-nav
{
	display: grid!important;
}


/* - */

.page-link
	{
		padding: 5px 15px;
		justify-self: center;
		text-align: center;
	}

@media( min-width: 992px )
{
	.page-link
	{
		grid-row: 1;
	}
}

/* - */

/* DROPDOWN */

@media(max-width:992px) {
  .page-linkdrop {

  }
}
.dropdown-outer:hover .dropdown-container 
{
    display: grid!important;
}

.dropdown-container
{
    display: block;
    background-color: #784c57;
    padding: 16px;
    grid-gap: 8px;
}

.dropdown-outer:hover .dropdown-container
{
    display: block!important;
}

.dropdown-outer:hover .dropdown-container p
{
    justify-self: center;
    text-align: center;
}


.dropdown-container p {
justify-self: center;
}

@media( min-width: 992px )
{ 
    .dropdown-outer
    { 
        grid-row:1;
    } 
}
@media( min-width: 992px )
{
    .dropdown-container
    {
        display: none;
        position: absolute;
        z-index: 4;
        background-color: #784c57;
        padding: 16px;
        grid-gap: 8px;
    }
}
.caret {
 display:inline-block;
 width:0; height:0; 
margin-left:2px; 
vertical-align:middle; 
border-top:4px solid; 
border-right:4px solid transparent; 
border-left:4px solid transparent; 
color: #784c57; 
}

.active-link .caret {
    color: #784c57;
}

/* - */

.burger-container
{
	display: grid;
	grid-row: 1;
	width: 32px;
	justify-self: center;
}

@media( min-width: 992px )
{
	.burger-container
	{
		display: none!important;
	}
}

.burger-icon
{
	font-size: 32px;
	align-self: center;
	grid-row: 1;
	grid-column: 1;
	justify-self: center;
    color: #fff;
}

#burger-bars
{

}

#burger-cross
{

}