@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(https://static.igem.wiki/teams/4150/wiki/fonts/open-sans-300.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(https://static.igem.wiki/teams/4150/wiki/fonts/open-sans-400.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(https://static.igem.wiki/teams/4150/wiki/fonts/open-sans-600.woff) format('woff');
}

* {
	font-family:'Open Sans';
}
body { overflow-x:hidden;}
	
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #132343 !important; }
.bg-hero { background-color: #7952b3; }

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

/* header */
.main-header {
	height:70vh;
	background: transparent no-repeat center;
	background-size: cover;
	background-attachment: fixed;
}

.main-header .transbox {
	background-color:rgba(19,35,67,0.5);
	height:100%;
	width: 100%;

}

.main-header .header-title {
	display:block;

	color: #f5f5f5;/*a6b4d0;*/
	font-weight:900;
	font-size: 75px;
	font-family:'Open Sans';
	text-transform: uppercase;

	text-shadow: 5px 5px #132343;
	position: absolute; 
	height:fit-content;
	width:auto;
	max-width:90vw;
	margin:0;
	text-align:center;

	left: 50vw;
	top:35vh;
	transform:translate(-50%, -50%);

}
.lower {
	text-transform:none !important;
}

/* loader */
.loader {
  border: 0px solid #f5f5f5;
  border-radius: 50%;
  border-top: 5px solid #0f1626;
  width: 80px;
  height: 80px;
  -webkit-animation: spin 0.7s linear infinite; /* Safari */
  animation: spin 0.7s linear infinite;

  position:fixed;
  display:block;
  top:50vh;
  left: 50vw;
  margin-top: -40px;
  margin-left: -40px;
  z-index:100;

}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.loader-background {
	position:fixed;
	top:0;
	left:0;
	width: 100vw;
	height: 100vh;
	background-color:#f5f5f5;
	opacity: 0.9;
	z-index:100;
}

.main-container {
	padding:0 !important;
}

/* menu */
.navbar {
	background-color:rgba(19, 35,67,0.95);
	color:white! important;
}