/******************************************************/
/* HEADERS HEADERS AND MORE HEADERS                   */
/******************************************************/
/* Big */
@media only screen and (max-width: 500em) { 
    h1 {
        font-size: 2.5em;
        margin: 15px 0 15px 0;
        color: #000000; /* ##CR:H1_FG */
    /*text-shadow: 2px 2px 5px rgba(114, 111, 111, 0.58); */
        text-shadow: 1px 1px 3px rgba(114, 111, 111, 0.58);
        font-family: 'Open Sans', sans-serif;
    }
    h2 { 
        font-size: 1.8em;
        color: #BF1408;  /* ##CR:H2_FG */
        text-shadow: 2px 2px 1px #DDD;   
        font-family: 'Open Sans', sans-serif;
    }
	h3 {
		font-family: 'Open Sans', sans-serif;
		color: #555555;  /* ##CR:H3_FG */
		font-size: 1.4em; 
		margin-top: 10px;
        text-shadow: 2px 2px 1px #EEE; 
    }
	h4 {
		font-family: 'Open Sans', sans-serif;
		color: #BF1408;  /* ##CR:H4_FG */
		font-size: 1.25em; 
		margin-top: 10px;
        text-shadow: 2px 2px 1px #EEE; 
    }
        	
	.centerm {
		font-family: 'Roboto', sans-serif;
		text-align: center;
		font-size: 48px;
		color: #3d080e;
		text-shadow: 5px 4px 4px rgba(30,13,8,0.26);
	}	
}

/* small */
@media only screen and (max-width: 40em) {
    h1 {
        font-size: 1.75em;
        margin: 15px 0 15px 0;
        color: #000000;  /* ##CR:H1_FG */
    /*text-shadow: 2px 2px 5px rgba(114, 111, 111, 0.58); */
        text-shadow: 1px 1px 3px rgba(114, 111, 111, 0.58); 
        font-family: 'Open Sans', sans-serif;
    }
    h2 {
        font-size: 1.3em;
        color: #BF1408;  /* ##CR:H2_FG */
        text-shadow: 2px 2px 1px #DDD;   
        font-family: 'Open Sans', sans-serif;
    }	
	h3 {
		font-family: 'Open Sans', sans-serif;
		color: #555555;  /* ##CR:H3_FG */
		font-size: 1.1em;
		margin-top: 10px;
		text-shadow: 2px 2px 1px #EEE;
	}
	h4 {
		font-family: 'Open Sans', sans-serif;
		color: #BF1408;  /* ##CR:H4_FG */
		font-size: 1.05em; 
		margin-top: 10px;
        text-shadow: 2px 2px 1px #EEE; 
    }

	.centerm {
		font-family: 'Roboto', sans-serif;
		text-align: center;
		font-size: 30px;
		color: #3d080e;
		text-shadow: 5px 4px 4px rgba(30,13,8,0.26);
	}	
}


/******************************************************/
/* BUTTONS BUTTONS and More BUTTONS                   */
/******************************************************/
button, .button {
    background-color: #59514D; /* ##CR:BTN_PRIMARY_BG */
    color: #FFFFFF; /* ##CR:BTN_PRIMARY_FG */
}
button, .button:focus, .button:hover {
	background-color:#7D716C; /* ##CR:BTN_PRIMARY_HOV_BG */
	color: #FFFFFF; /* ##CR:BTN_PRIMARY_FG */
}

button.primary, .button.primary {
    background-color: #59514D; /* ##CR:BTN_PRIMARY_BG */
    color: #FFFFFF;  /* ##CR:BTN_PRIMARY_FG */
}
button.primary:hover, button.primary:focus, .button.primary:hover, .button.primary:focus {
    background-color:#7D716C ; /* ##CR:BTN_PRIMARY_HOV_BG */
	color: #FFFFFF;  /* ##CR:BTN_PRIMARY_FG */ 
}


button.secondary, .button.secondary {
    background-color: #E9E9E9;  /* ##CR:BTN_SEC_BG */
    color: #0A0A0A;  /* ##CR:BTN_SEC_FG */
}
button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus {
    background-color: #BABABA;  /* ##CR:BTN_SEC_HOV_BG */
	color: #0A0A0A;  /* ##CR:BTN_SEC_FG */ 
}

button.success, .button.success {
    background-color: #5DA423; /* ##CR:BTN_SUCCESS_BG */
    color: #0A0A0A; /* ##CR:BTN_SUCCESS_FG */
}
button.success:hover, button.success:focus, .button.success:hover, .button.success:focus {
    background-color:  #4A831C; /* ##CR:BTN_SUCCESS_HOV_BG */ 
    color: #0A0A0A; /* ##CR:BTN_SUCCESS_FG */
}

button.alert, .button.alert {
    background-color:  #9E0C0F; /* ##CR:BTN_ALERT_BG */
    color: #FEFEFE; /* ##CR:BTN_ALERT_FG */ 
}
button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus {
    background-color:  #9E0C0F; /* ##CR:BTN_ALERT_HOV_BG */ 
    color: #FEFEFE; /* ##CR:BTN_ALERT_FG */ 
}

button.warning, .button.warning {
    background-color:  #FFAE00; /* ##CR:BTN_WARNING_BG */
    color:  #0A0A0A;   /* ##CR:BTN_WARNING_FG */ 
}
button.warning:hover, button.warning:focus, .button.warning:hover, .button.warning:focus {
    background-color:  #CC8B00;  /* ##CR:BTN_WARNING_HOV_BG */ 
    color: #0A0A0A;   /* ##CR:BTN_WARNING_FG */ 
}


