/*  hvalpepakken.dk
  sk@opengate.dk 15-04-2014
  
  Generelt
  Text: #000000 rgb(0,0,0);
  Grey: #515151 rgb(81,81,81);
  Red: #e1000e rgb(225,0,14);
  Green: #81b612 rgb(129,182,18);
  Orange: #f94d00 rgb(249,77,0);
  
  
  Red: #a21b22 rgba(163,11,53,1.0);
    
    Sizes:
  11px = 0.6875em
  12px = 0.75em
  14px = 0.875em
  15px = 0.9375em
  16px = 1em
  17px = 1.0625em
  18px = 1.125em
  20px = 1.25em
  22px = 1.375em
  24px = 1.5em
  28px = 1.75em

*/

@font-face {
  font-family: 'fontello';
  src: url('../fonts/fontello.eot?41607320');
  src: url('../fonts/fontello.eot?41607320#iefix') format('embedded-opentype'),
       url('../fonts/fontello.woff?41607320') format('woff'),
       url('../fonts/fontello.ttf?41607320') format('truetype'),
       url('../fonts/fontello.svg?41607320#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'AmaticSC-Regular';
  src: url('../fonts/AmaticSC-Regular.eot');
  src: url('../fonts/AmaticSC-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/AmaticSC-Regular.woff') format('woff'),
       url('../fonts/AmaticSC-Regular.ttf') format('truetype'),
       url('../fonts/AmaticSC-Regular.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Amatic-Bold';
  src: url('../fonts/Amatic-Bold.eot');
  src: url('../fonts/Amatic-Bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/Amatic-Bold.woff') format('woff'),
       url('../fonts/Amatic-Bold.ttf') format('truetype'),
       url('../fonts/Amatic-Bold.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}


/*====================================
  GLOBAL SETTINGS
=====================================*/
html { 
	overflow-y:scroll; 
/*  background:transparent url(../images/background.jpg) left top repeat-x; */
	background: url(../images/background.jpg) no-repeat center top fixed #fff; 
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: 100% auto;   
}



body { }
html,body { }

body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, figure, figcaption, font, img, ins, input, kbd, q, s, samp, small, select, option, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, textarea, table, caption, tbody, tfoot, thead, tr, th, td, tt, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  font: normal normal normal 14px/18px arial, helvetica, verdana, tahoma, sans-serif;
  color:#506066;
  margin:0; 
  padding:0;
  border:0 none;
  box-sizing:border-box;  
}
/* html5 */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }


figure { margin: 0}
img, object, embed, video {max-width:100%; width:100% !important; } /* Fluid images */
img {border: 0; -ms-interpolation-mode: bicubic; height: auto;} /* Improve IE's resizing of images */
svg:not(:root) {overflow: hidden} /* Correct IE9 overflow */

em { font-style:italic; }
strong, strong a { font-weight:bold; }
strong em, em strong { font-weight:bold; font-style:italic; }

/*-----------------------------------
  HEADER STYLE SETTINGS
------------------------------------*/
h1, h1 a { font-size:24px; line-height:28px; color:#000000; margin:0 0 10px 0; text-decoration:none; }
h1 a { text-decoration:none; margin:0; }
h1 a:hover { color:rgb(238,38,38); text-decoration:underline; }
h2, h2 a, legend { font-size:18px; line-height:22px; color:rgb(81,81,81); margin:0 0 10px 0; text-decoration:none; }
h2 a { margin:0; }
h2 a:hover { color:rgb(238,38,38); text-decoration:underline; }
h3, h3 a { font-size:14px; line-height:17px; font-weight:bold; color:rgb(0,0,0); text-decoration:none; margin:0 0 10px 0; }
h3 a { margin:0; }
h3 a:hover { color:rgb(238,38,38); text-decoration:underline; }
h4, h4 a { font-size:13px; line-height:17px; color:rgb(0,0,0); margin:0; text-decoration:none;}
h4 a:hover { color:rgb(238,38,38); text-decoration:underline; }
h5, h5 a { font-size:11px; line-height:14px; text-decoration:none;}
h5 a { color:rgb(0,0,0); }
h5 a:hover { color:rgb(238,38,38); text-decoration:underline; }


/*-----------------------------------
  PARAGRAPH STYLE SETTINGS
------------------------------------*/
p { margin:0 0 15px 0; }

p.align-left { text-align:left; }
p.align-center { text-align:center; }
p.align-right { text-align:right; }

/*-----------------------------------
  BLOCKQOUTE SETTINGS
------------------------------------*/
blockquote { 
  padding:11px 8px 0px 37px;
  border:1px solid #e0e0e0;
  margin:0 0 20px;
  background:#eeeeee url('openqoute.png') left top no-repeat;
}  
blockquote .closequote { padding:0 31px 0 0; background:transparent url('closeqoute.png') right bottom no-repeat; }

blockquote p, blockquote li, blockquote a, blockquote strong { 
  font-style:italic;
}
/*-----------------------------------
  LINK STYLE SETTINGS
------------------------------------*/
a { color:#e1000e; text-decoration:none;}
a:link, a:visited {}
a:focus { outline:0 none; }
a:hover { color:#f94d00; text-decoration:underline; }
a:active {}

a img, :link img, :visited img {
  border:0 none;
}
a:hover img { border:0px solid #fff;}

/*-----------------------------------
  CLASS STYLE SETTINGS
------------------------------------*/
span.class-0, p.class-0, td.class-0 { color:rgb(255,255,255); } /* Hvid */
span.class-1, p.class-1, td.class-1 { color:rgb(63,146,210); } /* LightBlue */
span.class-2, p.class-2, td.class-2 { color:rgb(11,97,164); } /* Darkblue */
span.class-3, p.class-3, td.class-3 { color:rgb(255,73,0); } /* Red */
span.class-4, p.class-4, td.class-4 { color:rgb(255,191,0); } /* Orange */
span.class-5, p.class-5, td.class-5 { color:rgb(191,89,48); } /* Brown */
span.class-6, p.class-6, td.class-6 { color:rgb(121,147,54); } /* Green */

.align-left { text-align:left; }
.align-center { text-align:center; }
.align-right { text-align:right; }

.boxShadow, .supplier { 
/*  
  -moz-box-shadow:1px 1px 3px #a21b22;
  -webkit-box-shadow:1px 1px 3px #a21b22;
  box-shadow:1px 1px 3px #a21b22;
  border-collapse: separate;  
*/
}
.borderRadius, .supplier {
  -moz-border-radius:4px 4px 0 0;
  -webkit-border-radius:4px 4px 0 0;
  border-radius:4px 4px 0 0;
}

/*-----------------------------------
   HR STYLE SETTINGS
------------------------------------*/
hr {  width:100%; height:1px; line-height:1px; border:0; border-top:1px solid rgb(11,97,164); padding:0; margin:10px 0; }


/*-----------------------------------
  INPUT, SELECT, TEXTAREA STYLE SETTINGS
------------------------------------*/
/* IOS: IPAD - undgå rundehjørner */
.ipad {
    -webkit-appearance: none;
  -moz-border-radius:0;
  -webkit-border-radius:0;
  border-radius:0;
}  

/* Hvert inputsfelt */
.fieldWrap, div.inputfields, div.csc-mailform ol li.csc-form-element { margin:0 0 3.5%; }
div.submitfields { margin:4% 0 0 0; }


label, .powermail_label {
  min-height:28px;
  line-height:28px; 
  width:35%;
  display:block;
  float:left;
}

/* <input type="text"> */
input[type="text"], input.text, input.stdText, .powermail_input {
  height:28px;
  width:65%;
  padding:2px 5px;
  border:1px solid #f4f4f4;
  background:#ffffff none;
    -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
}

/* select */
select, .powermail_select {
  height:28px;
  width:65%;
  padding:2px 5px;
  border:1px solid #f4f4f4;
  background:#ffffff none;
    -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
}
option { 
  padding:2px 0 2px 5px;
}
option:first-child {
  color:#8e8e8e;  
}
/* Placeholder */
/* https://stackoverflow.com/questions/2610497/change-an-html5-inputs-placeholder-color-with-css */
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #8e8e8e;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #8e8e8e;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #8e8e8e;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #8e8e8e;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #8e8e8e;
}

::placeholder { /* Most modern browsers support this now. */
   color:    #8e8e8e;
}
/* <input type="checkbox"> */
input[type="checkbox"], input.checkBox {
  width:13px;
  min-height:32px;
  margin:0;
  border:1px solid #f4f4f4;
  background:#ffffff none;
    -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
}

/* <input type="radio"> */
input[type="radio"], input.radio {
  width:13px;
  min-height:inherit;
  margin:2.5% 3% 2.5% 1%;
  border:1px solid #f4f4f4;
  background:#ffffff none;
    -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
}
/* textarea */
textarea {
  padding:2px;
  border:1px solid #f4f4f4;
  overflow:auto;
  background:#ffffff none;  
}


/* <input type="submit"> */
input[type="submit"] {
  font-size:16px;
  height:32px;
  padding:0.5% 7% 0.5% 4%;
  position:relative;
  font-weight:bold;
  color: #fff;
  text-decoration:none;
  cursor:pointer;
  border: 1px solid #f4f4f4;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border-collapse: separate;    
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6a8187+1,506066+100 */
background: #506066; /* Old browsers */
background: -moz-linear-gradient(top, #6a8187 1%, #506066 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #6a8187 1%,#506066 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #6a8187 1%,#506066 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6a8187', endColorstr='#506066',GradientType=0 ); /* IE6-9 */	
}
span.callToAction:after {
  content: ' \e89e'; 
  content: ' \e89a';
  content: ' \e891';
    color: #fff;
    display: inline-block;
    font-family: "fontello";
    font-size: 20px;
    margin: -4px 0 0 -28px;
    position: relative;
    vertical-align: middle;    
}


input[type="submit"]:hover {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bc3c0f+0,ff9000+0,bc3c0f+100 */
background: #506066; 

}



input:not([type="submit"]):focus,
select:focus,
textarea:focus  {
  background:#fff none;
  border:1px solid #000;
  -moz-box-shadow:none;
  -webkit-box-shadow:none;
  box-shadow:none; 
  
}


input[readonly="readonly"],
input[disabled="disabled"], 
select[disabled="disabled"],
textarea[disabled="disabled"],
input.powermail_text[readonly="readonly"]:focus,
fieldset.tx-powermail-pi1_fieldset input.powermail_text[readonly="readonly"]:focus:not([type="submit"]) { 
  border:1px solid #f4f4f4;
  background:#EDEDED none;
}



/* HTML 5 validering */
/* http://www.the-art-of-web.com/html/html5-form-validation/ */
input:required, 
textarea:required {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAT1JREFUeNpi/P//PwMpgImBRMACY/x7/uDX39sXt/67cMoDyOVgMjBjYFbV/8kkqcCBrIER5KS/967s+rmkXxzI5wJiRSBm/v8P7NTfHHFFl5mVdIzhGv4+u///x+xmuAlcdXPB9KeqeLgYd3bDU2ZpRRmwH4DOeAI07QXIRKipYPD35184/nn17CO4p/+cOfjl76+/X4GYAYThGn7/g+Mfh/ZZwjUA/aABpJVhpv6+dQUjZP78Z0YEK7OezS2gwltg64GmfTu6i+HL+mUMP34wgvGvL78ZOEysf8M1sGgZvQIqfA1SDAL8iUUMPIFRQLf+AmMQ4DQ0vYYSrL9vXDz2sq9LFsiX4dLRA0t8OX0SHKzi5bXf2HUMBVA0gN356N7p7xdOS3w5fAgcfNxWtn+BJi9gVVBOQfYPQIABABvRq3BwGT3OAAAAAElFTkSuQmCC");
    background-position: right top;
    background-repeat: no-repeat;
    box-shadow: none;
}

input:focus:required:invalid, 
input:focus:invalid {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAeVJREFUeNqkU01oE1EQ/mazSTdRmqSxLVSJVKU9RYoHD8WfHr16kh5EFA8eSy6hXrwUPBSKZ6E9V1CU4tGf0DZWDEQrGkhprRDbCvlpavan3ezu+LLSUnADLZnHwHvzmJlvvpkhZkY7IqFNaTuAfPhhP/8Uo87SGSaDsP27hgYM/lUpy6lHdqsAtM+BPfvqKp3ufYKwcgmWCug6oKmrrG3PoaqngWjdd/922hOBs5C/jJA6x7AiUt8VYVUAVQXXShfIqCYRMZO8/N1N+B8H1sOUwivpSUSVCJ2MAjtVwBAIdv+AQkHQqbOgc+fBvorjyQENDcch16/BtkQdAlC4E6jrYHGgGU18Io3gmhzJuwub6/fQJYNi/YBpCifhbDaAPXFvCBVxXbvfbNGFeN8DkjogWAd8DljV3KRutcEAeHMN/HXZ4p9bhncJHCyhNx52R0Kv/XNuQvYBnM+CP7xddXL5KaJw0TMAF8qjnMvegeK/SLHubhpKDKIrJDlvXoMX3y9xcSMZyBQ+tpyk5hzsa2Ns7LGdfWdbL6fZvHn92d7dgROH/730YBLtiZmEdGPkFnhX4kxmjVe2xgPfCtrRd6GHRtEh9zsL8xVe+pwSzj+OtwvletZZ/wLeKD71L+ZeHHWZ/gowABkp7AwwnEjFAAAAAElFTkSuQmCC);
    background-position: right top;
    background-repeat: no-repeat;
    -moz-box-shadow: none;
}

input:required:valid {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAepJREFUeNrEk79PFEEUx9/uDDd7v/AAQQnEQokmJCRGwc7/QeM/YGVxsZJQYI/EhCChICYmUJigNBSGzobQaI5SaYRw6imne0d2D/bYmZ3dGd+YQKEHYiyc5GUyb3Y+77vfeWNpreFfhvXfAWAAJtbKi7dff1rWK9vPHx3mThP2Iaipk5EzTg8Qmru38H7izmkFHAF4WH1R52654PR0Oamzj2dKxYt/Bbg1OPZuY3d9aU82VGem/5LtnJscLxWzfzRxaWNqWJP0XUadIbSzu5DuvUJpzq7sfYBKsP1GJeLB+PWpt8cCXm4+2+zLXx4guKiLXWA2Nc5ChOuacMEPv20FkT+dIawyenVi5VcAbcigWzXLeNiDRCdwId0LFm5IUMBIBgrp8wOEsFlfeCGm23/zoBZWn9a4C314A1nCoM1OAVccuGyCkPs/P+pIdVIOkG9pIh6YlyqCrwhRKD3GygK9PUBImIQQxRi4b2O+JcCLg8+e8NZiLVEygwCrWpYF0jQJziYU/ho2TUuCPTn8hHcQNuZy1/94sAMOzQHDeqaij7Cd8Dt8CatGhX3iWxgtFW/m29pnUjR7TSQcRCIAVW1FSr6KAVYdi+5Pj8yunviYHq7f72po3Y9dbi7CxzDO1+duzCXH9cEPAQYAhJELY/AqBtwAAAAASUVORK5CYII=);
    background-position: right top;
    background-repeat: no-repeat;
}



/*-----------------------------------
  LIST STYLE SETTINGS
------------------------------------*/
ul {
  text-align:left;
  padding-left:0px;
  list-style:none outside url('ul.png');
  margin:0 0 15px 26px;
}

ol {
  text-align:left;
  padding:0;
  list-style-position: outside;
  margin:0 0 15px 34px;
}

q:before, q:after, blockquote:before, blockquote:after {
  content:"";
}

/*-----------------------------------
  TABLE STYLE SETTINGS   [TYPO3] 
------------------------------------*/
table.contenttable, table.countingtable { 
  border-collapse: collapse;
  padding:0;
  border-bottom: 1px solid #1f6089; 
}

/* Overskriftscelle */
table.contenttable th,
table.countingtable th { color:#ffffff; padding:5px 5px 5px 10px; background:#1f6089; border:1px solid #1f6089; }
table.contenttable th p, 
table.countingtable th p { color:#ffffff; font-weight:700; margin:0; padding:0; } 

/* Almindelig celle */
table.contenttable td, 
table.countingtable td { padding: 4px 10px; vertical-align:top; border-left:1px solid #1f6089; border-right:1px solid #1f6089; border-bottom:1px solid #1f6089;}
table.contenttable td p, 
table.countingtable td p { margin:0; padding:0; }

table td.align-left { text-align:left;}
table td.align-center { text-align:center;}
table td.align-right { text-align:right;}
table td.align-justify { text-align:justify;}


/* TABEL SKIFTENDE RÆKKER (alternating) */
/* Overskriftscelle */
table.countingtable th { background:#EAB021;  border:0 none; }

/* Almindelig celle */
table.countingtable td { border:0 none;}

tr.tr-odd { background-color:#ffffff; }
tr.tr-even { background-color:#ededed; }



/*====================================
  TYPO3 inlines styles
=====================================*/
.ce-textpic .csc-textpic-single-image img { margin-bottom:0; }
.ce-center .ce-gallery { line-height:0; }
.ce-textpic .ce-gallery figure { display: block !important; }

.ce-center .ce-outer,
.ce-center .ce-inner { }
figcaption.csc-textpic-caption { display:block; }

#footerContainer img.frontEndEditIcons, #rightCol-1 img.frontEndEditIcons { width:auto; height:auto; }
#websiteLogo a.frontEndEditIconLinks, 
#address a.frontEndEditIconLinks { display:none;}