/* NXT splash screen for applications */
/* added in NXT 5 - BERNHAM           */
/* required:
 * jsplus.js
 * sole-design.css
 * splash.js

   clashes with:
 * design.css
*/
body {
  margin:0;
  padding:0;
  background:#FEFEFE;
  font-family: 'Open Sans', sans-serif;
}
header {
   background: #3f51b5;
   width:100%;
   height:450px;
   font-family: 'Montserrat', sans-serif;
   text-align: center;
   vertical-align: middle;
   color:white;
   font-size: 75px;
}
header span {
  display: block;
  padding-top: 179px;
  /* text-shadow: 0px 1px 2px #424242; */
}
nav {
  font-family: 'Montserrat', sans-serif;
  background:var(--dark-primary);
  height:50px;
  padding-top: 30px;
  display: block;
  color:#FEFEFE;
  text-align: center;
  letter-spacing: 1px;
}
container {
  display: block;
  margin: 50px auto;
  max-width: 800px;
  box-shadow: 0px 2px 4px #999;
  transition:all .4s;
  border-radius: 0px 0px 3px 3px;
}
container:hover {
  box-shadow: 0px 2px 8px #777;
}
card {
  display: block;
  padding: 20px;
  background: #FAFAFA;
  transition: all .2s;
}

card:hover {
   background:#DDD;
  cursor: pointer;
}
card:not([no]) b {
  display: block;
  font-weight: 500;
  font-family: 'Montserrat', sans-serif;
}
  card.title {
      color: white;
    background: var(--primary);
    border-radius: 3px 3px 0px 0px;
    border:none;
    font-family: 'Montserrat', sans-serif;
}

.scroll450>header {
  position: fixed;
  top:0;
  left:0;
  
  font-size:30px;
  height: 80px;
  z-index: 99;
  animation:scrollIn .2s;
}
header.small {
  height:300px;
}
@keyframes scrollIn {
  0% {left:-250px;}
  100% {left:0px;}
}
.scroll450>header span {
  padding-top:20 !important;
}
.scroll450  nav {
  position: fixed;
  top:0; left:0; right:0;
}
.scroll450 {
  margin-top:530px;
}
#dotnet {
  display: none;
      position: fixed;
bottom: -20px;
z-index: 99;
left: calc(50% - 10px );
border-radius: 20px;
border: 1px solid #444;
transform: rotate(90deg);
  background:rgba(240,240,240,0.9);
}
#dotnet span {
  border-radius: 100%;
  display: block;
  width:15px;
  height:15px;
  overflow: hidden;
  color:transparent;
  background: red;
  margin: 3px;
}


@keyframes scrollShow {
  0% {     height: 0px; color:transparent;}
  60% {    color:transparent; }
  100% {  height: 450px; color:white;   }
}
@keyframes opacitIn {
  0% {opacity:0;}
  50% {opacity:0;}
  100% {opacity:1s;}
}
@keyframes saturate {
  0% {   background:hsl(231,20%,48%);  height:0px;}

  100% {     background:hsl(231,57%,37%);height:50px;}
}