momangen/_sass/mycv.scss

/*! sakrecoer sheet */


html,
body {
  width: 100%;
  height: 100%;
}
body {
  line-height: 1.5em;
  background-color: #fff;
  overflow-x: hidden;
  width: 100%;
  margin: 0;
  padding:0px;
  font-size: 1em;
  font-family: avant, "Helvetica Neue", Helvetica, Arial, sans-serif;
  color:#333;
}
h1,
h2,
h3,
h4,
b,
strong {
  font-family: avantB, "Helvetica Neue", Helvetica, Arial, sans-serif;

}

a h1:hover,
a h2:hover,
a h3,
a h4 {
  text-shadow: none;
}

h1{
  font-size: 2em;
  line-height: 1em;
  text-transform: uppercase;
}
h2{
  font-size: 2em;
  line-height: 1em;
  text-transform: uppercase;

}
p{
  line-height:1.5em;

}
a:link,
a:visited,
a:hover,
a:active,
a:focus {
  color: #333;
  text-decoration: none;
  -webkit-transition: text-shadow 0.2s linear;
  -moz-transition: text-shadow 0.2s linear;
  -ms-transition: text-shadow 0.2s linear;
  -o-transition: text-shadow 0.2s linear;
  transition: text-shadow 0.2s linear;
  text-shadow: none;
  padding: 0 10px;
  border-radius: 3px;
}
a:hover {
  text-shadow: .05em .05em rgb(31, 31, 31), -.05em -.05em rgb(224, 224, 224);

  
}
a:active {
  color: rgb(55, 171, 200);
}
/*
 * blend4web
 */

#banner {
  overflow: hidden;
  display: flex;
  width: 100%;
  height: 100vh;
  background: transparent;
  
  div {
    align-self: flex-end ;
    flex: 1 1 auto;
    margin-left:5px;
    margin-right: 5px;
    margin-bottom: 0;
    padding: 0;
  }
  h1 {
    position: relative;
    margin-bottom: 0;
    font-size: 3em;
    // text-shadow: .05em .05em rgba(31, 31, 31, 0.5), -.05em -.05em rgba(224, 224, 224, 0.5);
    -moz-animation: fontmovement 10s linear infinite; /* Safari 4.0 - 8.0 */
    -webkit-animation: fontmovement 10s linear infinite; /* Safari 4.0 - 8.0 */
    animation: fontmovement 10s linear infinite;

  }

}

 
 /*
  * Layout
  */
#header {
  overflow: hidden;
  display: flex;
  width: 100%;
  height: 30vh;
  background-size: 800% 800%;

  div {
    align-self: flex-end ;
    flex: 1 1 auto;
    margin-left:5px;
    margin-right: 5px;
    margin-bottom: 0;
    padding: 0;
  }
  h1 {
    position: relative;
    margin-bottom: 0;
    font-size: 3em;
    // text-shadow: .05em .05em rgba(31, 31, 31, 0.5), -.05em -.05em rgba(224, 224, 224, 0.5);
    -moz-animation: fontmovement 10s linear infinite; /* Safari 4.0 - 8.0 */
    -webkit-animation: fontmovement 10s linear infinite; /* Safari 4.0 - 8.0 */
    animation: fontmovement 10s linear infinite;
  }
  h1,
  a:link,
  a:visited,
  a:hover,
  a:active,
  a:focus {
    text-shadow: none;
  }

}

#navigation {
  position: relative;
  height: 10%;
  width: 100%;
}


#content {
  width: 100%;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  overflow-x: hidden;
  background-color: #fff;
  a:link,
  a:visited,
  a:hover,
  a:active,
  a:focus {
    text-decoration: none;
    background: linear-gradient(97deg, rgb(84, 241, 210), rgb(165, 202, 195));
    -webkit-transition: text-shadow 0.2s linear;
    -moz-transition: text-shadow 0.2s linear;
    -ms-transition: text-shadow 0.2s linear;
    -o-transition: text-shadow 0.2s linear;
    transition: text-shadow 0.2s linear;
    text-shadow: none;
    padding: 0 10px;
    border-radius: 3px;
  }
  a:hover {
    text-shadow: .05em .05em rgb(31, 31, 31), -.05em -.05em rgb(224, 224, 224);
    background: linear-gradient(97deg, rgb(224, 224, 224), rgb(31, 31, 31),);
    color: rgb(84, 241, 210);
  
  }
}
.column {
  flex: 1 1 300px;
  margin-left:5px;
  margin-right: 5px;

}
#footer {
  width:100%;
  height: 50px;
  font-size: .6em;
  padding: 0;
  line-height: 1em;
  display: flex;
  flex-wrap: wrap;
  /* background: linear-gradient(293deg, rgba(255, 0, 0, 0.25), rgba(0, 153, 255, 0.25)); */
}

.date {
  flex: 0 0 100%;
  margin-left: 5px;
}