/* OCLIN CSS */
/* V2 2020 */


* {
	margin: 0px;
	padding: 0px;
}

body {
	font-family: 'Baloo 2', 'Arial';
	background-color: #F1F5F8;
	color: #1F1F1F;
}

.text-clean {
  padding-top: 0px;
  padding-bottom: 0px;
  margin: 0px;
}

.text-blue {
  color: #1D60FB;
}

.text-green {
  color: #77EAA9;
}

a.link-dark, a:hover.link-dark, a:focus.link-dark {
	color: #1F1F1F;
}

a.link-light, a:hover.link-light, a:focus.link-light {
	color: #F1F5F8;
}

.line-blue {
  border-bottom: 3px solid #1D60FB;
  height: 3px;
	width: 100%;
}

.line-green {
  border-bottom: 3px solid #77EAA9;
  height: 3px;
	width: 100%;
}

.line-dark {
  border-bottom: 3px solid #1F1F1F;
  height: 3px;
	width: 100%;
}

.line-light {
  border-bottom: 3px solid #F1F5F8;
  height: 3px;
  width: 100%;
}

.border-blue {
	border: 3px solid #1D60FB;
}

.border-green {
	border: 3px solid #77EAA9;
}

.border-dark {
	border: 3px solid #1F1F1F;
}

mux-video {
  width: 100%;
  height: 100%;
}

.videografikk {
  z-index: 10;
  position: absolute;
  top: 47px;
  left: 0px;
  text-align: center;
  background: linear-gradient(-45deg, #77EAA9, #1D60FB, #77EAA9, #1D60FB);
  background-size: 400% 400%;
  opacity: 0.5;
  animation: gradient 30s ease infinite;
  color: #F1F5F8;
}

.videografikk-content {
  z-index: 11;
  position: absolute;
  top: 0px;
  left: 0px;
  text-align: center;
  opacity: 1;
}

/* Luft */
.space-5 {width: 100%; height: 5px;}
.space-10 {width: 100%; height: 10px;}
.space-15 {width: 100%; height: 15px;}
.space-25 {width: 100%; height: 25px;}
.space-50 {width: 100%; height: 50px;}
.space-100 {width: 100%; height: 100px;}
.space-200 {width: 100%; height: 200px;}


/* Equal rows */
.row.is-flex {
  display: flex;
  flex-wrap: wrap;
}
.row.is-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

/*
* And with max cross-browser enabled.
* Nobody should ever write this by hand. 
* Use a preprocesser with autoprefixing.
*/
.row.is-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.row.is-flex > [class*='col-'] {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* BG */
.dark-bg {
	background-color: #1F1F1F;
	color: #F1F5F8;
}

.light-bg {
	background-color: #F1F5F8;
	color: #1F1F1F;
}

.green-bg {
	background-color: #77EAA9;
	color: #1F1F1F;
}

.blue-bg {
	background-color: #1D60FB;
	color: #F1F5F8;
}

.bg-gradient {
	background: linear-gradient(-45deg, #77EAA9, #1D60FB, #77EAA9, #1D60FB);
    background-size: 400% 400%;
    animation: gradient 30s ease infinite;
    height: 100%;
    color: #F1F5F8;
}

.gradient-bg {
  background: linear-gradient(-45deg, #77EAA9, #1D60FB, #77EAA9, #1D60FB);
    background-size: 400% 400%;
    animation: gradient 30s ease infinite;
    height: 100%;
    color: #F1F5F8;
}

.video-top {
  z-index: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.gradient-top {
  z-index: 3;
  position: absolute;
  top: 0;
  left: 0;
  background-color: blue;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.minus-margin-10 {
	margin-top: -10px;
}

/* Typografi */

.typo-blue {color: #1D60FB; }
.typo-green {color: #77EAA9;}
.typo-red {color: #DC143C;}

.typo-bold {font-weight: 600;}
.typo-light {font-weight: 300;}

.typo-shadow { text-shadow: 0px 0px 0px #1F1F1F; }

.typo-space {padding: 25px;}

.versaler { text-transform: uppercase; }

.ikon-stor { font-size: 150px; }
.ikon { font-size: 40px; }

a {
	color: #1D60FB;
	text-decoration: none;
}

a:hover {
	color: #1D60FB;
	text-decoration: none;
	font-weight: 300;
}

.icon-green { color: #77EAA9; }
.icon-blue { color: #1D60FB; }

/* Forsidevideo full bredde */

#bg-video {
	width: 100%;
}

.media-border {
	border: 2px solid #F1F5F8;
}

.video-content {
  width: 100%;
}

.tavle {
  font-family: 'Source Code Pro', monospace;
}