@charset "UTF-8";
/* CSS Document */
body, h1,h2,h3,h4,h5,h6 {font-family: "Montserrat", sans-serif}
.w3-row-padding img {margin-bottom: 12px}
/* Set the width of the sidebar to 120px */
.w3-sidebar {width: 120px;background: #222;margin-top:10px;}
/* Add a left margin to the "page content" that matches the width of the sidebar (120px) */
/*hr Style*/
hr{border:0;border-top:1px solid #d98b5c;margin:20px 0}
#main {margin-left: 120px}

/*slide container main*/
.w3-display-container{position:relative; max-width: 800px; }






/*top slider images settings*/
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 13 ));
  }
}


.w3-display-container.mySlides{border: 1px solid ;
  padding: 10px 40px 0px 40px;
  box-shadow: 2px 1px 20px 0px #ffff;
;}

/*end top slider images settings*/

/* Slider */
/*logo slider start*/

/* Slider */
.wrapper {
	width: 100vw;
	height: 30vh;
	display: flex;
	align-items:center;
	justify-content: center;
}

.slider {
	width: 100%;
	height: 100%;
	position: relative;
	background: black;
	box-shadow: 0px 10px 20px -10px rgba(0,0,0,0.2);
	display: flex;
	align-items: center;

	overflow: hidden;
}

.slide {
	height: 150px;
	display: flex;
	align-items:center;
	animation: slideshow 15s linear infinite;
	
}

.slide img {
	height: 70px;
	
	padding: 0 12px 0 12px;
}

@keyframes slideshow {
	0% {transform: translateX(0);}
	100% {transform: translateX(-100%);}
}

.slider::before, .slider::after {
	height: 150px;
	width: 150px;
	position: absolute;
	content: "";
	background: linear-gradient(to right, black 0%, rgba(0,0,0,0)100%);
	z-index:2;
}
.slider::after {
	right: 0;
	top: 0;
	transform: rotateZ(180deg);
}

/* Remove margins from "page content" on small screens */
@media only screen and (max-width: 600px) {#main {margin-left: 0}}