* {
  box-sizing: border-box;
  -webkit-appearance: none;
}

::selection {
}

::-moz-selection {
}

html {
  min-height: 100vH;
}

body {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #000;
  min-width: 390px;
  font-family: 'Open Sans', arial, helvetic, sans-serif;
  background: #F8F8F8;
}

a {
  color: #00996b
}

a.more {
  display: inline-block;
  line-height: 36px;
  background: #F8F8F8;
  color: #000;
  padding: 0 10px;
  text-decoration: none;
  margin-top: 20px;
  font-weight: 700;
  border-radius: 5px;
  box-shadow: 0 5px 15px rgba(0,0,0,.1);
}

h1, h2, h3, h4, h5, h6 {
  color: #00996b;
}

.section_left,
.section_right {
  overflow: visible;
}

.section_left {
  display: flex;
  flex-direction: column;
  width: 50%;
  float: left;
  min-height: 100vH;
  justify-content: center;
  align-items: center;
}

.section_right {
  display: flex;
  width: 50%;
  float: right;
  min-height: 100vH;
}

.section_right .mod_slider {
  position: absolute;
  top: 12.5%;
  bottom: 12.5%;
  right: 1em;
  left: 50%;
  overflow:hidden;
}

.mod_slider {
  position: relative;
  overflow: visible;
}

.mod_slider .slide {
  position: relative;
  display: none;
}

.mod_slider .slide .text_container {
  position: absolute;
  top: 10%;
  left: 40px;
  z-index: 100;
  color: #FFF;
}

.mod_slider .marked {
  position: absolute;
  top: -40px;
  left: -10px;
  transform: rotate(-1deg);
  display: inline-block;
  background: yellow;
  color: #000;
  padding: 0 10px;
  line-height: 32px;
  border-radius: 5px;
  font-weight: 700;
  margin-bottom: 0;
}

.mod_slider .marked.new {
  background: red;
  color: #FFF;
}

.mod_slider h2 {
  display: inline-block;
  margin: 0;
  background: #00996b;
  color: #FFF;
  line-height: 70px;
  padding: 0 10px;
  font-size: 36px;
}

.mod_slider .desc {
  display: inline-block;
  background: rgba(0,0,0,.3);
  padding: 0 6px;
  line-height: 28px;
}

.mod_slider .navigation .prev a,
.mod_slider .navigation .next a {
  position: absolute;
  top: 50%;
  margin-top: -25px;
  background: #00996b url('icon-arrow-right.svg') no-repeat scroll center;
  background-size: 25px 25px;
  color: #FFF;
  width: 50px;
  height: 50px;
  line-height: 50px;
  box-shadow: 0 5px 10px rgba(0,0,0,.5);
}

.mod_slider .navigation .prev a {
  left: 20px;
  background: #00996b url('icon-arrow-left.svg') no-repeat scroll center;
  background-size: 25px 25px;
}

.mod_slider .navigation .next a {
  position: absolute;
  right: 20px;
}

.mod_navigation_top {
  display: block;
  width: 100%;
  text-align: right;
  padding-right: 1em;
}

.mod_navigation_top .btn {
  padding: 6px 10px;
  border-radius: 0;
  line-height: 40px;
  text-decoration: none;
  margin-left: 1em;
}

.mod_navigation_legal {
  position: absolute;
  bottom: 1em;
  left: 1em;
  font-size: 14px;
  font-weight: 700;
}

.mod_navigation_legal a {
  margin-right: 1em;
}

.mod_copyright {
  position: absolute;
  bottom: 1em;
  right: 1em;
  font-size: 13px;
}

.mod_copyright strong,
.mod_copyright sup {
  color: #00996b;
  font-weight: 900;
}

.mod_copyright a {
  color: #000;
  text-decoration: none;
  font-weight: 500;
}

.mod_login {
  width: 500px;
  height: 380px;
  background: #FFF;
  box-shadow: 0 5px 35px rgba(0, 153, 107, .2);
  border: 1px solid rgba(0, 0, 0, .125);
  border-radius: 16px;
  padding: 2em 3em 3em 3em;
}

.mod_login a {
  float: right;
  font-size: 13px;
  margin-bottom: 1em;
}

.branding {
  position: absolute;
  top: 1em;
  left: 1em;
}

figure {
  margin: 0;
}

.branding .image_container {
  max-width: 250px;
}

.mod_login label {
  font-size: 13px;
  font-weight: 700;
  color: #666;
}

.mod_login input[type="text"],
.mod_login input[type="password"] {
  width: 100%;
  line-height: 38px;
  padding: 0 6px;
  border: 1px solid rgba(0,0,0,.3);
  border-radius: 6px;
  background: #FFF;
  box-shadow: none;
  margin-bottom: 6px;
}

.btn,
input[type="submit"] {
  margin: 10px 0;
  line-height: 40px;
  border-radius: 5px;
  background: #00996b;
  color: #FFF;
  border: 0;
  box-shadow: 0;
  width: 100%;
  font-size: 16px;
  font-weight: 700;
}

input[type="submit"]:hover,
input[type="submit"]:active {
  cursor: pointer;
}
