/* ////////// FONTS ////////// */
@font-face {
  font-family: 'Font Awesome 5 Brands Regular';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/fa-brands-400.eot'); /* IE9 Compat Modes */
  src: local('Font Awesome 5 Brands Regular'), local('Font Awesome 5 Brands Regular'),
       url('../webfonts/fa-brands-400.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/fa-brands-400.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/fa-brands-400.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/fa-brands-400.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/fa-brands-400.svg') format('svg'); /* Legacy iOS */
}

/* rubik-regular - latin */
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/google/rubik-v21-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../webfonts/google/rubik-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/google/rubik-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/google/rubik-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/google/rubik-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/google/rubik-v21-latin-regular.svg#Rubik') format('svg'); /* Legacy iOS */
}
/* ////////// FONTS END ////////// */

body {
	background: linear-gradient(-45deg, #403ece, #ef4148);
	background-size: 400% 400%;
	animation: gradient 10s ease infinite;
	min-height: 100vh;
	font-family: 'Rubik';
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

main {
	display: flex;
	min-height: 86vh;
	align-items: center;
	justify-content: center;
	padding-top: 7vh;
}

.container {
  color: white;
  margin: 0 auto;
  text-align: center;
}

hr {
	border-color: #c6c6c6;
    opacity: 0.5;
}

/* images */
img.logo {
	width: 250px;
	height: auto;
}

/* Headlines */
h1 {
  font-weight: 400;
  letter-spacing: .125rem;
  text-transform: uppercase;
}

/* .modal */
.modal a {color: #403ece;}
.modal a:hover {
	color: #ef4148;
	text-decoration: none;
}

/* ////////// COUNTDOWN ////////// */

#countdown ul {padding-left: 0;}

#countdown li {
  display: inline-block;
  font-size: 1.5em;
  list-style-type: none;
  padding: 1em;
  text-transform: uppercase;
}

#countdown li span {
  display: block;
  font-size: 4.5rem;
}

/* ////////// FORM ////////// */
form.form-inline {justify-content: center;}

form.form-inline > div {
	max-width: 350px;
	width: 100%;
}
form.form-inline > div > input.form-control {
	width: 100%;
	background-color: rgba(255,255,255,.5);
	border: none;
}

form.form-inline > button {
	width: auto;
}

form.form-inline > div > input.form-control:focus {
	background-color: rgba(255,255,255,1);
	box-shadow: none!important;
}

.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: white!important;
	opacity: 1; /* Firefox */
}

.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: white!important;
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
	color: white!important;
 }

/* ////////// SOCIAL MEDIA ////////// */
.social-media .btn {margin: 0 10px;}

.social-media .btn:hover,
.social-media .btn:focus,
.social-media .btn:active {box-shadow: none!important;}

.social-media .btn i {margin-right: 7px;}


/* ////////// FOOTER ////////// */
footer {
	min-height: 14vh;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 7vh;
}

footer button.btn.btn-primary {
	margin: 0 10px;
	background-color: transparent;
	border: none;
}

footer button.btn.btn-primary:hover,
footer button.btn.btn-primary:active,
footer button.btn.btn-primary:focus {
	background-color: transparent !important;
	border: none!important;
	color: #dedede!important;
	box-shadow: none!important;
}

/* ////////// MEDIA QUERIES ////////// */
@media all and (max-width: 768px) {
	#countdown h1 {
		font-size: 1.5rem;
	}

	#countdown li {
		font-size: 1.125rem;
	}
  
	#countdown li span {
		font-size: 3.375rem;
	}
}

/*@media (max-width: 575.9px) {
	.entry {
		min-height: 93vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
}*/

@media (max-width: 510px) {
	#countdown ul li {min-width: 34%;}
}

@media (max-width: 462.9px) {
	.social-media a.btn {
		display: block;
		margin: 15px 0;
	}
}