body{margin:0;padding:0;background:black;font-family:helvetica;}
	p{align-text:center;}
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	video{width:50%;height:250;}

#animated-text {
  width: 100px;
  height: 100px;
  color: red;
  position: relative;
  animation-name: moving-text;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-delay: 1s;
  animation-iteration-count: infinite;
  animation-direction: both;
}

@keyframes moving-text {
  0%   {color:red; left:0px; top:0px;}
  100%  {color:red; left:10px; top:0px;}

}


/*	Firefox PDF Viewer	*/
#Newsletter-Oject #outerContainer #mainContainer div.toolbar {
  display: none !important; /* hide PDF viewer toolbar */
}
#Newsletter-Oject #outerContainer #mainContainer #viewerContainer {
  top: 0 !important; /* move doc up into empty bar space */
}

/*	Mobile Menu Icon */	
	.menu-icon-container {
		display: inline-block;
		cursor: pointer;
	}

	#menu-bar-top, #menu-bar-mid, #menu-bar-bot{
		width: 35px;
		height: 5px;
		background-color: #333;
		margin: 6px 0;
		transition: 0.4s;
	}
	.ex-top {
		-webkit-transform: rotate(-45deg) translate(-9px, 6px);
		transform: rotate(-45deg) translate(-9px, 6px);
	}
	.ex-mid {opacity: 0;}
	.ex-bot {
		-webkit-transform: rotate(45deg) translate(-8px, -8px);
		transform: rotate(45deg) translate(-8px, -8px);
	}
/***************************/

#button-grp{position:relative;width:30%;left:35%;}
	
.bufferbox{width:100%;color:red;}	
.header-title{font-size:24px;font-weight:bold;}
.header-subtitle{font-size:14px;font-style:italic;}
.title-overlay{color:white;text-shadow: -1px -1px 0 #A9A9A9, 1px -1px 0 #A9A9A9, -1px 1px 0 #A9A9A9, 1px 1px 0 #A9A9A9;
				position:relative; width:90%;left:5%;top:220px;font-size:48px;z-index:3;}
.title-alternate{position:relative; width:90%;left:5%;top:45px;height:150px;z-index:3;}				
				
.parallax {
    /* The image used */
    background-image: url("/images/hymnal_candle.jpg");

    /* Set a specific height */
    height: 320px;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}	
#gmap iframe{width:600px;height:450px;}
.content-image {
  object-fit: full; 
  object-position: center; 
  width:100%;
  height:360px;
}	
.fixed-header{position:fixed;top:0;width:100%; height:155px;z-index:50;} /*changed from 135px to 155px to accomodate "Donate Button"*/
.special-message{position:fixed;top:150px;width:100%; height:20px;z-index:500;background:red;text-align:center;}
.special-message a{color:white; text-decoration: none;}
.header-event-banner{position:fixed;top:150px;width:100%; /*height:20px*/height:73px;z-index:500;background:#b600ff;text-align:center;}
.header-event-banner a{color:white; text-decoration: none;}
.social-media-icon{height:30px;width:30px;}
.nav-bar{width:100%;height:100%;float:right;}
.bg-1{background:Black;color:Gainsboro;}
.bg-2{background:Gainsboro;color:Black;}
.bg-3{background:White;color:Black;}
.force-left{float:left;}
.left{text-align:left}
.responsive-container{float:left;width:100%;}	
.columns-1{float:inherit;padding:2%; width:96%;}			
.columns-2{float:inherit;padding:2%; width:46%;}
.columns-3{float:inherit;padding:2%; width:29.333%;}
.columns-4{float:inherit;padding:2%;width:21%;}
.columns-5{float:inherit;padding:2%;width:16%;}
.columns-6{float:inherit;padding:2%;width:12.666%;}
.columns-7{float:inherit;padding:2%;width:10.285%;}
.columns-8{float:inherit;padding:2%;width:8.5%;}
.columns-9{float:inherit;padding:2%;width:7.111%;}
.columns-10{float:inherit;padding:2%;width:6%;}
.centered, #services,#aboutus, #youth, #media, #special{text-align:center;}
#donate-button {
  border-radius: 5px;
  background:blue; 
  color:white; 
}
.mobile{display:none;}
.non-mobile{display:block;}	
#calendar iframe{max-width:250px;}
.license-footer{width:68%;margin-left:16%;}
#menu-list li {float: right;}
#menu-list li a {display: inline-block;color: Gainsboro;text-align: center;padding: 14px 16px;text-decoration: none;}
#menu-list{display:block;margin-top:80px;padding-right:50px;}		
#menu-icon{cursor:default;display:none;font-size:80px;float:right;height:100%;padding-right:20px;}
#logo{padding:10px;}
#logo img{width:50px;height:75px;}
#title{margin-top:10px;}

