﻿/** BEGINNING OF IN LIGHT OF GOD'S WORD - THROUGH THE LENS OF THE SCRIPTURE **/
:root {
  --color-background: #000119;
  --stroke-width: calc(1em / 16);
  --font-size: 30vmin;
  --font-weight: 700;
  --letter-spacing: calc(1em / 8);
}

.slider-content {
  	user-select: none; 
	width: 100%; 
	height: 100%;
  	position: absolute !important;
	box-sizing: border-box;
	clear: both;
	box-sizing: border-box;
	clear: both;
	left: 0; 
	}



.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  	position: absolute;
  	color: #2C3E50; color: #888888;
  	transform: rotate(-90deg);
	font-size: 0.8rem;  
  	z-index: 10;
  	clip: rect(0rem, 21rem, 2rem, 53px);  
  	display: inline-block;
  	transition: all 0.3s ease; 
	}

.slider-content .image-caption span { /**VERTICAL TEXT FORMAT & ITS LINE**/
  	display: inline-block;
  	vertical-align: top; 

	/**TEXT OUTLINE**/
  	-webkit-background-clip: text;
                background-clip: text;
  	background-image: -webkit-gradient(linear, left top, right top, from(#09f1b8), color-stop(#00a2ff), color-stop(#ff00d2), to(#fed90f));
  	background-image: -o-linear-gradient(left, #09f1b8, #00a2ff, #ff00d2, #fed90f);
  	background-image: linear-gradient(to right, #09f1b8, #00a2ff, #ff00d2, #fed90f);
  	color: #000119;
  	color: var(--color-background);
  	letter-spacing: calc(1em / 8);
  	letter-spacing: var(--letter-spacing);
  	-webkit-text-stroke-color: transparent;
  	-webkit-text-stroke-width: calc(1em / 16);
  	-webkit-text-stroke-width: var(--stroke-width); 
	/**END OF TEXT OUTLINE**/
	}

.slider-content .image-caption .line {/**VERTICAL LINE ALONE WITHOUT VERTICAL TEXT**/
  	position: relative;
  	background: #2C3E50;
  	height: 1px;
  	width: 5rem;   
  	top: 1rem; 
	/**LINE FORMATING**/
   		background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
	/**END OF LINE FORMATING**/
	}

.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
  	POSITION: ABSOLUTE; 
  	margin-left: auto;
  	margin-right: auto;   
  	text-align: center;  
  	z-index: 5;   
	}







/* SMALLER TABLET screens --------*/   /* SMALLER TABLET */
@media screen and (max-width: 480px) {
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%; 
		MARGIN-BOTTOM: 2REM;
		/**CENTERING HORIZONTAL**/
  			margin: auto;  
 			position: absolute;
  			left:0;
  			right: 0;   
  			bottom: 0;
			margin-bottom: 4rem;  
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -6.8rem;  
		position: relative;  
  		top: 50%;    
		}  
	}





@media only screen and (min-width : 320px) and (max-width : 480px) {/* Mobile portrait */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%; 
		MARGIN-BOTTOM: 2REM;
		/**CENTERING HORIZONTAL**/
  			margin: auto;  
 			position: absolute;  
  			left:0;
  			right: 0;
  			bottom: 0;
			margin-bottom: 4rem;    
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -6.8rem;   
		position: relative;  
  		top: 50%;  
		}  
	}





@media only screen and (min-width : 480px) and (max-width : 595px) {/* Mobile landscape */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%; 
		MARGIN-BOTTOM: 2REM;
		/**CENTERING HORIZONTAL**/
  			margin: auto;  
 			position: absolute;
  			left:0;
  			right: 0;  
  			bottom: 0;
			margin-bottom: 3.9rem;    
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -6.3rem;   
		position: relative;  
  		top: 50%;    
		}  
	}





@media only screen and (min-width : 595px) and (max-width : 690px) {/* Small tablet portrait */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%; 
		MARGIN-BOTTOM: 2REM;
		/**CENTERING HORIZONTAL**/
  			margin: auto;  
 			position: absolute;
  			left:0;
  			right: 0;  
  			bottom: 0;
			margin-bottom: 3.9rem;   
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -6.5rem; 
		position: relative; 
  		top: 50%;   
		}  
	}





@media only screen and (min-width : 690px) and (max-width : 769px) {/* Tablet portrait */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%;  
		FLOAT: RIGHT;  
		RIGHT: 0;  
		MARGIN-RIGHT: 9%;
		BOTTOM: 0; 
		MARGIN-BOTTOM: 8%; 
		MARGIN-BOTTOM: 3.7REM;    
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -4.8rem;    
		position: relative;  
  		top: 50%;    
		}  
	}





