/* Headings */

body{background-color:#050608}

h1, h2, h3, h4, h5, h6, p{font-family: 'Source Sans Pro', sans-serif;color:#ffffff;text-align:center;line-height:150%}

h1 {font-size: 26px;padding-top:0px;max-width:800px;margin:0 auto}
h2 {color:#000;font-size: 24px;padding-top:0px;max-width:800px;margin:0 auto;vertical-align:middle}
h4{font-size:20px;color:#1371b8;font-weight:400}

.white-bar{background-color: #1371b8;margin:0 20px;height:35px}
.white-bar2{background-color: #868484;margin:0 20px;height:35px}

.blue{background-image: url(../img/blue.png);width:100%;height:170px}

p{font-size: 22px;line-height:36px;color:#fff;margin:0}
.small{font-size:12px;text-align:left;line-height:15px;width:300px;float:left}
.links{font-size:10px;text-align:left;line-height:33px;margin-top:0px;margin-left:15px;width:300px;float:left}
.icon{padding-right:10px}

a{color:#82c3eb;font-family: 'Source Sans Pro', sans-serif;}

.logo{max-width:80%;padding-top:60px}

hr{border-color:#1371b8}
 
.container{display: grid;place-items: center; height: 70vh;}

.footer{padding:15px}

.flex-container{
  padding: 10px;
  margin: 0;
  list-style: none;  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;  
  -webkit-flex-flow: row wrap;
  justify-content: space-around;   
}

.flex-item {
  background: #050608;
  padding: 5px;
  width: 220px;
  height: 200px;
  margin-top: 0px;  
  color: white;
  font-size: 1.3em;
  text-align: center;
}

.flex-item2 {
  background: transparent;
  padding: 5px;
  width: 220px;
  height: 170px;
  margin-top: 10px;  
  color: white;
  font-size: 1.3em;
  text-align: center;
}


@media only screen and (max-width:520px){
    h1 {font-size: 22px}
    h2 {font-size:20px}
    p{font-size:18px}
}