/* Colour pallet: grey and white*/

body{
    font-family: Arial, Helvetica, sans-serif;
    margin: 0%;
    padding: 0%;
    /* background-color: #5c5360; */
    height: 100%;
    width: 100%;

    /* background: #f18c54; Orange */
    background: linear-gradient(#f18c54, #d37949);
    background-repeat: no-repeat; /* KEEP THIS! Without this, the gradient repeats*/
    background-attachment: fixed;

    /* display: flex; */ /* puts EVERYTHING in center */
}

.heading{
    text-align: center;

    margin:auto;
    /* margin: 0px; */
    /* position: fixed;  */ /* IGNORES FORMATTING. ONLY USE FOR COVERING WHOLE SCREEN*/

    /* width: 100%; */ /* ORIGINAL  */
    padding: 0px; /* REMOVE PADDING, to allow section to cover whole screen horizontally */
    background-size: auto;
}

.TopNav{
    overflow: hidden;
    background-color: white;

    margin: auto;
    margin-bottom: 0%;  /* -1% */
    margin-left: 0;  /* -1% */
    width: 100%; /* 101% */

    align-items: center; /* centers elements*/
    /* display: flex; */
    display: inline-block; /* block */
    


    /* NEWW */
    /* position: absolute; */
}


.TopNav a{
    /* background-color: white; */
    /* display: block; */
    color: #453030;
    margin: auto;
    /* padding: 20px; */
    padding: 20px 10px 30px;

    text-align: center;
    text-decoration: none;
    font-size: 20px;
    /* padding-bottom: 10px; */
}

.navLinks a.hover {  /* .TopNav a.hover */
    background-color: #22df28;
    color: rgb(125, 114, 114);
}

.navLinks a.active { /* .TopNav a.active */
    background-color: #4CAF50;
    color: white;
  }

.navLinks {
    margin: auto auto; /* goes underneath logo*/
    /* inline-size: auto; */
    /* display: inline-block; */

    /* display: flex; */
    align-items: center;
    /* list-style: none; */
    /* gap: 5px; */
    padding-bottom: -10px;
}

/* HOMEPAGE: BODY STUFF */
#center { /* Intro */
    /* color: white;  */ /* ORIGINAL */
    color: #262626;

    /* GREY BOX */
    /* background-color: #6B6E70;
    border: 1px solid #6B6E70; */

    /* WHITE BOX */
    background-color: white;
    border: 1px solid white;

    border-radius: 5px;

    margin: auto;
    width: 50%;
    padding: 10px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;

    /* display: flex; */
    align-items: center;
    /* justify-content: center; */
    white-space: initial;

    /* STUFF  */
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.logoSmall{
    /* width: 5%; */
    /* padding-right: 100px; */

    /* position: fixed; */
    /* top: 0; */
    left: 0;
    /* padding: 10px; */
}

#learnMore{
    padding: 1%;
    color: #f2f2f2; /* text color */
    border: 2px solid #535353;
    background-color: #535353;
    border-radius: 1px;

    margin: 0 auto;
}

#videoBlock {
    text-align: center;
    background-color: #796e7e;
    border: #bdbab1;
    border-radius: 2px;
}


/* WHAT: BODY */

#body_What {
    position: relative;
    margin-top: 5%;
}

#body_What p{
        color: #262626;

        /* WHITE BOX */
        background-color: white;
        border: 1px solid white;

        border-radius: 3px;

        margin: auto;
        /* margin-top: 2%; */
        width: 50%;
        padding: 10px;
        text-align: center;
        font-family: Arial, Helvetica, sans-serif;
}

#body_What a{
    background-color: #535353;
    border-radius: 5px;

    margin: 0 auto;
    margin-top: 1%;
    margin-left: 45%;
    margin-right: 45%;
    /* width: 10%; */
    width: auto;
    padding: 10px;
    text-align: center;

    position: absolute;
}

/* FEATURES: BODY */
#body_Features { /* This handles the body of the whole page */
    position: relative;
    margin-top: 5%;
    margin: auto;
    width: 50%;
    display: block;
} /* Keep all text blocks centered and all that*/

.P1{
    color: #262626;

    /* WHITE BOX */
    background-color: white;
    border: 1px solid white;
    border-radius: 3px;

    padding: 10px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    margin: auto;
    margin-top: 3%;
    margin-bottom: 5%;

    /* width: 50%;
    display: block; */
}

/* ABOUT US: BODY */
#body_About{
    position: relative;
    margin-top: 5%;
    margin: auto;
    width: 60%;
    display: block; /* block */
}

#body_About p{
    text-align: center;
    /* width: 80%; */
}

#body_About h3{
    /* margin-top: %; */
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: larger;
}

.viewLinkedin{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}