#services, #aboutus, #youth, #media, #special{margin-top:76px;}
#materials, #admin, #message{margin-top:144px;}
#message{text-align:initial;}
.banner{opacity:.6;}
#services h4{display:inline;}
#join-us{margin-top:800px;}

#footer{width:100%;}
#footer a{text-decoration:none;}
#live-service-link a{text-decoration:none;}
#live-service-link a{display: inline-block;}
#live-service-link a{padding: 5px 10px;background:silver;}
#live-service-link a:hover{background:gray;}
#footer a:link, #footer a:visited{color:Gainsboro;}
#footer a:active, #footer a:hover{color:GhostWhite;}
#footer div{text-align:left;}

#credits{width:100%;font-size:xx-small;}
#credits a{text-decoration:none;}
#credits a:link, #credits a:visited{color:Gainsboro;}
#credits a:active, #credits a:hover{color:GhostWhite;}
#credits div{text-align:center;}
#no-audio{font-size:small;}

/*	Mobile Styling	*/
@media screen and (min-width: 1275px) {		/*changed 1024px to 1275px to accomodate "Donate Button"*/	
#menu-list{display:block;
			margin-top:80px;
			padding-right:50px;}
#menu-list li a {display: inline-block;color: Gainsboro;text-align: center;padding: 14px 16px;text-decoration: none;}			
}

@media screen and (min-width: 768px) and (max-width: 1275px) {  /*changed 1024px to 1275px to accomodate "Donate Button"*/
	#menu-icon{display:block;}
	#menu-list{ display:none;opacity:.8;width:100%;margin-top:135px;border-top:solid White 2px;}
	#menu-list ul{width:inherit;text-align:center;}
	#menu-list li{float:initial;}
	video{width:80%;height:250;}
}

@media screen and (max-width: 768px) {
	.mobile{display:block;}
	.non-mobile{display:none;}	
	
	.responsive-container div{margin-left:2%;width:94%;}	
	.nav-bar h2{font-size:16px;}	
	.fixed-header{height:80px;}	
	.special-message{top:80px;}
	.social-media-icon{height:40px;width:40px;}	
	.center-cropped { object-fit: cover;object-position: center;width:100%;height:360px;}
	.top-banner, .bottom-banner{color:gainsboro;text-align:center;font-size:18px;}
	.header-title{font-size:18px;font-weight:bold;}
	.header-subtitle{font-size:10px;font-style:italic;}
	#gmap iframe{width:350px;height:250px;}
	#menu-icon{display:block;font-size:40px;}
	#menu-list{display:none;width:100%;margin-top:80px;border-top:solid White 2px;}			
	#menu-list li{float: initial;}
	#menu-list ul{width:inherit;text-align:center;}			
	#logo img{width:40px;height:60px;}
	#footer div{text-align:center;}
	#aboutus, #services, #youth, #media{margin-top:45px;}
	#worship-materials a{font-size:small;}
	.title-overlay{color:white;
	text-shadow:-1px -1px 0 #A9A9A9, 1px -1px 0 #A9A9A9,-1px 1px 0 #A9A9A9, 1px 1px 0 #A9A9A9; 
		position:relative; width:100%;left:0%;top:95px;font-size:28px;z-index:3;}	
		video{width:100%;height:250;}
		

	#button-grp{width:50%;left:20%;}
	}

@media screen and (max-width: 380px) {
	.mobile{display:block;}
	.nav-bar h2{font-size:14px;}	
	.fixed-header{height:80px;}
	.special-message{top:80px;}
	.responsive-container div{margin-left:2%;width:94%;}	
	.social-media-icon{height:40px;width:40px;}	
	.center-cropped { object-fit: cover;object-position: center;width:100%;height:225px;}	
	.top-banner, .bottom-banner{color:gainsboro;text-align:center;font-size:16px;}	
	.header-title{font-size:16px;font-weight:bold;}
	#gmap iframe{width:300px;height:250px;}
	#menu-icon{display:block;font-size:40px;}
	#menu-list{width:100%;margin-top:80px;border-top:solid White 2px;}			
	#menu-list li{float: initial;}
	#menu-list ul{width:inherit;text-align:center;}			
	#logo img{width:35px;height:55px;}
	#footer div{text-align:center;}
	video{width:100%;height:250;}
	#no-audio{font-size:xx-small;}
}