:root { --color-red: rgba(255,110,0,1); --color-red-opac: rgba(255,110,0,0.5) }
html { font-size: 16px; }
h1, h2 { color: var(--color-red); }
h2 { font-size: 1.4rem; }
a { text-decoration: none; color: rgba(255,110,0,1); }
nav ul { list-style: none; margin: 0; padding: 0; }
hr { border: 0; border-top: 1px solid black; margin: 3rem 0; }

.announcement { height: 2rem; }

.bg-white { background-color: #fff; }
.font-sans { font-family: dincond, sans-serif; }
.max-w-xs { max-width: 20rem; }
.max-w-sm { max-width: 24rem; }
.max-w-lg { max-width: 32rem; }
.max-w-full { max-width: 100%; }
.w-auto { width: 100%; }
.mx-auto { margin-left: auto; margin-right: auto; }
.flex { display: flex; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.content-center { align-content: center; }
.text-center { text-align: center; }
.text-sm { font-size: .875rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.uppercase { text-transform: uppercase; }
.font-light { font-weight: 300; }
.text-black { color: #000; }
.text-red { color: var(--color-red); }
.hover\:text-red:hover { color: rgba(255,110,0,.6); }

/* margin */
.m-4 { margin: 1rem; }
.m-0 { margin: 0; }
.mt-0 { margin-top: 0; }
.mt-8 { margin-top: 2rem; }
.mt-16 { margin-top: 4rem; }
.mr-6 { margin-right: 1.5rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.mx-0 { margin-right: 0; margin-left: 0; }
.my-4 { margin-top: 1rem; margin-bottom: 1rem; }
.my-8 { margin-top: 2rem; margin-bottom: 2rem; }
.my-16 { margin-top: 4rem; margin-bottom: 4rem; }

/* padding */
.p4 { padding: 1rem; }
.py-0 { padding-top: 0; padding-bottom: 0; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.px-4 { padding-right: 1rem; padding-left: 1rem; }
.px-6 { padding-right: 1.5rem; padding-left: 1.5rem; }

.top-border { border-top: 10px solid rgba(255,110,0,1); }
.bottom-border { border-bottom: 10px solid rgba(255,110,0,1); }

.bg-red { background-color: rgba(255,110,0,0.25); }
.shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }

/* slider */
.overflow-hidden { overflow: hidden; }
.w-5x { width: 500%; }
.w-1\/5 { width: 20%; }
.float-left { float: left; }
.text-0 { font-size: 0; }
.relative { position: relative; }
.slider-animation { animation: 45s slidy infinite; }

@keyframes slidy {
	0% { left: 0%; }
	10% { left: 0%; }
	12.5% { left: -100%; }
	22.5% { left: -100%; }
	25.0% { left: -200%; }
	35.0% { left: -200%; }
	37.5% { left: -300%; }
  47.5% { left: -300%; }
  50.0% { left: -400%; }

  60.0% { left: -400%; }
  62.5% { left: -300%; }
	72.5% { left: -300%; }
	75.0% { left: -200%; }
	85.0% { left: -200%; }
	87.5% { left: -100%; }
	97.5% { left: -100%; }
	100% { left: 0%; }
}

@font-face {
	font-family: 'dincond';
	src: url('dincond.eot');
	src: local('☺'), url('dincond.woff') format('woff'), url('dincond.ttf') format('truetype'), url('dincond.svg') format('svg');
	font-weight: normal;
}
