/*GLOBALS*/
@import url('https://fonts.googleapis.com/css?family=Kanit:300,600&display=swap');

:root {
  --color-dark: #222;
  --color-light: white;
  --color-grey: rgba(34,34,34,.5);
  --color-primary: #36ddbb;
  --color-secondary: #ee3080;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html{
  width: 100%;
  height: 100%;
}


body {
  padding: 0;
  font-family: Kanit, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-weight: 300;
  font-size: 0.85rem;
  letter-spacing: 1.3px;
  overflow:hidden;
}
/*TYPO*/

a,
a:link{
  text-decoration: none;
  color: var(--color-primary);
}

a:hover,
a:focus{
  color: var(--color-grey);
}


/*CLASSES*/
.text-right{
    text-align: right;
}

/*GRID*/
.row {
  float: left;
  width: 100%;;
  min-width: 320px;
  margin-bottom: .5rem;
  clear: both;
}

.col {
  float: left;
}

.c10 {
  width: 10%;
  min-width: 32px;
}

.c20 {
  width: 20%;
  min-width: 64px;
}

.c30 {
  width: 30%;
  min-width: 96px;
}

.c40 {
  width: 40%;
  min-width: 128px;
}

.c50 {
  width: 50%;
  min-width: 160px;
}

.c60 {
  width: 60%;
  min-width: 192px;
}

.c70 {
  width: 70%;
  min-width: 224px;
}

.c80 {
  width: 80%;
  min-width: 256px;
}

.c90 {
  width: 90%;
  min-width: 288px;
}

.c100 {
  width: 100%;
  min-width: 320px;
}

/*HEADER*/
header nav ul {
    list-style: none;
    margin: 0;
}

header .fixed-p{
  background: url(../img/subicon.dark.svg) no-repeat;
  background-size: contain;
  height: 50px;
}

/*MAIN*/
main {}

/*FOOTER*/
footer {}