@font-face {
  font-family: 'Marck Script';
  src: url('../fonts/marckscript-regular-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/marckscript-regular-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/marckscript-regular-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/marckscript-regular-webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}
.advicetext {
  padding: 0 5%; }

.etikett-view {
  margin-bottom: 68px; }

.carousel {
  background-color: transparent;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 400px;
  perspective: 100px;
  transform-style: preserve-3d;
  transform-origin: 0% 50%; }

.etikett {
  width: 379px;
  height: 400px;
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: top left; }
  .etikett img {
    width: 100%; }

.carousel-item {
  display: none;
  width: 379px;
  height: 400px;
  position: absolute;
  top: 0;
  left: 0; }
  .carousel-item img {
    width: 100%; }

.etikett-background {
  position: absolute;
  left: 0px;
  top: 0px;
  -webkit-filter: drop-shadow(0px 0px 10px rgba(120, 120, 120, 0.3));
  filter: drop-shadow(0px 0px 10px rgba(120, 120, 120, 0.3)); }

.etikett-label {
  border: 0 !important;
  width: 259px;
  height: 160px;
  background: transparent;
  text-align: center;
  font-size: 2.5em;
  font-family: Arial, Helvetica, sans-serif;
  resize: none;
  overflow: hidden;
  outline: none;
  line-height: 120%;
  position: absolute;
  left: 60px;
  top: 60px;
  white-space: pre-wrap;
  word-wrap: break-word; }

.etikett-label.plain {
  font-family: Arial, Sans-Serif; }

.etikett-label.italic {
  font-family: 'Marck Script', cursive; }

.menu {
  display: block; }

.menu-item {
  display: inline-block;
  font-weight: bold;
  color: #135279;
  margin: 10px; }

.menu-item.active {
  border-bottom: solid 1px #135279; }

.etikett-thumbnail {
  height: 50px;
  padding-left: 10px;
  opacity: 0.4; }

.etikett-thumbnail.active {
  height: 70px;
  opacity: 1; }

.dark-button {
  height: 58px;
  line-height: 58px;
  background-color: #0099b8;
  width: 325px;
  color: #ffffff;
  margin: auto; }

.light-button {
  height: 58px;
  line-height: 58px;
  font-size: 18px;
  font-weight: bold;
  background-color: #0099b8;
  width: 325px;
  color: #ffffff;
  margin: auto; }

.header {
  color: #ffffff;
  height: 75px;
  background-color: #0099b8;
  font-size: 25px;
  line-height: 43px; }

.number {
  display: inline-block;
  background-color: #ffffff;
  color: #0099b8;
  border-radius: 50%;
  margin-top: 16px;
  margin-right: 12px;
  width: 43px;
  height: 43px; }

.font-bar {
  line-height: 48px; }

.mat-select {
  font-family: arial !important; }

.mat-slider-thumb {
  background-color: #0099b8; }

.mat-slider-track-fill {
  background-color: #0099b8; }

.mat-select:focus:not(.mat-select-disabled) .mat-select-trigger {
  color: #0099b8; }

.mat-select:focus:not(.mat-select-disabled) .mat-select-underline {
  background-color: #0099b8; }

.mat-select-value {
  color: #0099b8; }

.mat-select-value-text {
  font-weight: bold !important;
  color: #0099b8; }

.mat-select-trigger {
  display: block;
  padding-top: 9px;
  min-width: 82px !important; }

.mat-option {
  color: #0099b8; }

.mat-option.mat-selected {
  color: #0099b8; }

.mat-select-arrow {
  color: #0099b8;
  margin-top: -10px !important; }

.mat-select-underline {
  display: none !important; }

.etikett-header-background {
  margin-top: 64px;
  width: 1024px;
  background-image: url("images/header-background.png");
  text-align: center; }

.etikett-header {
  font-size: 32px;
  font-weight: bold;
  display: inline-block;
  background-color: #fff;
  padding-left: calc(2vw);
  padding-right: calc(2vw);
  vertical-align: middle; }

.etikett-panel {
  margin-top: 96px; }

@media (max-width: 1024px) {
  .etikett-header-background {
    margin-top: calc(5vw);
    width: calc(100vw); }
  .etikett-panel {
    margin-top: calc(9vw); }
  .etikett-thumbnail {
    height: calc(10vw);
    padding-left: calc(1vw);
    padding-right: calc(1vw); }
  .etikett-thumbnail.active {
    height: calc(12vw);
    opacity: 1; } }

.selection {
  margin-top: 49px; }

.selection > div {
  width: 208px;
  text-align: center;
  position: relative;
  display: inline-block;
  margin-left: 17px;
  margin-right: 17px; }

.selection .icon {
  width: 208px;
  height: 290px;
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative; }

.selection .label {
  font-weight: bold;
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-size: 1.3rem;
  color: #0099b8; }

.selection .selected:after {
  content: ' ';
  background-image: url("images/checkmark.png");
  width: 34px;
  height: 34px;
  position: absolute;
  top: -12px;
  left: -11px;
  background-size: contain;
  background-repeat: no-repeat; }

.selection .etikett {
  background-image: url("images/etikett.png"); }

.selection .selected .etikett {
  background-image: url("images/etikett_selected.png"); }

.selection .locketikett {
  background-image: url("images/locketikett.png"); }

.selection .selected .locketikett {
  background-image: url("images/locketikett_selected.png"); }

.selection .flasketikett {
  background-image: url("images/flasketikett.png"); }

.selection .selected .flasketikett {
  background-image: url("images/flasketikett_selected.png"); }

.selection .bordsplacering {
  background-image: url("images/bordsplacering.png"); }

.selection .selected .bordsplacering {
  background-image: url("images/bordsplacering_selected.png"); }

.textoverlay {
  border: solid 1px #000;
  position: absolute;
  padding: 2px; }

.etikett textarea, .etikett .textoverlay {
  width: 265px;
  height: 153px; }

.flasketikett textarea, .flasketikett .textoverlay {
  width: 220px;
  height: 130px;
  left: 115px;
  top: 40px; }

.carousel-item.locketikett {
  width: 379px;
  height: 379px; }

.locketikett textarea, .locketikett .textoverlay {
  width: 110px;
  top: 135px;
  left: 135px;
  height: 110px; }

.bordsplacering textarea, .bordsplacering .textoverlay {
  width: 308px;
  left: 35px;
  top: 167px; }

.editing::placeholder {
  color: transparent; }

.editing {
  color: transparent; }

intro-view .intro {
  width: 100%;
  height: 600px;
  text-align: left;
  position: relative;
  background-size: cover; }

intro-view .menu {
  display: block; }

intro-view .menu-item {
  display: inline-block;
  font-weight: bold;
  color: #ffffff;
  margin: 10px; }

intro-view .menu-item.active {
  border-bottom: solid 1px #ffffff; }

intro-view .content {
  padding-top: 190px;
  margin-left: 45px; }

intro-view .competition-instructions {
  padding-left: 170px;
  padding-right: 170px; }

intro-view .competition-links {
  background-color: #ff00ff; }

intro-view #intro-title {
  font-family: Arial, sans-serif;
  margin: 0px;
  padding: 0px;
  font-size: 64px;
  color: #0099b8; }

intro-view #intro-text {
  font-family: Arial, sans-serif;
  font-size: 25px;
  line-height: 1.1;
  font-weight: 400;
  padding-left: 4px;
  width: 480px;
  margin: 0px;
  color: #555; }

intro-view #intro-info {
  color: #333;
  font-weight: 400;
  font-size: 19px;
  line-height: 1.3; }

intro-view h3 {
  font-size: 16px; }

#intro-dansukker {
  line-height: 1;
  font-size: 18px;
  color: #2f2d2c; }

@media (max-width: 1024px) {
  intro-view .intro {
    background-size: cover;
    background-repeat: no-repeat;
    height: calc(60vw); }
  intro-view .menu {
    display: block; }
  intro-view .menu-item {
    margin: 10px; }
  intro-view .content {
    padding-top: calc(16vw);
    margin-left: calc(5vw); }
  intro-view #intro-title {
    font-size: calc(8vw);
    color: #0099b8; }
  intro-view #intro-text {
    font-size: calc(4vw);
    line-height: 1.3;
    padding-top: 5px;
    padding-left: 0;
    width: calc(47vw);
    margin: 0px; }
  intro-view #intro-info {
    font-size: calc(4vw);
    line-height: 1.3; }
  intro-view h3 {
    font-size: 16px; } }

#print-view {
  background-color: #ffffff; }
  #print-view .printsize {
    width: 177px;
    height: 98px;
    text-align: left;
    padding-left: 90px;
    padding-top: 25px;
    line-height: 20px;
    font-size: 15px;
    color: #0099b8;
    vertical-align: top; }
  #print-view #small {
    background-image: url("images/small-unselected.png"); }
  #print-view #small.selected {
    background-image: url("images/small-selected.png"); }
  #print-view #medium {
    background-image: url("images/medium-unselected.png"); }
  #print-view #medium.selected {
    background-image: url("images/medium-selected.png"); }
  #print-view #large {
    background-image: url("images/big-unselected.png"); }
  #print-view #large.selected {
    background-image: url("images/big-selected.png"); }
  #print-view .spinner {
    background-color: #f0f0f0;
    box-sizing: border-box;
    padding: 13px 25px;
    border-radius: 5px;
    margin: 20px auto;
    width: 642px;
    height: 90px; }
  #print-view .spinner-thumb {
    transform: scale(0.235, 0.235); }
  #print-view .spinner-text {
    display: inline-block;
    margin-top: 15px;
    margin-bottom: auto;
    margin-left: 0px;
    margin-right: 0px;
    text-align: left;
    width: 200px; }
  #print-view .right-area {
    float: right;
    display: block;
    margin-top: 20px; }
  #print-view .spinner-delete {
    display: inline-block;
    float: right;
    margin-left: 15px;
    background-image: url("images/soptunna.png");
    background-size: contain;
    background-size: 100% 100%;
    width: 20px;
    height: 24px; }
  #print-view number-spinner {
    display: inline-block; }
    #print-view number-spinner div {
      height: 24px;
      background-color: #0099b8; }
    #print-view number-spinner .spinner-button {
      text-align: center;
      font-weight: bold;
      display: inline-block;
      font-size: 24px;
      color: #ffffff;
      padding: 0px;
      margin: 0px;
      cursor: pointer;
      width: 24px;
      height: 100%;
      line-height: 22px;
      vertical-align: middle; }
    #print-view number-spinner .spinner-edit {
      display: inline-block;
      font-size: 18px;
      border: none;
      width: 50px;
      margin: 0px;
      padding: 0px;
      height: 26px;
      text-align: center; }