/******************************************************/
/* CALLOUTS & NOTIFICATIONS                           */
/******************************************************/
.callout.success {
    background-color: #E1FAEA; /* ##CR:CO_SUCCESS_BG */
     color: #0A0A0A; /* ##CR:CO_SUCCESS_FG */
}
.callout.alert {
    background-color: #F7E4E1; /* ##CR:CO_ALERT_BG */
    color: #0A0A0A; /* ##CR:CO_ALERT_FG */
}
.callout.secondary {
    background-color: #EEEEEE;  /* ##CR:CO_SEC_BG */
    color: #0A0A0A;  /* ##CR:CO_SEC_FG */
}
.callout.warning {
    background-color: #FFF3D9; /* ##CR:CO_WARNING_BG */
     color: #0A0A0A;   /* ##CR:CO_WARNING_FG */
}
.callout.primary {
    background-color: #D7ECFA;  /* ##CR:CO_PRIMARY_BG */
    color: #0A0A0A;   /* ##CR:PRIMARY_FG */
}


/******************************************************/
/* THE MENU                                           */
/******************************************************/
.title-bar-title {
    color: #FFF; 
}

.title-bar-left { 
	background-color: #3F3533; /* ##CR:MENU_BG */
	color: #FFFFFF; /* ##CR:MENU_FG */
    padding: 10px;
}

/* menu entry color */
.menu li a {
	color: #FFFFFF; /* ##CR:MENU_FG */
    font-family: Aldrich, sans-serif !important;
}

/* menu entry color when hovering */
.menu li a:hover {
	color: #F50C0C; /* ##CR:MENU_HOV_FG */
}

/* active menu item */
.menu .active > a {
	background-color: #554D4A; /* ##CR:MENU_ACTIVE_BG */
	color: #FFFFFF; /* ##CR:MENU_ACTIVE_FG */
}

/* active menu item when hovering */
.menu .active > a:hover {
	background-color: #554D4A; /* ##CR:MENU_ACTIVE_BG */
	color: #FFFF00; /* ##CR:MENU_ACTIVE_HOV_FG */
}

/* menu background color */
.top-bar, .top-bar ul {
	background-color: #3F3533; /* ##CR:MENU_BG */
}

.drilldown a {
	background-color: #3F3533; /* ##CR:MENU_BG */
}

/* main bar background color
 .title-bar {
 background-color: #3d080e;
 }

 /* submenu title when hovering  */
.dropdown.menu > li.is-active > a {
	color: #FFFFFF; /* ##CR:MENU_ACTIVE_FG */
}

li .label  {
    background-color: #888888 !important; /* ##CR:MENU_LBL_BG */
    color: #FFF;
    border: none;
    border-radius: 0;
    font-size: 14px;
    padding: 10px 6px;
}

/*  Dropdown arrow on items with submenus..  */

.top-bar .is-dropdown-submenu-parent > a:after {
	border-color: #FFFFFF rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) !important;
}

section.navsection {
    background-color: transparent; /* ##CxxxR:MENU_BG */
}

/******************************************************/
/* THE FOOTER                                         */
/******************************************************/
footer {
    background-color: transparent;  /* ##CxxxR:FOOTER_BG */
    color: #FEFEFE; /* ##CR:FOOTER_FG */
}

footer a {
    color: #F71A11; /* ##CR:FOOTER_LINK_FG */
}

footer a:hover {
    color: #FFAE00; /* ##CR:FOOTER_LINK_HOV_FG */
}

/******************************************************/
/* OTHER                                              */
/******************************************************/

a {
    color: #CB150E; /* ##CR:A_LINK_FG */
}
a:hover {
    color: #87D4FE; /* ##CR:A_LINK_HOVER_FG */
}

.scroll-to-top {
    display: none;
    position: fixed; bottom: 80px; right: 0px;
    width: 40px;
    height: 40px;
    font: bold 0.9em/1.2em Arial, Helvetica, sans-serif; color: #bbb; text-transform: uppercase; text-decoration: none;
    padding: 3px 10px 12px 10px;
    background-color:#59514D; /* ##CR:BTN_PRIMARY_BG */
    border-radius: 5px;
    /*box-shadow: 5px 5px 1px #DDD;*/
    text-align:center;
}
    
.scrolltop {
    font-size: 35px; 
    color: #FFFFFF;  /* ##CR:BTN_PRIMARY_FG */
}

.scroll-to-top:hover { text-decoration: none; }

/* Media query to so this doesn't effect SMALL */
@media print, screen and (min-width: 40em) {
    /* Makes the colored active backgrounds take up the full height of themenu bar since they are just the a */
    .menu > li > a {
        display:block;
        padding: 0 1rem;
        line-height: 25px;
        background-color:990000;
        color:#ffffff;
    }
    /* The above messed up the line-height on vertical menus so put it back */
    .vertical .menu > li > a {
        line-height: 15px;
    }
    .top-bar {
        padding: 0 0;
    }
} 

body{
    background-color: #999999;
}
.grid-container {
    background-color: #FFFFFF;
    -webkit-box-shadow: 6px 1px 7px -4px rgba(214,43,43,0.38);
    -moz-box-shadow: 6px 1px 7px -4px rgba(214,43,43,0.38);
    box-shadow: 6px 1px 7px -4px rgba(214,43,43,0.38);

}