header h1{
  color:#ffffff;
}

header {
  background-image: url(./images/vacnet/hero.jpg);
}

.images{
width: 100%;
margin-top:32px;
text-align:center;
}

.images img{
  width: 100%;
}

.appLogos{
  width: 100%;
  margin:auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:space-evenly;
  text-align: center;
}

.appLogos img{
  margin-bottom: 4px;
}

.appLogos-name{
margin-bottom:32px;
}

/*.appLogos-wrapped{
width:80%;
display: flex;
flex-direction: row;
justify-content:space-evenly;
}*/

.apps{
display: flex;
flex-direction:row;
  justify-content:center;
}

.app{
text-align: center;
  margin:auto;
margin: 10px;
}

.app img{
  margin-bottom: 4px;
}

.personas-section{
  margin-bottom: 0px;
}

.personas{
width: 100%;
margin-top: 24px;
}

.personas-individual{
width:100%;
display:flex;
justify-content:space-between;
margin-bottom:40px;
}

.persona{
margin: 0px 8px;
}

.persona img{
width:100%;
}

.persona-description{
margin-top:4px;
}

.persona-description-details{
margin-top:8px;
}

.persona-card img{
object-fit: cover;
width: 100%;
border:#ababab solid 1px;
border-radius:4px;
}

.concept{
background:rgb(73, 125, 204);
background:linear-gradient(90deg, rgba(73, 125, 204, 1) 60%, rgba(218, 79, 85)100%);
padding:68px 24px;
margin-top:32px;
text-align: center;
}

.concept h2{
color:#ffffff;
font-size:28px;
color:#ffffff;
}

.network{
display:flex;
flex-direction:row;
flex-wrap:wrap;
max-width: 440px;
margin: auto;
}

.network-graph{
display:flex;
flex-direction:column;
margin-top:40px;
}

.network-graph img{
 width:100%;
}

.network-graph-description{
display:flex;
flex-direction:row;
margin:8px auto;
}

.network-graph-description img{
width:40px;
  max-height:40px;
}

.network-graph-description h4{
margin:auto;
}

.userflows{
margin-bottom:88px;
}

.screens{
  margin: auto;
  width: 90%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:center;
  margin-bottom:88px;
}

.screens img{
  width: 100%;
  height:100%;
  margin-bottom: 48px;
}

.design{
margin-bottom:40px;
}

.nextImg img{
  margin-left: -100px;
}

@media (min-width: 490px) {
  .images img{
    max-height:100vh;
    width:auto;
  }
  
  .persona-card{
    max-width:700px;
    margin: auto;
    margin-bottom: 144px;
  }

  .concept{
    padding:104px 24px;
  }
    
  .concept h2{
    color:#ffffff;
    font-size:40px;
    color:#ffffff;
  }
  
  .network{
    justify-content:center;
  }
  
  .network-graph{
    width:300px;
  }

  .network-growth{
    width:100%;
    margin: auto;
  }
  
  .subpart-images img{ 
  max-width:100%;
  }
  
  .userflows {
    margin-bottom:96px;
  }
  
  .userflows img{
    max-width:100%;
  }

  .screens img{
    max-width: 378px;
    height:100%;
    margin-bottom: 48px;
  }

  .nextImg img{
    margin-left: -250px;
  }
}

@media (min-width: 768px) {
  .network{
    max-width:100%;
  }
  
  .network-graph{
    width:200px;
    margin:16px;
  }
  
  .part-side-images img{
    max-width: 378px;
  }
  
  .screens img{
    width:310px;
  }
}

@media (min-width: 1040px) {
  .network-graph{
    width:300px;
    margin:16px;
  }
  
  .screens{
    justify-content:space-between;
  }
  
  .screens img{
    width:300px;
  }
}

@media (min-width: 1440px) {
  .images{
  margin-top:0px;
  }

  .personas{
    margin-top: 0px;
    }

  .persona-card{
    max-width:1200px;
    text-align: center;
  }

  .persona-card img{
    width: 984px;
  }

  .concept{
    margin-top: 0px;
    padding:68px 40px;
  }

  .network{
    max-width: 545px;
    justify-content:space-around;
  }

  .network-graph{
    margin: 0px;
    max-width: 251px;
  }

  .network-growth{
    width:860px;
    margin-bottom: 88px;
  }
  
  .part-side-images img{
    width:auto;
    height:656px;

  }
  
  .screens{
    justify-content:space-evenly;
  }

  .nextImg img{
    margin-left: -350px;
  }
}
