@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;500&display=swap');
@font-face {  
	font-family:INCISED901;  
	src: url(./media/INCISED901.ttf);				/* EOT for IE */
	src: local("INCISED901"),
	url(./media/IN901XKI.ttf) format("truetype");	/* non-IE */  
} 
body {
	background-color: #1c1c1c;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	margin: auto;
	text-align: center;
	width: 100%;
}
main {
	margin: auto;
	text-align: center;
}
@media only screen and (min-width: 768px) {		/* For tablets: */
	body {
		width: 70%;
	}
}
@media only screen and (min-width: 1200px) {	/* For desktop: */
	body {
		width: 60%;
	}
}
@media only screen and (min-width: 1900px) {	/* For large-desktop: */
	body {
		width: 50%;
		max-width: 1080px;
	}
}
header {
}
@media only screen and (min-width: 768px) {
	header {
		/* width: 70%; */
	}
}
@media only screen and (min-width: 1200px) {
	header {
		/* width: 60%; */
	}
}
@media only screen and (min-width: 1900px) {
	header {
		/* width: 50%; */
	}
}

header > img {
	display: block;
	height: auto;
	max-width: 35%;
}
header > a > img {
	display: block;
	height: auto;
	max-width: 30%;
}
video {
	height: auto;
	width: 100%;
}
img.partner {
	width: 50%;
	height: auto;
	padding: 1%;
	    opacity: 0.5;
	filter: gray;
	filter: grayscale(100%);
	transition: all 1s ease;
}
img.partner:hover {
	filter: grayscale(0%);
	    opacity: 1;
}
@media only screen and (min-width: 768px) {
	video {
		/* width: 70%; */
	}
	img.partner {
	width: 40%;
	}
}
@media only screen and (min-width: 1200px) {
	video {
		/* width: 60%; */
	}
	img.partner {
	width: 30%;
	}
}
@media only screen and (min-width: 1900px) {
	video {
		/* width: 50%; */
	}
	img.partner {
	width: 25%;
	}
}
/*FONTS*/
h2 {
	background-color: white;
	border: thick solid white;
	color: #1c1c1c;
	font-family: INCISED901, sans-serif;
	font-size: xx-large;
	letter-spacing:2px;
	text-align: center;
	transform : skewX(-15deg);
	word-spacing: 0.5vw;
	width:90%;
	margin: 0 auto;
}
p {
	color: white;
	font-size: large;
	line-height: 150%;
}
strong {
	color: white;
	font-weight: 500;
	line-height: 1.5;
}
label {
	color: white;
	font-weight: 500;
	line-height: 1.5;
}
/* LINKS */
.link {
	color: white;
	text-decoration: none;
}
.link:hover {
	font-weight: 700;
}
a[href^="tel"]{
    color:inherit;
    text-decoration:none;
}
/*BUTTONS*/
button {
	background-color: #1c1c1c;
	border-bottom: thin solid white;
	border-left: none;
	border-right: none;
	border-top: thin solid white;
	color: white;
	cursor: pointer;
	display: inline-block;
	font-family: INCISED901, sans-serif;
	font-size: large;
	font-weight: 700;
	letter-spacing: 2px;
	line-height: 1.5;
	outline: none;
	padding: 15px 32px;
	position: relative;
	text-decoration: none;
	transition: all 2s ease;
	width: 90%;
	margin: 0 auto;
}
@media only screen and (min-width: 768px) {
	button {
		width: 80%;
	}
}
@media only screen and (min-width: 1200px) {
	button {
		width: 70%;
	}
}
@media only screen and (min-width: 1900px) {
	button {
		width: 60%;
	}
}
button:hover {
	background-color: white !important;
	border-bottom: none;
	border-top: none;
	color: #1c1c1c !important;
	letter-spacing: 3px;
	transform : skewX(-15deg);
}
/*SOCIALLINKS*/
#sociallinks {
	color: white;
	position: relative;
}
#sociallinks > .fab, #sociallinks > .fas {
	height: auto;
	margin: 0.7%;
	padding: 1%;
	text-align: center;
	text-decoration: none;
	width: auto;
    opacity: 0.5;
}
@media only screen and (min-width: 768px) {
	#sociallinks > .fab, #sociallinks > .fas {
		margin: 0.5%;
		padding: 0.7%;
		font-size: large;
	}
}
@media only screen and (min-width: 1200px) {
	#sociallinks > .fab, #sociallinks > .fas {
		margin: 0.3%;
		padding: 0.5%;
		font-size: x-large;
	}
}
.fab:hover, .fas:hover, .tooltiptext {
    opacity: 1 !important;
}
.fa-facebook {
  background: #3B5998;
  color: white;
}
.fa-instagram {
  background: #125688;
  color: white;
}
.fa-youtube {
  background: #bb0000;
  color: white;
}
.fa-tiktok {
  background: #bb0000;
  color: white;
}
.fa-phone {
  background: white;
  color: #1c1c1c !important;
}
#sociallinks > .fa-envelope {
  background: white;
  color: #1c1c1c;
}
.tooltip .tooltiptext {
	background-color: white;color: #1c1c1c;
	border: thin solid white;
	font-family: 'Roboto', sans-serif;
	font-size: medium;
	font-style: normal;
	left: 50%;
	padding: 5px;
	margin: 5px;
	position: absolute;
	text-align: center;
	top: 100%;
	visibility: hidden;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
}
.collapsible {
}
.active {
	background-color: white;
	border-bottom: none;
	border-top: none;
	color: #1c1c1c;
	letter-spacing: 2px;
	transform : skewX(-15deg);
	width: 90%;
	margin: 0 auto;
	transition: all 2s ease;
}
.expand {	/* hidden by default */
	display: none;
	text-align: center;
}
/*FORM*/
form {
	color: white;
}
input, textarea {
	background: #1c1c1c;
	border: thin solid lightgrey;
	font-family: 'Roboto', sans-serif;
	height: 2vh;
	padding: 5px;
	transition: width 2s ease;
	width: 50vw;
}
textarea {
	color: white;
	overflow: hidden;
	transition: 2s ease;
	width: 50%;	
}
::placeholder {				/* Chrome, Firefox, Opera, Safari 10.1+ */
	color: white;
	opacity: 1;				/* Firefox */
}
:-ms-input-placeholder {	/* Internet Explorer 10-11 */
	color: white;
}
::-ms-input-placeholder {	/* Microsoft Edge */
	color: white;
}
input:focus {
	width: 90vw;
}
textarea:focus {
	height: 15vh;
	width: 90%
}
@media only screen and (min-width: 768px) {
	input {
		width: 40vw;
	}
	textarea {
		width: 57.5%;
	}
	input:focus {
		width: 60vw;
	}
	textarea:focus {
		height: 20vh;
	}
}
@media only screen and (min-width: 1200px) {
	input {
		width: 30vw;
	}
	textarea {
	width: 42.5%;
	}
	input:focus {
		width: 40vw;
	}
	textarea:focus {
		height: 30vh;
	}
}
@media only screen and (min-width: 1900px) {
	/* FORM FOR LARGE DESKTOPS */
}
input[type="file"] {
    display: none;
}
.custom-file-upload {
    border: 1px solid #ccc;
    cursor: pointer;
    display: inline-block;
    padding: 6px 12px;
}
/*FOOTER*/
hr.separation {
	border: thin solid white;
	opacity: 0.5;
}
footer > p {
	font-size: small;
}
footer a {
	color: white;
	text-decoration: none;
}