/* ENF-specific CSS classes */

body 
{
    background: #6F2C40 !important;
}

h1,h2,h3,h4,h5,h6 
{
	color: #6F2C40;	

}

#header 
{
	background:url('/images100/enfHeader1140.png') no-repeat;
}

/*For clarity, this is an existing ENF style that I've edited, but there are too many instances in the news article pages to simply change the class name.
This is different from the "header" above, which handles the banner image.*/
.header
{
    color: #6F2C40;	
    font-size: 26;
    font-weight: 600;
    padding: 3px 0 3px 0;

}

.header2
{
    color: #6F2C40;	
    font-size: 20;
    font-weight: 600;
    padding: 3px 0 3px 0;

}

.headerlinks a
{
	float: right;
	display: block;
}

.headerlinks a:hover
{
	background-color: transparent !important;
}

@media (min-width: 1px) and (max-width: 1199px) {
 #header, .lodgeheader
	{
		background: url('/images100/ENF_Logo_Mobile.png') no-repeat !important; 
		width: 100%;
		height: 102px;
		display: block; 
		vertical-align:middle !important;
		margin: 0 auto !important;
		background-color: black;
		background-color: #F6E1AA !important;
		background-position: center !important;
	}	
}

.enfHeader
{
    width: 100%;
    height: auto; 
    max-width: none;
}


a[href]{
    color: #899e4c;
}

a[href].dropdown-item {
    color: #FFF;
}

@media (min-width: 1px) and (max-width: 1199px) {
  a[href].dropdown-item {
    color: black;
}  
}

a[href].btnsocial 
{
    color: #516C78;
}

.enfHeadline
{
    text-decoration: none;
    font-weight: 750;
    color: #536722 !important;
}


.subscribe-buttons
{
    width:40%;float:right;
}
    
@media screen and (min-width: 0px) and (max-width: 640px)
{
	.subscribe-buttons
	{width:100%;}
}


.youtubeVid 
{
    width: 560px;
    height: 315px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

@media (min-width: 1px) and (max-width: 767px) {
.youtubeVid {
    width: 500px;
    height: 275px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
}


a[href].btnsocial{
    color: #874156;
}
    
.cipHeader
{
    width: 100%;
    height: auto; 
    max-width: none;
}

.resources {
    padding: 10px;
}


#pagecontent
{
	max-width: 915px !important;
}


@media (min-width: 1px) and (max-width: 1199px) {
#pagecontent
{
	max-width: 740px !important;
}
    
#navigationMenus
{
    background: #874156;	
}	
}

@media (min-width: 1px) and (max-width: 576px){
#userLinks {
    background-image: none !important;
    background-color: #874156 !important;
}
}

.login
{
    background-color: #ACBB80 !important;
}

#enfhome.nav-link 
{
	background: #ACBB80;
}
#enfhome:hover
{
    background: #899E4C;
}

#enfprograms.nav-link 
{
	background: #ACBB80;
}
#enfprograms:hover
{
    background: #899E4C;
}

#supportenf.nav-link 
{
	background: #ACBB80;
}
#supportenf:hover
{
    background: #899E4C;
}

#fidelityclub.nav-link 
{
	background: #ACBB80;
}
#fidelityclub:hover
{
    background: #899E4C;
}

#myenf.nav-link 
{
	background: #ACBB80;
}
#myenf:hover
{
    background: #899E4C;
}

.navbar 
{
    background-color: #874156 !important;
}

.leftmenu 
{
    background: #EBE6DA !important;
    padding-left: 0px;
}


.lodgeThumb
{
    padding-bottom: 10px;
    padding-right: 10px;
    flex-wrap: wrap;
}


/******************* ENF Home *******************/

.enfhomestories
{
    width: 48%;
    margin: 5 10 5 10;
    background-color: white;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    transition: all 0.0s ease-in-out;
    flex-wrap: wrap;
}


@media (min-width: 1px) and (max-width: 767px) {
.enfhomestories
{
    width: 98%;
}
    
}
    
.enfHomeStoryText
{
  margin: 7px;  
}


/******************* Youth Programs *******************/

.yellowCard
{
    margin: 10 20 10 20;
    padding: 7px;
    background-color: #FEECBE;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    transition: all 0.0s ease-in-out;
    flex-wrap: wrap;
}


/******************* Support ENF *******************/

.volunteer-button {

    border-radius: 6px;
    height: 200px;
    width: 140px;
/*    width: 22%;*/
    padding-top:3px;
/*    float: left;*/
    margin-right: 10px;
    margin-bottom: 10px;
    box-shadow: 3px 2px 9px 0px rgb(119 119 119 / 81%);
    -moz-box-shadow: 3px 2px 9px 0px rgba(119, 119, 119, 0.81);
    -webkit-box-shadow: 3px 2px 9px 0px rgb(119 119 119 / 81%);
}

@media (min-width: 1px) and (max-width: 1199px) {
.volunteer-button
{
	width: 120px;
    margin-left: 10px;
}
}



@media (min-width: 1px) and (max-width: 767px) {
.volunteer-button
{
	width: 60%;
    height: 160px;
    margin: 10 auto 10 auto;
}
}

#projectbubble {
    background-repeat: no-repeat;
    margin: 10 auto 10 auto;
    border-radius: 50%;
    border: 2px solid #ccc;
    width: 90px;
    height: 90px;
    float:none !important;
}

