.section-nav{width:98%!important;padding-top:10px!important;padding-bottom:10px!important;}
.red-top-banner{
	background-color:#cb333b;
	padding:5px;
	transition:all 0.3s ease;
	display: flex;
    justify-content: space-between;
    transition:				all 0.5s ease;
}
.hide-banner{display:none;transition:all 0.5s ease;}
/* Add a background color to the top navigation */
.first-icon{
	float:					left;
	padding:				0px;
	margin:					0px;
}
.top-logo{
    height:70px;
    margin:5px;
    transition:				all 0.5s ease;
}
.top-logo-smaller{
    height:50px;
    margin:5px;
    transition:				all 0.5s ease;
}
.topnav {
	top:					0!important;
	background-color:		#ffffff;
	text-align:				right;
	position: 				fixed;
    z-index: 				10000;
    width: 					100%;
    box-shadow: 			0px -2px 16px 0px #888;
}
/* Style the links inside the navigation bar */
.topnav a {
    display: 				inline-block;
    color: 					#000;
    text-align: 			center;
    padding: 				15px 15px;
    text-decoration: 		none;
    font-size:              16px;
    font-family:            'Cabin', sans-serif;
    font-weight:            400;
	margin:					3px;
}
.fa-angle-down{color:#cb333b!important;}
/* Change the color of links on hover */
/*.topnav a:hover {
    background-color: 		#ddd;
    color: 					black;
}*/

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon 					{display: none;}

.underline{
	vertical-align: 			middle;
    -webkit-transform: 			perspective(1px) translateZ(0);
    transform:					perspective(1px) translateZ(0);
    box-shadow: 				0 0 1px transparent;
    position: 					relative;
    overflow: 					hidden;
}
.underline:before {
    content: 					"";
    position: 					absolute;
    z-index: 					-1;
    left: 						0;
    right: 						100%;
    bottom: 					0;
    background: 				#cb333b/*#93272c*/;
    height: 					1px;
-webkit-transition-property:	right;
    transition-property: 		right;
-webkit-transition-duration:	0.3s;
    transition-duration: 		0.3s;
-webkit-transition-timing-function:ease-out;
    transition-timing-function: ease-out;
}
.underline:hover:before, .underline:focus:before, .underline:active:before {
  right: 0;
}


.nav-span{
	display:inline;
	/*float:right;*/
}

.dropbtn:before {
    content: 					"";
    position: 					absolute;
    z-index: 					-1;
    left: 						0;
    right: 						100%;
    bottom: 					0;
    background: 				#93272c;
    height: 					1.5px;
-webkit-transition-property:	right;
    transition-property: 		right;
-webkit-transition-duration:	0.3s;
    transition-duration: 		0.3s;
-webkit-transition-timing-function:ease-out;
    transition-timing-function: ease-out;
}
.dropbtn:hover:before, .dropbtn:focus:before, .dropbtn:active:before {
  right: 0;
}

.dropbtn {	
	vertical-align: 			middle;
    -webkit-transform: 			perspective(1px) translateZ(0);
    transform:					perspective(1px) translateZ(0);
    box-shadow: 				0 0 1px transparent;
    position: 					relative;
    overflow: 					hidden;


    display: 				inline-block;
    color: 					#93272c;
    text-align: 			center;
    padding: 				15px 15px;
    text-decoration: 		none;
    font-size: 				16px;
	font-family: 			'Roboto Condensed', sans-serif;
	font-weight: 			600;
	margin:					3px;
	border:none;background-color:#fff;cursor:pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: fixed;
    background-color: #f1f1f1;
    min-width: 190px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 100!important;
}

.dropdown-content a {
    color: #000;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
	text-align: left!important;
}
.dropdown-content a:hover {background-color: #ddd;}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {background-color: #f1f1f1;}

.sub-item{font-size:16px!important;font-weight:400!important;padding: 5px 16px 5px 40px!important;}
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1280px) {
    .topnav a {font-size:14px;}
}
@media screen and (max-width: 1150px) {
  .topnav a:not(.first-icon) 	{display: none;}
  .topnav a.esp{display: block;color: #1da1a0!important;position: relative;top:3px;left:3px;}
  .topnav a.esp-2{display: block;color: #1da1a0!important;position: relative;top:3px;left:3px;}
  .topnav a.icon {float: right;display: block;font-size: 25px;background-color: #93272c;color: #f1f1f1;padding: 5px 10px;position: absolute!important;right: 0!important;top: 20px!important;}
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1150px) {
  .topnav.responsive 			{position: fixed;z-index: 1000;text-align:center;}
  .topnav.responsive a.icon 	{position: absolute!important;right: 0!important;top: 0!important;}
  .topnav.responsive a 			{float: none;display: block;text-align: center;}
  .first-icon					{float: none;text-align:center;height:70px;}
  .topnav						{text-align:center;}  
  .section-nav                  {width:98%!important;padding-top:5px!important;padding-bottom:5px!important;}
  .nav-span                     {float:none!important;}
  .dropdown-content             {position: relative!important;}
  .dropdown                     {float: none;display: block;text-align: center;}
  .red-top-banner               {background-color: #f1f1f1}
  .top-logo                     {height:60px!important;}
  span#esp                      {position: absolute;left: 0;}
  .esp                          {color:#1da1a0!important;font-size:14px!important;}
  .esp-2                        {color:#1da1a0!important;font-size:14px;}
}

@media screen and (max-width: 550px) {
	.top-logo{height:50px!important;margin:5px!important;margin-top:15px!important;}
    .top-logo-smaller{height:45px!important;margin:5px!important;}
    .first-icon{height:50px}
}
@media screen and (max-width: 480px) {	
    .top-logo{height:40px!important;}
    .top-logo-smaller{height:35px!important;}
}
@media screen and (max-width: 350px) {
	.section-nav{text-align:left!important;}
    .top-logo{height:40px;margin:5px!important;}
    .top-logo-smaller{height:35px!important;}
}

.esp{
	padding: 0px!important;
    color: #fff!important;
	/*float: left!important; take this out, it messes everything up*/
    transition:all 0.3s ease;
    cursor: pointer;
}
.esp-2{
	padding: 1px!important;
    color: #fff!important;
	/*float: left!important; take this out, it messes everything up*/
    transition:all 0.3s ease;
    cursor: pointer;
}
.social-media{padding:3px!important;margin:1px 5px!important;}
.social-media-2{padding:3px;margin:1px;display:inline-block!important;}
.sm-icons{width:25px;transition:all 0.3s ease;}
.sm-icons-smaller{width:20px;transition:all 0.3s ease;}

.small-type{
	color:#888;
	font-size:14px;
}
/*side nav */
.sidenav {
    height: 			100%;
    width: 				0;
    position: 			fixed;
    z-index: 			10000;
    top: 				0;
    right: 				0;
    background-color: 	#ffffff;
    overflow-x: 		hidden;
    transition: 		0.5s;
    padding-top: 		60px;
    text-align:			center;
}
.sidenav a {
	font-family: 		'Cabin', sans-serif;
	font-size: 			16px;
	font-weight: 		400;
	text-align:			left;
    padding: 			18px;
	color: 				#000;
    text-decoration: 	none;
    display: 			block;
    margin:				3px;
}
.sidenav a:hover{
    color: 				#4f4f4f;
}
.sidenav .closebtn {
    position: 			absolute;
    top: 				0;
    right: 				25px;
  /*font-size: 			50px;
    margin-left: 		50px;*/
}
/*Acordion*/
.accordion {
	font-family: 		'Cabin', sans-serif;
	font-size: 			16px;
	font-weight: 		400;
    background-color: 	#ffffff;
    color: 				#000;
    cursor: 			pointer;
    padding: 			18px;
    width: 				100%;
    border: 			none;
    text-align: 		left;
    outline: 			none;
    transition: 		0.4s;
    margin:				3px;
}

.active, .accordion:hover {
    background-color: #cb333b;
	color:#fff;
}

.accordion:after {
    content: '\002B';
    color: #888;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.active:after {
    content: "\2212";
}

.panel {
    padding: 0 18px;
    background-color: #f1f1f1;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}
.panel a{color:#000!important;font-weight:500;}

span#esp{
	font-family: 			'Cabin', sans-serif;
    display: 				inline-block;
    color: 					#fff;
    text-align: 			center;
    font-size: 				18px;
	font-weight: 			600;
    padding: 				15px 15px;
    margin:					3px;
    text-decoration: 		none;
    cursor:                 pointer;
}