/* CSS Document */
@import url('//fonts.googleapis.com/css2?family=Michroma&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Orbitron:wght@400..900&family=Oxanium:wght@200..800&family=Saira:ital,wght@0,100..900;1,100..900&display=swap');
:root {
    --primary-color: lightsteelblue;
    --secondary-color: lightpink;
    --large: 101%;
    --small: 10px;
}
body, html { margin: 0;height: 100%;background-color: rgba(0,0,0,1);font-family: 'Saira';color:#fff;font-weight:300;/*overflow-x: hidden;*/}
h1 {font-size:240%;font-family: 'Michroma';text-transform:uppercase;font-weight:bold;word-spacing:1rem}
h2 {font-size:200%;font-family: 'Michroma';text-transform:uppercase;}
h3 {font-size:180%;font-family: 'Michroma';}
h4 {font-size:130%;font-family: 'Michroma';}
ul {list-style:none;padding:0;margin:0;}

canvas {position: fixed;top: 0;left: 0; animation: zoomInOut 30s ease infinite alternate forwards;filter: grayscale(1);}
#bg { z-index: 0; }
#fx { z-index: 1; pointer-events: none; opacity:0.75}

a, a:hover, a:focus {color:#912583}

.fw-600 {font-weight:600}

.grayscale {filter: grayscale(1);}

#navigation {position:relative;z-index: 2;background-color:rgba(255,255,255,1);color: rgba(0,0,0,1);text-transform: uppercase;font-family: 'Saira';}
#navigation .ai-logo {max-height:70px}
#navigation .navbar-brand {padding-top:0;padding-bottom:0;}
#navigation .nav-link {color:#000000;font-weight:500;font-size:110%}
#navigation .nav-link:hover, #navigation .nav-link:focus {color:#912583}
.navbar-toggler {border: 0;color:#912583}

#main {position:relative;z-index: 2;color:#fff;}
#header {padding-top:45px;padding-bottom:45px;min-height: calc(100vh - 86px);}
#header .btn:hover, #header .btn:focus {color:#912583 !important;border-color:#912583 !important}

#main .btn {font-weight: 400; padding: 15px 35px;}
#main .btn-transparent {background-color: 0; border-color: 0;}
#main .btn-transparent.white {color: rgba(255,255,255,1);border-color: rgba(255,255,255,1);}

.img-radial-transparent {/* Apply radial gradient as mask */
  -webkit-mask-image: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 70%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: cover;
  /* Standard syntax for supporting modern browsers */
  mask-image: radial-gradient(circle, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 70%);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: cover;
}

#main img {filter: hue-rotate(49deg);max-height: 440px;}

@media (min-width:992px) {
	#navigation .nav-link + .nav-link {margin-left: 25px;}
}
@media (max-width:991px) {
	/*#navigation {
		padding-left: 0;
    	padding-right: 0;
	}*/
	#navigation .navbar-nav { text-align: right; }
	h1 {font-size:200%;}
	h2 {font-size:180%;}
	h3 {font-size:150%;}
	h4 {font-size:120%;}
}
/*
@-webkit-keyframes rotating {
    from{ -webkit-transform: rotate(0deg); }
    to{ -webkit-transform: rotate(360deg); }
}
.rotate {-webkit-animation: rotating 180s linear infinite;}*/

@keyframes zoomInOut {
 from{ -webkit-transform: scale(1); }
 to{ -webkit-transform: scale(1.1); }
}

.accordion {
	--bs-accordion-bg: transparent; /* For the overall accordion background */
	--bs-accordion-btn-bg: transparent; /* For the button/header background when collapsed */
	--bs-accordion-active-bg: transparent; /* For the button/header background when active/open */
	--bs-accordion-body-bg: transparent; /* For the content body background */
	--bs-accordion-color: #fff;
	--bs-accordion-btn-color: #fff;
	--bs-accordion-btn-active-color: #fff;
	--bs-accordion-border-color: 0
}
/* You might also want to address the focus outline/box-shadow */
.accordion-button, .accordion-button:focus {
  box-shadow: none;
}
.accordion-button.collapsed, .accordion-button:not(.collapsed) {
	color: #fff;
	font-weight:400;
	box-shadow: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.accordion-body {padding-bottom:45px}
.accordion-button::after, .accordion-button:not(.collapsed)::after {
	background-image:none;
	font-weight: 900;
	font-family: "Font Awesome 6 Free";
	content:"\f068";
	color:rgba(255,255,255,0.75);
	text-align: center;
}
.accordion-button::after { content:"\2b"; font-size: 80%; }

/* Alternative styling*/
body#alt a, body#alt a:hover, body#alt a:focus {color:#D03687}
body#alt #navigation {background-color:rgba(255,255,255,0);color: rgba(255,255,255,1);}
body#alt #navigation .nav-link {color:#fff;}
body#alt #navigation .nav-link:hover, body#alt #navigation .nav-link:focus {color:#D03687}
body#alt #navigation .ai-logo {max-height:56px}
body#alt #navigation .navbar-brand {padding-top:7px;padding-bottom:7px;}
body#alt .navbar-toggler {color:#fff;padding-right: 0;}
body#alt #header .btn:hover, body#alt #header .btn:focus {color:#D03687 !important;border-color:#D03687 !important}

body#alt #navigation #aiSvgLogo {max-height:45px}
