/* CSS created by me */
#mainContentHomePage{
	padding-top:20px;
}

.headerOutline
{
    color: white;
    text-shadow:
            -1px -1px 0 #000,
            1px -1px 0 #000,
            -1px 1px 0 #000,
            1px 1px 0 #000;

}

/* body */
body{
    /*background-color:lightyellow; older version*/
    background-color:floralwhite;
    
    /*
    The fixed navbar will overlay your other content, unless you add padding to the top of the <body>. 
    Try out your own values or use our snippet below. 
    Tip: By default, the navbar is 50px high.
    
    */
   padding-top: 110px;
    
	 
}
/* to reduce spacing around alert divs */
.alert {
	padding: 0px;
}

/* display a <br> between address to make it look neat on phones */
.mobile-break {display: none;}

.footerBackgroundColor{
    background: lightyellow;
}

/* fa font awesome */
/*
span:hover {
    color: yellow;
}
*/

/* calendar responsive
url: https://thomas.vanhoutte.be/miniblog/make-google-calendar-iframe-responsive/ */
.responsiveCal {
 
position: relative; padding-bottom: 75%; height: 0; overflow: hidden;
 
}
 
.responsiveCal iframe {
 
position: absolute; top:0; left: 0; width: 100%; height: 100%;
 
}

.hrWithNoPadding{
    padding: 0px;
    margin: 0px;    
}

.thumbnailImage{
	height: 100px;
	width: 100px;
}


/* MailChimp form for newsletter*/
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */



/* navbar */
.navbar-default {
    background-color: red;
    border-color: #E7E7E7;
    background: red; /* For browsers that do not support gradients */
    background: linear-gradient(to right, rgba(120,0,0,1), rgba(190,0,0,1));
    /*background: linear-gradient(to right, red , yellow); /* Standard syntax (must be last) */
}
/* Title */
.navbar-default .navbar-brand {
	font-size:24px;
    color: white; 
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: yellow;
}
/* Link */
.navbar-default .navbar-nav > li > a {
    color: white;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: yellow;
}


.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: #E7E7E7;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
   /* Being used on dropdowns */

    color: white;
    background-color: red;
    border-color: #E7E7E7;
    background: red; /* For browsers that do not support gradients */
    background: linear-gradient(to right, rgba(200,0,0,1), rgba(190,0,0,1));
}
/* Caret */
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #777;
    border-bottom-color: #777;
}
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #333;
    border-bottom-color: #333;
}
.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret,
.navbar-default .navbar-nav > .open > a:focus .caret {
    border-top-color: #555;
    border-bottom-color: #555;
}
/* Mobile version */
.navbar-default {
    background-color: red;
    border-color: #E7E7E7;
    background: red; /* For browsers that do not support gradients */
    background: linear-gradient(to right, rgba(120,0,0,1), rgba(190,0,0,1));
    /*background: linear-gradient(to right, red , yellow); /* Standard syntax (must be last) */
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    /* This effects the "Menu" hover color */
    background-color: rgba(250, 250, 70, 0.3);
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #CCC;
}
@media (max-width: 767px) {
    /*dropdown <a> color is set to white */
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: white;
    }

    /* Dropdown link hover/focus */
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
        color: yellow;
    }
}


.homePage{
    /*padding-top: 200px;*/
}
/* Media Queries */

/* Extra Small Devices (XS Boostrap 3.0 <768px) 
Mobile Phones
*/
@media (max-width:768px) {
    .homePage{
        padding-top: 60px;
    }
    /* make title smaller*/
	.navbar-default .navbar-brand {
	font-size:16px;
    color: white; 
	}
	

	.mobile-break { display: block; }
	
	.ShowEverywhereButExtraSmall{
	display:none;
	}
    
    .OnlyShowInExtraSmall{
	display:block;
	}
	
	#donateButton {
	/*display: none;*/
	}
	
	body{
	padding-top: 125px;
	}
	
	/* overriding the padding for mobile phones */
	#mainContentHomePage{
    padding-top:0px;
	}
	
	/* Overriding <h1>..<h6> sizes on mobile view */
	h1 {
	/* Default: 36 */
	font-size: 22px;
	}
	
	h2 {
	/* Default: 30 */
	font-size: 20px;
	}
	
	h3 {
	/* Default: 24 */
	font-size: 18px;
	}
	
	h4 {
	/* Default: 18 */
	font-size: 16px;
	}
	
	h5 {
	/* Default: 14 */
	font-size: 14px;
	}
	
	h6 {
	/* Default: 12 */
	font-size: 12px;
	}
	
	.alert{
	/*Default: 15px; */
	font-size:16px;
	padding: 2px;
	margin: 2px;
	}
	
	.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -0px;
	}
	
	/* to adjust the size of the dismissible 'x' button to close an alert */
	.close{
	font-size: 36px;
	}
	
	/* 
	to allow Call, GPS, Donate to fit on ONE line 
	in extra small resolution devices 
	*/
	.navItemList {
	font-size: 18px;
}
	.navItemList ol, ul {
		margin-bottom: -20px;
	}

}
/* Small Devices*/
@media (min-width: 768px) and (max-width:900px) {
    .navbar-default .navbar-nav > li > a {
        font-size: 16px;
    }
    .homePage{
        padding-top: 100px;
    }
    
     .ShowEverywhereButExtraSmall{
	display:block;
	}
    
    .OnlyShowInExtraSmall{
	display:none;
	}
	
	
    
}
/* Medium Devices(992px-1199px) */
@media (min-width: 901px) and (max-width:965px) {
    .homePage{
        padding-top: 100px;
    }
    
     .ShowEverywhereButExtraSmall{
	display:block;
	}
    
    .OnlyShowInExtraSmall{
	display:none;
	}
	
	/*overide*/
	.navbar-default .navbar-nav > li > a {
    font-size: 18px;
	}
	
}

/* Medium Devices(992px-1199px) */
@media (min-width: 966px) and (max-width:1199px) {
    .navbar-default .navbar-nav > li > a {
        font-size: 18px;
    }
    .homePage{
        padding-top: 50px;
    }
    
    .ShowEverywhereButExtraSmall{
	display:block;
	}
    
    .OnlyShowInExtraSmall{
	display:none;
	}
}
/* Large Devices */
@media (min-width:1200px) {
    .homePage{
        padding-top: 50px;
    }
    
    .ShowEverywhereButExtraSmall{
	display:block;
	}
    
    .OnlyShowInExtraSmall{
	display:none;
	}
}

.hrWithNoPadding {
    padding: 0px;
    margin: 0px;
}

/*
.navItemList {
}

.navItemList ol, ul {
margin-bottom: 0px;
}
*/
