body { 
    font-family: "Open sans";
    background-color: rgb(40, 39, 39);
    color: rgb(247, 247, 247);
}

#aboutme, #languageskills, #portfolio, #contactme, #jobexperience {
    padding-top: 0px;
}

#tplogo, #aglogo {
    height: 30px;
    width: 30px;
}

#logos {
    color: white;
}

#backgroundfoto {
    position: absolute;
    width: 100vh;
    height: auto;
}


.info {
    background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(165, 20, 163));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding-left: 20px;
    padding-right: 20px;
}

.card-img-top {
    height: 380px;
    width: 400px;
}

.botinfo {
    position: absolute;
    bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
}

.job {
    font-size: 30px;
}

.jobinfo {
    font-size: 25px;
}


@media (max-width: 1200px) {
    .card-img-top{height: 100px;
                  width: 110px;
                  display: block;
                  margin-left: auto;
              margin-right: auto;}
    .job {font-size: 23px;}
    .jobinfo {font-size: 19px;}

 } 


@media (max-width: 700px) {  
    .card-img-top {height: 70px;
                   width: 80px;
                   display: block;
                   margin-left: auto;
               margin-right: auto;}
    .job {font-size: 22px;}
    .jobinfo {font-size: 20px;} 

  } 

 @media (max-width: 500px) {  
    .card-img-top {height: 70px;
                   width: 80px;
                    display: block;
                margin-left: auto;
            margin-right: auto;}
    .job{font-size: 21px;}
    .jobinfo {font-size: 18px;}
    #aboutme, #languageskills, #portfolio, #contactme, #jobexperience {
    padding-top: 10px;
    }
}

@media (max-width: 400px) {
    .job{font-size: 19px;}
    .jobinfo {font-size: 16px}
}

@media (max-width: 310px) {
    .job{font-size: 15px;}
    .jobinfo {font-size: 13px}
}


.link-spanner{
    position:absolute; 
    width:100%;
    height:100%;
    top:0;
    left: 0;
    z-index: 1;
}

.card:hover {
    background-color: rgb(48, 47, 47);
}


.pythongradient {
    background: -webkit-linear-gradient(rgb(75, 139, 190), rgb(255, 212, 59));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.htmlcssgradient {
    background: -webkit-linear-gradient(rgb(89, 118, 236) , rgb(227, 76, 38));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}



.nav-link {
    font-size: 20px;
    color: rgb(247, 247, 247);
}
a {
    color: white;
}

.bg-purple {
    background-color: rgb(220, 173, 215);
}

.bg-darkpurple {
    background-color: rgb(202, 46, 207);
}

.btn-purple{
    background-color: rgb(165, 24, 165);
    color: white;
}

a:link {
    text-decoration: none;
}

a:hover {
   color: white;
}

.card {
    background-color: rgb(40, 39, 39);
    color: white;
}