#vo-link {
/*    letter-spacing: -0.9px;*/
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    margin: 5 auto 5 auto;
    color: #3a3a3a;
  

}


/******************* Online Giving *******************/

.purpleButton 
{
display:block;
-webkit-border-radius: 6;
-moz-border-radius: 6;
border-radius: 6px;
color: #ffffff!important;
background: #772f45;
padding: 10px 20px 10px 20px;
text-decoration: none;
}

.purpleButton:hover 
{
background: #913a56!important;
}

.aCalloutInfoTable
{
padding:10px;
}

.aSectionWithButtons
{
padding:10px;
margin-bottom:15px;
}




/******************* Fundraising Chair Dashboard (Migrated from ENF Leadership Dashboard) *******************/


.NationalStatistics p
{
    font-weight: bold;
    text-align: left;
}

.quickText
{
    text-align: center;
}

.section-header
{
    background:  #753045;
}

.NationalStatistics
{   margin: auto;
    margin-bottom: 10px !important;
    width: 95%;
    border:1px solid #772F46;
    border-radius:6px;
    vertical-align:middle;
    padding:5px;
background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
background-image: -o-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
background-image: linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
box-shadow:2px 2px 4px rgba(0,0,0,0.25);  
}


.statisticCol
{
    padding-left: 30px;
}

.quickLinks
{
  padding-left: 25px !important;
}


.quickButton
{
    display: block;
    height: 100px;
    color:#555;
    float:left;
    font-size:113%;
    margin: 5px 5px 5px 5px;
    width: 48%;
    border:1px solid #772F46;
    border-radius:6px;
    vertical-align:middle;
    padding:10px;
background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
background-image: -o-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
background-image: linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
box-shadow:2px 2px 4px rgba(0,0,0,0.25); 
}

@media only screen and (max-width : 1199px) {
.quickButton
{
    height: 120px;    
}
}




.faENF
{
    font-size:150%;
    padding: 10px;
}


@media only screen and (max-width : 767px) {
    
.statisticCol
{
    width: 100% !important;
}
    
.quickLinks
{
  padding-left: 0 !important;
}
    
 .quickButton
{
    height: 100px;
    width:100% !important;
    font-size:120% !important;
    padding: 5 0 5 0;
} 
    
.faENF
{
    float: left;
    font-size:240%;
    padding: 20 5 10 12;
    padding-bottom: 10px;
    margin-left: 20px !important;
}   
    
}



/******DROPDOWN MENU STUFF FOR THE CHAIR RESOURCE LINKS******/



.btn-group.dropdown-menu
{
    background-color:#F1F1F1 !important;
    position: absolute;
    transform: translate3d(0px, 46px, 0px);
    top: 0px;
    left: 0px;
    will-change: transform;
}


/******Org Chart******/



.Director {
	font-size: 14px;
	font-weight: bold;
	border: solid 1px #000000;
	background: #e1e1e1;
	width: 150px;
	padding: 5px;
	margin-bottom: 10px;
}

.Department {
	font-size: 14px;
	font-weight: bold;
	border: solid 1px #000000;
	background: #e1e1e1;
	color: #ffffff;
	padding: 5px;
	margin: 4px;
	text-decoration: none;
}

.DepartmentLink {
	text-decoration: none;
	color: #ff0000;
}

.DepartmentLink:visited {
	text-decoration: none;
	color: #ff0000;
}

.DepartmentLink:hover {
	    text-decoration: underline;
		color: #ff0000;
}
	
.Manager {
	font-size: 13px;
	font-weight: bold;
	border: solid 1px #000000;
	background: #eeeeee;
	width: 90%;
	padding: 5px;
	margin-top: 4px;
	margin-bottom: 4px;
}	

.Employee {
	font-size: 11px;
	border: solid 1px #000000;
	width: 80%;
	padding: 5px;
	margin-top: 4px;
	margin-bottom: 4px;
}


