@font-face {
    font-family: Lato-Regular;
    src: url(assets/Lato/Lato-Regular.ttf);
}

@font-face {
    font-family: Lato-Bold;
    src: url(assets/Lato/Lato-Bold.ttf);
}

a {
   font-family: Lato-Regular;
    font-size: 16px; 
    text-decoration: none;
}
h1 {
    font-family: Lato-Bold;
    font-size: 66px;
    margin: 0;
    line-height: 1.3;
}
h2 {
    font-family: Lato-Regular;
    font-size: 20px;
    margin: 0;
/*    text-align: center;*/
    font-style: normal;
    font-weight: 100;
}

h3{
     font-family: Lato-Bold;
    font-size: 22px;
/*    text-align: center;*/
}

body {
     /*background-color: aqua;*/
/*
  margin: 0;
    width: 900px;
    background-color: aqua;
*/
}

#mainBodyContainer {
    width: 100%;
/*    background-color: blue;*/
    position: relative;
    padding-bottom: 100px;
    /*background-image: url("");*/
}


/*--------------------------------------------------------------------------*/

#openingLogoDiv {
    width: auto;
    height: 106px;
    background-color: #383838;
    /*margin-bottom: 100px;*/
  }
#actualLogoDiv{ 
    display: flex;
    justify-content: center;
    /*background-color: blue;*/
    float: left;
    height: 93px;
    width: 282px;
    /*position: absolute;*/
    /*overflow: hidden;*/
    margin-top: 10px;
    /*padding-bottom: 10px;*/
    /*margin-bottom: 10px;*/
}
#logoImage {
    /*width: 400px;*/
    /*height: 200px;*/
    /*height: -79px;*/
    /*float: left;*/
    /*position: absolute;*/
}
#logoText {
    font-family: Nimbus;
    /*font-family: poppinsBold;*/
    position: absolute;
    color: white;
    top: 40px;
  left: 114px;
    /*margin-left: 38px;*/
    font-size: 27px;
}
#navDiv {
   
    position: relative;
    /*height: 600px;*/
    width: 100px;
    /*background-color: aqua;*/
    /*white-space: nowrap;*/
    /*text-align: right;*/
   float: right;
    

    
    
    
    }
.navLinks {

    /*background-color: blueviolet;*/
    text-decoration: none;
    color: white;
    display: inline-block;
    vertical-align: top;
    width: auto;
    white-space: nowrap;
    padding-top: 71px;
    margin-left: 20px;
   
}

/*
#navDiv a:hover {
  background-color: #ddd;
  color: black;
}
*/


/*
#mobileMenuDiv {
    display: flex;
    visibility: hidden;
    position: absolute;
    right: 0px;
    width: 150px;
    height: 30px;
     background-color: #383838;
    top: 106px;
    white-space: nowrap; 
        display: grid;

    grid-gap: 8px;

    grid-template-columns: 50px;
    grid-template-rows: repeat(3, 4fr);
    margin-top: -5px;
}
*/


/*

.mobileNavLinks {
    position: absolute;
    margin-top: 0px;
    color: white;
    margin-left: 10px;
    margin-top: 10px;
}
*/

#mobileBackButton {
    position: absolute;
    top: 70px;
    color: white;
    visibility: hidden;
    height: 30px;
   margin-left: 20px;
}


@media only screen    and (min-device-width: 375px)    and (max-device-width: 812px)    and (-webkit-min-device-pixel-ratio: 2)   and (orientation: portrait) {
    #mainContainer {
    /*background-color: aqua;*/
    }
    #openingLogoDiv {
        height: 103px;
         /*
         background-image: url("../assets/images/whitehamburger.png");
       background-size: 30px;
        background-repeat: no-repeat;
        background-position-x: 330px;
        background-position-y: 65px;
        */
    }
    #actualLogoDiv{
        width: 80%;
        /*background-color: aqua;*/
    }
    #navDiv{
        display: none;
        
        
    }
    /*
    #mobileMenuDiv {
        visibility: hidden;
       
}   */
        
    
    #mobileBackButton {
    visibility: visible;
}
    

#logoText {
    
    left: 80px;
    font-size: 20px;
    /*margin-left: 0px;*/
}
}
    
#logoImage{
    width: 370px;
    height: auto;
    object-fit: contain; 
    /*display: inline-block;*/
    /*align-self: flex-end;*/
    float: left;
    margin-top: 14px;
    margin-bottom: 14px;
    margin-left: 33px;
    
}
@media only screen    and (min-device-width: 375px)    and (max-device-width: 812px)    and (-webkit-min-device-pixel-ratio: 2)   and (orientation: portrait) {
    #logoImage {
        width: 270px;
        width: 91%;
        margin-left: 5px;
    }
}


#mainTitleDiv{
    height: 30px;
    width: 100%;
    background-color: white;
    text-align: center;
}
#mainTitleText{
    color: black;
}
#bodyDiv{
    height: 1020px;
    width: 90%;
/*    background-color: green;*/
    text-align: left; 
    margin-left: 5%;
/*    margin-right: 50px;*/
}

.bodyText {
/*    text-align: left:*/
}

#lastAnswer {
    /*background-color: aqua;*/
    padding-bottom: 100px;
}