* { margin: 0; padding: 0; outline: none; box-sizing: border-box; }
img {border:0;}
html {height:100%;}
body {height: auto !important; height: 100%; min-height: 100%; position: relative; background:#e9e9e9; font:12px Arial, Helvetica, sans-serif; color:#3b4a56;}
.container { min-width:320px; position:relative;}
a, .spotted-Crake {transition:all 0.15s ease-in-out;}

.logo {text-align:center; padding:10px 0 1px 0;}
.logo img {display:inline-block !important}
.logo>a {border:0 !important;}
h1 {font-size:16px; margin-top:6px;}
.treecreeper {padding:4px 0 0 0; margin:0 auto; display:none;}
.grebe {position:relative; margin-bottom:5px; width:302px;}
.grebe h2 {position: absolute; color: #FFF; padding: 2px 8px 3px 8px; line-height: 25px; font-size: 19px; background: rgba(0,0,0,.4); z-index: 2; font-weight:400;}
.grebe>a, .spotted-Crake {border:1px solid #808080; display:block;}
.grebe>a:hover, .spotted-Crake:hover {border:1px dashed #3b4a56;}
.grebe>a img {display:block;}
footer {font-size:14px; padding:30px 10px; text-align:center;}
.spotted-Crake>iframe {display:block; -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; -ms-transform-origin: 50% 0; -o-transform-origion: 50% 0; transform-origin: 0 0; }
.spotted-Crake img {display:block; width:300px; height:250px;}

.scrollToTop {position:fixed; right:25px; bottom:25px; z-index:5; display:none; cursor:pointer;}

/*Responsive*/
@media (max-width: 629px) {
.grebe { max-width:460px; width:auto; margin:0 auto 5px auto;}
.treecreeper {padding:5px;}
.grebe>a img {width:100%; height:auto;}
.spotted-Crake>div { position:absolute; left:1px; top:1px; right:1px; bottom:1px; width: auto !important; height: auto !important; display:block;}
.spotted-Crake>div img {position:absolute; left:0; top:0; right:0; bottom:0; width:100%; height:100%;}
.logo>a img { max-width:100%; height:auto; width:auto;}
}