
   /* resets and clearfix */
   
   *, *:before, *:after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }
   .cf:before, .cf:after { content: " "; display: table; }
   .cf:after { clear: both; }
   html, div, label, input, button, select { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
   input:focus, select:focus, option, option:focus, option:hover { outline: none; }
   html, body { height: 100%; }
   
   /* fonts */
   
   @font-face 
   {
      font-family: 'Chunk'; font-weight: bold;
      src: url('fonts/Chunkfive-webfont.eot'); 
      src: url('fonts/Chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Chunkfive-webfont.svg') format('svg'), url('fonts/Chunkfive-webfont.woff') format('woff'),
         url('fonts/Chunkfive-webfont.ttf') format('truetype');
   }
   @font-face 
   {
      font-family: 'Font Awesome 5 Pro'; font-style: normal; font-weight: 900;
      src: url('fonts/fa-solid-900.woff2') format('woff2'), url('fonts/fa-solid-900.woff') format('woff'); 
   }
   .fa, .fas { font-family: 'Font Awesome 5 Pro'; font-weight: 900; }
   @font-face 
   {
      font-family: 'Font Awesome 5 Brands'; font-style: normal; font-weight: normal;
      src: url('fonts/fa-brands-400.woff2') format('woff2'), url('fonts/fa-brands-400.woff') format('woff');
   }
   .fab { font-family: 'Font Awesome 5 Brands'; }
   
   /* type */
   
   body, div, table, td, input, select, option, textarea { font: 300 18px/26px 'Open Sans', sans-serif; }
   h1 { font: bold 60px/60px 'Chunk', sans-serif; margin: 0px; color: #51544A; display: block; }
   h1 .scene { color: #92D400; }
   h2 { font: 400 36px/40px 'Open Sans', sans-serif; margin-bottom: 0px; letter-spacing: -1px; }
   h3, h3 select, h3 option { font-weight: 300; font-size: 32px; line-height: 36px; text-transform: lowercase; }
   h4 { font-weight: 400; font-size: 22px; line-height: 26px; }
   h5 { font-weight: 700; font-size: 18px; line-height: 22px; margin: 10px 0px; color: #CC7700; }
   h6 { font-weight: 400; font-size: 19px; line-height: 23px; margin: 10px 0px; }
   .tagline { margin: 0px 0px 15px 0px; color: #000000; font-size: 110%; }
   span.browse
   {
      font-size: 14px; line-height: 14px; font-weight: 600; color: #000000; background-color: #DEDEDE; padding: 1px 6px 2px 6px; 
      text-transform: lowercase; white-space: nowrap;
   }
   .confirm { color: #8BB544; }
   .alert { color: #CC0000; }
   .warm { color: #CC7700; }
   select.warm { font-weight: 700; }
   
   /* branding */
   
   h1, .tagline { display: none; }
   #de-scene { width: 530px; height: auto; display: block; margin-top: 5px; }
   #dda 
   {
      display: block; height: 38.5px; margin-top: 10px;
      background: transparent url('images/dda-2018.png') left center repeat-x; background-size: auto 100%; 
   }
   
   /* images */
   
   img { border: none; }
   img.right { max-width: 50%; height: auto; margin: 0px 0px 30px 40px; float: right; }
   div.img 
   { 
      width: 100%; padding: 66.666% 0 0 0; margin: 0px; 
      background-position: center center; background-size: cover; background-repeat: no-repeat; 
   }
   div.img img { display: none; }
   img.alignright { max-width: 33%; float: right; margin: 0px 0px 30px 30px; }
   div.hero 
   { 
      width: 100%; padding-top: 50%; background-size: cover; background-repeat: no-repeat; background-position: center center; 
      margin: 30px 0px;
   }
   .wd, td.wd { text-transform: uppercase; font-size: 16px; line-height: 16px; font-weight: 600; }
   .dy, td.dy { font-size: 40px; line-height: 20px; color: #8BB544; font-weight: 400; }
   td.dy { padding: 0px 15px; text-align: center; }
   .sb { font-weight: 400; }
   
   /* structure */
   
   body { background-color: #FFFFFF; color: #000000; padding: 0px; margin: 0px; }
   .frame { padding: 0px 60px; position: relative; }
   .table { display: table; width: 100%; }
   .tr { display: table-row; vertical-align: middle; }
   .td { display: table-cell; }
   #hd { padding: 10px 0px 0px 0px; position: relative; }
   .side { width: 50%; margin: 30px 0px 60px 0px; }
   .side1 { float: left; padding-right: 15px; }
   .side2 { float: right; padding-left: 15px; }
   #content h3 { border-top: 1px dotted #000000; margin: 0px 0px 20px 0px; padding: 20px 0px 0px 0px; color: #CC7700; }
   #content h3 select, #content h3 option { color: #CC7700; cursor: pointer; }
   .dda-alt 
   { 
      display: inline-block; background: transparent url('images/dda-alt.png') left center no-repeat; 
      width: 180px; height: 28px; background-size: contain; margin: 10px 10px 5px 0px; 
      vertical-align: middle;
   }
   .dda 
   { 
      display: block; width: 120px; height: 100px; float: right; margin: 10px 0px 20px 30px;
      background: transparent url('images/dda.png') right top no-repeat; background-size: contain;
   }
   #footer 
   { 
      padding: 30px 0px; margin-top: 60px; border-top: 1px dotted #000000; font-size: 15px; line-height: 23px; 
      font-weight: 400; clear: both;
   }
   #footer a { white-space: nowrap; }
   #search i.fas { font-size: 32px; vertical-align: middle; }
   .blockout { padding: 30px; width: 100%; background-color: #EFEFEF; text-align: left; display: block; }
   .box { padding: 20px; margin: 30px 0px; border: 1px solid #AAAAAA; }
   table.addevent { width: 100%; }
   table.addevent > tr > td:last-child { width: 100%; }
   table.addevent input[type=text] { width: 100%; }
   table.addevent input[type=text].short { width: 50%; }
   small { font-size: 15px; line-height: 18px; font-weight: 400; }
   label.error { font-size: 15px; line-height: 18px; color: #CC0000; font-weight: 400; }
   table.bigcalendar { width: 100%; }
   table.bigcalendar th { color: #FFFFFF; background-color: #8BB544; }
   table.bigcalendar td { padding: 5px; background-color: #EFEFEF; width: 14.29%; }
   
   /* links */
   
   a, a:visited, a:link { color: #2193D1; text-decoration: none; }
   a:hover, a:active, #searchbox:hover .label, #searchbox:hover a { color: #CC7700; text-decoration: none; }
   a.moar, body.about #content a { font-weight: 400; }
   a.moar:before { content: '\00BB '; color: #CC7700; font-weight: 600; padding-right: 6px; font-size: 20px; }
   
   a.btn, .btn 
   { 
      font-weight: 700; color: #FFFFFF; background-color: #2193D1; padding: 1px 6px 2px 6px; 
      text-transform: lowercase; white-space: nowrap; border: none; cursor: pointer;
   }
   a.cat 
   { 
      font-size: 14px; line-height: 14px; font-weight: 700; color: #FFFFFF; background-color: #2193D1; padding: 1px 6px 2px 6px; 
      text-transform: lowercase; white-space: nowrap;
   }
   a.cat:hover, a.btn:hover, .btn:hover { color: #FFFFFF; background-color: #CC7700; }
   
   a.announce { display: block; color: #FFFFFF; background-color: #E17276; padding: 5px 5px 5px 15px; margin: 20px 0px 20px 0px; font-weight: 400; }
   a.announce:hover { background-color: #2193D1; }

   /* working mode */
   
   @-webkit-keyframes pulse { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} }
   @keyframes pulse { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} }
   .working 
   { 
      -webkit-animation-name: pulse; animation-name: pulse; 
      -webkit-animation-duration: 2s; animation-duration: 2s;
      -webkit-animation-fill-mode: both; animation-fill-mode: both;
      -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;
   }
   
   
   /* icons and controls */
   
   a.social { font-size: 22px; display: inline-block; margin-right: 5px; vertical-align: middle; }
   a.social.bw { color: #CCCCCC; }
   
   /*
   a.feature 
   { 
      color: #FFFFFF; background-color: #a2c469; padding: 15px 10px 15px 90px;
      background-size: 60px 60px; background-position: 15px center; background-repeat: no-repeat;
      display: block; margin: 0px 0px 30px 0px; font-weight: 400; font-size: 16px; line-height: 21px;
   }
   a.feature b { font-weight: 700; font-size: 18px; color: #000000; }
   a.feature.stealers { background-image: url('images/feature-stealers.png'); }
   a.feature.ddoa-news { background-image: url('images/feature-ddoa-news.png'); background-color: #E17177; }
   a.feature:hover { color: #FFFFFF; background-color: #DB9E4A; }
   */
   
   a.feature 
   { 
      color: #000000; padding: 0px 0px 0px 45%;
      background-size: 100% auto; background-position: center center; background-repeat: no-repeat;
      display: block; margin: 0px 0px 30px 0px; font-weight: 400; font-size: 15px; line-height: 18px;
   }
   a.feature span { display: block; padding: 20px; }
   a.feature b { font-weight: 700; font-size: 18px; color: #FFFFFF; display: block; margin: 0px 0px 6px 0px; }
   a.feature.stealers { background-color: rgba(157,196,106,1); background-image: url('images/box-ss-bg.jpg'); }
   a.feature.ddoa-news { background-color: rgba(225,114,118,1); background-image: url('images/box-news-bg.jpg'); }
   a.feature.stealers span { background-color: rgba(157,196,106,0.9); }
   a.feature.ddoa-news span { background-color: rgba(225,114,118,0.9); }
   @media screen and (min-width: 1300px)
   {
      a.feature { background-position: center 40%; }
      a.feature span { padding: 30px; }
   }
   @media screen and (min-width: 1600px) { a.feature span { padding: 40px; } }
   
   a.tix { font-weight: 400; white-space: nowrap; }
   a.facebook, a.facebook.bw:hover { color: #4C5498; }
   a.twitter, a.twitter.bw:hover { color: #6BA2DE; }
   a.youtube, a.youtube.bw:hover { color: #C13C32; }
   a.flickr, a.flickr.bw:hover { color: #BF23DB; }
   a.podcast, a.podcast.bw:hover { color: #94B84B; }
   a.share, a.share.bw:hover { color: #DB8B45; }
   #footer a.social { font-size: 32px; margin-right: 10px; }
   #footer a.social:hover { opacity: 0.7; }
   
   a.managing { width: 100%; display: inline-block; text-transform: none; padding: 4px 8px; background-color: #186996; }
   a.logout { display: inline-block; text-transform: none; padding: 4px 8px; background-color: #CC0000; white-space: nowrap; }
   .performance .remove { color: #CC0000; cursor: pointer; }
   
   /* menu */
   
   #menu 
   { 
      padding: 0px; margin: 10px 0px 1px 0px; font-size: 20px; line-height: 24px; color: #86C8C4; background-color: #81BFE1;
      text-align: left; display: flex; 
   }
   #menu a 
   { 
      padding: 4px 15px;  font-weight: 600; color: #FFFFFF; background-color: #2093D1; border-right: 1px solid #FFFFFF; 
      flex-grow: 1;
   }
   #menu a .label { font-weight: 300; }
   #menu a:hover { color: #FFFFFF; background-color: #CC7700; }
   #menu a.current { background: #186996 url('images/currentnav.png') center 33px no-repeat; }
   #navzone { margin: 0px 0px 9px 0px; padding: 0px; }
   #navzone > div { display: none; color: #FFFFFF; background-color: #186996; padding: 9px 15px; }
   
   /* search overlay and controls */
   
   .modal
   { 
      display: none; background-color: #112E3D; padding: 30px 0px 30px 0px; color: #FFFFFF; 
      position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 30; text-align: center; overflow: auto;
   }
   .modal .frame { max-width: 1400px; text-align: left; margin: 0px auto; }
   .modal h1 { color: #FFFFFF; }
   .modal .panel h3 { margin: 0px 0px 25px 0px; padding-top: 25px; border-top: 1px dotted #FFFFFF; }
   .modal .panels { margin-right: -30px; }
   .modal .panel 
   {
      padding: 0px 30px 30px 0px; 
      position: relative; width: 33.3333%; display: inline-block; float: left;
   }
   .modal .panel ul, .modal .panel li { list-style-type: none; margin: 0px; padding: 0px; }
   .modal .panel li { margin-bottom: 5px; }
   #termsbox { margin: 30px 30px 30px 0px; }
   #terms, .datepicker { -webkit-appearance: none; -moz-appearance: none; }
   #terms, .modal select, .modal option 
   { 
      border: none; color: #FFFFFF; background-color: #415864; width: 100%; font-size: 24px; line-height: 24px; padding: 3px 6px; 
   }
   .modal .btn
   { 
      border: none; color: #FFFFFF; background-color: #2193D1; font-size: 24px; line-height: 24px; font-weight: 300; 
      padding: 7px 12px; cursor: pointer;
   }
   .modal .btn:hover { color: #FFFFFF; background-color: #CC7700; }
   .modal option:hover, .modal option:focus { color: #000000; background-color: #2193D1; }
   #terms:-webkit-input-placeholder { color: #415864; font-style: italic; }
   #terms:-moz-input-placeholder { color: #415864; font-style: italic; }
   #terms:-ms-input-placeholder { color: #415864; font-style: italic; }
   #terms:-moz-placeholder { color: #415864; font-style: italic; }
   .datepicker { color: #2193D1; border: 0; background-color: transparent; font-weight: 400; width: 100%; max-width: 200px; }
   .datepicker.inline { width: auto; display: inline-block; }
   .datebtn { position: relative; top: 4px; display: inline-block; float: left; margin-right: 8px; cursor: pointer; color: #2193D1; }
   .modal .panel li.daterange  { display: none; padding-top: 13px; line-height: 28px; }
   li.daterange .through { display: block; margin-left: 30px; }
   li.daterange i.fas { vertical-align: bottom; display: inline-block;  cursor: pointer; color: #2193D1; }
   .active { color: #E18300; }
   label, input[type="radio"], .datepicker { cursor: pointer; }
   ul#regions { display: table-cell; white-space: nowrap; padding-right: 30px; }
   #map 
   {
      display: table-cell; width: 100%;
      background: transparent url('/images/region0.png') center center no-repeat; background-size: contain;
   }
   .map-single, .map-nearby { overflow: hidden; width: 100%; height: 300px; margin-bottom: 30px; }
   #gmap_canvas { width: 100%; height: 300px; }
   #gmap_canvas img { max-width: none !important; background: none !important }
   div.gm-style-iw div { font-size: 13px; line-height: 18px; overflow: auto; }
   
   /* search switches */

   .searchtools { text-align: right; cursor: pointer; float: right; white-space: nowrap; cursor: pointer; }
   .searchtools i.fas { font-size: 48px; vertical-align: middle; }
   .searchtools .label { font-size: 20px; line-height: 48px; color: #666666; padding-right: 5px; vertical-align: middle; }

   /* browser panel */

   #browser { display: none; padding: 30px; color: #FFFFFF; /* background-color: #186996; */ }
   #browser h3 { margin: 0px 0px 15px 0px; font-size: 32px; line-height: 36px; }
   #browser ul, #browser li, #navzone ul, #navzone li { list-style-type: none; margin: 0px; padding: 0px; }
   #browser ul { margin-bottom: 25px; }
   #browser li a, #navzone li a, #navzone li form { display: block; border-top: 1px dotted #000000; padding: 6px 0px; }
   #navzone li:first-child a, #navzone li:first-child form { border-top: none; }
   #browser a, #navzone a, #navzone input { color: #b3dae8; font-weight: 300; /* color: #96CFD6; */ }
   #browser a:hover, #navzone a:hover { color: #FFFFFF; }
   
   /* back-to-top control */
   
   a#totop 
   { 
      position: fixed; width: 100px; height: 100px; bottom: 0px; left: 50%; margin-left: -50px; margin-bottom: -55px; 
      z-index: 25; text-align: center; color: #FFFFFF; background-color: #2193D1; border-radius: 50px; display: none;
      font-size: 32px;
   }
   a#totop:hover { color: #FFFFFF; background-color: #CC7700; }
   a#totop i.fas { position: relative; top: 7px; }
   
   /* audio players */
     
   div.playcontrol { cursor: pointer; color: #FFFFFF; font-size: 40px; }
   table.tracks { width: 100%; background-color: #C2D9ED; list-style-type: none; margin: 10px 0px; padding: 0px; }
   table.tracks td { padding: 10px; border-top: 1px dotted #FFFFFF; font-weight: 400; font-size: 16px; line-height: 21px; }
   table.tracks td .date { color: #000000; font-size: 14px; line-height: 22px; text-transform: uppercase; font-weight: 700; }
   table.tracks tr:first-child td { border-top: none; }
      
   /* slider */
   
   div.slider { width: 100%; margin: 30px 0px; }
   a.slide { display: block; width: 100%; padding-top: 50%; background-position: center center; background-size: cover; cursor: pointer; }
   a.slide .caption 
   { 
      position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 80px 30px 40px 30px;
      background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 25%, rgba(0,0,0,0.65) 100%);
      background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 25%, rgba(0,0,0,0.65) 100%);
      background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.3) 25%, rgba(0,0,0,0.65) 100%);
   }
   a.slide h2 
   { 
      color: #FFFFFF; font-size: 40px; line-height: 48px; padding: 0; display: inline-block; margin: 0px 0px 5px 0px; 
      text-shadow: 2px 2px 8px rgba(0,0,0,0.8); font-weight: 300; letter-spacing: 0px;
   }
   a.slide h4 
   { 
      color: #FFFFFF; background-color: #CC7700; padding: 1px 6px; display: inline-block; margin: 10px 0px 0px 0px; 
      text-transform: uppercase; font-weight: 400; letter-spacing: 1px; font-size: 14px; line-height: 18px; max-width: 800px;
   }
   .flickity-page-dots { bottom: 15px; right: 15px; text-align: right; }
   .flickity-page-dots .dot { background-color: #DEDEDE; width: 15px; height: 15px; margin: 0px 0px 0px 12px; }
   .flickity-prev-next-button { display: none; }
   
   /* sidebar calendar grid */

   .calendar 
   { 
      border-top: 1px dotted #000000; margin-bottom: 10px;
      -moz-transition: animation: fadein 0.5s ease; -webkit-transition: animation: fadein 0.5s ease;
      -o-animation: fadein 0.5s ease; animation: fadein 0.5s ease;
   }
   @keyframes fadein { 0% { opacity:0; } 50% { opacity:0; } 100% { opacity:1; } }
   .calendar, .monthgrid { width: 100%; overflow: hidden; }
   .monthgrid { margin: 0px 5px; }
   .monthname { text-align: center; padding: 10px 5px; font-weight: 400; }
   .monthname a { font-size: 28px; padding: 0px 8px; position: relative; top: 1px; }
   #browser table.month { margin: -1px; width: 100%; }
   #browser table.month td { padding: 1px; width: 14.29%; font-weight: 400; text-align: center; }
   #browser table.month th { padding: 1px; width: 14.29%; font-weight: 700; font-size: 15px; text-align: center; color: #FFCC00; }
   #browser table.month td a.day { display: block; color: #FFFFFF; background-color: rgba(0,0,0,0.5); text-align: center; padding: 1px 0px;  }
   #browser table.month td a.day:hover { color: #FFFFFF; background-color: #2193D1; }
   #browser table.month td div.blank { display: block; color: #FFFFFF; background-color: #000000; text-align: center; padding: 1px 0px; opacity: 0.35;  }
   #browser table.month td.today div.blank { background-color: #FFFFFF; color: #CC7700; opacity: 0.35; }
   #browser table.month td.today a.day { color: #FFFFFF; background-color: #CC7700; }
   #browser table.month td.today a.day:hover { color: #FFFFFF; background-color: #2193D1; }
   
   /* table with horizontal dividers */
   
   table.ruled { border-spacing: 0px; }
   table.ruled th, table.ruled td { text-align: left; padding: 2px 15px 2px 5px; }
   table.ruled td { border-bottom: 1px solid #DEDEDE; }
   table.ruled th { color: #FFFFFF; font-weight: bold; background-color: #8BB544; border-bottom: 0px; }
   
   /* tiles */
   
   .tiles { display: flex; flex-wrap: wrap; margin-right: -30px; }
   .tile { padding: 0px 30px 30px 0px; width: 33.3333%; }
   .tile h6 { margin: 0px; padding: 15px 0px 5px 0px; }
   .tile .date { font-size: 16px; line-height: 16px; }
   .tile .date b { font-weight: 400; }
   
   /* advertising */
   
   .ad-728 { text-align: center; padding: 10px 0px 20px 0px; border-bottom: 1px dotted #000000; margin-bottom: 30px; }
   .ad-300 { text-align: left; margin: 10px auto 20px 0px; }
   .ad img { max-width: 100%; height: auto; border: none; }
    
   /* location controls and information only appear when we have user's position */
   
   li.geolocated { display: none; }
   
   
   /* autocomplete and reset */
   
   .autocomplete-match 
   { 
      display: none; color: #000000; background-color: #DEDEDE; white-space: nowrap; position: absolute;
      padding: 0px; margin: 0px; border: 0px; list-style-type: none; 
      box-shadow: 3px 3px 6px rgba(0,0,0,0.3);
   }
   .autocomplete-match li { cursor: pointer; padding: 5px; }
   .autocomplete-match li:hover, .autocomplete-match li.selected { background-color: #999999; color: #FFFFFF; }
   .autocomplete:focus + .autocomplete-match { display: block; }
   .resetter { padding-right: 30px; margin-right: -30px; }
   .clearcontrol { display: inline-block; width: 30px; text-align: center; }
   
   .modal .autocomplete-match { background-color: #6D93A7; color: #FFFFFF; z-index: 40; }
   .modal .autocomplete-match li:hover, .modal .autocomplete-match li.selected { background-color: #E18300; }
   
   
   /* addtocalendar.com */
   
   .addtocalendar var { display: none; }
   .addtocalendar { position: relative; display: inline-block; background: transparent!important; }
   .atcb-link { display: inline-block; outline: none!important; cursor: pointer; } 
   .atcb-link:focus~ul, .atcb-link:active~ul, .atcb-list:hover { visibility:visible; }
   .atcb-list { visibility: hidden; position: absolute; top: 100%; left: 0; width: 170px; z-index: 900; border: 1px solid #999999; padding: 4px; }
   .atcb-list, .atcb-item { list-style: none; margin: 0; background-color: #fff; text-transform: lowercase; }
   .atcb-item { float: none; text-align: left; padding: 1px 4px; }
   .atcb-item-link { text-decoration: none; outline: none; display: block; }
   .atcb-item.hover, .atcb-item:hover { position: relative; z-index: 900; cursor: pointer; text-decoration: none; outline: none; }

   .atc-style-menu-wb .atcb-list { width: 170px; border: 1px solid #999999; }
   .atc-style-menu-wb .atcb-list, .atc-style-menu-wb .atcb-item { background: #fff; color: #000; }
   .atc-style-menu-wb .atcb-item, .atc-style-menu-wb .atcb-item-link { line-height: 1.3em; vertical-align: middle; zoom: 1; } 
   .atc-style-menu-wb .atcb-item-link, .atc-style-menu-wb .atcb-item-link:hover,   
      .atc-style-menu-wb .atcb-item-link:active, .atc-style-menu-wb .atcb-item-link:focus
      { color: #000; text-decoration: none; outline: none; padding: 5px 15px; }
   .atc-style-menu-wb .atcb-item-link:hover, .atc-style-menu-wb .atcb-item-link:active, .atc-style-menu-wb .atcb-item-link:focus { color: #fff; }
   .atc-style-menu-wb .atcb-item.hover, .atc-style-menu-wb .atcb-item:hover { background-color: #CC7700; }
   
   /* sharing controls */
   
   .a2a_svg, .a2a_count, .a2apage_dropdown, .a2a_menu, .a2a_mini { border-radius: 0 !important; }
   a.a2a_i { font-family: 'Open Sans', sans-serif; border-color: #FFFFFF; }
   a.a2a_i:hover { background-color: #FFFFFF !important; border-color: #FFFFFF; }
     
   /* update form */
   
   div#updateform { display: none; }
   
   /* medium-to-wide screens: browse column */
   
   @media screen and (min-width: 1101px)
   {
      h1 { font-size: 72px; line-height: 72px; margin-top: 10px; }
      #content { float: left; width: 75%; padding-right: 60px; }
      #browser { display: block; float: right; width: 25%; }
      #content .frame { padding-right: 0px; }
      #menu, #navzone { display: none; }
      /* #hd { padding-bottom: 10px; border-bottom: 1px dotted #000000; } */
      body { background: #FFFFFF url('images/bg.png') right center repeat-y; background-size: 25% 100%; background-attachment: fixed; }
      .ad-728 { padding-top: 20px; }
      a.slide h2 { font-size: 30px; line-height: 32px; }
   }
   
   /* very wide screens: more tile columns */
   
   @media screen and (min-width: 1400px)
   {
      .tile { width: 25%; }
      body.home .tile { width: 33.333%; }
      a.slide h2 { font-size: 40px; line-height: 48px; }
   }
   
   /* very narrow desktops */
   
   @media screen and (max-width: 1100px)
   {  
      #searchbox .label { display: none; }
   }

   /* small desktops and tablets: mobile nav */

   @media screen and (max-width: 900px)
   {
      #content .frame, .modal .frame { padding: 0px 30px; }
      a.slide .caption { padding-left: 30px; padding-right: 30px; }
      h1 { font-size: 48px; line-height: 48px; margin-top: 10px; }
      .modal .panel { width: 100%; display: block; }
      #map { background-position: left center; }
      #searchbox .label { display: none; }
      a.slide h2 { font-size: 30px; line-height: 32px; }
      .tagline { font-size: 16px; color: #666666; }
      
      h1, .tagline { display: block; }
      #de-scene, #dda { display: none; }
      
      a.announce { margin: 0px 0px 10px 0px; font-size: 90%; }
   }
   
   /* bring tiles down to 2 columns */
   
   @media screen and (max-width: 800px)
   {
      .tile { width: 50%; }
      body.home .tile { width: 33.333%; }

   }
   
   /* header adjustments */

   @media screen and (max-width: 700px)
   {
      h1 { font-size: 36px; line-height: 36px; margin-top: 0px; }
      .tagline { display: none; }
      .searchtools .label { line-height: 30px; }
      .dda-alt, #hd .social { display: none; }
      #hd { padding-top: 20px; }
      img.right { max-width: 33%; }
      
   }
   
   /* phone */
   
   @media screen and (max-width: 600px)
   {
      #content .frame, .modal .frame { padding: 0px 15px; }
      h1 { font-size: 33px; line-height: 33px; }
      #hd { padding-top: 18px; }
      .flickity-page-dots { display: none; }
      a.slide .caption { padding: 30px; }
      a.slide h2 { font-size: 24px; line-height: 28px; font-weight: 400; }
      a.slide h4 { letter-spacing: 0px; }
      #menu { margin-bottom: 0px; align-content: stretch; }
      #menu .label { display: none; }
      #menu a { text-align: center; white-space: nowrap; padding: 4px; font-size: 18px; }
      #menu a:last-child { border: none; }
      .modal h1 .delaware, .modal h1 .scene { display: none; }
      .side, .side1, .side2 { float: none; width: 100%; margin: 0px 0px 60px 0px; padding: 0px; }
      a.slide .caption { padding: 15px; }
      a.slide .caption h2 { font-size: 22px; line-height: 24px; }
      a.slide h4 {   }    
      .dda { float: none; margin: 0px; height: 90px; }
      #menubar { position: fixed; top: 0px; left: 0px; right: 0px; background-color: #FFFFFF; z-index: 20; }
      #content { padding-top: 110px; }
      .tiles { margin-right: 0; padding-right: 0; }
      .tile, body.home .tile { width: 100%; margin-right: 0; padding-right: 0; } 
      #navzone { margin: 1px 0px 10px 0px; }
      div.slider { margin-top: 0px; }
      body.home div.img { padding-top: 33%; }
      img.right { float: none; max-width: 100%; display: block; margin: 40px 0px 40px 0px; }

   }
   