body{margin:0;padding:0;font-family:sans-serif}@font-face{font-family:Sonder;src:url(/the-sea/static/media/SonderSans-Black.d406ab66.otf)}@font-face{font-family:Octanis;src:url(/the-sea/static/media/Octanis-SansRoundedItalic.37d2f9fb.ttf)}@media only screen and (max-width:992px) and (min-width:768px){header{padding-bottom:20px}}body{opacity:1;background-color:#eee;padding:75px 0 0;font-family:Sonder;font-size:20px;letter-spacing:1px;-webkit-animation:background-load 1s linear forwards 3s;animation:background-load 1s linear forwards 3s;background-position:center -200px;background-size:100vw auto;background-repeat:no-repeat}@-webkit-keyframes background-load{to{background-color:#fff;background-image:url(/the-sea/static/media/background.6a2168e0.png)}}@keyframes background-load{to{background-color:#fff;background-image:url(/the-sea/static/media/background.6a2168e0.png)}}@media only screen and (max-width:992px){body{padding-top:40px;background-position:center -5px}}@media only screen and (max-width:767px){body{background-size:175vw auto}}.container{width:95%}@media only screen and (max-width:992px){.container{width:100%}}.show-grid{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-top:50px}@media only screen and (max-width:992px){.show-grid{padding-top:0}}footer{margin-top:80px;text-align:center;padding:80px 25vw;background-color:#bedff7;background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#bedff7));background:-webkit-linear-gradient(#fff,#bedff7);background:-o-linear-gradient(#fff,#bedff7);background:linear-gradient(#fff,#bedff7)}@media only screen and (max-width:767px){footer{padding-left:25px;padding-right:25px}}footer img{width:50px;height:auto}img{width:100%;font-size:25px;font-family:Arial}.img{opacity:0;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-webkit-transition:opacity 2s,-webkit-transform .5s;transition:opacity 2s,-webkit-transform .5s;-o-transition:opacity 2s,transform .5s;transition:opacity 2s,transform .5s;transition:opacity 2s,transform .5s,-webkit-transform .5s}@media only screen and (min-width:992px){.img-fish:hover{-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}h1 .img-fish:hover{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.img-fish:hover{cursor:pointer}h1 .img-fish:hover{cursor:default}@media only screen and (min-width:601px){.modal-wrapper .img-fish{-webkit-animation:swim 1s ease-in-out infinite alternate;animation:swim 1s ease-in-out infinite alternate}@-webkit-keyframes swim{0%{-webkit-transform:translateY(-.5vh);transform:translateY(-.5vh)}to{-webkit-transform:translateY(.5vh);transform:translateY(.5vh)}}@keyframes swim{0%{-webkit-transform:translateY(-.5vh);transform:translateY(-.5vh)}to{-webkit-transform:translateY(.5vh);transform:translateY(.5vh)}}}@media only screen and (min-width:992px){@-webkit-keyframes swim{0%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}to{-webkit-transform:translateY(5px);transform:translateY(5px)}}@keyframes swim{0%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}to{-webkit-transform:translateY(5px);transform:translateY(5px)}}}.modal-wrapper .img-fish.mudskipper,.modal-wrapper .img-fish.mudskipper:hover{-webkit-animation:none;animation:none;-webkit-transform:none;-ms-transform:none;transform:none}.modal-wrapper .img-fish:hover{cursor:default}.img-loaded{opacity:1;background:none}.loader:empty,.loader:empty:after{position:absolute;width:100vw;background-color:#b0e2ff;border-bottom:15vh solid #a4d3ee;z-index:99;bottom:0;left:0}.loader:empty{animation-delay:0s,3s;animation-duration:3s,2s;animation-name:slide,fade;animation-fill-mode:forwards;animation-timing-function:ease-in-out;-webkit-animation-delay:0s,3s;-webkit-animation-duration:3s,2s;-webkit-animation-name:slide,fade;-webkit-animation-fill-mode:forwards;-webkit-animation-timing-function:ease-in-out}@-webkit-keyframes slide{0%{height:0}to{height:100vh}}@keyframes slide{0%{height:0}to{height:100vh}}@-webkit-keyframes fade{0%,50%{opacity:1}to{opacity:0}}@keyframes fade{0%,50%{opacity:1}to{opacity:0}}h1{text-align:center;position:relative;letter-spacing:3px}a,a:active,a:focus,a:hover,a:visited,h1 a,h1 a:active,h1 a:focus,h1 a:hover,h1 a:visited{color:#333;text-decoration:none}h1 img{height:20vw;width:auto;margin-bottom:25px}@media only screen and (max-width:992px){h1{font-size:60px}h1 img{height:40vw}}@media only screen and (max-width:767px){h1{font-size:50px}h1 img{height:60vw}}h2{margin:0;font-family:Ranger;font-size:50px;word-spacing:-10px;display:inline}.small,small{font-size:75%}.sci-name{bottom:120px;left:120px}.modal-content .en-fish{font-family:Sonder;font-size:35px;margin-right:10px}@media only screen and (max-width:991px){.modal-content .en-fish{font-size:4vw}}@media only screen and (max-width:767px){.modal-content .en-fish{font-size:5vw}}.modal-content .fish-names{font-size:30px;text-transform:uppercase}@media only screen and (min-width:1500px){.modal-content .fish-names{margin-bottom:5vh}}@media only screen and (max-width:991px){.modal-content .fish-names{font-size:3vw}}@media only screen and (max-width:767px){.modal-content .fish-names{font-size:4vw}}.mobile-back{font-size:20px;top:20px;position:absolute;z-index:9;text-align:left}@media only screen and (max-width:767px){main img{padding:20px 0}}.ReactModal__Content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.ReactModal__Body--open{overflow:hidden}.modal-wrapper{width:100%;vertical-align:bottom}.modal-content{font-family:Octanis;position:absolute;top:5vh;bottom:5vh;left:5vw;right:5vw;border:none;background:#fff;overflow:auto;border-radius:4px;outline:none;padding:20px;-webkit-box-shadow:none;box-shadow:none;text-align:center}@media only screen and (max-width:991px){.modal-content{top:5vh;bottom:5vh;left:5vw;right:5vw}}@media only screen and (max-width:767px){.modal-content{top:10vh;bottom:10vh;left:10vw;right:10vw;overflow-x:hidden;padding-top:0}}.modal-content img{height:75%;width:50vw;text-align:center;margin:0 auto;margin-bottom:30px;position:relative}@media only screen and (max-width:750px){.modal-content img{width:100%;height:auto;margin-top:2vh;margin-bottom:10vh}}@media only screen and (max-width:767px){.modal-content img{width:88%;height:auto;margin-bottom:30px}}@media only screen and (max-width:600px){.modal-content img{max-width:none;width:80%}}@media only screen and (max-width:500px){.modal-content .img-fish{width:55vh;-webkit-transform:translateX(10vw);-ms-transform:translateX(10vw);transform:translateX(10vw)}}.modal-content p{margin-top:-30px;font-size:35px}.schemes{margin-top:20px;padding:0;text-align:left;padding-left:15vw}.modal-content .scheme{width:5vw;height:5vw;max-height:70px;max-width:70px;display:inline-block}.facts img{width:50px;height:auto;margin:0;margin-right:8px}.facts{margin-top:20px;padding:0;color:#909090;text-align:right;padding-right:15vw}@media only screen and (max-width:991px){.schemes{padding-left:0}.facts,.schemes{text-align:center}.facts{padding-right:0}}.fact-details{display:inline-block}.facts .weight{padding-right:30px}@media only screen and (max-width:992px){.facts{margin-top:13px}}@media only screen and (max-width:767px){.facts{margin-top:13px}}@media only screen and (max-width:600px){.facts .weight{padding-right:0}}.modal-overlay{background-image:url(/the-sea/static/media/modal-bg.ffe37c30.png);background-size:cover;position:fixed;top:0;left:0;right:0;bottom:0}@media only screen and (min-width:601px){.visible-mobile{display:none}}
/*# sourceMappingURL=main.66a161b8.css.map*/