content {position: fixed; text-align: center; width: 100%; top: 50%; margin-top: -80px}

content h1 {color: #f4f4f4;
font-weight: 300;
font-size: 80px;
line-height: 80px;
text-transform: uppercase;
display: inline-block;
font-family: 'Open Sans',sans-serif;}

content h1 b {font-weight: 900}

.js-nametag{position: absolute;width: 100%;}

.js-nametag:nth-child(1){
  animation-name: fade;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-duration: 5s;
  animation-direction: alternate-reverse;  
}

.js-nametag:nth-child(2){
  animation-name: fade;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-duration: 5s;
  animation-direction: alternate;  
}


@keyframes fade{
    0%,50% {opacity: 0;}
    100%{opacity: 1; }
}

#b1 {text-align: right; right: 16px!important}
#b2 {margin-left: 16px}
#b1, #b2 {position: fixed; bottom: 16px; width: 100%; color:#f4f4f4; opacity: .8; font-size: 11px;}

@media only screen and (max-width: 1000px){
h1 {font-size: 60px!important; line-height: 60px!important}
}

@media only screen and (max-width: 768px){
h1 {font-size: 40px!important; line-height: 40px!important}
#b1, #b2 {text-align: center;}
#b1 {bottom: 36px}
#b2 {margin-left: 0px}
}

@media only screen and (max-width: 480px){
h1 {font-size: 32px!important; line-height: 32px!important}
}
