.slideshow-container
{
/*	position:relative;*/
	margin-top:10px;
	margin-bottom:0;
	margin-left:auto;
	margin-right:auto;
	display:flex;
}

.myImage
{
	max-width:90%;
	margin:auto;
	object-fit:contain;
}

/*.myImage-text*/
/*{*/
/*	max-width:40%;*/
/*	position: absolute;*/
/*	top: 37%;*/
/*	left: 45%;*/
/*	transform: translate(-20%, -60%);*/
/*	text-align: justify;*/
/*	color:#222;*/
/*	font-family:'Martel', serif;*/
/*}*/

.arrow
{
	opacity:20%;
/*	width:auto;*/
}

.arrow:hover
{
	opacity:50%;
	cursor: pointer;
}

.fade
{
	animation-name:fade;
	animation-duration:0.5s;
}

@keyframes fade
{
	from {opacity:0.4} 
	to {opacity:1}
}

.container4 img
{
	padding-right:5px;
	padding-top:0px;
	padding-bottom:5px;
}

/* ====================== ====================== ====================== ====================== */
/* ====================== responsive for smaller than 320px screen ====================== */
@media (max-width: 320px)
{
  .slideshow-container
  {
	max-width:95%;
	height: 250px;
  }

  .myImage
  {
	height:200px;
  }

  .arrow
  {
	height:20px;
	margin:120px auto;
  }
}

/* ====================== responsive for larger than 320px screen ====================== */
@media (min-width: 320px)
{
  .container4 img
  {
	padding-left:15px;
	height:35px;
	width:170px;
  }

  .slideshow-container
  {
	max-width:95%;
	height: 250px;
  }

  .myImage
  {
	height:200px;
  }

  .arrow
  {
	height:20px;
	margin:120px auto;
  }
}

/* ====================== responsive for larger than 375px screen ====================== */
@media (min-width: 375px)
{
  .container4 img
  {
	padding-left:15px;
	height:37px;
	width:180px;
  }

  .slideshow-container
  {
	max-width:95%;
	height:260px;
  }

  .myImage
  {
	height:225px;
  }

  .arrow
  {
	height:20px;
	margin:125px auto;
  }
}

/* ====================== responsive for larger than 425px screen ====================== */
@media (min-width: 425px)
{
  .container4 img
  {
	padding-left:15px;
	height:40px;
	width:190px;
  }

  .slideshow-container
  {
	max-width:95%;
	height:280px;
  }

  .myImage
  {
	height:255px;
  }

  .arrow
  {
	height:20px;
	margin:135px auto;
  }
}

/* ====================== responsive for larger than 575px screen ====================== */
@media (min-width: 575px)
{
  .container4 img
  {
	padding-left:15px;
	height:42px;
	width:200px;
  }

  .slideshow-container
  {
	max-width:95%;
	height:350px;
  }

  .myImage
  {
	height:320px;
  }

  .arrow
  {
	height:25px;
	margin:160px auto;
  }
}

/* ====================== responsive for larger than 768px screen ====================== */
@media (min-width: 768px)
{
  .container4 img
  {
	padding-left:15px;
	height:42px;
	width:200px;
  }

  .slideshow-container
  {
	max-width:95%;
	height:400px;
  }

  .myImage
  {
	height:370px;
  }

  .arrow
  {
	height:30px;
	margin:180px auto;
  }
}

/* ====================== responsive for larger than 1024px screen ====================== */
@media (min-width: 1024px)
{
  .container4 img
  {
	padding-left:13px;
	height:45px;
	width:210px;
  }

  .slideshow-container
  {
	max-width:90%;
	height:450px;
  }

  .myImage
  {
	height:400px;
  }

  .arrow
  {
	height:40px;
	margin:210px auto;
  }
}

/* ====================== responsive for larger than 1280px screen ====================== */
@media (min-width: 1280px)
{
  .slideshow-container
  {
	max-width:90%;
	height:475px;
  }

  .myImage
  {
	height:450px;
  }

  .arrow
  {
	height:45px;
	margin:210px auto;
  }
}

/* ====================== responsive for larger than 1440px screen ====================== */
@media (min-width: 1440px)
{
  .container4 img
  {
	padding-left:10px;
	height:52px;
	width:240px;
  }

  .slideshow-container
  {
	max-width:80%;
	height:500px;
  }

  .myImage
  {
	height:480px;
  }

  .arrow
  {
	height:50px;
	margin:220px auto;
  }
}

/* ====================== responsive for larger than 1920px screen ====================== */
@media (min-width: 1920px)
{
  .container4 img
  {
	padding-left:10px;
	height:55px;
	width:260px;
  }

  .slideshow-container
  {
	max-width:80%;
	height:600px;
  }

  .myImage
  {
	height:580px;
  }

  .arrow
  {
	height:60px;
	margin:260px auto;
  }
}

/* ====================== responsive for larger than 2560px screen ====================== */
@media (min-width: 2560px)
{
  .container4 img
  {
	padding-left:10px;
	height:55px;
	width:260px;
  }

  .slideshow-container
  {
	max-width:80%;
	height:600px;
  }

  .myImage
  {
	height:580px;
  }

  .arrow
  {
	height:60px;
	margin:260px auto;
  }
}

/* ====================== responsive for larger than 3200px screen ====================== */
@media (min-width: 3200px)
{
  .container4 img
  {
	padding-left:10px;
	height:55px;
	width:260px;
  }

  .slideshow-container
  {
	max-width:80%;
	height:600px;
  }

  .myImage
  {
	height:580px;
  }

  .arrow
  {
	height:60px;
	margin:260px auto;
  }
}

/* ====================== responsive for larger than 3840px screen ====================== */
@media (min-width: 3840px)
{
  .container4 img
  {
	padding-left:12px;
	height:60px;
	width:280px;
  }

  .slideshow-container
  {
	max-width:80%;
	height:800px;
  }

  .myImage
  {
	height:760px;
  }

  .arrow
  {
	height:80px;
	margin:290px auto;
  }
}