/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary { display:block; }  audio,canvas,video { display:inline-block; }  audio:not([controls]) { display:none; height:0; }  [hidden] { display:none; }  html { font-family:sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }  a:focus { outline:thin dotted; }  a:active,a:hover { outline:0; }  h1 { font-size:2em; }  abbr[title] { border-bottom:1px dotted; }  b,strong { font-weight:700; }  dfn { font-style:italic; }  mark { background:#ff0; color:#000; }  code,kbd,pre,samp { font-family:monospace, serif; font-size:1em; }  pre { white-space:pre-wrap; word-wrap:break-word; }  q { quotes:\201C \201D \2018 \2019; }  small { font-size:80%; }  sub,sup { font-size:75%; line-height:0; position:relative; vertical-align:baseline; }  sup { top:-.5em; }  sub { bottom:-.25em; }  img { border:0; }  svg:not(:root) { overflow:hidden; }  fieldset { border:1px solid silver; margin:0 2px; padding:.35em .625em .75em; }  button,input,select,textarea { font-family:inherit; font-size:100%; margin:0; }  button,input { line-height:normal; }  button,html input[type=button],/* 1 */ input[type=reset],input[type=submit] { -webkit-appearance:button; cursor:pointer; }  button[disabled],input[disabled] { cursor:default; }  input[type=checkbox],input[type=radio] { box-sizing:border-box; padding:0; }  input[type=search] { -webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; }  input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration { -webkit-appearance:none; }  textarea { overflow:auto; vertical-align:top; }  table { border-collapse:collapse; border-spacing:0; }  body,figure { margin:0; }  legend,button::-moz-focus-inner,input::-moz-focus-inner { border:0; padding:0; }

/* Structure */
body { margin: 0; font-family: DINWeb, sans-serif; overflow-x: scroll; }

/* iFrames */
.frame { float: left; }
iframe { margin: 0 20px 20px 0; border: 1px solid #999; }
.wrapper { margin: 0 20px; }

/* ==========================================================================
   WEB FONTS
   ========================================================================== */

/*  DIN Font is NOT open source. Licensed for Draftfcb use only. 
    To obtain a license, purchase from fontfont.com */

/* first for IE 4–8 */
  @font-face {
    font-family: DINWeb-Light;
    src: url("fonts/DINWeb-Light.eot");
  }

  /* then for WOFF-capable browsers */
  @font-face {
    font-family: DINWeb-Light;
    src: url("fonts/DINWeb-Light.woff") format("woff");
  }

/* first for IE 4–8 */
@font-face {
  font-family: DINWeb;
  src: url("fonts/DINWeb.eot");
}

/* then for WOFF-capable browsers */
@font-face {
  font-family: DINWeb;
  src: url("fonts/DINWeb.woff") format("woff");
}

/* first for IE 4–8 */
@font-face {
  font-family: DINWeb-Bold;
  src: url("fonts/DINWeb-Bold.eot");
}

/* then for WOFF-capable browsers */
@font-face {
  font-family: DINWeb-Bold;
  src: url("fonts/DINWeb-Bold.woff") format("woff");
}

header {
    background: #111;
    padding: 10px; 
}
.author { color: #999; font-style: italic; margin-left: 5px; }
.author a,.author a:visited { color: #aaa; }
h1, h2 { line-height: 1; padding:0; margin: 0; font-weight: normal; }
header h1, header h2 {
  display: inline;
  color: #fff;
  padding: 10px 0 0 20px;
  font-size: 18px;
  display: inline-block;
  vertical-align: top;
}
header h1 { text-transform: uppercase; font-family: DINWeb; }
header h2 { font-family: DINWeb-Light; font-size: 1em; }
label { font-size: 14px; }
a, a:visited, a:active { color: #999;}
a:hover { color: #666;}

.controls { margin: 0 0 20px; padding: 8px 0 5px 18px; background: #eee; }
fieldset { margin-top: -8px; border: none; padding: 0; display: inline; line-height: 2.4; margin-left: 100px; }
#form-customize { 
  margin: 20px 20vw; 
  width: 700px; 
  -webkit-transition-duration:0.6s;
  -moz-transition-duration:0.6s;
  -ms-transition-duration:0.6s;
  -o-transition-duration:0.6s;
  transition-duration:0.6s; 
}
#form-customize.collapsed { height: 0; overflow: hidden; margin: 0 0 0 400px; opacity: 0; }
#form-customize fieldset { display: block; margin-bottom: 10px; }
#form-customize-fields { margin-bottom: 20px; }
#customize-btn-finish { display: block; width: 60px; margin: 0 auto; text-align: center; text-transform: uppercase; font-size: 14px; }
.input-width,.input-height { width: 50px; text-align: center;}
.share-field { font-size: .8em; }
#share-field-input { width: 200px; cursor: pointer;}
#view-btn { left: -5px; text-transform: uppercase; border-top-left-radius: 0; border-bottom-left-radius: 0; }
#view-random-btn {  margin: 0 5px; }
#curr-site { margin: 20px; font-style: italic; }
#frames-wrapper { margin-top: 10px; }
.error { border: solid 1px red; }

.btn, .btn:visited {
    background-color:#efefef;
    border: solid 1px #666;
    color:#666;
    font-size:13px;
    font-weight:normal;
    padding: 6px 20px 4px;
    text-decoration:none;
    text-shadow:none;
    position: relative;
    font-family: DINWeb;
    border-radius: 12px;
    text-transform: uppercase;
}
.btn:hover {
    color: #fff;
    background-color: #5a5b1d;
    border: solid 1px #5a5b1d;
}
.btn:active {
  opacity: .8;
}
.btn-active {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ddd), color-stop(1, #bbb) );
    background:-moz-linear-gradient( center top, #ddd 5%, #bbb 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ddd', endColorstr='#bbb');
    background-color:#ccc;
    border: solid 2px #aaa;
    color: #eee;
    text-shadow:  0 0 2px #444;
}
.btn.btn-delete {
  padding: 0 10px;
  margin: 0 10px;
  color: white;
  font-size: 18px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #DA4F49;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#EE5F5B), to(#BD362F));
  background-image: -webkit-linear-gradient(top, #EE5F5B, #BD362F);
  background-image: -o-linear-gradient(top, #EE5F5B, #BD362F);
  background-image: linear-gradient(to bottom, #EE5F5B, #BD362F);
  background-image: -moz-linear-gradient(top, #EE5F5B, #BD362F);
  background-repeat: repeat-x;
  border-color: #BD362F #BD362F #802420;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  filter: progid:dximagetransform.microsoft.gradient(enabled=false);
  height: 18px;
  width: 10px;
  display: inline-block;
  padding: 0 4px;
  line-height: 1;
}
.social-btn { 
  padding: 0 3px;
  position: relative;
  top: 6px; 
}
#hide-header {
	margin-left: 30px;
}