* {
	margin: 0;
	padding: 0;
	z-index: 0;
}

body {
  font-family: "Lato", sans-serif;
  font-size: 16px;
  display: flex;
  flex-direction: column;
  height: 100vh;
  background: #333333;
  color: white;
  min-width: 475px;
}

main {
  text-align: justify;
  flex-grow: 1;
}

.container {
  max-width: 1000px;
  width: calc(100% - 6em);
  margin: auto;
  padding-top: 2em;
  padding-bottom: 2em;
}

a {
  color: #6a6;
}

a:visited {
  background: white;
}

main {
  pre, section, p {
    margin: 1em 0;
  }

  td.code pre, pre.lineno {
    margin: 0;
  }

  pre {
    overflow-x: auto;
  }
  
  pre, code {
    font-family: "Source Code Pro", monospace;
  }

  pre code {
    overflow-wrap: normal;
    white-space: pre;
  }
}

.rouge-table {
  .gutter.gl {
    border-right: 1px solid #555;
    text-align: left;
    padding-right: .5em;
  }

  .code {
    padding-left: 1em;
  }
}

ul, dl, ol {
  margin-left: 2em;
}

/* ------- HOMEPAGE --------*/

video{
  width:70%;
  margin:auto;
  display:block;
}

.cont3step{
  width: calc(70% + 50px);
  margin: 50px auto;
}

.cont3step span{
  width: calc(33% - 50px);
  background-color: white;
  height: 300px;
  margin: 0 25px;
}

/* ------- PAGE LAYOUT --------*/

.box-arrows {

  position: fixed;
  bottom: 275px;

  a{
    text-decoration:none;
    cursor:pointer;
    color:#fff;
  }

  span{
    height: 50px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
  }

  i{
    font-size: 6vh;
  }

  #back img{
    content:url("assets/style/l-arrow-black.png");
  }

  #next img{
    content:url("assets/style/r-arrow-black.png");
  }

  #back:hover{
    color:#6a6;
  }

  #next:hover{
    color:#6a6;
  }

  img{
    vertical-align:middle;
  }
}