/* Master styles */ 
body{
    margin: 0px;
}

.maintext{
    font-size: 5%;
}


/* Text styles */
.maintext_home{
    background-image: url(images/national-cancer-institute-W2OVh2w2Kpo-unsplash.jpg);
    background-repeat: repeat;
    background-size: 100%;
    font-family: Arial, Helvetica, sans-serif;
}

.maintext_contact{
    background-image: url(images/national-cancer-institute-TX9pU27p6D0-unsplash.jpg);
    background-repeat: repeat;
    background-size: 100%;
    font-family: Arial, Helvetica, sans-serif;
}

.titels{
    font-style: italic;
    text-align: left;
    font-size: 4ex;
}

.introduction{
    font-size: x-large;
    background-color: rgb(255, 126, 126);
    text-align: justify;
    color: black;
    width: 75%;
    padding: 5%;
}

.technology{
    font-size: x-large;
    background-color:rgb(81, 169, 121); 
    text-align: justify;
    color: black;
    width: 75%;
    margin-left: 15%;
    padding: 5%;
}

.treatments{
    font-size: x-large;
    background-color:rgb(248, 193, 131);
    text-align: justify;
    color: black;
    width: 75%;
    padding: 5%;
}

.knowledge{
    font-size: x-large;
    background-color:rgb(106, 163, 223); 
    text-align: justify;
    color: black;
    width: 75%;
    margin-left: 15%;
    padding: 5%;
}

.future{
    font-size: x-large;
    background-color:rgb(168, 92, 171); 
    text-align: justify;
    color: black;
    width: 75%;
    padding: 5%;
}


/*.introduction{
    font-size: x-large;
    background-color: red;
    text-align: left;
    color: white;
    width: 75%;
    padding: 5%;
}

.technology{
    font-size: x-large;
    background-color: rgb(1, 175, 80);
    text-align: left;
    color: white;
    width: 75%;
    margin-left: 15%;
    padding: 5%;
}

.treatments{
    font-size: x-large;
    background-color: rgb(248, 151, 40);
    text-align: left;
    color: white;
    width: 75%;
    padding: 5%;
}

.knowledge{
    font-size: x-large;
    background-color: rgb(0, 109, 229);
    text-align: left;
    color: white;
    width: 75%;
    margin-left: 15%;
    padding: 5%;
}

.future{
    font-size: x-large;
    background-color: rgb(166, 26, 171);
    text-align: left;
    color: white;
    width: 75%;
    padding: 5%;
}*/

.contact{
    font-size: x-large;
    background-color: rgb(255, 255, 255);
    text-align: left;
    color: rgb(0, 0, 0);
    width: 75%;
    padding: 5%;
}

/* Header and Nav styles */

.nav-bar{
    display: flex;
    justify-content: space-between;
    padding: 38px;
    font-family: Arial, Helvetica, sans-serif;
}

.nav-right-side{
    display: flex;
}

.nav-bar > .nav-right-side > div {
    margin-right: 20px;
    font-size: 1.5em;
    text-transform: uppercase;
}

.nav-left-side{
    margin-left: 10px;
    font-size: 5vw;
}

.img.logo-wrapper{
    margin-right: 100px;
}

.nav-link-wrapper{
    height: 30px;
    border-bottom: 1px solid transparent;
    transition: border-bottom 0.5s;
}

.nav-link-wrapper a {
    color: #8a8a8a;
    text-decoration: none;
    transition: color 0.5s;
}

.nav-link-wrapper:hover{
    border-bottom: 1px solid black;
}

.nav-link-wrapper a:hover{
    color: black;
}

.nav-center{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
}

/* Portfolio styles */

.portfolio_img_background{
    height: 100px;
}

.bottomtext{
    font-size: 5mm;
    color:white;
}