html,

body {

  height: 100%;

}

body {padding-top:8px;border-top:8px solid  @blue;}

#wrap {

  min-height: 100%;

  height: auto;

  margin: 0 auto -60px;

  padding: 0 0 60px;

}

/* Typo

------------------------------------ */

@font-face {

    font-family: 'gandhi_serifbold';

    src: url('../fonts/gandhiserif-bold-webfont.eot');

    src: url('../fonts/gandhiserif-bold-webfont.eot?#iefix') format('embedded-opentype'),

         url('../fonts/gandhiserif-bold-webfont.woff') format('woff'),

         url('../fonts/gandhiserif-bold-webfont.ttf') format('truetype'),

         url('../fonts/gandhiserif-bold-webfont.svg#gandhi_serifbold') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'gandhi_serifregular';

    src: url('../fonts/gandhiserif-regular-webfont.eot');

    src: url('../fonts/gandhiserif-regular-webfont.eot?#iefix') format('embedded-opentype'),

         url('../fonts/gandhiserif-regular-webfont.woff') format('woff'),

         url('../fonts/gandhiserif-regular-webfont.ttf') format('truetype'),

         url('../fonts/gandhiserif-regular-webfont.svg#gandhi_serifregular') format('svg');

    font-weight: normal;

    font-style: normal;

}

/* Utilities

------------------------------------ */

#wrap > .container {

  /*padding: 60px 15px 0;*/

}

img {

     vertical-align: middle;

     border: 0;

     page-break-inside: avoid;

     max-width: 100% !important;

     }

/* Navigation

------------------------------------ */

.navbar-nav > li:hover {

//border-top:8px solid @yellow;position: relative;top: -17px;

}

.navbar-nav > li > a {

 // margin-top: 48px;

  font-size: 18px;

}

.nav > li > a:hover, 

.nav > li > a:focus {

//margin-top: 54px;

}

.navbar {

margin-bottom: 0px;

border-bottom:3px solid #f0f0f0;

}

.navbar-nav {margin-top:24px;}

a.link-yellow {color:@yellow !important;text-decoration:underline;}

a.link-yellow:hover {color:@gray-dark !important;text-decoration:none;}

.navbar-default .navbar-nav > .active > a, 

.navbar-default .navbar-nav > .active > a:hover, 

.navbar-default .navbar-nav > .active > a:focus {

border-bottom:1px dotted @blue-darker;

color:@blue;

}

/* Module

------------------------------------ */

.module-gallery {

    background: url('../images/python_blender.jpg') no-repeat 0px -200px;

    background-size: 2000px 884px;

}

.module-gallery .module-content {

    height: 300px;

    position: relative;

}

.module-cite h1 {color:@blue;}

.col-yellow {background:@yellow-light;}

li.module-language a:first-child {border-right:1px solid @blue;}

.module-course {background-color: #f5f5f5;}

.module-info {border-bottom:1px solid @yellow;padding-bottom:20px;}

.module-cite {padding-bottom:20px;}

.cite {position:relative;}

.cite-left {top: 6px;}

.cite-right {top:48px;}

.cite-right svg {margin-top: -48px;}

.module-impression {background:@blue;}

.module-impression a {color:white;}

.module-thumbnail,

.module-impression h3 {margin-top:20px;}

.module-footer .headline {padding:20px 0;}

/* Video

------------------------------------ */ 

.flex-video {

position: relative;

padding-top: 25px;

padding-bottom: 67.5%;

height: 0;

margin-bottom: 16px;

overflow: hidden;

}

.flex-video.widescreen { padding-bottom: 57.25%; }

.flex-video.vimeo { padding-top: 0; }

.flex-video iframe,

.flex-video object,

.flex-video embed {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

}

/* Footer

------------------------------------ */ 

#footer {

  height: 60px;

}

.sponsor{

  height: 50px;

}

#footer > .container {

  padding-left: 15px;

  padding-right: 15px;

}

.carousel-control.left {

  background-image: none;

  filter: 0;

}

.carousel-control.right {

  background-image:none;

  filter: 0;

}

.module-imprint {border-top:1px solid #f5f5f5; padding:20px 0;}

/* media queries

------------------------------------ */ 

@media (max-width: 767px) {

.module-gallery .module-content {

    height: 405px;

    }

.module-impression svg {display:none;}

}

@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {

.flex-video { padding-top: 0; }

}