.motto-header {
  position: relative;
  width: 100%;
 /* height: 150px; */
  max-height: 220px;
/*  background-image: url(../graphics/lotnisko1.png) center center no-repeat;  */
  /* https://www.istockphoto.com/pl/plany-i-ceny/subskrypcja-do-darmowego-okresu-probnego 
  10 bezpBatynych obrazów */
 background-size: cover;  
/*   background-size: 100% 100%;    */




 /*   background-image: url(../graphics/cpk1.png) center center no-repeat; */
    background-size: cover;
    height: 300px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
   /* margin-bottom: 32px;  */








}

/*
@media (max-width: 1100px) {
.motto-header {
  min-height: 21vw;
}
}
*/








.motto {
  position: absolute;
  bottom: .5em;
  display: block;
  margin: 0;
  width: 90%;
  color: #fff;
  text-align: center;
 /* text-shadow: 1px 1px 2px #000;  */
}

.cpk {
  background: url(../graphics/krolestwo_polskie3.png) center center no-repeat;
      background-size: cover;
    height: 300px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.porty {
  background: url(../graphics/port_gdansk2.png) center center no-repeat;
}

.atom {   
  background: url(../graphics/elektrownia_atomowa.png) center center no-repeat;
}

.motto h1 {
  position: relative;
bottom: 1rem;
  font-size: 2.5rem;
    color: #fff;
}

.motto p {
  font-size: 1.5rem
}

@media (max-width: 600px) {
  .motto h1 {
    font-size: 5vw;
  }
  .motto p {
    font-size: 3.5vw;
  }
}