@import url('https://fonts.googleapis.com/css2?family=Anek+Latin:wght@100..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url("foundation-mods.css");

/*Type*/
h1, h2, h3, h4, h5, p, ul, ol, a{
	font-family: 'Roboto', sans-serif;
	margin: 0 0 0.6em 0;
	padding: 0;
	}
h1, h2, h3, h4, h5{
	font-weight: 800;
	color: #0d738b;
	line-height: 99%;
 }
p, ol, ul{
	font-size: 1.3em;
	letter-spacing: 0.008em;
	line-height: 1.3;
	color: #3e3e3e;
	margin: 0 0 0.6em 0;
	}
a, a:visited{
	color: #0289bf;
}
a:hover{
	color: #f0ae5b;
}
a.button{
	font-family: 'Annek', sans-serif;	
	font-weight: 500;
	text-transform: uppercase;
}
ul{
	list-style: square inside;
	margin: 0.2em 0 1em 0;
}	
ul:not(.nav ul) li{
	text-indent: -1em;
    padding-left: 1em;
}	
span.light{
	font-weight: 300;
}
span.caption{
	font-size: 0.9rem;
	line-height: 1!important;
}
.button{
 background-color: #093e4e;
 color: #ffffff;	
}
.button:hover{
 background-color: #0d738b;
 color: #ffffff;	
}
.nav .top-bar, .nav.top-bar-section ul li, .nav .top-bar-section ul li > a{
	font-family: 'Annek', sans-serif;
	font-weight: 500;
	text-transform: uppercase;
	}
table{
	border: 0;
	width: 80%;
	margin: 1em 0;
	background-color: transparent!important;
}
table tr{
	background-color: transparent!important;
}
table thead tr th, table tbody tr td{
	font-family: 'Annek', sans-serif;	
	font-weight: 600;
}
table tbody tr td{
	font-size: 1.2rem;
}
table tr td span{
	text-transform: uppercase;
	line-height: 1.6rem;
	font-weight: 300;
}
table thead tr th{
	padding: 18px!important;
	font-size: 1rem;
}
table thead tr th:not(:first-child){
	text-transform: uppercase;
	background-color: #2e2e2e;
	color: #f1f1f1;
	text-align: center;
}
table tbody tr td:not(:first-child){
	padding-left: 35px;
}
/*global*/
.scroll-to-top {
  position: fixed;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  text-align: center;
  z-index: 99999999;
  background: #aaa;
  color: #f1f1f1;
  width: 50px;
  height: 48px;
  line-height: 48px;
  right: 0;
  bottom: 20px;
  padding-top: 5px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.scroll-to-top:hover {
  background-color: #f0ae5b;
}
.scroll-to-top.show {
    visibility:visible;
    cursor:pointer;
  opacity: 0.6;
}
.scroll-to-top i.fa {
line-height: inherit;
}
.iframeWrap {
    position: relative;
    padding-bottom: 50%;
    padding-top: 25px;
    overflow: hidden;
	border-radius: 3px;
}
.iframeWrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
	padding: 1em 0;
}
.full-width{
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   max-width: initial;	
}	
.expanded{
	overflow: hidden;
	}
.section p:not(:first-child){
	margin-top: 0.2em;
}
.newsBanner{
	background-color: #f0ae5b;
	background-image: linear-gradient(to top right, #f0ae5b, #f0a74d, #f1a03e, #f1992e, #f1921b);
	padding: 1.3em 0;
}
.newsBanner h2{
	color: #0e0e0e;
	font-size: 1.6rem;
	margin-top: 0.4em;
}
.newsBanner p{
	font-size: 1rem;
}
.newsBanner a{
	color: #eeeeee !important;
	text-decoration: underline;
}
.newsBanner a:hover{
	color: #2e2e2e !important;
}
.uaf-footer{
	background-color: #236192;
	padding: 1em 0;
	text-align: center;		
}	
.uaf-footer img{
	height: 6vh;
	display: block;
	margin: 0 auto;
}	
.uaf-footer img:hover{
	transform: scale(1.2);
	}	
.uaf-footer p{
	font-size: 0.9em;
	font-weight: 300;
	color: #f1f1f1;
	margin: 0.4em 0;
	padding: 0;
	}
.uaf-footer a, .uaf-footer a:visited{
	font-weight: 400;
	color: #f1f1f1;
	text-decoration: underline;
	}
.uaf-footer a:hover{
	font-weight: 600;
	text-decoration: none;
	}
.prefooter{
	  background-color: #2e2e2e; 	
	   background-image: linear-gradient(to left top, #2e2e2e, #262626, #1e1e1e, #171717, #0e0e0e);
	}
.prefooter h2{
	color: #0289bf;
}
.prefooter p, .prefooter a{
	color: #f1f1f1;
	font-weight: 300;
	}
.title, .subpage{
	background-color: #2e2e2e;    
	background-image: linear-gradient(to right top, #0d738b, #26566e, #293b4e, #20242d, #0e0e0e);
	}
.welcome{
	background-color: #ffffff;   
	background-image: linear-gradient(to bottom right, #ffffff, #fbfbfb, #f8f8f8, #f4f4f4, #f1f1f1);
	}
.sponsor{
	background-color: #ffffff;   
	padding: 2em 0 1em 0;
	text-align: center;
}
.sponsor h2{
	color: #2e2e2e;
	font-size: 1.6rem;
	margin-bottom: 1em;
}
.sponsor .sponsor-gallery div{
  display: flex;
  flex-wrap: wrap; 
  justify-content: center; 
  margin-bottom: 0.6em;	
}
.sponsor .sponsor-gallery div img{
  object-fit: contain; 
  padding: 0 20px;		
}
.sponsor .sponsor-gallery div.platinum img{
  max-height: 60px; 	
}
.sponsor .sponsor-gallery div.silver img{
  max-height: 70px; 	
}
.sponsor .sponsor-gallery div.bronze img{
  max-height: 70px; 	
}

.sponsor p.buttonWrap{
	margin-top: 2em;
}
.sponsor .button{
	background-color: #2e2e2e;
}
.sponsor .button:hover{
	background-color: #2197B0;
}
.reg{
	background-color: #fefefe;
}	
.title .logo img{
	max-height: 200px;
	}
.subpage .logo img{
	max-height: 80px;
	}	
.title .logotext{
	margin: 2em 0 1.4em 0;
}
.subpage .logotext{
	margin: 1em 0 0 0;
	display: flex;
	justify-content: left;
    align-items: baseline;
}
.title .logotext a h1, .title .logotext a:visited h1, .subpage .logotext a h1, .subpage .logotext a:visited h1{
	display: inline-block;
	color: #fefefe!important;
	text-decoration: none;
	}	
.title .logotext a h1, .title .logotext a:visited h1{
	font-size: 3rem;
}	
.title .logotext a:hover h1, .subpage .logotext a:hover h1{
	color: #5db3d6!important;
	}	
.title .logotext p, .subpage .logotext p{
	color: #6dc3e6!important;
	}	
.subpage .logotext a h1, .subpage .logotext a:visited h1{
	font-size: 1.6rem;
}	
.subpage .logotext p{
	font-size:1.1rem;
	font-weight: 300;
}	
.nav{
	background: transparent;
	margin-top: 10px;
	margin-left: -10px;
	}	
.nav .top-bar, .nav .top-bar-section ul li, .nav .top-bar-section ul li > a{
	background: transparent!important;	
	}	
.nav .top-bar-section ul li:hover > a:hover, .nav .top-bar-section ul li:hover > a{
	background-color: #0289bf!important;								
	}	
.hero{
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	z-index: -1;
	}	
.tagline{
	position: relative;	
	}
.tagline p{
	position: fixed;	
	font-family: 'Annek', sans-serif;	
	font-weight: 800;		
	text-transform: uppercase;	
	color: #ffffff;
	text-shadow: 2px 2px 4px #0d738b;
	}
.level{
	padding: 1.2em 1em;
}
.level img{
  display: block;
  margin: auto;
  width: 50%;	
  padding-top: 10px;
}
.level p, .level ul li{
	font-size: 1rem;
}
.level ul li{
	margin-bottom: 0.2rem;
}
.basic .level h1, .level h2, .level h3{
	display: block;
	text-align: center;
	padding: 0.4em 0;
	width: 100%;
}
.basic .level p{
text-align: center;
margin: 0.5rem 0;	
}
.basic .level ul{
 margin: 0.5em 0;
} 

.basic ul li:nth-child(1) .level h1{background-color:#41bdda; color: #2e2e2e;}
.basic ul li:nth-child(2) .level h1{background-color:#f0ae5b; color: #2e2e2e;}
.basic ul li:nth-child(3) .level h1{background-color:#bababa; color: #2e2e2e;}
.basic ul li:nth-child(4) .level h1{background-color:#d4b396; color: #2e2e2e;}
.basic ul li:nth-child(1) .level h2{color:#219dba;}
.basic ul li:nth-child(2) .level h2{color:#d08e3b;}
.basic ul li:nth-child(3) .level h2{color:#9a9a9a;}
.basic ul li:nth-child(4) .level h2{color:#b49376;}
.basic ul li .level h3{color:#222222; font-size: 1.3rem;}

.premium p, .premium ul, .premium h1, .premium h2 {
	color: #f1f1f1;
}
.premium p, .premium h1, .premium h2 {
	text-align: center;
}
.premium ul li:nth-child(1) .level {
	background-color: #0d738b;
}
.premium ul li:nth-child(2) .level {
	background-color: #2d93ab; 
}
.premium .level ul  {
	margin: 1em 1em 0 3em;
}

ul.accordion li{
	text-indent: 0!important;
	list-style:none !important;
}	
#schedule > li.accordion-navigation > a{
	background-color: #ffffff;
	color: #463e3f;
	border: 1px solid #0d738b;
	font-size: 0.9rem;
	font-weight: 300;
}	
#schedule > li.accordion-navigation > a span.day{
	font-size: 1.8rem;
	font-weight: 800;
}	
#schedule > li.accordion-navigation > a > div {
  display: flex;
  align-items: center;
}
#schedule > li.accordion-navigation > a div::before {
  content: '\25B7'; 
  display: inline-block;
  font-size: 1.2rem;
  margin-right: 10px;
}
#schedule > li.accordion-navigation > a:hover div::before {
  transform: rotate(90deg);
}
#schedule > li.accordion-navigation.active > a div::before {
  content: '\2715'; 
}
#schedule > li.accordion-navigation.active > a:hover div::before {
  transform: scale(1.5);	
}
.col3Wrapper{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 5px;
}

.col3Wrapper p {
  flex: 1; 
  min-width: 200px;
  font-size: 1rem;	
}
.col3Wrapper p:nth-of-type(1) {
   flex-grow: 1;
   font-size: 1.2rem;	
}
.col3Wrapper p:nth-of-type(2) {
  font-weight: 600;
  font-size: 1.2rem;
  flex-basis: 50%;	
}
.col3Wrapper.break p:nth-of-type(3) {
  flex-shrink: 1;
}


#posters li.accordion-navigation a{
	background-color: #0d738b;
	color: #f1f1f1;
	font-size: 1.2rem;
	font-weight: 600;
}	
#posters li.accordion-navigation a:hover, #posters li.accordion-navigation.active a{
	background-color: #463e3f;
	color: #f1f1f1;
}	
#posters li.accordion-navigation a::after {
  content: 'Show list \25B7'; 
  float: right;	
  font-size: 1rem;	
  font-weight: 300;
}
#posters li.accordion-navigation a:hover::after {
  content: '\0025B6'; 
  transform: rotate(90deg);
}
#posters li.accordion-navigation.active a::after {
  content: '\2715'; 
}
#posters li.accordion-navigation.active a:hover::after {
  transform: scale(1.5);	
}
.sessionItem p{
	margin: 0.2em 0;
	font-size: 1.3rem;
}
.sessionItem p.tags, .sessionItem div.authors p{
	font-size: 0.9rem;
}
.sessionItem p.tags{
	padding: 0.4rem;
	background-color: #0d738b;
	color: #f1f1f1;
    display: inline-block;
}
.sessionItem.talk p.time{
	color: #0d738b;
}

.sessionItem .break{
	background-color: #f1f1f1;
}

@media only screen and (min-width: 40em) {
	.hero {
	height: 50vh;
	background-position: center center;	
	}	
	.tagline p{
	font-size: 2.6rem;
	line-height: 2.6rem;	
	animation-name: colorEaseLarge;
    animation-duration: 3s;	
	animation-timing-function: ease-in;	
	left: 20%;
	top: 40%;	
	transform: translate(-20%, 0);	
	}
	.section:not(.newsBanner .section){
	padding: 1.6em 0 1em 0;
	}
	.section p:first-child{
	margin-top: 0.3em;
	}
}	
@media only screen and (max-width: 40em) {
	.hero {
	height: 25vh;
	background-position: 80% 50%;	
	}	
	.tagline p{	
	font-size: 1.2rem;
	line-height: 1.5rem;
	animation-name: colorEaseSmall;
    animation-duration: 6s;	
	animation-timing-function: ease-in;	
	left: 10%;
	top: 50%;		
	}
	.section{
	padding: 1em 0 0.5em 0;
	}
}	
@keyframes colorEaseLarge {
  from {color:#0d738b;  font-size: 1em;}
  to {color:  #fefefe; font-size: 2.6em;}
}
@keyframes colorEaseSmall {
  from {color: #0d738b;font-size: 0.8em;}
  to {color: #fefefe;   font-size: 1.2em;}
}
