@import './fonts.css';

:root{
  --black: #383e42;
  --white: #ffffff;
  --fallback: #031735;
  --font-size-h1: 5.2em;
  --font-size-h1-smaller: 4.9em;
  --font-size-h2: 3.5em;
  --font-size-h3: 2.0em;
  --font-size-h4: 1.6em;
  --font-size-h5: 1.3em;
  --font-size-h6: 1.0em;
}
*{
  box-sizing: border-box;
}
@media(max-width: 50em){ /* MOBILE */
  :root{
    --font-size-h1: 3.0em;
    --font-size-h1-smaller: 2.8em;
    --font-size-h2: 2.5em;
    --font-size-h3: 1.6em;
    --font-size-h4: 1.2em;
    --font-size-h5: 1.0em;
    --font-size-h6: 0.9em;
  }
  .row{
    display: flex;
    flex-flow: column;
  }
}
{
    box-sizing: border-box;
  }
  html, body{
    margin: 0;
    padding: 0;
    color: var(--black);
    background-color: var(--fallback);
  }
  html {
    position: relative;
    min-height: 100%;
}
  body{
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Ubuntu, roboto, noto, arial, sans-serif;
    line-height: 1.5;
    font-size:16px;
   /* background-image:url('../img/bg3.jpg');*/
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center;
    color:var(--white);
    background-attachment: fixed;
  }
  p {
    font-size: 1em;
}
.about p{
    font-size: 2em;   
}
  div#logo{
    margin:0 auto;
    margin-top:3em;
    width:120px;
    margin-bottom:3em;
  }
  div#logo img{
    width:120px;
	    
  }
 .logolink{
    text-decoration:none;
    border-bottom:none;
            
  }
  a {
text-decoration: none; /* no underline */   
 border-bottom: 1px solid var(--white);
    color:var(--white);
  word-break: break-all;
}
  .container {
width: 100%;
  padding: 0 25px;
  max-width: 50rem;
  margin: 0 auto;
  }
  body {

  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;

}
img.itsme{
border-radius: 50%;
width: 8rem;
height: 8rem;
object-fit: cover;
object-position: top;
margin-top:18px;
display: block;
margin: 0 auto;
}
 .col{
    display: table-cell;
    vertical-align: top;
    flex: 1;
  }