 
 

 
 
 
 
 
 
 
 


*{
	border: 0;
	margin: 0;
	padding: 0;
}

/***************************************************************
                            HTML
***************************************************************/
body {
  line-height:28px; 
  font-size: 20px;
/*  font-family: "Trebuchet MS", Helvetica, sans-serif; */
/*  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; */
  font-family: 'Open Sans', sans-serif; 
/*  font-family: Calibri, sans-serif; */ 
  color: #333333;             	 
  text-align: left;
  margin: 0px 0 0 0;
/*  padding: 0 20px 0 20px;*/
  background-color: #fff;
}
li {margin-left: 15px;}
ol {margin-left: 15px;}

a, a:link, a:active, a:visited {	
	color: #67CC34;
	text-decoration: none;
}

a:hover {
	color: black;
	text-decoration: underline;
}
/***************************************************************
                     Font + align + class
***************************************************************/
.sidetitle, h1, h2, h3, h4, h5 {
  font-family: "Trebuchet MS", Helvetica, sans-serif; 
}

.sidetitle {
  position: relative;
  float: left;
  width: 100%;
  line-height: 24px;
  font-size: 20px;
  font-weight: bold;
  margin: 10px 0px 10px 0px;
  color: #333;
}

h1, h1 a {
  font-size: 30px;
  line-height: 30px;
  color: #333;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  margin: 14px 0;
}

h2, h2 a {
  font-size: 18px;
  line-height: 18px;
  color: #333;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  margin: 12px 0;
}

h3, h3 a {
  color: #333; 
  line-height:16px;
  font-size: 16px;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  margin: 10px 0;
}

h4, h4 a {
  color: #333; 
  line-height:16px;
  font-size: 12px;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  margin: 10px 0;
}

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  {	text-align: left; }
.align-right {	text-align: right; }
.align-center {	text-align: center; }


/******* Classes *******/
.responsive_img {
  max-width: 100%;
  height: auto;
  width:100%;
  margin: 7px 0;
}
.wedolist ul li {
  display: block;
  list-style-type: none;
  color: #333;
  font-weight: bold;
  padding: 3px 0 3px 23px;
  background-image: url(http://www.bdr-knudsen.dk/nsd/arrow.png);
  background-repeat: no-repeat;
  background-position: left 5px;
}
.wedolist ul li:hover {
  background-image: url(http://www.bdr-knudsen.dk/nsd/arrow-hover.png);
}

.facebook {
  display: block;
  float: left;
  height: 50px;
  min-width: 50px;
  margin: 0 0 0 0px;
  background-image: url(http://www.bdr-knudsen.dk/nsd/facebook_grey.png);
  background-repeat: no-repeat;
  background-position: left;
}
.facebook:hover {
  background-image: url(http://www.bdr-knudsen.dk/nsd/facebook.png);
}
/********************************
   Formular tildel skabelon div id= formular
********************************/
#formular {
  margin-top: 20px;
}

#formular input[type="text"]  {
  padding: 0 3px 0 3px;
  border: 1px solid #999999;
  max-width: 93%;
}

#formular select {
  border: 1px solid #999999;
}

#formular input[type="submit"] {
  padding: 0 3px 0 3px;
  margin: 3px 0 0 0px;
  border: 1px solid #999999;
}

#formular textarea {
  display: block;
  max-width: 93%;
  padding: 10px;
  border: 1px solid #999999;
}

/*************** Styling af alle formular *****************/
input[type="text"], input[type="password"] {
  padding: 2px 3px 2px 3px;
  border: 1px solid #999999;
  max-width: 93%;
}
select {
  border: 1px solid #999999;
}
input[type="submit"] {
  padding: 0 3px 0 3px;
  margin: 3px 0 0 0px;
  border: 1px solid #999999;
}
textarea {
  display: block;
  max-width: 93%;
  padding: 10px;
  border: 1px solid #999999;
}
/***************************************************************
                            Layout
***************************************************************/
.wrap {
  margin: 0 auto;
  text-align: left;
  height: 100%;
}
.container {
  position: relative;
  float: left;
  Width: 100%;
}
.header-wrap {
  position: relative;
  float: left;
  Width: 100%;
  margin: 0px 0 0px 0;
  border-top: 3px solid #33cc22;
  background-color: #f8f8f8;
}

.logo {                 /* Styles under opløsningerne */
}
.logo img {
  max-Width: 100%;
}

.info {
  float: right;
  height: 35px;
  font-size: 20px;
  line-height: 38px;
  color: #444; /*fbfbfb;*/
  font-decoration: none;
  margin-top: 35px;
}

.menubar {
  position: relative;
  float: left;
  Width: 100%; 
/*  border-radius: 10px 10px 0 0; */
  z-index: 999;
background-color: #fff;
/*
  background-image: url(http://www.bdr-knudsen.dk/nsd/nav.png);
  background-repeat: repeat;
*/
}

.showtime {
  position:relative;
  float: left;
  Width: 100%;
margin-bottom: -52px;
}
#content img, .midibox img {max-width:100%;height:auto;}

#content {
  position: relative;
/*  box-shadow: 0px 0px 5px #888888; */
  margin: 50px 0px 0px 0px;
  padding: 20px 20px 40px 20px;
  background-color: #fff; /*rgba(51,51,51,0.2);*/
}

