/* GENERAL */

* {
  box-sizing: border-box;
}

html {
  font-family:"Georgia", serif;
  color:#404040;
  font-size:100%;
  width:100%;
  height:100%;
}

img {
  max-width:100%;
  height:auto;
  border:0;
  vertical-align: middle;
} 

h1 {
   font-size:2.0em; 
   font-weight:bold; 
   font-variant: small-caps;
   letter-spacing:3px;
}

h2 {
   font-size:1.2em; 
   font-weight:bold;
   font-variant: small-caps;
   letter-spacing:3px;
   margin-bottom:5px;
}

p, ul, ol {
   font-size:1.0em; 
   text-align: justify;
   line-height:175%;
}

p.alinea1 {
  font-family:"Open+Sans", sans-serif;
  font-style: italic;
  font-weight: 600;
}

p.alinea1::first-letter {
  font-family:"Georgia", serif;
  font-size: 175%;
  color: #8A2BE2;
  font-weight: bold;
}

p.alinea2 {
}

ul {
   list-style-type:square; 
   padding-left:18px;
   margin-top:0px;
}

ol {
   padding-left:18px;
   margin-top:0px;
}

table {
   border-collapse: collapse;
   width:100%;
}

tr {
  font-family:"Open+Sans", sans-serif;
}

td, th {
   font-family:"Open+Sans", sans-serif;
   text-align:left;
   font-size:0.95em;
   padding:3px 5px; 
} 

th {
   vertical-align:bottom; 
   font-weight:bold;
   font-variant: small-caps;
   letter-spacing:2px;
   font-size:1.0em;
   border-bottom: 1px solid #000000;
}

td {
   vertical-align:top; 
   font-size:0.95em;
   padding:3px; 
   height:25px; 
   line-height:25px; 
} 

div {
   margin:0px;
}

div.img-artikel {
}

.hide {
   display:none;
}

.cap {
   text-transform: capitalize;
}

.upp {
   text-transform:uppercase;
}

fieldset {
   font-family:"Georgia", serif;
   width:100%; 
   margin:0px 0 30px 0; 
   padding:10px; 
   vertical-align:middle;
}

fieldset p {clear:both;}

fieldset div {
   font-family:"Open+Sans", sans-serif;
   margin: 10px 0 5px 0;
}

fieldset div.label {
   font-weight:bold;
   font-variant: small-caps;
   letter-spacing:2px;
   font-size:1.0em;
}

legend {
   font-weight:bold;
   font-variant: small-caps;
   letter-spacing:2px;
   font-size:1.0em;
}

input {
  padding: 0 15px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  height:50px; 
  line-height:50px; 
  font-size:1.0em; 
  resize: vertical;
  outline:0;
}

label {
  padding-top:10px;
  text-align:left;
  float:left;
}

/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* For mobile phones: */

  [class*="col-"] {width: 100%;}

body {
  margin:5px;
  padding:15px;
  border: 3px solid #000000;
}

.hide-phone {
  display:none;
}

.hide-ipad {
  display:none;
}

.highlight {
  font-style: italic;
}

div.txt-artikel {
  column-count:1;
  column-gap:0;
  column-fill: balance;
}

/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 600px) {
  /* For tablets: */

  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}

body {
  margin:15px;
  padding:20px 50px 25px 50px;
  border: 5px solid #808080;
}

.hide-phone {
  display:inline;
}

.hide-ipad {
  display:none;
}

div.artikel {
  column-count:2;
  column-gap:50px;
  column-fill: balance;
}

}

/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 1048px) {
  /* For desktop: */

  .col-1 {width: 8.33%;}
  .col-2 {width: 16.66%;}
  .col-3 {width: 25%;}
  .col-4 {width: 33.33%;}
  .col-5 {width: 41.66%;}
  .col-6 {width: 50%;}
  .col-7 {width: 58.33%;}
  .col-8 {width: 66.66%;}
  .col-9 {width: 75%;}
  .col-10 {width: 83.33%;}
  .col-11 {width: 91.66%;}
  .col-12 {width: 100%;}

body {
  margin:30px;
  padding:20px 50px 25px 50px;
  border: 5px dotted #8A2BE2;
}

.hide-phone {
  display:inline;
}

.hide-ipad {
  display:inline;
}

div.artikel {
  column-count:3;
  column-gap:50px;
  column-fill: balance;
}

}

/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

@media print {
         body {
         margin: 5mm 0mm 0mm 5mm;
         color: #000;
         background-color: #fff;
         }

img {
   display:none;
         }
}