.selected-locketikett #small {
  display: none; }

.selected-locketikett #print-view .spinner-thumb {
  transform: scale(0.165, 0.165); }

.selected-flasketikett #small {
  display: none; }

.selected-flasketikett #large {
  display: none; }

.selected-bordsplacering #small {
  display: none; }

.selected-bordsplacering #medium {
  display: none; }

.selected-locketikett #print-view #medium {
  background-image: url("images/circle_3_unselected.png"); }

.selected-locketikett #print-view #medium.selected {
  background-image: url("images/circle_3_selected.png"); }

.selected-locketikett #print-view #large {
  background-image: url("images/circle_2_unselected.png"); }

.selected-locketikett #print-view #large.selected {
  background-image: url("images/circle_2_selected.png"); }

.busy-screen {
  pointer-events: none;
  touch-action: none;
  position: fixed;
  z-index: 1000;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  background-color: rgba(255, 255, 255, 0.7); }

.spinner {
  width: 40px;
  height: 40px;
  position: relative;
  margin: 100px auto; }

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #333;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out; }

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s; }

.form-group input {
  display: block; }

.form-group text-area {
  display: block; }

@-webkit-keyframes sk-bounce {
  0%, 100% {
    -webkit-transform: scale(0); }
  50% {
    -webkit-transform: scale(1); } }

