/* 

FONT:

font-family: 'Lato', sans-serif;



COLORS:

#9421CE

#296C98

#052133 - font

green: rgb(47, 150, 7)

 */

html{

    margin:0;

    padding: 0;

    

}

body {    

   display: flex;

   min-height: 100vh;

   flex-direction: column;

   background-image: url(../img/lighthouse-bg.png);

   background-position: center;

   background-repeat: no-repeat;

   background-size: cover;

   color: #fff;

   font-family: 'Lato', sans-serif;

}



.title {

    text-transform: uppercase;

    font-weight: 900;

    letter-spacing: 5px;

    font-size: 45px !important;

    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.658);

    margin-bottom: 5vh;

}



@media only screen and (max-width: 450px) {

    .title {

        font-size: 30px !important;

        word-break: break-all;

        letter-spacing: 2px;

    }



    h2 {

        font-size: 1rem;

    }



    img {

        width: 250px;

    }

}



h2 {

    text-transform: uppercase;

    font-weight: 400;

    font-size: 2.5rem;

    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.658);

}



p {

    font-size: 2rem;

    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.658);

}



.btn-large {

    font-size: 2rem;

    border-radius: 5px;

    margin-top: 5vh;

    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);

}



.btn-large:hover {

    box-shadow: inset 2px 2px 8px rgba(0, 0, 0, 0.7);

}



img {

    opacity: 0.7;

    margin-top: 10vh;

}



.container {

    margin-top: 5px;

    flex: 1 0 auto;

}