mywebsite/client/assets/scss/main.scss

@import './utils.scss';

body{
  position: relative;
  -webkit-font-smoothing: subpixel-antialiased;
}

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

a{
  background-color: transparent;
  color: #3598db;
  text-decoration: none;
 
 &:hover{
   color: #3598db;
 }
}

.Layout {
  height: 100%;
  display:        flex;
  flex-direction: column;

  .Header, .Main, .Footer {
    display:    flex;
    box-sizing: padding-box;
    padding:    1em calc(50% - 997px / 2);
    &:before, &:after { content: " "; width: 1em; }
  }
}

.Main{
  padding-top: 1em;
  flex: 1;
}

.Header{
  width: 100%;
  background: url("../images/header.jpg");
  background-size: cover;
  height: 30em;
  border-bottom: solid;
  border-width: 1px;
  border-color: #DADADA;
  
  h1{
    text-align: center;
  }
}

.Footer{
  height: 5em;
  line-height: 5em;
  background-color: #F1F1F1;
  border-top: solid;
  border-width: 1px;
  border-color: #DADADA;
}

.Previews{
  flex: 1;
  -webkit-flex: 1;
}