@keyframes sk-bounce {
  0%, 100% {
    transform: scale(0);
    -webkit-transform: scale(0); }
  50% {
    transform: scale(1);
    -webkit-transform: scale(1); } }

@media (max-width: 1024px) {
  #print-view .spinner {
    background-color: #f0f0f0;
    box-sizing: border-box;
    padding: 13px calc(2vw);
    border-radius: 5px;
    margin: calc(2vw) auto;
    width: calc(98vw);
    height: 90px; } }

@media (max-width: 480px) {
  #print-view .spinner-text {
    margin-left: 40px;
    width: auto; } }

.entry {
  display: inline-block; }
  .entry img {
    width: 200px;
    display: block; }

#entries:after {
  clear: both; }

#priser-panel {
  background-color: #ffffff;
  padding-left: 150px;
  padding-right: 150px; }

#regler-panel {
  padding-left: 180px;
  padding-right: 180px; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  text-align: center;
  overflow-x: hidden;
  margin: auto;
  width: 1024px;
  color: #555;
  background-color: #fff;
  font-family: Arial, sans-serif;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
                                  supported by Chrome and Opera */ }

.fat {
  font-weight: bold; }

h1 {
  font-size: 32px; }

h2 {
  font-size: 24px; }

h3 {
  font-size: 16px; }

