nav {
  display: flex;
  justify-content: space-between;
}

#nav_personal {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

header {
  background-color: #333;
}

h1 {
    margin-top: auto;
  margin-bottom: auto;
  font-family: "Science Gothic", sans-serif;
  font-size: x-large;
  text-decoration: none;
}

#logo_personal {
  border: 5px solid orangered;
  border-radius: 25px;
  margin:10px;
}

@media (max-width:1000px) {
  .media{
    display:none;
  }
}

#person {
  font-family: "Science Gothic", sans-serif;
  font-size: xx-large;
  width: 400px;
  background-color: red;
  display: flex;
  align-items: left;
}

#title_name {
  font-size: x-large;
  color: white;
  margin-top:9%;
  margin-left:3%;
}

.icon {
  display: none;
}

#mylinks {
  display: none;
}

a {
  margin-top: auto;
  margin-bottom: auto;
  font-family: "Science Gothic", sans-serif;
  font-size: x-large;
  color:white;
  text-decoration: none;
}

p{
  font-size: larger;
  font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

#myLinks{
  display:none;
}

#name {
  color: white;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-size: large;
}

main {
  background-color:whitesmoke;
  display:flex;
  justify-content: space-around;
}

#me{
  background-color: #333;
}

#personal{
  display:flex;
  justify-content: left;
}

.capsule {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  background-color: whitesmoke;
}

.scroll-track {
  display: inline-flex;
  animation: scroll-left 20s linear infinite;
}

.imagerow {
  width: 100px;
  margin-right: 20px;
}

@keyframes scroll-left {
  0% {
    transform: translateX(-30%); /* Off the screen on the left */
  }
  100% {
    transform: translateX(0); /* Fully visible by the end */
  }
}

@keyframes moveAcross {
   0% {
    transform: translateX(0%); /* Start off-screen to the left */
  }
  100% {
    transform: translateX(100vw); /* End off-screen to the right (100vw is 100% of viewport width) */
  }
}

p{
  color:white;
  font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  padding:20px;
}

#foot {
  justify-content: space-around;
}

footer {
  background-color: #333;
  color: white;
  font-family: "Science Gothic", sans-serif;
  font-size:small;
}

.topnav{
  display: flex;
  justify-content: space-between;
}

.widescreen:hover{
  color:black;
  background-color:white;
}

p{
  background-color:red;
}

@media (max-width:1100px) {

  #title_name{
    display:none;
  }

  #person{
    width:110px;
  }

  .small{
    display:none;
  }

  footer{
    font-size:x-small;
  }

  .widescreen{
    font-size:large;
  }
}

@media (max-width:700px) {
    .widescreen{
    font-size:medium;
  }
}

@media (max-width: 1100px) {
    #media{
    display:none !important;
  }

  p{
    background-color:red;
  }

  main{
    display:flex;
    justify-content: space-around;
  }
}