/* SMALLER TABLET screens */   /* (location for ID picture) --- SMALLER TABLET */
@media only screen and (min-width : 769px) and (max-width : 800px) {/* Small tablet landscape */
	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%;  
		FLOAT: RIGHT;  
		RIGHT: 0;  
		MARGIN-RIGHT: 9%;
		BOTTOM: 0; 
		MARGIN-BOTTOM: 8%; 
		MARGIN-BOTTOM: 3.52REM;  
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -4.8rem; 
		position: relative;  
  		top: 50%;    
		}  
	}





/* SMALLER TABLET screens */   /* (location for ID picture --- SMALLER TABLET */
@media only screen and (min-width : 800px) and (max-width : 1024px) {/* Small tablet landscape */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%;  
		FLOAT: RIGHT;  
		RIGHT: 0;  
		MARGIN-RIGHT: 9%;  
		BOTTOM: 0; 
		MARGIN-BOTTOM: 3REM;   
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -4.8rem; 
		position: relative; 
  		top: 50%;    
		}  
	}





@media only screen and (min-width : 1024px) and (max-width : 1224px) {/* Tablet landscape */
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem; 
		HEIGHT: 4%;  
		FLOAT: RIGHT;  
		RIGHT: 0;  
		MARGIN-RIGHT: 9%;    
		BOTTOM: 0; 
		MARGIN-BOTTOM: 3REM;  
  		}

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -4.5rem;  
		position: relative;  
  		top: 50%;   
		}  
	}






/* Desktops and laptops */  /* SMALL DESKTOP */
@media only screen 
and (min-width : 1224px) {
  	.slider-content .title-wrapper { /**HORIZONTAL TEXT CONTAINER**/
		width: 11rem;
		HEIGHT: 4%;  
		FLOAT: RIGHT;  
		RIGHT: 0;  
		MARGIN-RIGHT: 9%;
		BOTTOM: 0; 
		MARGIN-BOTTOM: 3REM; 
		} 

	.slider-content .image-caption { /**VERTICAL TEXT FORMAT & ITS LINE**/
  		left: -4.1rem;    
		position: relative;
  		top: 50%; 
		}  
	}





/** HOVER EFFECT **/
body:hover .image-caption { 
	display: none !important; 
	}

body:hover .title-wrapper {  
	display: none !important;  
	}
/** END OF HOVER EFFICT **/









.slider-content .title-wrapper h1 span.mask-wrap {  /**HORIZONTAL TITLE TEXT**/
	WIDTH: 100%; 
	TOP: 0;
  	display: block;  
  	HEIGHT: 100%;
  	POSITION: ABSOLUTE; 
	}

.slider-content .title-wrapper span.gallery { /** HORIZONTAL TEXT WITHOUT THE VERTICAL SIDE BAR **/
	WIDTH: 100%; 
  	font-size: 0.5rem; 
  	TOP: 0; 
	MARGIN-TOP: 0PX; 
	POSITION: ABSOLUTE;  
  	LEFT: 0;  

	/**TEXT OUTLINE**/
  	-webkit-background-clip: text;
                background-clip: text;
  	background-image: -webkit-gradient(linear, left top, right top, from(#09f1b8), color-stop(#00a2ff), color-stop(#ff00d2), to(#fed90f));
  	background-image: -o-linear-gradient(left, #09f1b8, #00a2ff, #ff00d2, #fed90f);
  	background-image: linear-gradient(to right, #09f1b8, #00a2ff, #ff00d2, #fed90f);
  	color: #000119;
  	color: var(--color-background);
  	-webkit-text-stroke-color: transparent;
  	-webkit-text-stroke-width: calc(1em / 16);
  	-webkit-text-stroke-width: var(--stroke-width); 
	/**END OF TEXT OUTLINE**/
	}

.slider-content .title-wrapper span.gallery::before { /** LEFT-SIDE VERTICAL SIDE BAR WITHOUT THE HORIZONTAL TEXT **/
  	content: "";
  	position: absolute;
  	left: -1.8REM;
  	display: block;
  	width: 1px;
  	height: 1.5REM;
  	background: #EEEEEE;
  	top: -0.5rem;
  	opacity: 0.9;  
	/**LINE FORMATING**/
   		background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
	/**END OF LINE FORMATING**/ 
	}

.slider-content .title-wrapper span.gallery::after { /** RIGHT-SIDE VERTICAL SIDE BAR WITHOUT THE HORIZONTAL TEXT **/
  	content: "";
  	position: absolute;
  	right: -1.8REM;
  	display: block;
  	width: 1px;
  	height: 1.5REM;
  	background: #EEEEEE;
  	top: -0.5rem;
  	opacity: 0.9;  
	/**LINE FORMATING**/
   		background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
   		background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
	/**END OF LINE FORMATING**/ 
	}
/** END OF BEGINNING OF IN LIGHT OF GOD'S WORD - THROUGH THE LENS OF THE SCRIPTURE **/