.midibox {
  display: block; 
  Width: 100%; /*223px;*/
  height: 100%; /*248px;*/
  box-shadow: 1px 1px 5px #888888;
  background-color: #fff;
}

.footer-wrap {
  position: relative;
  float: left;
  Width: 100%;
  margin: 0px 0 0px 0;
  border-bottom: 3px solid #33cc22;
  background-color: #27313d;
}

#footer {
  position: relative;
  heigth: 200px;
  color: #aaa; /*#666; /*333;*/
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
  text-decoration: none;
  margin-top: 0px;
  margin-bottom: 30px;
  padding: 20px 20px 20px 20px;
/*
  box-shadow: 0px 0px 5px #888888;
  border-radius: 0 0 10px 10px;
  background-color: #373737;
  background-image: url(http://www.bdr-knudsen.dk/nsd/footerbg.jpg);
  background-repeat: repeat-x;
*/
/*
  background-color:rgba(51,51,51,0.2);
*/
}
#footer a {
  color: #aaa; /*666; /*333;*/
  text-decoration: none;
}
#footer a:hover {
  color: #33cc22;
  text-decoration: underline;
}

#footer img {
  max-Width: 100%;
}

#footer h2 {
  padding-bottom: 18px;
  color: #fff;
/*  background:#333; */
  margin-top: 0px;
  padding: 5px;
  border-bottom: 2px solid #33cc22;

}

.google-maps {
  position: relative;
  padding-bottom: 50%; // This is the aspect ratio
  height: 0;
  overflow: hidden;
}
.google-maps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/************************************* Responsive Styles ***************************/

@media screen and (max-width : 760px){

}

/***************************************************************
                   Specifik Layout - Responsive
***************************************************************/
@media (min-width: 1200px) {
  .wrap {Width: 900px;}
  .logo {Width: 70%;margin-top: 30px;}
/*  .info {height: 35px;font-size: 30px;line-height: 30px;margin-top: 85px;} */
}

@media (min-width: 980px) and (max-width: 1199px) {
  .wrap {width: 900px;}
  .logo {Width: 70%;margin-top: 30px;}
/*  .info {height: 35px;font-size: 30px;line-height: 30px;margin-top: 65px;} */
}
@media (min-width: 768px) {
  .menubar {min-height: 40px; /*52px;/*67px;*/}
}

@media (min-width: 768px) and (max-width: 979px) {
  .wrap {width: 724px;}
  .logo {width: 80%;margin-top: 30px;}
/*  .info {height: 30px;font-size: 25px;line-height:25px;margin-top: 65px;} */
}

@media (max-width: 767px) {
  .wrap {Width: 100%;}
  .menubar {height: 49px;/*67px;*/}
  .logo {margin-top: 30px;}
}

@media (min-width: 481px) and (max-width: 767px) {
/*  .info {height: 30px;font-size: 22px;line-height:30px;margin-top: 65px;} */
}

@media (max-width: 480px) {
  .wrap {min-Width: 245px;}
  .logo {Width: 100%;margin-top: 30px;}
/*  .info {height: 30px;font-size: 25px;line-height:25px;margin-top:15px;} */
  .showtime {display:none;}
}

/***************************************************************
                             Grid
***************************************************************/
/* resets */
*,
*:before,
*:after {
  box-sizing: border-box;
}
.clearfix:after {
	content: "";
  display: table;
  clear: both;
}

/* grid */
.row {
  margin: 0 -10px;
  margin-bottom: 20px;
}
.row:last-child {
  margin-bottom: 0;
}
[class*="col-"] {
  padding: 0 10px;
}

@media (min-width: 980px) {
  .col-4-3 { 
    float: left;
    width: 75%;
    margin-bottom: 10px;
  }
  .col-4-1 {
    float: left;
    width: 25%;
  }
}
@media all and (max-width: 979px) {
  .col-4-3 { 
    float: left;
    width: 100%;
  }
  .col-4-1 {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
  }
}


@media all and ( min-width: 768px ) {

  /* make the columns responsive */
  .col-1-2 {
    float: left;
    width: 50%;
  }
  .col-1-4 {
    float: left;
    width: 25%;
  }
  .col-1-5 {
    float: left;
    width: 20%;
  }

  .col-1-6 {
    float: left;
    width: 16.66666666666667%;
  }

  .col-1-7 {
    float: left;
    width: 14.28571428571429%; /*12.7789028561429%;*/
  }

  .col-1-8 {
    float: left;
    width: 12.5%;
  }

}

@media (max-width: 767px) {

  .col-1-2:nth-child(n+3), .col-1-4:nth-child(n+3), .col-1-5:nth-child(n+3), .col-1-6:nth-child(n+3), .col-1-7:nth-child(n+5), .col-1-8:nth-child(n+5){
  margin-top: 20px;
}

  /* make the columns responsive */

  .col-1-2, .col-1-4, .col-1-5, .col-1-6 {
    float: left;
    width: 50%;
  }

  .col-1-7, .col-1-8 {
    float: left;
    width: 25%;
  }
}

@media (max-width: 480px) {
  .col-1-2 {
    float: left;
    width: 100%;
  }
  .col-1-2:nth-child(2) {
  margin-top: 20px;
  }
}


/* Stylesheet: ResponsiveCSS Modified On 2015-08-21 11:59:34 */
