/* typo */
/*@import url(https://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic);*/
/*@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed);*/

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

}

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

}

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

}

body,
p,
ul {
     color: #2d2d2d;
     font-family: 'robotoregular', sans-serif;


}

ul {
     list-style-image: url("../img/check.png");
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea {
     font-family: 'Lato', sans-serif;
     font-size: 15px;
     font-weight: 300;
     height: 33px;
     background-color: #f5f5f5;
     border: 0px none;
}

a {
     color: #2192f1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
     margin: 0;


     font-size: 18px;
     font-weight: 300;
     margin-bottom: 5px;
}

h2 {
     font-siZe: 2.2em;
     letter-spacing: 1px;
}

h3 {
     font-siZe: 2.0em;
     letter-spacing: 1px;
}

h4 {
     font-siZe: 1.8em;
     letter-spacing: 1px;
}

h5 {
     font-siZe: 1.7em;
}

h6 {
     font-siZe: 1.6em;
}

/* styling */
button,
.button {
     background-color: #4aaddc;
     border: 0px;
     color: #2462a9;
     cursor: pointer;
     display: inline-block;

     font-size: 1rem;
     font-weight: normal;
     line-height: normal;
     margin: 0 0 1.25rem;
     position: relative;
     text-align: center;
     text-decoration: none;
     transition: background-color 300ms ease-out 0s;
}

.actionButton {
     font-family: 'robotolight';
     background-image: url("../img/actionButton.jpg");
     background-repeat: no-repeat;
     color: white;
     display: inline-block;
     font-size: 1.35em;
     padding-bottom: 8px;
     padding-top: 7px;
     text-align: center;
     width: 235px;
}

.nopadding {
     padding: 0px;
}



#topbutton {
     margin-bottom: 60px;
     text-align: center;
}

#topbutton aside {
     background-color: #eeeeee;
     float: right;
     font-size: 20px;
     letter-spacing: 3px;
     padding: 7px;
     width: 100%;
}

#dialog {
     display: none;
     display: none;
     position: absolute;
     background-color: #dddddd;
     width: 50%;
     z-index: 99;
     left: 20%;
     font-size: 0.8em;
     padding: 15px;
}

/* header */


#header {
     height: auto;

}

/* logo */
#logo {
     margin-top: -15px;
}

#logo img {
     max-width: 220px;
}

/*  nav   */
.navbar-default {
     color: #97261C;
     background-color: transparent;
     z-index: 5;

}

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

.navbar-default,
.navbar-default ul,
.navbar-default ul ul {

     border: 0px none;
     padding: 0px;
}

.navbar-default ul {
     width: 100%;
}

.navbar-nav li {
     padding-right: 0px;
}

.navbar-nav li:nth-child(n+7) {
     display: none;
}

.navbar-default .navbar-nav>li {
     background-color: #eeeeee;
     margin-right: 0.66%;
     padding-left: 0px;
     text-align: center;
     white-space: nowrap;
     width: 16%;
}

.navbar-default .navbar-nav li.menu-last {
     margin-right: 0px;

}

.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav ul>li>a,
.navbar-default .navbar-nav ul ul>li>a {
     color: #a5220e;
     font-family: 'roboto_condensedregular', sans-serif;
     font-size: 20px;
     letter-spacing: -1px;
     padding-bottom: 55px;
     padding-top: 55px;
     text-transform: uppercase;
}

.navbar-default .navbar-nav>li>a:hover {
     color: white;
}

#bs-example-navbar-collapse-1 .navbar-nav>li a.active {
     border-bottom: 0px solid #ffffff;
}

#bs-example-navbar-collapse-1 .navbar-nav ul>li a:hover {
     /* background-color: #05aa2; */
}

#bs-example-navbar-collapse-1 .navbar-nav ul>li a.active {
     background-color: #e4e4e4;
     border-bottom: 0px solid #4aaddc;
}

.nav>li>a {
     padding: 0;
}

ul.nav li.dropdown:hover>ul.dropdown-menu {
     display: block;
}

ul.nav ul ul {
     display: none;
     left: 100%;
     position: absolute;
     top: 0px;
}

#bs-nav-mobile .nav {
     display: none;
     visibility: hidden ! important;
     z-index: 99;
}

#bs-nav-mobile .nav,
#bs-nav-mobile .nav ul {
     list-style-type: none;
}

#bs-nav-mobile .nav ul {
     padding-left: 30px;
     z-index: 99;
}


#videocontainer {
     left: 0;
     right: 0;
     margin-left: auto;
     margin-right: auto;
     margin-top: 68px;
     position: absolute;
     z-index: -2;
     width: 96%;
     overflow: hidden;
     /*max-width: 1600px;*/
}

