/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/**/
.align_left{text-align:left !important}
.align_center{text-align:center !important}
.align_right{text-align:right !important}
.align_top{vertical-align:top !important}
.align_middle{vertical-align:middle !important}
.align_bottom{vertical-align:bottom !important}
/**/

@font-face {
    font-family: 'RefrigeratorDeluxe-Regular';
    src:  url('RefrigeratorDeluxe-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

html,body,div{margin:0;padding:0;border:0;vertical-align:baseline;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{width:100%;font-family:'Lato',sans-serif;color:#555459;font-size:1.5rem;font-weight:300;background:white;overflow-x:hidden;-webkit-transition:translate3d(0,0,0)}
.container{width:80%;max-width:1020px;margin:0 auto;position:relative;padding:3rem 0}
.column{width:480px;padding:0 2rem 0 0;float:left}
.column.right{padding:0 0 0 2rem}
.column p:last-child{margin-bottom:0}
p{margin:0 0 2rem 0}
ul{padding-left:2rem;margin:0}
li{margin-bottom:.75rem}
strong{font-weight:500}
hr{max-width:50%;border:0;border-bottom:1px solid white;margin:3rem auto}
a,a:link,a:visited{color:#2a80b9;text-decoration:none}
a:hover,a:active{color:#439fe0;text-decoration:underline}
.section.colored a,.section.colored a:link,.section.colored a:visited,.section.colored a:hover,.section.colored a:active{color:white}
.section.colored{color:white !important}

#landing .header{position:absolute;top:0;left:0;width:100%}
#landing .section.splash .container{padding:1.5rem}
#landing #logo{background-image:url(images/dsl_logo_cube.png);background-repeat:no-repeat;width:200px;height:103px;margin:0 auto;top:2.5rem;left:1rem}

#landing .section.footer{background:white;font-size:1rem}
#landing .section.footer .container{padding:4rem 3rem 4rem}
#landing .section.footer a{font-weight:700;color:#0f7965;margin:0 .5rem}
#landing .section.footer a:hover{color:#4c9689}
#landing .section.footer h2{text-align:center;max-width:800px;margin:0 auto 2rem}
#landing .section.footer p{margin:2rem auto 0;line-height:2rem;font-weight:500}
#landing .footer_logo_wrapper{text-align:center}
#landing .section.footer .section.landing.form{margin:0 auto;display:block;background:#3c4b5b}

#landing .section.splash{background-image:url(images/top_cam.jpg);background-repeat:no-repeat;background-position:center;background-size:cover;text-align:center;min-height:672px;text-shadow:0 1px 2px rgba(0,0,0,0.5);padding-bottom:2rem}
#landing .section.splash h1{font-weight:700;font-size:7rem;color:white;padding:10rem 0 4rem;margin:0}
#landing .section.splash p{font-size:1.5rem;line-height:2.25rem;color:white;font-weight:500;margin:1rem 0}
#landing .section.video.splash{background-image:url(images/top_cam_02.jpg);padding-bottom:60px;min-height:0}

#landing .section.video.splash h1{font-size:4rem;letter-spacing:-2px;text-shadow:0 1px 10px rgba(0,0,0,0.5);padding-bottom:3rem;font-weight:900}
#landing .section.video.splash p{font-size:1.3rem;line-height:1.5rem;text-shadow:0 1px 4px rgba(0,0,0,0.5)}
#landing .section.video.splash #video_thumb{margin:1rem auto 0;cursor:pointer;width:80%;height:80%}
#landing .section.video.splash #video_form{background:rgba(255,255,255,0.1);padding:2rem 0 1rem}
#landing .section.video.splash #video_form p:first-child{max-width:580px;margin:0 auto}
#landing .section.video.splash .form{background:0}

#landing #teaser .section{background-color:#67b9b0;height:440px}
#landing #teaser .container{padding:5rem 0}
#landing #teaser h1{font-size:4rem;font-weight:700;margin:1rem 0;line-height:100%;display:inline-block;border-width:.25rem;}
#landing #teaser h1 i{margin-left:.5rem}
#landing #teaser p{font-weight:500}
#landing #teaser:hover,#landing #teaser:active{text-decoration:none}
#landing #teaser .section.end {height: 20px; color: #67b9b0; }
#landing .description p{font-size:1.5rem;font-weight:200;line-height:2rem;  }
#landing 

.cartodb {padding: 20px 0 20px 0; }
.image.gallery {background-color: #f2f2f2; }
.credits.description {height: 400px; margin-top: 60px; }
.credits {background-color: #fff; }
#dsl {font-family:'RefrigeratorDeluxe-Regular';font-size:1.5rem;background-repeat:no-repeat;width:180px;margin:0 auto;top:2.5rem;left:1rem;color:white;} }
.gallery a {height: 840px; }
.thumbnails{width:95%;margin:0 auto;position:relative;padding:3rem 0}

#map { height:700px; padding:0; margin:0 }

.thumbnail-listing {
        list-style: none;
        overflow: hidden;
        margin: 0
}
.thumbnail-listing.small img {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
        height: inherit;
        width: 85%
}
.thumbnail-listing img {
        display: block;
        margin: 0 auto;
        -webkit-border-radius: 300px;
        -moz-border-radius: 300px;
        -ms-border-radius: 300px;
        -o-border-radius: 300px;
        border-radius: 300px;
        max-width: 80%;
        height: auto
}
.thumbnail-listing li {
        position: relative;
        width: 32.39437%;
        float: left;
        margin-right: 1.40845%;
        display: inline;
        margin-bottom: 1em
}
.thumbnail-listing li:nth-child(3n) {
        float: right;
        margin-right: 0
}
@media (max-width: 700px) {.thumbnail-listing li {
        width: 49.29577%;
        float: left;
        margin-right: 1.40845%;
        display: inline
}
.thumbnail-listing li:nth-child(3n) {
        float: left;
        margin-right: 1.40845%
}
.thumbnail-listing li:nth-child(2n) {
        float: right;
        margin-right: 0
}
.thumbnail-listing li.last {
        display: none
}

.thumbnail-listing li:nth-child(2n) {
        float: left;
        margin-right: 1.40845%
}
.thumbnail-listing li.last {
        display: block
}
}.thumbnail-listing .thumbnail {
        position: relative;
        text-align: center;
        margin: 3.5em 0 0 0
}
@media (max-width: 400px) {.thumbnail-listing .thumbnail {
        margin-top: 2.5em
}
}.thumbnail-listing h4 {
        font-family: 'Lato';
        font-weight: 300;
        line-height: 1em;
        margin: 2em 1em 1.5em 10%;
        position: relative
}
.thumbnail-listing h4.no-subtitle {
        margin-top: 2.5em;
}
.thumbnail-listing h4.no-subtitle {
        margin-top: 1.6em
}
.thumbnail-listing h4 {
        margin-bottom: 0.8em;
        margin-top: 1.3em
}
}.thumbnail-listing small {
        font-size: 14px;
        display: block;
        color: #666;
        margin-top: 0.3em
}
.thumbnail-listing .plus {
        width: 25px;
        height: 25px;
        position: absolute;
        left: -40px;
        bottom: 50%;
        margin-bottom: -12px
}
.thumbnail-listing .plus .x {
        width: 25px;
        top: 12px
}
.thumbnail-listing .plus .y {
        height: 25px;
        left: 12px
}
.thumbnail-listing .plus.small {
        margin-bottom: -7px
}
.thumbnail-listing a {
        text-decoration: none;
        display: block;
        position: relative;
        height: 99%;
        background-color: #fff;
        padding: 1px;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        tap-highlight-color: rgba(0,0,0,0);
        -webkit-transition: background-color 100ms cubic-bezier(0.23,1,0.32,1);
        -moz-transition: background-color 100ms cubic-bezier(0.23,1,0.32,1);
        -o-transition: background-color 100ms cubic-bezier(0.23,1,0.32,1);
        transition: background-color 100ms cubic-bezier(0.23,1,0.32,1)
}
.thumbnail-listing a:hover {
        background-color: #67b9b0;
        color: #fff
}
.thumbnail-listing a:hover h4,.thumbnail-listing a:hover small {
        color: #fff
}
.thumbnail-listing a:hover .plus .x,.thumbnail-listing a:hover .plus .y {
        background-color: #fff
}