orgchart department a,orgchart director a{color:#899e4c !important;font-weight:bold !important;}
orgchart department a:hover,orgchart director a:hover{background: #feecbe;color:#772F46;}
orgchart,department,staff,department-name{box-sizing:border-box;}
orgchart,department,director{display:table;}
orgchart{width:100%;height:800px;}
department{float:left;display:table;width:25%;padding:4px;text-align: center;}
department-name{display:block;font-weight:bold;padding-top:10px;vertical-align:middle;height:50px;}
director{box-sizing:border-box;padding:10px;display:table;height:120px;width:100%;margin:0 auto;}
director-head{display: table;background-color:white;width:33%;float:left;height:100%;}
director-name{display:table-cell;vertical-align:middle;height:100%;}
manager,staff,director-head{text-align:center;}
staff{border:1px solid #772f45;}
manager,staff{float:left;margin-bottom:6px;display:table;height:100px;width:100%;}
staff,manager,director-head{border-radius:5px;}
staff{background-color:white;}
manager,director-head{border:2px solid #772f45;background-color:rgba(241, 241, 241, 0.59);}
staff-details{display:table-cell;vertical-align:middle;text-align:center;height:100%;width:100%;letter-spacing:-0.5px;line-height:1.33;}
iii{float:left;width:33%;display:table-cell;height:100%;}
.cfdebug{display:none;}

@media only screen and (max-width: 700px) {
	.lity-iframe-container{padding-top:140%!important;}
	department{width:100%;}
	iii{display:none;}
	director-head{width:100%;}
}



/******END OF DROPDOWN MENU STUFF FOR THE CHAIR RESOURCE LINKS******/

.big-boxes{width:100%;}



.link-box{
   position:relative;
   padding:10px 10px 10px 0px;
   width:50%;
}

@media only screen and (max-width : 767px) {
.link-box
{
   width:100%;
}
}

.link-box-inner{
   border-left:1px solid #b1b1b1;
   border-right:1px solid #b1b1b1;
   box-shadow:2px 2px 4px rgba(0,0,0,0.25);
   height:450px;
   overflow-y:scroll;
   width:100%;
   display:table;
}
.link-box-inner ul li,.category-links ul li{
font-size:13px;font-family:'Arial';padding:1px;
}

.link-box-inner ul li a,
.link-box-inner ul li a,
.category-links ul li a[href]{
display:block;
background:none!important;
}
.category-links a[href]:hover{
color:#772F46;
text-decoration:underline;
}
.link-box-inner ul li:before,
.category-links ul li:before{
}
.link-box-inner ul li:hover:before,
.link-box-title{color:white;}
.link-box ul li:hover a,
.link-box ul li:hover a[href]{
text-decoration:underline!important;
}

.link-box-title{
   background-color:#772f46;
  /*background-image:-webkit-linear-gradient(top, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.0) 51%, rgba(162, 162, 162, 0.2) 100%);
   */
   font-size:15px;
   font-weight:bold;
   padding:15px;
}
.link-box-body
{
    padding:6px 13px 6px 13px;
}








/******************* (Everything down here is a work in progress) *******************/




#card-rectangle
{
    background-size:contain!important; 
    size:auto; 
    max-width:100%;
} 


/*
h3
{
    line-height: 1.5; 
    size:auto;
}
*/
    
li.weigel 
{
    line-height:1; 
    font-size:12px; 
    font-color:auto;
    list-style-type: none;
    padding: 0;
}

.card-panels
{
    font-size: 110% !important;
    float: left;
    padding: 10px;
    color: black!important;
    background: #fff;
    border-radius: 2px;
    display: block;
    background-color: #f3f3f3;
}

.card-4 {
    width: 48%;
    margin-right: 10px;
    margin-bottom: 10px;
    background-color: white;
    height: 150px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    transition: all 0.0s ease-in-out;
    float: left;
    flex-wrap: wrap;
}

.card-4:hover
{
   box-shadow: 3px 2px 9px 0px rgba(119, 119, 119, 0.81);
    -moz-box-shadow: 3px 2px 9px 0px rgba(119, 119, 119, 0.81);
    -webkit-box-shadow: 3px 2px 9px 0px rgba(119, 119, 119, 0.81); 
}


@media (min-width: 1px) and (max-width: 767px) {
.card-4 {
    width: 90%;
    font-size: 140%;
}
    
}

.btn-primary
{
    border-color: #E1E1E1 !important;
}

.btn-primary h6
{
    color: #444 !important;
}

.btn-primary:hover
{
    background-color: #E1E1E1 !important;
}

.card-body a
{
    font-size: 16px;
}