
body{
  padding-top: 54px;
  overflow-x: hidden;
  background-color:#eaeaea;
  font-family: 'Montserrat';
  background-image: url('../images/bg.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;

}
@media (min-width: 992px) {
  body {
    padding-top: 56px;
  }
}
a {
    color:#f6f6f6;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition:.5s;
  }
  a:hover {
    color:#f6f6f6;
    text-decoration: none;
  }

  a.footer-link {
      color:#68b3cf;
      -o-transition:.5s;
      -ms-transition:.5s;
      -moz-transition:.5s;
      -webkit-transition:.5s;
      transition:.5s;
    }
  a.footer-link:hover {
      color:#267d9e;
      text-decoration: none;
  }
  h1.main-header{
    font-family: 'Times New Roman' ;
    font-size: 50pt;
    color:#ffffff;
    text-shadow: 2px 2px #68b3cf;
  }
  h2.sub-header{
    font-family: 'Playfair Display' ;
    text-align: center;
  }
/*************************/
nav.navbar{

}
.btn, .btn-primary{
  background-color:#fb6c6c;
  border: none;
  padding: 20px;
}
footer{
  padding-top: 100px;
}
/*************************/
ul.list-1, li.list-item-1{
  list-style: none;
  display: inline-block;
  padding-right: 10px;
}
li.nav-list{
  padding-right: 15px;
}
/*************************/
.bigger {
  padding: 50px;
  transition: transform .2s;
  margin: 0 auto;
}
.bigger:hover {
  transform: scale(1.2);
}

/***************************/

.main{
  padding-top: 100px;
}
.module-main{
  border-radius: 20px;
  padding: 20px;
  margin-top:200px;
}
.module-1, .module-2, .module-3, .module-4{
  border-radius: 20px;
  height: 50%;
  padding: 20px;
}
.module-1{
  background-color:#fb6c6c;
}
.module-2{
  background-color:#6cbafb;
}
.module-3{
  background-color:#fbce6c;
}
.module-4{
  background-color:#ba6cfb;
}

/***************************/
.row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}

.column {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}


@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }
}


@media screen and (max-width: 600px) {
  .column {
    flex: 100%;
    max-width: 100%;
  }
}

/***************************/

@media screen and (max-width: 800px) {
  .module-main{
    margin-top:0px;
  }
}
/***************************/
