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

html { font-size:100%;}
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ border:none; }
a { color:#ffffff; text-decoration: none;}
a:hover { color:#ffffff; text-decoration: underline;}

body { padding:0; margin:0; background:#ffffff; font-family: 'HSGrotesk-Light-Normal', sans-serif; font-size:1rem; color:#202020;}
header { padding:0; margin:0; width:100%; background:#202020; float:left; height:100px; color:#ffffff; text-transform:uppercase;}
.logo { width:100px; height:100px; float:left;}
.headline { width: calc(100% - 100px); float:left; padding-left:2rem; padding-top:2rem;}
.headline h1 { padding:0; margin:0; font-size:1rem; font-weight:normal; line-height:1.8}
.headline h1 em { font-style:normal; color:#ed1c24; font-weight:bold;}
.headline h1 span { background:#ed1c24; -webkit-border-radius:5px; border-radius:5px; padding:.2rem .5rem;}

footer { margin:0; width:100%; float:left; text-transform:uppercase; font-size:.875rem; padding:1rem 1%;  color:#ed1c24;}
footer img { float:right;}
footer span { padding-right:3rem;}

.main-content { padding:0; margin:0; width:100%; height:calc(92vh - 100px); float:left; overflow:hidden;}
.col1 { width:30%; float:left;}
.col2 { width:35%; float:left;}
.col3 { width:35%; float:left;}

.item { width:100%; float:left; position: relative;}
.item img { width:100%; display:block;}
.item span { position:absolute; background:#ed1c24; right:0; top:1rem; padding:.5rem 1rem; -webkit-border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px; text-transform: uppercase; font-size:.875rem; white-space: nowrap;}


.remodal, [data-remodal-id] { display: none;}
.remodal-overlay { position: fixed; z-index: 9999; top: -5000px; right: -5000px; bottom: -5000px; left: -5000px; display: none;}
.remodal-wrapper { position: fixed; z-index: 10000; top: 0; right: 0; bottom: 0; left: 0; display: none; overflow: auto; text-align: center; -webkit-overflow-scrolling: touch;}
.remodal-wrapper:after {display: inline-block; height: 100%; margin-left: -0.05em; content: "";}
.remodal-overlay, .remodal-wrapper { -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.remodal { position: relative;  outline: none; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%;}
.remodal-is-initialized { display: inline-block;}

/*
 *  Remodal - v1.0.3
 *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
 *  http://vodkabears.github.io/remodal/
 *
 *  Made by Ilya Makarov
 *  Under MIT License
 */

/* ==========================================================================
   Remodal's default mobile first theme
   ========================================================================== */

/* Default theme styles for the background */
.remodal-bg.remodal-is-opening, .remodal-bg.remodal-is-opened { -webkit-filter: blur(3px); filter: blur(3px);}
.remodal-overlay { background: rgba(0,0,0, 0.5);}

.remodal-overlay.remodal-is-opening, .remodal-overlay.remodal-is-closing {  -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards;}
.remodal-overlay.remodal-is-opening { -webkit-animation: remodal-overlay-opening-keyframes 0.3s; animation: remodal-overlay-opening-keyframes 0.3s;}
.remodal-overlay.remodal-is-closing { -webkit-animation: remodal-overlay-closing-keyframes 0.3s; animation: remodal-overlay-closing-keyframes 0.3s;}
.remodal-wrapper { padding: 10px 10px 0;}
.remodal { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin-bottom: 10px; padding: 35px; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); color: #202020; background: #fff;}
.remodal.remodal-is-opening, .remodal.remodal-is-closing { -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards;}
.remodal.remodal-is-opening { -webkit-animation: remodal-opening-keyframes 0.3s; animation: remodal-opening-keyframes 0.3s;}
.remodal.remodal-is-closing { -webkit-animation: remodal-closing-keyframes 0.3s; animation: remodal-closing-keyframes 0.3s;}
.remodal, .remodal-wrapper:after { vertical-align: middle;}

.remodal-close { position: absolute; top: 0; right: 0; display: block; overflow: visible; width: 35px; height: 35px; margin: 0; padding: 0; cursor: pointer; -webkit-transition: color 0.2s;transition: color 0.2s; text-decoration: none; color: #ffffff; background:#ed1c24; border: 0; outline: 0;}
.remodal-close:before { font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important; font-size: 32px; line-height: 35px;  position: absolute; top: 0; left: 0; display: block; width: 35px; content: "\00d7"; text-align: center;}

/* Keyframes
   ========================================================================== */

@-webkit-keyframes remodal-opening-keyframes {
  from {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);

    opacity: 0;
  }
  to {
    -webkit-transform: none;
    transform: none;

    opacity: 1;
  }
}

@keyframes remodal-opening-keyframes {
  from {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);

    opacity: 0;
  }
  to {
    -webkit-transform: none;
    transform: none;

    opacity: 1;
  }
}

@-webkit-keyframes remodal-closing-keyframes {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);

    opacity: 1;
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);

    opacity: 0;
  }
}

@keyframes remodal-closing-keyframes {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);

    opacity: 1;
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);

    opacity: 0;
  }
}

@-webkit-keyframes remodal-overlay-opening-keyframes {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes remodal-overlay-opening-keyframes {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes remodal-overlay-closing-keyframes {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes remodal-overlay-closing-keyframes {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/* Media queries
   ========================================================================== */

@media only screen and (min-width: 641px) {
  .remodal {
     width:90%;
  }
}

/* IE8
   ========================================================================== */

.lt-ie9 .remodal-overlay {
 
}

.lt-ie9 .remodal {
  width: 90%;
}

.modal-content { text-align:left !important;}
.modal-content h2 { padding:0 0 2rem; margin:0; font-size:1.5rem; font-weight:normal; text-transform:uppercase;}
.modal-content .image { width:50%; float:left; padding-right:3%;}
.modal-content .image img { width:100%;}
.modal-content .info { width:50%; float:right;}
.modal-content .info .table-container { width:100%; overflow-x: auto;}
.modal-content .info .table-container table { width:100%; border-collapse:collapse; padding:0; margin:0; font-size:.75rem; text-transform:uppercase; border-top:1px solid #cccccc;}
.modal-content .info .table-container table thead tr th { padding:.5rem 2%; font-size:.75rem; font-weight:normal; vertical-align:top; border-bottom:1px solid #cccccc; background:#f2f2f2}
.modal-content .info .table-container table tbody tr td { padding:.5rem 2%;  vertical-align:top; border-bottom:1px solid #cccccc;}
.modal-content .info .table-container table tbody tr td.red { color:#ed1c24;}
.modal-content .info .table-container table tbody tr td.red strong { font-weight:normal; font-size:1.25rem;}


@media only screen and (max-width: 1280px) {
.main-content { height:calc(94vh - 100px); }
}

@media only screen and (max-width: 1280px) {
.main-content { height:calc(69vh - 100px); }
.col1 { width:32%; float:left;}
.col2 { width:34%; float:left;}
.col3 { width:34%; float:left;}
}


@media only screen and (max-width: 1280px) and (max-height: 800px) {
.main-content { height:calc(92vh - 100px); }
.col1 { width:33%; float:left;}
.col1 .item { width:100%;}
.col2 { width:33.5%; float:left;}
.col3 { width:33.5%; float:left;}
}


@media only screen and (max-width: 1152px) {
.main-content { height:100%; }
.col1 { width:100%; }
.col1 .item { width:50%;}
.col2, .col3 { width:50%; }
.modal-content .image { display:none;}
.modal-content .image img { width: auto}
.modal-content .info { width:100%; float:left;}
}

@media only screen and (max-width: 800px) {
.headline br { display:none !important}
footer a, footer a:hover { color:#202020;}
}

@media only screen and (max-width: 640px) {
.col1 .item, .col2, .col3 { width:100%; }
}

@media only screen and (max-width: 480px) {
.headline { padding-top:1rem; padding-left:1rem;}
.headline h1 { line-height:1.3; font-size:.875rem;}
.headline br { display:block !important}
.modal-content .info .table-container table { width:200%;}
}

@media only screen and (max-width: 320px) {
header { height:auto !important; padding-bottom:1rem}
.logo { width:100%; text-align:center;}
.headline { width:100%; text-align:center;}
.headline h1 { line-height:2;}
}