.responsive-video {
     height: auto;
     width: 100%;
     z-index: -3;
     background-color: #000;
}

#videobanner {
     background-color: rgba(0, 0, 0, 0.4);
     color: white;
     font-family: robotolight;
     left: 0px;
     margin-left: auto;
     margin-right: auto;
     margin-top: 27vw;
     max-height: 100%;
     max-width: 1140px;
     overflow: hidden;
     padding-top: 15px;
     position: absolute;
     right: 0px;
     width: 96%;
     z-index: 1;
     text-align: center;
}

#videobanner #moviebannertitle {
     font-size: 2em;
}

#videobanner #moviebannertext {
     font-size: 1.4em;
     max-width: 50%;
     display: block;
     margin-left: auto;
     margin-right: auto;
}

#videobanner #moviebannerbutton {
     background-image: url("../img/actionButtonWhite.jpg");
     background-repeat: no-repeat;
     background-color: transparent;
     color: black;
     display: inline-block;
     padding-bottom: 9px;
     padding-top: 5px;
     text-align: center;
     width: 221px;
}

/* title balk */
.title {
     background-color: #A5220E;
     padding: 10px 0px 10px 20px;
     margin-top: 30px;
}

.title h1 {
     color: white;
     text-transform: uppercase;
}

/* content */



#content {
     background-color: white;
     margin-top: 31vw;
     padding: 30px auto auto;
     z-index: 99;
}

#content a {
     text-decoration: underline;
}

#content .thumb {
     margin: 10px;
}

#content .row {}

/* footer */
#footer {

     background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 80px, rgba(240, 240, 240, 1) 0%);
     color: #b8b8b8;
     padding-top: 20px;
     font-size: 1.2em;
}

#footer a {
     color: #b8b8b8;
}

#footer ul,
#footer li {
     padding: 0;
     maring: 0;
     list-style-image: none;
     list-style-type: none;
}

#footer #footertext {
     background-image: url("../img/logo-trap-flat.png");
     background-repeat: no-repeat;
     padding-top: 80px;
     background-position: 0px 27px;
}

/* credits */
#credits {
     color: #999;
}

#credits a {
     color: #E7897E;
}





@media (max-width: 1212px) {
     .navbar-default .navbar-nav>li {
          margin-right: 5px;
          width: 125px;
     }

     .navbar-default .navbar-nav>li a {
          padding-left: 2px;
          padding-right: 2px;
          font-size: 18px;
     }

     .nav>li>a {
          padding: 0;
     }

     #logo img {
          max-width: 100%;
          margin-top: 35px;
     }

     .GrijsVlak {
          font-size: 0.8em;
          background-color: #eeeeee;
          margin-bottom: 40px;
     }
}

@media (max-width: 1004px) {
     .navbar-default .navbar-nav>li {
          margin-right: 5px;
          width: 115px;
     }

     .navbar-default .navbar-nav>li a {
          padding-left: 2px;
          padding-right: 2px;
          font-size: 17px;
     }

     #topbutton {
          margin-bottom: 10px;
     }

     #videocontainer {
          margin-top: 220px;
     }

     #videobanner {
          margin-top: 35vw;
          font-size: 12px;
     }

     #content {
          margin-top: 28vw;
     }

     #logo img {
          max-width: 220px;
          margin-top: 20px;
     }
}

@media (max-width: 980px) {
     /*#videocontainer { margin-top: 268px; }
  #videobanner {   margin-top: 35vw; font-size: 12px; }*/
}

@media (max-width: 778px) {
     #videocontainer {
          margin-top: 200px;
     }

     #videobanner {
          margin-top: 42vw;
     }

     .GrijsVlak {
          margin-bottom: 20px;
     }
}

@media (max-width: 765px) {
     #bs-example-navbar-collapse-1 {
          display: none;
     }

     #bs-nav-mobile .nav {
          visibility: visible ! important;
          display: block;
          z-index: 99;
     }

     .navbar-default .navbar-nav>li {
          z-index: 9999;
          margin-right: 5px;
          width: 100%;
          padding: 0px;
     }

     .navbar-default .navbar-nav>li a {
          padding: 10px
     }

     ul.nav li.dropdown:hover>ul.dropdown-menu {
          display: none;
     }

     .GrijsVlak {
          font-size: 1em;
     }
}

@media (max-width: 550px) {

     #videocontainer {
          margin-top: 220px;
     }

     #videobanner {
          margin-top: 230px;
     }

     #content {
          margin-top: 50vw;
     }
}

@media (max-width: 450px) {
     #videocontainer {}

     #videobanner {
          margin-top: 210px
     }

     #content {
          margin-top: 60vw;
     }
}