.body-content {
  width: 1024px;
  background-color: #fff;
  height: 100%; }

app-header .header {
  width: 100%;
  height: 68px;
  background: white;
  border-bottom: solid 1px black; }

app-header .back {
  float: left; }

app-header .logo {
  float: right;
  height: 75%; }

app-footer .content {
  border-top: 5px solid #ddd;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-top: 100px;
  height: 180px; }
  app-footer .content .share-widgets {
    display: none;
    text-align: center; }
    app-footer .content .share-widgets a {
      color: #0099b8;
      text-decoration: none;
      font-weight: bold;
      margin: 20px 0px;
      display: inline-block; }
  app-footer .content .custom_images {
    display: inline-block; }
  app-footer .content a {
    color: #0099b8;
    text-decoration: none;
    font-weight: bold; }

.button {
  display: inline-block;
  text-align: center;
  background: #0099b8;
  width: 220px;
  max-width: 45%;
  height: 55px;
  line-height: 55px;
  color: #ffffff;
  font-weight: bold;
  margin: 5px;
  text-align: center; }

.mat-dialog-container {
  padding: 0px !important;
  text-align: right; }

.clickable {
  cursor: pointer; }

#widget {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-align: left;
  vertical-align: bottom; }

.btn {
  position: relative;
  height: 20px;
  display: inline-block;
  box-sizing: border-box;
  padding: 1px 8px 1px 6px;
  background-color: #1b95e0;
  color: #fff;
  border-radius: 3px;
  font-weight: 500;
  cursor: pointer;
  outline: 0;
  text-decoration: none;
  text-decoration-line: none;
  text-decoration-style: initial;
  text-decoration-color: initial;
  font-size: 11px; }

.btn i {
  position: relative;
  top: 2px;
  display: inline-block;
  width: 14px;
  height: 14px;
  background: transparent 0 0 no-repeat;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E); }

.btn .label {
  margin-left: 3px;
  white-space: nowrap; }

.btn a {
  outline: 0;
  text-decoration: none;
  text-decoration-line: none;
  text-decoration-style: initial;
  text-decoration-color: initial; }

@media (max-width: 1024px) {
  body {
    width: calc(100vw); }
  .body-content {
    width: calc(100vw); }
  app-footer .content {
    margin-top: calc(1vw);
    height: calc(25vw); }
    app-footer .content .custom_images a {
      float: none;
      margin: 0; }
    app-footer .content .custom_images img {
      height: 35px;
      width: 35px;
      margin: 20px 0px; }
  app-footer a {
    height: calc(1vw); }
  app-footer img {
    height: calc(15vw);
    margin-left: calc(5vw);
    margin-right: calc(5vw); } }