@import url('https://fonts.googleapis.com/css2?family=Marck+Script&family=Mr+Dafoe&family=Tillana:wght@700;800&display=swap');

body {
    margin:0;
    padding:0;
	font-family:"Sriracha",cursive;
	color:#4d4d4d;
	background:#fafafa;
	height:100%;
}
.content {
    display:block;
    background: #0CF;
	font-family:"Sriracha",cursive;
	color:#666;
	padding:1em 10%;
}

.menu {
	display:block;
    background:#fafafa;
	font-family:"Sriracha",cursive;
	color:#666;
	text-align:center;
	padding:1em 10%;
}

h1 {font-family:"Sriracha",cursive;color:#333;font-size:4.5em; font-stretch:extra-expanded;
	font-size:50px;
	text-transform:uppercase;
	padding-top:100px;
	margin-bottom:.6em;
	text-shadow:   0 1px 0 #ccc, 
				   0 2px 0 #c9c9c9,
				   0 3px 0 #bbb,
				   0 4px 0 #b9b9b9,
				   0 5px 0 #aaa,
				   0 6px 1px rgba(0,0,0,.1),
				   0 0 5px rgba(0,0,0,.1),
				   0 1px 3px rgba(0,0,0,.3),
				   0 3px 5px rgba(0,0,0,.2),
				   0 5px 10px rgba(0,0,0,.25),
				   0 10px 10px rgba(0,0,0,.2),
				   0 20px 20px rgba(0,0,0,.15);
}
h2 {
font-family: 'Marck Script', cursive;color:#444;font-size:2.5em; font-stretch:extra-expanded;
	-webkit-text-stroke: 1px #777;
	text-shadow: 3px 3px 10px rgba(77, 77, 77,0.7);
}
h3 {font-family: 'Sriracha', cursive;font-size:1.5em; font-stretch:extra-expanded;
	color: #4d4d4d;
	padding-top:1em;
}
.h2small {
	font-size:32px;
}
h3 {
	color: #4d4d4d;
	font-size:30px;
	margin-bottom:1em;
}
p {
	font-size:22px;
	margin-bottom:1em;
}
.colortext {
	color: #0F0;
}
.small{
    font-size: 18px;
}
strong {
	color:#333;
}
a:link {
	color:#666;
	font-weight: bold;
	text-decoration:none;
}
a:visited {
	color:#666;
}
a:hover {
	color: #6C3;
	text-shadow:2px 2px 6px #000;
}
a:active {
}

ul {
	padding:5px;
	list-style-type:circle;
}
ul li {
	font-size:18px;
}

hr {
    border:0;
	margin:5em 2em;
    height: 2px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(77, 77, 77, 0.75), rgba(0, 0, 0, 0));
}

.hr-menu {
    border:0;
	margin:-1em 5em;
	padding:0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(77, 77, 77, 0.25), rgba(0, 0, 0, 0));
}

/* HR SEPARATOR */
.separator {
	display: flex;
	align-items: center;
	text-align: center;
	color: #666;
	font-family: 'Tillana', cursive;color:#555;font-size:1.25em;
}
.separator::before,
.separator::after {
	content: '';
	flex: 1;
	border:0;
	margin:5em 2em;
	height: 2px;
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(77, 77, 77, 0.75), rgba(0, 0, 0, 0));
}
.separator:not(:empty)::before {
  margin-right: .5em;
}
.separator:not(:empty)::after {
  margin-left: .5em;
}

.index-slides {display:none;position:relative;width:auto;}

.imagebox {
	position: relative;
}
.image {
	display: block;
/*	margin-left: auto;
	margin-right: auto;*/
	width: 100%;
	max-width: 200%;
	height: auto;
	border-radius:0px;
	margin:5em 0;
	-webkit-box-shadow: 6px 6px 12px 5px rgba(77, 77, 77,0.8); 
	box-shadow: 6px 6px 12px 5px rgba(77, 77, 77,0.8);
}
.imagetext {
	position: absolute;
	bottom: 1em;
	right: 1em;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius:2em;
	color: white;
	padding-left: 1em;
	padding-right: 1em;
}
.himage {
	font-size:18px;
}
.pimage {
	font-size:14px;
	color:#CCC;
}
img {
	max-width: 100%;
	height: auto;
}
.video {
	display: block;
	width: 100%;
	max-width: 200%;
	height: auto;
	background-color:#000;
	border:#000 2px inset;
	border-radius:2em;
	margin:5em 0;
	-webkit-box-shadow: 6px 6px 12px 5px rgba(203,155,81,0.8); 
	box-shadow: 6px 6px 12px 5px rgba(203,155,81,0.8);
}
.animation {
	animation-duration: 2s;
	animation-name: slidein;
}
@keyframes slidein {
  from {
    margin-left: 100%;
    width: 200%;
  }
  to {
    margin-left: 0%;
    width: 100%;
  }
}

table {
	margin-left: auto;
	margin-right: auto;
	width:100%;
	font-family: arial, sans-serif;
	border-collapse: collapse;
	background-color: #EEE;
}
td {
	border: 1px solid #999;
	text-align: left;
	padding: 12px;
}

