/* CSS Document */

body,
html {
  font: 100% 'Roboto', sans-serif;
  margin: 0;
  background: url(../images/back.png);
  margin-top: 10px;
}

.main .container,
.navbar {
  margin: 0;
  padding: 0;
}

.content {
  padding: 20px 20px 20px 20px;
  color: #434343;
  background: #fff;
  border-top-style: dashed;
  border-top-width: 2px;
  border-top-color: #e87ea2;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
  border-right-style: solid;
  border-right-color: #e0e0e0;
  border-right-width: 1px;
  margin: 0;
  width: 100%;
  min-height: 300px;
}

.content2 {
  padding: 30px 5px 30px 20px;
  color: #434343;
  background: #f4f4f4;
  border-top-style: dashed;
  border-top-width: 2px;
  border-top-color: #e0e0e0;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
  border-right-style: solid;
  border-right-color: #e0e0e0;
  border-right-width: 1px;
  margin: 0;
  width: 100%;
}

.content .col-md-12,
.content2 .col-md-12 {
  margin: 0;
  padding: 0;
}

.forside .col-md-7,
.forside .col-md-5,
.forside .col-sm-4 {
  margin: 0;
  padding: 0;
}

.forside .card {
  margin-left: 0;
  margin-right: 10px;
  margin-bottom: 10px;
}

.forside .card-header {
  background: #d6d6d6;
  color: #333333;
}

.forside .card-title {
  color: #b7496e;
  font-weight: bold;
}

.forside .card-body {
  background: #fff;
}

.content h4,
.forside h1,
.forside h2,
.forside h3,
.translate h1 {
  color: #b7496e;
  margin: 0 0 10px 0;
}

.forside h1,
.forside h2,
.forside h3,
.translate h1 {
  font-size: 24px;
}

@font-face {
  font-family: LobsterTwo-Regular;
  src: url(../fonts/LobsterTwo-Regular.ttf) format('truetype');
}

.navbar {
  background: none !important;
  border: none;
}

.navbar .nav-item {
  margin-top: 10px;
}

.navbar .nav-item a {
  color: #b7486e;
  font-size: 21px;
}

.collapse .navbar-collapse {
  margin: 0;
  padding: 0;
}

.navbar li a {
  padding: 5px;
  margin-left: 12px;
  font-family: 'Roboto Condensed', sans-serif;
}

a.navbar-brand {
  font-size: 3em;
  color: #b7486e !important;
  text-decoration: none;
  font-family: LobsterTwo-Regular;
}

a.navbar-brand:hover {
  text-decoration: none;
}

.navbar-nav .active > a,
.navbar-nav > .active > a:hover,
.navbar-nav > .active > a:focus {
  color: #fff !important;
  background-color: #b7486e !important;
  text-decoration: none;
}

.navbar-nav> li > a:hover,
.navbar-nav > li > a:focus {
  color: #fff;
  text-decoration: none;
}

.menu-button {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}

.menu-button:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #b7486e;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.menu-button:hover,
.menu-button:focus,
.menu-button:active {
  color: white;
}

.menu-button:hover:before,
.menu-button:focus:before,
.menu-button:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

/*--------------  index.php  ----------------------------*/

.form-a .col-md-4,
.form-a .col-md-3,
.form-a .col-md-8 {
  padding: 0;
}

.form-a .form-row {
  padding: 0;
  margin: 0;
}

.form-a input {
  font-size: 18px;
  max-width: 200px;
}

.infotekst {
  margin-bottom: 10px;
}

.content label.AtCursor {
  margin-bottom: 10px;
}

.result th {
  background-color: #efefef;
}

.form-a .dropdown button {
  margin-right: 10px;
  min-width: 150px;
}

.dropdown a,
.dropdown a:visited {
  text-decoration: none;
  color: #212529;
}

.dropdown a:hover,
.dropdown a:active {
  text-decoration: none;
  color: #b7496e;
}

.form-control-sm {
  border: solid;
  border-width: 1px;
  border-color: #c7d1d9;
}

.AtCursor {
  font-size: 20px;
  cursor: pointer;
}

label.AtCursor {
  text-align: center;
  width: 20px;
  border: solid;
  border-width: 1px;
  border-color: #c7d1d9;
  display: inline-block;
}

.form-a .special,
.form-a .special2 {
  min-width: 350px;
}

@media (min-width: 576px) {
  .form-a .special {
    margin-top: -8px;
  }
}

@media (min-width: 576px) {
  .form-a .special2 {
    margin-top: 8px;
  }
}

p.justering {
  float: left;
  margin: 0 5px 5px 0;
  padding-top: 5px;
}

.form-a table {
  margin-top: 10px;
}

/*------ page_convert.php--------------------------------*/

.convert h4 {
  color: #434343;
  margin-bottom: 40px;
}

.convert input {
  padding-left: 18px;
}

/*------ page_solberegner.php--------------------------------*/

.calc hr {
  margin-top: 5px;
  height: 1px;
}

#img_select img {
  margin-right: 5px;
  margin-bottom: 8px;
  max-width: 196px;
}

#result_calc div {
  background-color: #F7D6E2;
  max-width: 150px;
  padding: 10px;
  float: left;
  margin-right: 10px;
  margin-bottom: 5px;
}
#result_calc span {
  font-size: 25px;
}
#result_calc hr {
  margin-bottom: 4px;
}
#result_calc .font1 {
  font-size: 25px;
  font-family: sans-serif;
  font-style: normal;
}
#result_images {
  margin-top: 20px;
}

