/*customer's linked fonts 
font-family: 'Caveat', cursive;
font-family: 'Henny Penny', cursive;
font-family: 'Orbitron', sans-serif;
font-family: 'Unica One', cursive;
font-family:'Unica One', sans-serif;*/


/* used the * to global include everything / resets the browser defaults for spacing around
border-box includes the margin/padding inside the total size specified / give the letters a bit of space*/

* { padding:0;
    margin:0;
    box-sizing: border-box;
    font-family:'Orbitron', sans-serif;
    letter-spacing: 1.2px;}

 /* hiding the x overflow prevents horizontal scroll bars */
    body {
        line-height: 1.3;
        font-family: 'Orbitron', sans-serif;
        align-items: center;
        text-align:center;
        height:100%;
        width:100%;
        overflow-x:hidden; 
        background:rgb(17, 6, 6);
       
    }
/* provides a background image if video is not visible */
    .intro {
        height:100vh;
        width:100%;
        margin:auto;
        overflow:hidden;
        background: url('/images/neutrinos_composite_mod.jpg') no-repeat 50% 50%;
        background-size: cover;
        align-items:center;
    }
/* little space */
    .intro h1 {
        padding-top:10%;
    }

/* headline text */
    h1 {
        font-size:3rem;
        line-height:1.2;
        margin-top:35px;
        margin-bottom:35px;
        position:relative;
    }

/* entry button with small transform */
   .btn {
        background:green;
        color: white;
        padding: 15px;
        margin-top:40px;
        text-decoration: none;
        border-radius: 12px;
        font-family: 'Orbitron', sans-serif;
        font-size: 2rem;
        text-align:center;
        min-height: 0.3rem;
        justify-content:center;
        border:white 1px solid;
        display:inline-block;
        transition: 2.5s;
        position:relative;
    }

/* mouse hovers button animates */
    .btn:hover {
        transform:rotateY(360deg);
        background:transparent;
    }
   
/* text styling */
    .header-content {
        color:white;
        font-family:'Orbitron', sans serif;
    }

    .header-content h1 {
        text-shadow: 2px 1px 15px black;
    }

/* use the position with '- position' to keep it in the middle no matter what  */
    .inner video {
        min-width:100%;
        min-height:100%;
        object-fit:cover;
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%, -50%);
    }

/* ensure always stays on top in the layers */
    .header-content {z-index:2;}

    .content {
        text-shadow: 1px 1px 3px black;
        color:white;
        position:relative;
        max-width:70%
        z-index:100;
        margin:auto;
        align-items:center;
        justify-content:center;
        place-items:center;

    }

    .content h1 {
        position:relative;
        width:70%;
        margin: 0 auto;
        place-items:center;
        color:white;
    }