.social {
	background:linear-gradient(to right, #826033 0, #cb9b51 15%, #f6e27a 45%, #f6e27a 55%, #cb9b51 80%);
	margin-top:-20px;
	margin-bottom:-30px;
	text-align:center;
	z-index:99;
}

.reviews {
	background:#FFF;
	padding:1em 10%;
}

/* top bar */
.topbar {
    position:fixed;
    left:0;
    right:0;
	height:80px;
	margin:0px 25px;
	padding:0px 35px;
	border-bottom:rgba(77, 77, 77, 0.8) 2px solid;
	border-radius:0 0 35px 35px;
	background-image: linear-gradient(to right, rgba(77, 77, 77, 0.7), rgba(177, 177, 177, 0.8), rgba(77, 77, 77, 0.7));
	-webkit-box-shadow: 0px 5px 20px 5px rgba(77, 77, 77,0.8); 
	box-shadow: 0px 5px 20px 5px rgba(77, 77, 77,0.8);
	z-index:10;
}
.topbar p {color:#000;text-shadow: 3px 3px 10px rgba(77, 77, 77,0.6);}
#topbar-container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  padding:0;
  margin-top:-20px;
}
#topbar-container > div {
  width: 33%;
}

/* SCROLLBAR 	color:#4d4d4d;
	background:#fafafa; */

::-webkit-scrollbar {
    height: 1rem;
	width:16px;
}
::-webkit-scrollbar-thumb {
    background-color:#4d4d4d;
    border-radius: .25rem;
    border: 1px solid #333;
}
::-webkit-scrollbar-thumb:hover{
	background: linear-gradient(to right, rgba(77,77,77, 1), rgba(77,77,77, 0.5), rgba(77,77,77, 1));
    border-radius: .25rem;
}
::-webkit-scrollbar-track {
    background-color: transparent;
    border: 0.5px dashed #4d4d4d;
    border-radius: .25rem;
}

/* footer */
.footer {
    display:block;
	padding:2em 10%;
	background: #3C3;

}

/* GLOW */
.glow {
  animation: glow 1s ease-in-out infinite alternate;
}
@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #333, 0 0 20px #333, 0 0 30px #333, 0 0 40px #333, 0 0 50px #333, 0 0 60px #333, 0 0 70px #333;
  }
  to {
    text-shadow: 0 0 20px #900, 0 0 30px #900, 0 0 40px #900, 0 0 50px #900, 0 0 60px #900, 0 0 70px #900, 0 0 80px #900;
  }
}

/* PULSING LINKS */
.pulse-link{
	font-size:24px;
	color:#000;
	text-decoration: none;
}
.pulse-link:hover{
	font-size:24px;
	text-decoration: none;
	color: #0FF;
}
@-webkit-keyframes pulse-grow-on-hover {
  to {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}
@keyframes pulse-grow-on-hover {
  to {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}
.pulse-hover {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(177, 177, 177, 0);
}
.pulse-hover:hover, .pulse-hover:focus, .pulse-hover:active {
  -webkit-animation-name: pulse-grow-on-hover;
  animation-name: pulse-grow-on-hover;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* TEXT ANIMATION */
.text-animation {
  text-align:center;
  text-transform:uppercase;
  letter-spacing:4px;
  background:linear-gradient(90deg, #cb9b51,#960,#cb9b51);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-repeat:no-repeat;
  background-size:80%;
  position:relative;
  animation:shine 3s ease-in-out alternate infinite;
}
@keyframes shine {
  from {
    background-position-x:-100%;
  }
  to {
    background-position-x:150%;
  }
}

/* news page */
.news {}
.row {display:flex;flex-wrap:wrap;}
.column {flex:1 0 26%;background-color:#CCC;margin:15px;padding:20px;border-radius:10px;box-shadow:7px 7px 9px #666;}
.column:hover{
	background: #CB9B51;
	background: -moz-linear-gradient(to right, rgba(77, 77, 77, 0.7), rgba(177, 177, 177, 0.8), rgba(77, 77, 77, 0.7));
	background: -webkit-linear-gradient(to right, rgba(77, 77, 77, 0.7), rgba(177, 177, 177, 0.8), rgba(77, 77, 77, 0.7));
	background: linear-gradient(to right, rgba(77, 77, 77, 0.7), rgba(177, 177, 177, 0.8), rgba(77, 77, 77, 0.7));
#pic {width:100%;height:auto;border-radius:10px;}
.news h2 {font:Verdana;font-size:36px;color:#FFF;text-shadow:#963 3px 3px 6px;-webkit-text-stroke: 0;}
.news p {font-size:24px;color:#FFF}
a.news:link {color:#FFF;font-weight:normal;}
a.news:hover {color:#960;text-shadow:2px 2px 6px #666;}
@media (max-width:900px) {.column {flex:100%;}}

.webmaster {
    display:block;
    background:#4d4d4d;
	padding:5em 10%;
	text-align:center;
}
.webmaster h3,a:link {
	color:#999
}