.roll-text-wrapper *, *::before, *::after {
  	box-sizing: border-box;
	}

.roll-text-wrapper { 
  	line-height: 1 !important;
	Z-INDEX: 1; 
  	111width: 170px; 
  	111height: 180px; 
	BOTTOM: 0 !IMPORTANT; 
	MARGIN-BOTTOM: 0PX !IMPORTANT; 
	LEFT: 0 !IMPORTANT;
	MARGIN-LEFT: 0PX !IMPORTANT;
	FLOAT: LEFT; 
	POSITION: ABSOLUTE; 
  	display: flex;
  	justify-content: center;
	}  



/* SMALLER TABLET screens */   /* SMALLER TABLET */
@media screen and (max-width: 480px) {
  	.roll-text-wrapper { 
  		width: 170px; 
		height: 180px;    
  		}
	}





@media only screen and (min-width : 320px) and (max-width : 480px) {/* Mobile portrait */
  	.roll-text-wrapper { 
  		width: 170px; 
		height: 180px;  
  		}
	}





@media only screen and (min-width : 480px) and (max-width : 595px) {/* Mobile landscape */
  	.roll-text-wrapper { 
  		width: 180px; 
		height: 180px;  
  		}
	}





@media only screen and (min-width : 595px) and (max-width : 690px) {/* Small tablet portrait */
  	.roll-text-wrapper { 
  		width: 220px; 
		height: 180px;    
  		}
	}





@media only screen and (min-width : 690px) and (max-width : 769px) {/* Tablet portrait */
  	.roll-text-wrapper { 
  		width: 270px; 
		height: 180px;   
  		}
	}





/* SMALLER TABLET screens */   /* (location for ID picture) --- SMALLER TABLET */
@media only screen and (min-width : 769px) and (max-width : 800px) {/* Small tablet landscape */
	.roll-text-wrapper { 
  		width: 280px; 
		height: 190px;   
  		}
	}





/* SMALLER TABLET screens */   /* (location for ID picture --- SMALLER TABLET */
@media only screen and (min-width : 800px) and (max-width : 1024px) {/* Small tablet landscape */
  	.roll-text-wrapper {  
  		width: 300px; 
		height: 200px;    
  		}
	}





@media only screen and (min-width : 1024px) and (max-width : 1224px) {/* Tablet landscape */
  	.roll-text-wrapper { 
  		width: 340px; 
		height: 210px;  
  		}
	}






/* Desktops and laptops */  /* SMALL DESKTOP */
@media only screen 
and (min-width : 1224px) {
  	.roll-text-wrapper { 
  		width: 350px;
		height: 220px; 
		} 
	}




.carousel {
  	position: relative;
  	width: 100%;
  	max-width: 500px;
  	display: flex;
  	justify-content: center;
  	flex-direction: column; 
	}

.carousel__item {  
  	background-color:rgba(0, 0, 0, 0.2);
  	border-radius: 30px;
	color: #FFFFFF;
  	display: flex;
  	align-items: center;
  	position: absolute;
  	width: 100%;
  	padding: 0 2px; padding-top: 1px; padding-bottom: 1px; 
  	opacity: 0;
  	filter: drop-shadow(0 2px 2px #555);
  	will-change: transform, opacity;
  	-webkit-animation: carousel-animate-vertical 27s linear infinite;
          	animation: carousel-animate-vertical 27s linear infinite;
	}

.carousel__item:nth-child(1) {
  -webkit-animation-delay: calc(3s * -1);
          animation-delay: calc(3s * -1);
}

.carousel__item:nth-child(2) {
  -webkit-animation-delay: calc(3s * 0);
          animation-delay: calc(3s * 0);
}

.carousel__item:nth-child(3) {
  -webkit-animation-delay: calc(3s * 1);
          animation-delay: calc(3s * 1);
}

.carousel__item:nth-child(4) {
  -webkit-animation-delay: calc(3s * 2);
          animation-delay: calc(3s * 2);
}

.carousel__item:nth-child(5) {
  -webkit-animation-delay: calc(3s * 3);
          animation-delay: calc(3s * 3);
}

.carousel__item:nth-child(6) {
  -webkit-animation-delay: calc(3s * 4);
          animation-delay: calc(3s * 4);
}

.carousel__item:nth-child(7) {
  -webkit-animation-delay: calc(3s * 5);
          animation-delay: calc(3s * 5);
}

.carousel__item:nth-child(8) {
  -webkit-animation-delay: calc(3s * 6);
          animation-delay: calc(3s * 6);
}

.carousel__item:last-child {
  -webkit-animation-delay: calc(-3s * 2);
          animation-delay: calc(-3s * 2);
}

.carousel__item-head {
  	border-radius: 50%;
  	background-color: inherit;
  	width: 35px;
  	height: 35px;
  	padding: 0px;
  	position: relative;
  	margin-right: -65px; 
	margin-left: 2px; 
	left: 0;
  	flex-shrink: 0;
  	display: flex;
  	align-items: center;
  	justify-content: center;
  	font-size: 10pt; 
	}

.carousel__item-body { 
	font-size: 10pt;
  	width: 100vw; 
	padding-left: 70px;
	padding-top: 1px;
	padding-right: 1px;
	padding-bottom: 1px;  
	}

.title {
	padding-top: 1px;
  	text-transform: uppercase;
  	font-size: 10pt;
	font-weight: bold;
  	margin-top: 0px; 
	}

@-webkit-keyframes carousel-animate-vertical {
  0% {
    transform: translateY(100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
  3%, 11.1111111111% {
    transform: translateY(100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  14.1111111111%, 22.2222222222% {
    transform: translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
  }
  25.2222222222%, 33.3333333333% {
    transform: translateY(-100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  36.3333333333% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: visible;
  }
  100% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
}

@keyframes carousel-animate-vertical {
  0% {
    transform: translateY(100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
  3%, 11.1111111111% {
    transform: translateY(100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  14.1111111111%, 22.2222222222% {
    transform: translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
  }
  25.2222222222%, 33.3333333333% {
    transform: translateY(-100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  36.3333333333% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: visible;
  }
  100% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
}





/**MAIN CATEGORY FOR CONTENT**/

.category-pointer { 
	Z-INDEX: 12000000000000 !IMPORTANT; 
  	width: 100%;
  	height: auto;
	left: 0 !important; 
	BOTTOM: 0 !IMPORTANT; 
	MARGIN-BOTTOM: 0PX !IMPORTANT;  
	}  


.all-size-canvas-device-screen {
  	DISPLAY: INLINE; 
	}
/**END OF MAIN CATEGORY FOR CONTENT**/