#img_select p, #result_images p{
  margin-bottom: 4px;
}
/*------ en/sv/ty.php modal-del -------------------------*/

.content-5 {
  padding: 15px;
  color: #434343;
  background: #fff;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
  border-right-style: solid;
  border-right-color: #e0e0e0;
  border-right-width: 1px;
  margin: 0;
  width: 100%;
}

.content-5 .col-md-8 input {
  max-width: 280px;
  margin-bottom: 5px;
}

/*------ page_needs_translation.php ---------------------*/

.translations a,
.translations a:visited {
  color: #434343;
}

.translations table {
  margin-bottom: 50px;
}

.translations span {
  font-weight: 600;
}

/*------ page_contact.php--------------------------------*/

@media screen and (min-width: 770px) {
  .kontakt button {
    margin-bottom: 10px;
    float: right;
  }
}

.kontakt textarea {
  resize: none;
}

.kontakt .msg {
  font-size: 16px;
  margin-top: 15px;
}

@media screen and (max-width: 769px) {
  .kontakt #rc-imageselect,
  .kontakt .g-recaptcha {
    transform: scale(0.77);
    -webkit-transform: scale(0.77);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
  }
  .kontakt #name {
    margin-bottom: 10px;
  }
  .kontakt button {
    margin-bottom: 20px;
    float: left;
  }
}

/*------ page_about.php--------------------------------*/

.about .col-md-4 {
  padding-left: 30px;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
}

.about .blogs {
  border-top-style: solid;
  border-top-color: #e0e0e0;
  border-top-width: 1px;
  padding-top: 15px;
}

.about .col-md-4 img.rounded-circle {
  margin-bottom: 30px;
}

.about .col-md-4 ul {
  margin: 0;
  padding: 0;
}

.about .col-md-4 ul li {
  list-style: none;
  line-height: 24px;
}

.about .col-md-4 .small {
  margin-top: 10px;
  margin-bottom: 15px;
}

.about .col-md-8 {
  padding-left: 0;
  padding-right: 10px;
  float: left;
}

.about h3 {
  padding: 0;
  color: #b7496e;
  margin: 0;
  font-size: 18px;
  font-weight: bolder;
}

/*--------  oversættelsessider ---------------*/

.translate .col-md-6 {
  margin-left: 0;
  padding-left: 0;
}

.translate .msg {
  font-size: 16px;
  padding-bottom: 10px;
}

.translate .table {
  background: #ffffff;
}

.translate .table-sm {
  width: 100%;
  margin-bottom: 30px;
  background: #ffffff;
}

.translate .table-sm td {
  padding: 8px 5px 0 5px;
}

.translate .table-sm th {
  padding: 11px;
}

.translate th {
  background-color: #EDEDED;
}

.translate button {
  margin-top: 10px;
}

.translate .AtCursor {
  font-size: 20px;
  cursor: pointer;
}

.translate label.AtCursor {
  text-align: center;
  width: 25px;
  border: solid;
  border-width: 1px;
  border-color: #c7d1d9;
  display: inline-block;
}

.translate h4 {
  color: #434343;
  margin-bottom: 2px;
}

.translate .div-header {
  border-left: solid;
  border-right: solid;
  border-top: solid;
  border-width: 1px;
  border-color: #d9e0e5;
  padding: 10px;
  background: #eaecec;
  color: #000000;
}

.translate .div-table {
  border-style: solid;
  border-width: 1px;
  border-color: #d9e0e5;
  padding: 10px;
}

.translate textarea {
  resize: none;
  height: 200px;
}

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

.translate .container {
  max-width: 300px;
}

@media screen and (max-height: 575px) {
  .translate #rc-imageselect,
  .translate .g-recaptcha {
    transform: scale(0.77);
    -webkit-transform: scale(0.77);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
  }
}

/* ---------- kasser vejledning ------------------*/

#diy .card {
  margin-left: 0;
  margin-right: 0px;
  margin-bottom: 20px;
}

#diy .card p {
  padding: 5px 25px 0px 25px;
}

/*------------------------------------------------*/

.footer-page .col-md-12 {
  background: #ffffff;
  margin: 0;
  padding: 10px 5px 0 5px;
  border-top-style: dashed;
  border-top-width: 2px;
  border-top-color: #d6d6d6;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
  border-right-style: solid;
  border-right-color: #e0e0e0;
  border-right-width: 1px;
}

.sproglinks {
  padding: 20px;
  text-align: left;
  border-bottom-style: solid;
  border-bottom-color: #e0e0e0;
  border-bottom-width: 1px;
}

.sproglinks a {
  font-weight: bold;
  margin-right: 5px;
}

.sproglinks div {
  margin-bottom: 5px;
}

/* ---------- 2. kolonne ------------------*/

.footer-page .small-devices {
  padding: 10px 5px 0 20px;
  font-weight: bold;
  border-left-style: solid;
  border-left-color: #e0e0e0;
  border-left-width: 1px;
  min-height: 180px;
}

.footer-page .small-devices .img-fluid {
  max-height: 40px;
  max-width: 95px;
}

.footer-page .small-devices img {
  margin-top: 10px;
  margin-bottom: 15px;
}

/* ---------- dato i bunden ------------------*/

.footer {
  padding: 13px 0 13px 0;
  font-size: 14px;
  background: #b7486e;
  color: #fff;
  text-align: center;
  margin-bottom: 50px;
}

.footer span {
  font-size: 16px;
}
