/*Christus vincit, regnat, imperat; ab omni malo plebem suam defendat. */


/* unvisited link */
a:link {
  color: blue;
  text-decoration: none;
  font-size: 20px;
}

/* visited link */
a:visited {
  color: blue;
}

/* mouse over link */
a:hover {
  color: green;
}

/* selected link */
a:active {
  color: green;
}

.no-bullets {
    list-style-type:none;
}

h1{
    text-align: center;
}

.indent{
    position: relative;
    width: 90%;
    padding: 0 5%;
}



#login_form{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 5%;
    background: #fff;
}

#container{
    position: relative;
    width: 100%;
    height: 100vh;
    font-size: 17px;
}


.heading-name{
    position: relative;
    width: 100%;
}






/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
    font-size: 125%;
  }
  
 

}

@media screen and (min-width: 1000px){
#container{
    width: 1000px;
    margin: 0 auto;
    height: 100vh;
    }
}

.flex-container {
  display: flex;
  flex-direction: row;
  background: #fff;
}


.flex-item-left {
   flex: 46%;
   padding: 10px 2% 10px 3%;
}

.flex-item-right {
   padding: 10px 3% 10px 2%;
  flex: 46%;
}


@media screen and (max-width: 600px) {
   .flex-container{
    flex-direction: column;   
   }
   
   .flex-item-left{
       width: 95%;
       left: 2.5%;
   }
   
   .flex-item-right {
        width: 95%;
        left: 2.5%;
   }
    
}

.singlediv{
    position: relative;
    width: 90%;
    background: #fff;
    padding: 20px 5%;
}


.title{
    position: absolute;
    left: 5%;
    top: 20px;
    color: #fff;
    font-size: 24px;
}



#headerimage{
    position: relative;
    width: 100%;
    margin-top: 20px;
}

.headerimage{
    max-width: 100%;
}