/* Theme Name: Galaxsea Theme URI: http://www.galaxseaproject.com/ Description: Galaxsea template Version: 1.0 Author: Galaxsea Author URI: Text Domain: galaxsea Domain Path: /lang */ /* Typography ---------- */ @font-face { font-family: 'HelveticaNeueThin'; src: url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-Light.eot'); /* IE9 Compat Modes */ src: url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-Light.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-Light.woff') format('woff'), /* Modern Browsers */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-Light.ttf') format('truetype'), /* Safari, Android, iOS */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-Light.svg#HelveticaNeue-Light') format('svg'); /* Legacy iOS */ font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'HelveticaNeueUltraThin'; src: url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-UltraLight.eot'); /* IE9 Compat Modes */ src: url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-UltraLight.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-UltraLight.woff') format('woff'), /* Modern Browsers */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-UltraLight.ttf') format('truetype'), /* Safari, Android, iOS */ url('/wp-content/themes/Galaxsea/fonts/HelveticaNeue-UltraLight.svg#HelveticaNeue-UltraLight') format('svg'); /* Legacy iOS */ font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } /* Misc ---- */ body{ margin: 0; padding: 0; width: 100%; height: 100%; background: black; background-image: url('/wp-content/themes/Galaxsea/img/bg.jpg'); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; color: white; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-osx-font-smoothing: grayscale; font-family: 'HelveticaNeueThin'; font-size: 18px; background-attachment: fixed; } body.x-frozen {overflow-x:hidden;} a{ color: white; transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out;} a:hover, a:focus{ color: white; text-decoration: none; outline:none;} input[type="text"], input[type="email"], input[type="number"], textarea { -webkit-appearance: none; border-radius: 0; } input, textarea { -webkit-font-smoothing: antialiased; border-radius: 0; -webkit-border-radius: 0; } textarea { resize: none; } input:focus{ outline: none} input:focus::-webkit-input-placeholder { color:transparent; } input:focus:-moz-placeholder { color:transparent; } input:focus::-moz-placeholder { color:transparent; } input:focus:-ms-input-placeholder { color:transparent; } textarea:focus{ outline: none} textarea:focus::-webkit-input-placeholder { color:transparent; } textarea:focus:-moz-placeholder { color:transparent; } textarea:focus::-moz-placeholder { color:transparent; } textarea:focus:-ms-input-placeholder { color:transparent; } ::-webkit-input-placeholder {color: red;} :-moz-placeholder { color: red; opacity: 1;} ::-moz-placeholder { color: red; opacity: 1;} :-ms-input-placeholder { color: red;} ::-moz-selection { color: red; background: transparent; } ::selection { color: red; background: transparent; } :focus {outline:none;} ::-moz-focus-inner {border:0;} h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0; font-weight: normal;} p{ margin-bottom: 20px; margin-top: 0; } .container-fluid{ max-width: 1280px; margin: 0 auto;} .img-responsive{ width: 100%;} .fullscreen{ width: 100%; height: 100vh; margin: 0; padding: 0;} .cover{ background-position: center center; background-size: cover; background-repeat: no-repeat;} .slick-slide, .slick-slide img { outline: none } .fluid-embed{ position: relative; padding-bottom: 56.25%; overflow: hidden; max-width: 100%; height: 0; z-index: 2;} .fluid-embed video, .fluid-embed iframe, .fluid-embed object, .fluid-embed embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .transition{ transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; } .v-middle{ position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%);} .bg-fixed{ background-attachment: fixed; backface-visibility: inherit !important;} .bg-parallaxed{ background-position: 50% 0;} .appear { opacity: 0; transition: transform 1000ms ease 200ms, opacity 1000ms ease 200ms; -webkit-transition: transform 1000ms ease 200ms, opacity 1000ms ease 200ms; -moz-transition:transform 1000ms ease 200ms, opacity 1000ms ease 200ms; -o-transition: transform 1000ms ease 200ms, opacity 1000ms ease 200ms; transform: translate3D(0, 100px, 0); -webkit-transform: translate3D(0, 100px, 0); -moz-transform: translate3D(0, 100px, 0); } .appear.appeared { opacity: 1; transform: translate3D(0, 0, 0); -webkit-transform: translate3D(0, 0, 0); -moz-transform: translate3D(0, 0, 0); } .timeline-appear { opacity: 0; transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out; } .tablet-mobile {display:none;} /* Font sizes ---------- */ /*96*/ .project .title h3, .project h3 { font-size: 96px;font-family: 'HelveticaNeueUltraThin';line-height: 1.1em; } .project section .title {font-size:96px;} /*48*/ h3, .single h1 { font-family: 'HelveticaNeueUltraThin';font-size: 48px; } .project .paragraph p {font-size: 48px;font-family: 'HelveticaNeueUltraThin';line-height: 1.1em; } .project small {font-size: 48px; } /*18*/ .page section, #img_title, nav#menu ul {font-size:18px;} article.us .years .column span.year { font-size: 18px;line-height: 36px; } .miniature, .miniature p {font-size: 18px !important;font-family: 'HelveticaNeueThin' !important;} /*15*/ article.us .years .column span {font-size:15px;line-height:20px; } /*12*/ .copyright {font-size: 12px; } /* Header ------ */ #wrapper {width:100vw;height:100vh;} header {padding:50px;z-index:99;position: fixed;width:100%;overflow:hidden; background: rgba(0,0,0,0); background: -webkit-linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0)); background: -o-linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0)); background: -moz-linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0)); background: linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0)); } section.responsive-nav { display: none; } header a.logo { background-image: url('/wp-content/themes/Galaxsea/img/galaxsea-316.svg'); background-size: 316px 91px; width: 316px; height:91px; background-repeat: no-repeat; display:block; position: absolute; margin-top:-30px; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; z-index: 999; } header nav#menu { margin:0 auto;} header .logo { float:left;} body.frozen { overflow:hidden;} header .social { position: absolute;top:50px;right:40px;} .social a.fb, .social a.in, .social a.tw, .social a.yt { height: 20px; width: 20px; display: inline-block;margin-right:20px;opacity:.7; } .social a.fb { background: url('/wp-content/themes/Galaxsea/img/fb.svg');background-size: 20px; } .social a.in { background: url('/wp-content/themes/Galaxsea/img/insta.svg');background-size: 20px; } .social a.tw { background: url('/wp-content/themes/Galaxsea/img/tw.svg');background-size: 20px; } .social a.yt { background: url('/wp-content/themes/Galaxsea/img/yt.svg');background-size: 20px; } .social a:hover { opacity:1; } /* VIDEO ----- */ #video-bg { overflow: hidden; } #video-bg video, #video-bg .video-js, #video-bg .video-js .vjs-tech{ position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height:auto; z-index: -100; -ms-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background-size: cover; } #video-bg {position:relative; } .page-template-video #video-bg {z-index:1;position: absolute; } /* Homepage -------- */ body.home { height: 100vh;overflow: hidden; } .home #video-bg .cover-logo { top: 32vh;position: absolute;margin: 0 auto;left: 0;right: 0;text-align: center;height: 220px;display: table;width: 100%; } .home #video-bg .logo { background-image: url('/wp-content/themes/Galaxsea/img/galaxsea-landing.svg');background-size: 100% auto;width: 50%;height: 40vh;background-repeat: no-repeat;display: block;margin: 0 auto;position: absolute;display: table-cell;vertical-align: top;left: 0;right: 0; } /* Page ---- */ .page section.default { display: table;height: 100vh;width: 80%;margin: 0 auto;color: #ccc; } .page article.default { vertical-align: middle;display: table-cell;height: 100%;height: 100vh; } .alter-bg { position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1; } /* Photo ----- */ #toolbar{ position:fixed; z-index:3; right:10px; top:10px; padding:5px; background:url('/wp-content/themes/Galaxsea/img/fs_img_g_bg.png'); } #toolbar img{ border:none;} #img_title{ position:fixed; z-index:3; left:10px; top:10px; padding:10px; background:url('/wp-content/themes/Galaxsea/img/fs_img_g_bg.png'); color:#FFF; font-family:'Josefin Sans Std Light', arial, serif; text-transform:uppercase; } #bg{ position:fixed; z-index:1; overflow:hidden; width:100%; height:100%; } #bgimg{ display:none; -ms-interpolation-mode: bicubic;min-height: 100vh;min-width:100vw;width: 100vw;height:auto; } #preloader{ position:relative; z-index:3; width:32px; padding:20px; top:80px; margin:auto; background:transparent; } #thumbnails_wrapper{ z-index:2; position:fixed; bottom:0; width:100%; background:url('/wp-content/themes/Galaxsea/img/empty.gif');/* stupid ie needs a background value to understand hover area */ bottom:40px; } #outer_container{ position:relative; padding:0; width:100%; margin:40px auto; } #outer_container .thumbScroller{ position:relative; overflow:hidden; background:url('/wp-content/themes/Galaxsea/img/fs_img_g_bg.png'); } #outer_container .thumbScroller, #outer_container .thumbScroller .container, #outer_container .thumbScroller .content{ height:170px; } #outer_container .thumbScroller .container{ position:relative; left:0; } #outer_container .thumbScroller .content{ float:left; } #outer_container .thumbScroller .content div{ margin:5px; height:100%; } /*#outer_container .thumbScroller img{border:2px solid #999;}*/ #outer_container .thumbScroller img{ border:1px solid #666; } #outer_container .thumbScroller .content div a{ display:block; padding:5px; } .nextImageBtn, .prevImageBtn{ display:block; position:absolute; width:50px; height:50px; top:50%; margin:-25px 10px 0 10px; z-index:3; filter:alpha(opacity=40); -moz-opacity:0.4; -khtml-opacity:0.4; opacity:0.4; } .nextImageBtn:hover,.prevImageBtn:hover{ filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity:0.8; opacity:0.8; } .nextImageBtn{ right:0; background:transparent url('/wp-content/themes/Galaxsea/img/next.svg') center center no-repeat; } .prevImageBtn{ background:transparent url('/wp-content/themes/Galaxsea/img/prev.svg') center center no-repeat; } #gallery .bg-img { background: transparent !important; } .slider-for .slick-prev, .fp-controlArrow.fp-prev { left:20px;background:transparent url('/wp-content/themes/Galaxsea/img/prev.svg') center center no-repeat; } .slider-for .slick-next, .fp-controlArrow.fp-next { right:20px;background:transparent url('/wp-content/themes/Galaxsea/img/next.svg') center center no-repeat; } #fp-nav { z-index: 9; } .fp-controlArrow.fp-prev, .fp-controlArrow.fp-next, .slider-for .slick-arrow { border-width: 0;width: 25px;height: 25px;margin: 0;top: auto;bottom:60px;background-size: 25px; } .fp-controlArrow.fp-prev { left:40%; } .fp-controlArrow.fp-next { right:40%; } /* Contact ------- */ .big_star { background-image: url('/wp-content/themes/Galaxsea/img/bigstar.png');background-size: 100%;width: 100px;height: 100px;display: block;position: absolute;margin-top: -120px;left: 20vw; } /* US -- */ /*body.page-template-us { width: 2100px; } .page-template-us .copyright, .page-template-us footer a.logo {display:none;} section.us { width: 2000px;margin: 0 auto;padding: 0 0 0 80px;-webkit-transition: -webkit-transform 5s ease;transition: -webkit-transform 5s ease;transition: transform 5s ease;-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0); } article.us { width: 100%;height: 100vh; } section.us.end { -webkit-transform: translate(-50%,0);-ms-transform: translate(-50%,0);transform: translate(-50%,0); } section.us.end.scroll { -webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0); } article.us .timeline { position: absolute;background: url('/wp-content/themes/Galaxsea/img/timeline_bbg_v2.png');width: 2000px;height:637.5px;background-size: 100%;background-repeat: no-repeat;background-position: center;margin: 0 auto;left: 0;right: 0;top: 0; } article.us .years { position: relative;height: 600px;margin:0 auto;padding: 0;width: 2000px;top:140px; } article.us .years .column { width: 200px;display: inline-block;vertical-align: top;height: 600px; } article.us .years .column:nth-child(6) { width: 300px; } article.us .years .column span { display: block; } article.us .column .empty, .column .full { height: 300px;position: relative; } .column .full { width: 370px; } article.us .years .column div:first-child { vertical-align: bottom;display: table-cell;padding-bottom:0; } article.us .years .column div:first-child span.year { margin-top:20px; } article.us .years .column div:last-child { padding-top: 80px; } article.us .years .column div:last-child span.year { margin-bottom:20px; } article.us .years .column span.last { left: 90px;position: absolute;width: 200px;display: block;bottom: 0; } article.us .years .column:nth-child(9) { position: absolute; } article.us .years .column .logo { position: absolute; background: url('/wp-content/themes/Galaxsea/img/logo_creativity.png');width:200px;height:150px;background-size: 200px 150px;background-repeat: no-repeat;background-position: center;top: -50px;left: -150px; } .toggle-popup {cursor:pointer;} .pop-up { display:none;position: absolute;top: 0;left: 0;width: 100vw;height: 100vh; } .popup-container { display: table;width: 100%;height: 100vh;background-image: url('/wp-content/themes/Galaxsea/img/bg.jpg'); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } .row.bio { max-width: 1200px;margin: 0 auto;padding: 0 40px;height:60vh;display: table-cell;vertical-align: middle; } .row.bio img { max-height: 60vh;width: auto;margin: 0 auto; } .row.bio .text { height: 60vh;font-size: 16px; } .popup-container .close { display: block;position: absolute;left: 50px;width: 25px; height: 25px;background: url('/wp-content/themes/Galaxsea/img/burger-close.svg');background-repeat: no-repeat;background-size: 25px;z-index: 999;cursor: pointer; }*/ section.alter-us { height: 90vh;width: 70%;margin: 0 auto; } .alter-us img { max-width: 80%;max-height: 80%;margin: 0 auto;left: 0;right: 0;position: absolute;height: auto;width: auto; } .page.page-template-we article.default { width:100vw;vertical-align: bottom;padding-bottom: 70px; } /* Product - Archive -----------------*/ .archive section { height: 100vh;padding: 0 30px; } .archive .products { margin: 0;padding: 0;list-style: none; } .archive .products .product {width: 33.3%;text-align: center;opacity: 0;transition: all 1s ease-in-out;-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-o-transition: all 1s ease-in-out;display:table;height:100vh;float:left; } .archive .products .product a { display: table-cell;vertical-align:middle;color: #ccc; } .archive .products .thumb { height: 400px; } .archive .products .product h4 { padding: 15px 0; } .archive .products .product a img { transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out;max-height: 400px;width:auto;margin:0 auto; } .archive .products .product.p-3 .thumb { height: 450px; } .archive .products .product.p-3 a img { max-height: 450px; } .archive .products .product a:hover { -webkit-text-shadow: 1px 0 3px rgba(255,255,255,1);-moz-text-shadow: 1px 0 3px rgba(255,255,255,1);text-shadow: 1px 0 3px rgba(255,255,255,1);color:white; } .archive .products .product a:hover img { filter: brightness(140%); } /* Product - Single ----------------*/ .single h1 { margin: 40px 0; } .single .text-wrap { height:100vh;display: table;position: fixed;right:0; } .single .text { height:100vh;display: table-cell;vertical-align: middle;padding-right: 50px; } .img-container { height: 100vh;display:table;margin-left:-15px; } .img-slide { display: table-cell;vertical-align: middle; } .img-container img { max-width: 100%;max-height: 100%; } #fp-nav.left { left:20px; } #fp-nav ul li a span, #fp-nav ul li:hover a span, #fp-nav ul li a.active span, #fp-nav ul li:hover a.active span { height:8px;width:8px;background:white;margin:0;opacity:.4; } #fp-nav ul li a.active span, #fp-nav ul li:hover a span { opacity:1; } a.more-info { text-decoration: underline; } /* Project ------ */ body.page-template-galaxsea-project { background-image: none;background-attachment:initial; } body.page-template-galaxsea-project section.project { background: url('/wp-content/themes/Galaxsea/img/bg.jpg');background-repeat: repeat-y;background-position: center center;background-size: cover;background-attachment: fixed; } .page-template-galaxsea-project .logo-project { background-image: url('/wp-content/themes/Galaxsea/img/byeugeniquitllet_project.png');background-size: 620px 152.5px;width: 620px;height: 152.5px;background-repeat: no-repeat;margin: 0 auto;top: 28vh;position: absolute;z-index: 99;margin: 0 auto;left: 0;right: 0; } .project .alter-bg {background-repeat: no-repeat;background-size: contain;background-position: right 130%;width: 100vw;height: 100vh;bottom: 0;position: absolute;right: 0; } .the-block { position:relative;width:100%;min-height: 100vh; } #the-show { margin-top: 35vh; } #the-show .parallax-block { position:relative; } #the-show .parallax-block.txt-block { height: 300px;z-index:9; } #the-show .parallax-block.img-block { height: 1000px; } #the-show .parallax-block.txt-block { background:transparent; } #the-show .bg-img-wrap { position: relative;z-index:3; } #the-show .bg-img-wrap img { height: auto;width: 100%; } #the-show .parallax-block#block-1 .bg-img-wrap { position: absolute;width:100%; } .project section.image { position:absolute;margin:0 auto;width:100%;z-index: 1; } .safari .project section.image { display:none !important; } .project section.text, .project section.big-text { z-index: 9;position: absolute;margin: 0 auto;width: 100%; } .project section.big-text { width: 70%;left: 0;right: 0; } .project .slide-img img { max-width: 100%; } .project .img-container { text-align: center;height:auto;width:100%; } .project #contenido { width: 100%; } .project .paragraph p { display: none;font-family: 'HelveticaNeueUltraThin';text-align: center;margin-bottom: 45px; } .project .paragraph p.appear { display:block; } .project .paragraph-background { width: 80%;margin: 0 auto; } .project section .title { max-width: 80%;margin: 0 auto; } .project .title h3, .project h3 { font-family: 'HelveticaNeueUltraThin';text-align: center;margin: 30px 0; } .miniature, .miniature p { text-align: center; } .project .custom-title { text-align: center;margin-top: -200px;margin-bottom: 40px;z-index: 9; } .project .custom-title img { max-width: 80%; } #the-show .parallax-block#block-23, #the-show .parallax-block#block-24, #the-show .parallax-block#block-25, #the-show .parallax-block#block-26, #the-show .parallax-block#block-27, #the-show .parallax-block#block-28, #the-show .parallax-block#block-29 { display: none !important; } #block-10 section.image, #block-18 section.image:nth-child(2) { text-align: right; } /* Footer ------ */ footer { position: fixed;bottom: 0;width: 100%;height:40px;z-index: 99; } nav#menu { position: relative;margin-bottom: 50px; } nav#menu ul { list-style: none;margin: 0 auto;padding: 0;text-align: center;left: 0;right: 0; } nav#menu ul li {display: inline-block;padding: 0 25px; } nav#menu ul li a { color: #ccc;text-transform: uppercase; } nav#menu ul li a:hover, nav#menu ul li.current-menu-item a, .single-product nav#menu ul li:last-child a {color:white;-webkit-text-shadow: 1px 0 3px rgba(255,255,255,1);-moz-text-shadow: 1px 0 3px rgba(255,255,255,1);text-shadow: 1px 0 3px rgba(255,255,255,1);} nav#menu ul li.current-menu-item a { color:#fff; } .copyright { text-align: center;color: #fff;font-weight: 300;position: relative;margin: 0 auto;left: 0;right: 0; } footer a.logo { background-image: url('/wp-content/themes/Galaxsea/img/eugeni.svg');background-size: 100%;width: 100px;height:80px;background-repeat: no-repeat;display:block;position: absolute;right: 60px;bottom: 22px;opacity:.7; } footer a.logo:hover { opacity:1; } /* VideoJS ------- */ .page-template-video footer a.logo {display: none;} .vjs-default-skin.vjs-controls-disabled .vjs-control-bar{ position: absolute; display: block !important; bottom: 40px; z-index: 100; width: 80%; left: 0; right: 0; margin: auto; background: transparent;} /* Videojs none */ .vjs-time-divider, .vjs-default-skin .vjs-duration, .vjs-default-skin .vjs-control-text, .vjs-default-skin .vjs-seek-handle, .vjs-default-skin .vjs-current-time, .vjs-default-skin .vjs-volume-control, .vjs-default-skin .vjs-play-control:before, .vjs-default-skin .vjs-mute-control:before, .vjs-default-skin .vjs-fullscreen-control:before, .vjs-default-skin .vjs-volume-menu-button:before{ display: none} .vjs-default-skin .vjs-control{ height: 0;} /* Videojs Big Play Button */ .vjs-default-skin .vjs-big-play-button {top: 50%;left: 50%;margin-left: -50px;margin-top: -50px;background: transparent url('/wp-content/themes/Galaxsea/img/c_play.svg');background-repeat: no-repeat;width: 100px;height: 100px;border-radius: 50px;border: 1px solid white;background-position: 50% 50%;} .vjs-default-skin .vjs-big-play-button:before { content: "";} /* Videojs Controlbar */ .vjs-default-skin .vjs-control-bar {display: block;position: absolute;bottom: 90px;left: 40px;right: 40px;background-color:transparent;} /* Videojs Progressbar */ .vjs-default-skin .vjs-slider{ background: rgba(255, 255, 255, .3);} .vjs-default-skin .vjs-play-progress{ background: #FFFFFF;} .vjs-default-skin .vjs-progress-control{ height: 2px; top: 0;} /* Videojs Play */ .vjs-default-skin .vjs-play-control{ width: 30px; cursor: pointer; height: 30px; position: absolute; top: 10px; left: -10px; background: transparent url('/wp-content/themes/Galaxsea/img/c_pause.svg') center center no-repeat; background-size: auto 100%;} .vjs-default-skin .vjs-play-control.vjs-paused{ background: transparent url('/wp-content/themes/Galaxsea/img/c_play.svg') center center no-repeat; background-size: auto 100%;} /* Videojs Mute */ .vjs-default-skin .vjs-mute-control, .vjs-default-skin .vjs-volume-menu-button{ cursor: pointer; float: right; position: absolute; right: 0; background: yellow; width: 30px; height: 30px; top: 10px; right: 0; background: transparent url('/wp-content/themes/Galaxsea/img/c_mute_off.svg') center center no-repeat; background-size: auto 100%;} .vjs-default-skin .vjs-mute-control.vjs-vol-0{ background: transparent url('/wp-content/themes/Galaxsea/img/c_mute.svg') center center no-repeat; background-size: auto 100%;} /* Videojs Fullscreen */ .vjs-default-skin .vjs-fullscreen-control{ display:none; cursor: pointer; float: right; position: absolute; right: 0; background: green; width: 30px; height: 30px; top: 10px; right: -5px; background: transparent url('/wp-content/themes/Galaxsea/img/c_fullscreen.svg') center center no-repeat; background-size: auto 100%;} /* Progress bar */ progress{ position: absolute; left: 0; top: 120px; width: 100%; height: 2px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color: transparent; color: #ddd; z-index: 100; transform: initial;} progress::-webkit-progress-bar{ background-color: transparent;} progress::-webkit-progress-value{ background-color: #FFD300;} progress::-moz-progress-bar{ background-color: #FFD300;} .show_nav progress{ z-index: 1} .single-articulo progress, .page-template-flexible-page progress{ top: 0;} /* VIDEO USER INACTIVE */ .hide-controls { cursor: none !important; } /* Hide the control bar when the video is playing and the user is inactive */ .hide-controls .vjs-control-bar, .hide-controls nav#menu, .hide-controls .social { display: block; visibility: hidden; opacity: 0; -webkit-transition: visibility 1.5s, opacity 1.5s; -moz-transition: visibility 1.5s, opacity 1.5s; -o-transition: visibility 1.5s, opacity 1.5s; transition: visibility 1.5s, opacity 1.5s; } .show-controls .vjs-control-bar, .show-controls nav#menu, .show-controls .social {visibility: visible;opacity: 1;} /*@media screen and (min-width: 1800px){ section.us, article.us .timeline, article.us .years { width: 1700px; } section.us {padding:0 0 0 70px;} article.us .timeline {height: auto;background-size: 100%;bottom: 300px;position: absolute;background-position: bottom;} article.us .years {height:800px;position:absolute;bottom:0;display:block;top:auto;} article.us .column .empty, .column .full {height: 50vh;} article.us .years .column {width:10%;height:800px;bottom:0;position:relative;} .column .full {width: 160%;} article.us .years .column div:last-child {padding-top:0;bottom:0;height:400px;vertical-align:bottom;position:absolute;} article.us .years .column div:first-child {padding-bottom:80px;bottom:0;height:400px;} article.us .years .column:nth-child(6) {width:15%;} article.us .years .column span.last {left: 60px;position: relative;width: 200px;display: block;top: -100px;} article.us .years .column .logo {top: -115px;left: -170px;} .page-template-us footer a.logo {display:block;} } @media screen and (min-height: 1200px) and (min-width: 1800px) { article.us {height:90vh;} }*/ @media screen and (min-width: 2160px){ .archive section { padding:0 120px; } .archive .products .thumb { height: 600px; } .archive .products .product a img { max-height: 600px; } .archive .products .product.p-3 .thumb { height:700px; } .archive .products .product.p-3 a img { max-height:700px; } #the-show .parallax-block.img-block { height: 1300px; } } @media screen and (max-width: 1680px) { .project section .title {font-size:80px;} header a.logo {background-image: url('/wp-content/themes/Galaxsea/img/galaxsea-200.svg');width:200px;height:57.5px;background-size:200px 57.5px;margin-top:-20px;} .archive .products .thumb { height: 300px; } .archive .products .product a img { max-height: 300px; } .archive .products .product.p-3 .thumb { height: 350px; } .archive .products .product.p-3 a img { max-height: 350px;} .parallax-block.large {display:block;} .parallax-block.larger, .parallax-block.laptop, .parallax-block.tablet, .parallax-block.mobile {display: none;} #the-show .parallax-block#block-2 {height:900px !important;} #the-show .parallax-block#block-4 {height:700px !important;} #the-show .parallax-block#block-6 {height:900px !important;} #the-show .parallax-block#block-8 {height:700px !important;} #the-show .parallax-block#block-10 {height:600px !important;} #the-show .parallax-block#block-12 {height:700px !important;} #the-show .parallax-block#block-14 {height:700px !important;} #the-show .parallax-block#block-18 {height:700px !important;} #the-show .parallax-block#block-20 {height:1500px !important;} #the-show .parallax-block#block-22 {height:700px !important;} #the-show .parallax-block#block-23 {height:900px !important;} #the-show .parallax-block#block-25 {height:700px !important;} #the-show .parallax-block#block-27 {height:700px !important;} #the-show .parallax-block#block-29 {height:600px !important;} #the-show .parallax-block#block-31 {height:800px !important;} #the-show .parallax-block#block-32 {height:700px !important;} #the-show .parallax-block#block-38 {height:800px !important;} #the-show .parallax-block#block-40 {height:500px !important;} .popup-container { width: 100vw; } } @media screen and (max-width: 1440px) { /*68*/ .project .title h3, .project h3, .project section .title { font-size: 68px; } /*16*/ .page section, #img_title, nav#menu ul {font-size:16px;} article.us .years .column span.year { line-height: 17px; } body, .miniature, .miniature p, article.us .years .column span {font-size: 14px; } .miniature, .miniature p { font-size: 16px !important; } article.us .years .column span { line-height: 17px;} article.us .years .column span.year { font-size:24px;} /*40*/ h3, .single h1, .project .paragraph p, .project small { font-size: 40px; } body.page-template-galaxsea-project section.project { background-size: contain; } } @media screen and (max-width: 1280px) { body.page-template-us {width:1500px;background-size:auto;} section.us {padding: 0 0 0 50px;} section.us, article.us .timeline, article.us .years {width:1500px;} article.us .timeline { top: -150px;height:100%;background-size: 100% auto; } article.us .years { height: 100vh;top:0; } article.us .years .column {vertical-align: middle;height: 100vh;width:10%;} article.us .column .empty, .column .full { height: 50vh; } .column .full {width: 160%;} article.us .years .column div:first-child { padding-bottom:80px; } article.us .years .column div:last-child { padding-top: 20px; } article.us .years .column:nth-child(6) { width: 20%; } article.us .years .column:nth-child(7) { width: 120px; } article.us .years .column span.last {left:0;bottom:60px;} article.us .years .column .logo { width: 100px; height: 75px; background-size: 100px 75px; top:80px;left:0;} .archive .products .thumb, .archive .products .product.p-3 .thumb { height: 275px !important; } #the-show .parallax-block#block-2 {height:800px !important;} #the-show .parallax-block#block-4 {height:600px !important;} #the-show .parallax-block#block-6 {height:800px !important;} #the-show .parallax-block#block-8 {height:600px !important;} #the-show .parallax-block#block-10 {height:500px !important;} #the-show .parallax-block#block-12 {height:600px !important;} #the-show .parallax-block#block-14 {height:600px !important;} #the-show .parallax-block#block-18 {height:600px !important;} #the-show .parallax-block#block-20 {height:1300px !important;} #the-show .parallax-block#block-22 {height:600px !important;} #the-show .parallax-block#block-23 {height:800px !important;} #the-show .parallax-block#block-25 {height:600px !important;} #the-show .parallax-block#block-27 {height:600px !important;} #the-show .parallax-block#block-29 {height:500px !important;} #the-show .parallax-block#block-31 {height:700px !important;} #the-show .parallax-block#block-32 {height:600px !important;} #the-show .parallax-block#block-36 {height:700px !important;} #the-show .parallax-block#block-37 {height:700px !important;} #the-show .parallax-block#block-38 {height:700px !important;} #the-show .parallax-block#block-40 {height:500px !important;} } @media screen and (max-width: 1024px) { .project .title h3, .project h3, .project section .title { font-size: 48px;} h3, .single h1, .project .paragraph p, .project small { font-size: 36px; } header {padding:0;height:100px;z-index: 999;} header a.logo { background-image: url('/wp-content/themes/Galaxsea/img/galaxsea-316.svg');background-size: 316px 91px;width: 316px;height:91px;float: none;margin: 0 auto;left: 0;right: 0;top: 6px; } footer a.logo {right:30px;} header nav#menu {display:none;} .toggle-menu { display: block;position: absolute;top: 30px;width: 50px;right: 30px;height: 50px;background: transparent url('/wp-content/themes/Galaxsea/img/burger.svg') center center no-repeat;background-size: 50px;z-index: 999;cursor: pointer; } .close-menu { display:none;position:absolute;top: 30px;width: 50px;right: 30px;height: 50px;background: url('/wp-content/themes/Galaxsea/img/burger-close.svg');background-repeat: no-repeat;background-size: 50px;z-index: 999;cursor:pointer; } section.responsive-nav { z-index: 99;position: fixed;margin: 0 auto;top: 0;bottom: 0;left: 0;right: 0;height: 100%;width: 100%;background-color: black;background-image: url('/wp-content/themes/Galaxsea/img/bg.jpg'); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%;display:none; } nav#mbl-menu {display:table;z-index: 99;width:100%;height:100%;} nav#mbl-menu ul { display: table-cell;vertical-align: middle;list-style: none;margin: 0 auto;padding: 0;text-align: center;width: 100%; } nav#mbl-menu ul li { margin: 0 auto;position: relative;display: block;padding:20px 0; } nav#mbl-menu ul li a { font-size: 18px;color: white;text-transform: uppercase; } section.responsive-nav .social { position: fixed;bottom: 60px;width: 100%;text-align: center; } header .social { display:none;} .project .alter-bg { background-size: 100%;background-position: bottom;width: 100%;height: auto; } /* Photo */ #bgimg { width:100vw;margin-top:0;left:0;margin-left:0!important;border-top: 1px solid #666;border-bottom: 1px solid #666; } #outer_container {margin: 20px auto;} #outer_container .thumbScroller, #outer_container .thumbScroller .container, #outer_container .thumbScroller .content {height:120px;} #outer_container .thumbScroller img {height:95px;} .nextImageBtn, .prevImageBtn {display:none !important;} #gallery { height: 100vh; } .slider-for .img-container {height: auto;display: block;margin: 0; } .slider-for .img-container img {border-top: 1px solid #616161;border-bottom: 1px solid #616161;} .slider-nav {position: relative;height:auto;width:auto;opacity:1;margin-top:40px; } .slider-nav .slick-slide { display: inline-block;height: auto;margin: 0 10px;opacity: 0.7;border: 1px solid #ccc; } .slider-nav .slick-slide.slick-current { opacity: 1; } .slider-nav .slick-slide img { width: 100%;height: 100%;} /* Project */ .project .paragraph p {margin-bottom:30px;} #the-show .parallax-block.txt-block {height: 200px;} #the-show .parallax-block#block-2 {height:500px !important;} #the-show .parallax-block#block-2 {height:500px !important;} #the-show .parallax-block#block-4 {height:500px !important;} #the-show .parallax-block#block-6 {height:500px !important;} #the-show .parallax-block#block-8 {height:500px !important;} #the-show .parallax-block#block-10 {height:400px !important;} #the-show .parallax-block#block-12 {height:500px !important;} #the-show .parallax-block#block-14 {height:500px !important;} #the-show .parallax-block#block-16 {height:500px !important;} #the-show .parallax-block#block-16 section.image .slide-img { display: none;} #the-show .parallax-block#block-18 {height:500px !important;} #the-show .parallax-block#block-20 {height:1000px !important;} #the-show .parallax-block#block-22 {height:500px !important;} #the-show .parallax-block#block-23 {height:700px !important;} #the-show .parallax-block#block-25 {height:500px !important;} #the-show .parallax-block#block-27 {height:500px !important;} #the-show .parallax-block#block-29 {height:400px !important;} #the-show .parallax-block#block-31 {height:600px !important;} #the-show .parallax-block#block-32 {height:500px !important;} #the-show .parallax-block#block-36 {height:450px !important;} #the-show .parallax-block#block-37 {height:350px !important;} #the-show .parallax-block#block-38 {height:500px !important;} #the-show .parallax-block#block-39 {height:500px !important;} #the-show .parallax-block#block-40 {height:400px !important;} } /* ----------- TOUCH ----------- */ /* Video */ .touch #video-bg video, #video-bg .video-js, #video-bg .video-js .vjs-tech{ height: auto !important; width: 100% !important;} .touch .home #video-bg video {height:100vh !important;width:auto !important;} .touch .hide-controls .vjs-control-bar, .hide-controls nav#menu, .hide-controls .social {display:none;} /*Project*/ .touch #the-show {margin-top:0;} .touch #the-show .parallax-block {overflow:auto;} .touch #the-show .parallax-block.txt-block, .touch #the-show .parallax-block, .touch #the-show .parallax-block.img-block { overflow: hidden;height: auto !important;z-index: 1; } .touch #the-show .parallax-block {margin-bottom: 30px;} .touch .project section.text, .project section.big-text {position:relative;} .touch .project section.big-text {width:80%;} .touch .page-template-galaxsea-project .logo-project {top:16vh;z-index:9;} .touch .project .paragraph-background, .project section .title {width:90%;max-width: 90%;} .touch .project .title h3, .project h3 {margin:10px 0;} .touch .project .paragraph p { margin-bottom: 20px; } .touch #block-1 { margin-top: 30vh; } .touch #block-1 .big-text { margin-top: 100px; } .touch.safari .project section.image {display:block !important;} .touch #the-show .parallax-block#block-2 {height:auto !important;} .touch #the-show .parallax-block#block-2 {height:auto !important;} .touch #the-show .parallax-block#block-4 {height:auto !important;} .touch #the-show .parallax-block#block-6 {height:auto !important;} .touch #the-show .parallax-block#block-8 {height:auto !important;} .touch #the-show .parallax-block#block-10 {height:auto !important;} .touch #the-show .parallax-block#block-12 {height:auto !important;} .touch #the-show .parallax-block#block-14 {height:auto !important;} .touch #the-show .parallax-block#block-16 {height:auto !important;} .touch #the-show .parallax-block#block-18 {height:auto !important;} .touch #the-show .parallax-block#block-20 {height:auto !important;} .touch #the-show .parallax-block#block-22 {height:auto !important;} .touch #the-show .parallax-block#block-23 {height:auto !important;} .touch #the-show .parallax-block#block-25 {height:auto !important;} .touch #the-show .parallax-block#block-27 {height:auto !important;} .touch #the-show .parallax-block#block-29 {height:auto !important;} .touch #the-show .parallax-block#block-31 {height:auto !important;} .touch #the-show .parallax-block#block-32 {height:auto !important;} .touch #the-show .parallax-block#block-36 {height:auto !important;} .touch #the-show .parallax-block#block-37 {height:auto !important;} .touch #the-show .parallax-block#block-38 {height:auto !important;} .touch #the-show .parallax-block#block-39 {height:auto !important;} .touch #the-show .parallax-block#block-40 {height:auto !important;} /* ----------- Ipad Pro ----------- */ /* Landscape */ @media only screen and (min-device-width : 1024px) and (max-device-width : 1024px) and (min-device-height : 1366px) and (max-device-height : 1366px) and (orientation: landscape) { .orientation-landscape {display:block;} .orientation-portrait {display:none;} .vjs-default-skin .vjs-big-play-button {display: none;} .vjs-default-skin .vjs-control-bar {display:none;} .hide-controls .vjs-control-bar, .hide-controls nav#menu, .hide-controls .social {display:none;} /* Photo */ #gallery { height: 90vh;} .slider-for .img-container { height: auto;display: block;margin: 0; } .slider-for .img-container img { width:100%;border-top: none;border-bottom: none; } .slider-nav { position: relative;height:auto;width:auto;opacity:1;margin-top:20px; } .slider-nav .slick-slide { display: inline-block;height: auto;margin: 0 10px;opacity: 0.7;border: 1px solid #ccc; } .slider-nav .slick-slide.slick-current { opacity: 1; } .slider-nav .slick-slide img { width: 100%;height: 100%;} footer {display:none;} } /* Portrait */ @media only screen and (min-device-width : 1024px) and (max-device-width : 1024px) and (min-device-height : 1366px) and (max-device-height : 1366px) and (orientation: portrait) { .orientation-landscape {display:none;} .orientation-portrait {height: 100vh;} .orientation-portrait .button {display: block;top: 50%;left: 50%;margin-left: -50px;margin-top: -50px;background: transparent url('/wp-content/themes/Galaxsea/img/turn.svg');background-repeat: no-repeat;background-size: 40%;width: 100px;height: 100px;border-radius: 50px;border: 1px solid white;background-position: 50% 50%;position: absolute;outline: 0;border-color: #fff;/* IE8 needs a non-glow hover state */background-color: #505050;background-color: rgba(50, 50, 50, 0.75);/* box-shadow */-webkit-box-shadow: 0 0 3em #ffffff;-moz-box-shadow: 0 0 3em #ffffff;box-shadow: 0 0 3em #ffffff; } .orientation-portrait .button:after { content:'Turn your device';position: absolute;bottom: -40px;width: 200px;left: -5px; } } /* ----------- iPad ----------- */ /* Landscape */ @media only screen and (min-device-width : 768px) and (max-device-width : 768px) and (min-device-height : 1024px) and (max-device-height : 1024px) and (orientation: landscape) { .orientation-landscape {display:block;} .orientation-portrait {display:none;} .vjs-default-skin .vjs-big-play-button {display: none;} /* Photo */ #gallery { height: 90vh;} .slider-for .img-container { height: auto;display: block;margin: 0; } .slider-for .img-container img { width:100%;border-top: none;border-bottom: none; } .slider-nav { position: relative;height:auto;width:auto;opacity:1;margin-top:20px; } .slider-nav .slick-slide { display: inline-block;height: auto;margin: 0 10px;opacity: 0.7;border: 1px solid #ccc; } .slider-nav .slick-slide.slick-current { opacity: 1; } .slider-nav .slick-slide img { width: 100%;height: 100%;} footer {display:none;} } /* Portrait */ @media only screen and (min-device-width : 768px) and (max-device-width : 768px) and (min-device-height : 1024px) and (max-device-height : 1024px) and (orientation : portrait) { .orientation-landscape {display:none;} .orientation-portrait {height: 100vh;} .orientation-portrait .button {display: block;top: 50%;left: 50%;margin-left: -50px;margin-top: -50px;background: transparent url('/wp-content/themes/Galaxsea/img/turn.svg');background-repeat: no-repeat;background-size: 40%;width: 100px;height: 100px;border-radius: 50px;border: 1px solid white;background-position: 50% 50%;position: absolute;outline: 0;border-color: #fff;/* IE8 needs a non-glow hover state */background-color: #505050;background-color: rgba(50, 50, 50, 0.75);/* box-shadow */-webkit-box-shadow: 0 0 3em #ffffff;-moz-box-shadow: 0 0 3em #ffffff;box-shadow: 0 0 3em #ffffff; } .orientation-portrait .button:after { content:'Turn your device';position: absolute;bottom: -40px;width: 200px;left: -5px; } } @media screen and (max-width: 992px){ .popup-container {padding-top:100px;} .popup-container .close {position:relative;top:0;left:0;margin-bottom: 20px;} .row.bio .text {padding-top:20px;} } @media screen and (max-width: 768px){ .archive section {height: auto;display: block; } .archive ul.products {display: block; height:100%; } .archive ul.products li { width: 100%; display: table; height:100vh; } .archive ul.products li a { display: table-cell;vertical-align: middle; } .archive ul.products .thumb { height: auto;} section.alter-us { height:calc(100vh - 45px);width: 90%; } .alter-us img { max-width: 100%;max-height: 100%;top: 15vh; } .page.page-template-we article.default { height:calc(100vh - 45px); } } @media screen and (max-width: 767px){ .project .title h3, .project h3, .project section .title { font-size: 36px;} h3, .single h1, .project .paragraph p, .project small { font-size: 24px; line-height:1em; } /*12*/ .page section, #img_title, article.us .years .column span { font-size:12px; } article.us .years .column span { line-height:14px; } .miniature, .miniature p { font-size: 12px !important; } article.us .years .column span.year { font-size:16px; } #wrapper { width: 100%;height: 100%; } header { height: 70px;padding: 0; } header a.logo { left:20px;top:10px;margin:0;background-image: url('/wp-content/themes/Galaxsea/img/galaxsea-200.svg');width:200px;height:57.5px;background-size:200px auto; } .toggle-menu, .close-menu { top: 25px;right: 20px;width: 30px;height: 30px;background-size: 30px; } .vjs-default-skin .vjs-control-bar {right: 0;bottom: 0;left: 0;z-index: 9;} .image-bg img, .single-project video { height: auto; min-height: auto; } .vjs-no-js { display: none; } .video-js video { position: static; } .slide .video-js { height: auto !important; position: static; background: transparent; } .video-js .vjs-tech { height: auto !important; position: static; } .orientation-portrait .button { margin-left: -25px;margin-top: -25px;width: 50px;height: 50px; } .orientation-portrait .button:after {left:-15px;} .page-template-galaxsea-project .logo-project { background-size: 310px 76.25px;width: 310px;height: 76.25px; } .project .custom-title {margin-top:0;} body.page-template-us {width:1000px;background-attachment:initial;} section.us { padding: 0 0 0 30px; } section.us, article.us .timeline, article.us .years { width: 1000px; } article.us .timeline { top: -100px; } article.us .years .column div:first-child {padding-bottom:50px;} article.us .years .column:nth-child(7) { width: 75px; } article.us .years .column .logo {top:75px;left:-85px;} /*section.us {padding:0 30px;width:2000px;} section.us, article.us .timeline {width:2000px;top:-170px;} article.us .years {width:1850px;} article.us .years .column {width:200px;} article.us .years .column div:last-child {padding-top:40px;} article.us .years .column div:first-child {padding-bottom:40px;} article.us .years .column span { padding-left: 5px; } article.us .years .column div:first-child span.year { margin-top: 5px;} article.us .years .column span.year {padding-left: 0;} article.us .years .column span.last { left: 60px;bottom:30px;}*/ #the-show {margin-top:0;} #the-show .parallax-block {overflow:auto;} #the-show .parallax-block.txt-block, #the-show .parallax-block, #the-show .parallax-block.img-block {overflow: hidden;height:auto !important;z-index:1;} #the-show .parallax-block#block-2 {height:auto !important;} #the-show .parallax-block#block-2 {height:auto !important;} #the-show .parallax-block#block-4 {height:auto !important;} #the-show .parallax-block#block-6 {height:auto !important;} #the-show .parallax-block#block-8 {height:auto !important;} #the-show .parallax-block#block-10 {height:auto !important;} #the-show .parallax-block#block-12 {height:auto !important;} #the-show .parallax-block#block-14 {height:auto !important;} #the-show .parallax-block#block-16 {height:auto !important;} #the-show .parallax-block#block-18 {height:auto !important;} #the-show .parallax-block#block-20 {height:auto !important;} #the-show .parallax-block#block-22 {height:auto !important;} #the-show .parallax-block#block-23 {height:auto !important;} #the-show .parallax-block#block-25 {height:auto !important;} #the-show .parallax-block#block-27 {height:auto !important;} #the-show .parallax-block#block-29 {height:auto !important;} #the-show .parallax-block#block-31 {height:auto !important;} #the-show .parallax-block#block-32 {height:300 !important;} #the-show .parallax-block#block-36 {height:200 !important;} #the-show .parallax-block#block-37 {height:200 !important;} #the-show .parallax-block#block-38 {height:auto !important;} #the-show .parallax-block#block-39 {height:auto !important;} #the-show .parallax-block#block-40 {height:auto !important;} .project section.text, .project section.big-text {position:relative;} .project section.big-text {width:80%;} .page-template-galaxsea-project .logo-project {top:16vh;} .project .paragraph-background, .project section .title {width:90%;max-width: 90%;} .project .title h3, .project h3, .project section .title { font-size:30px;} .project .title h3, .project h3 {margin:10px 0;} .project .paragraph p { margin-bottom: 20px; } #block-1 { margin-top: 30vh; } #block-1 .big-text { margin-top: 100px; } .project-landscape { display:none; } .single-product .img-container {margin:0;padding:0 30px;} .archive section {padding:0;} .archive .products .product {width:100%;} .archive .products .thumb {height:40vh !important;} .archive .products .product a img { padding:0 15px; max-height: 35vh !important;} .archive .products .product.p-3 a img { padding:0;max-height: 40vh !important;} footer a.logo { width: 50px;height: 40px;bottom: 10px;right: 15px; } } @media screen and (max-width: 767px) and (orientation: landscape) { section.responsive-nav .social {display:none;} #gallery { height: auto; } #gallery .v-middle { top: auto;transform: none;-webkit-transform: none;-moz-transform: none;-ms-transform: none; } #photo .bg-img .img-container {padding:0;} #photo .bg-img .img-container img { border: none; } #photo .bg-img .img-container img {min-height:100%;min-width:100%;} .slider-for .slick-arrow {top:50%;} nav#menu ul li {padding:10px 0;} .project-portrait {display:none;} .project-landscape {display: block;height:100vh;} .project-landscape .button { display: block;top: 50%;left: 50%;margin-left: -25px;margin-top: -25px;background: transparent url('/wp-content/themes/Galaxsea/img/turn.svg');background-repeat: no-repeat;background-size: 40%;width: 50px;height: 50px;border-radius: 50px;border: 1px solid white;background-position: 50% 50%;position: absolute;outline: 0;border-color: #fff;/* IE8 needs a non-glow hover state */background-color: #505050;background-color: rgba(50, 50, 50, 0.75);/* box-shadow */-webkit-box-shadow: 0 0 3em #ffffff;-moz-box-shadow: 0 0 3em #ffffff;box-shadow: 0 0 3em #ffffff; } .project-landscape .button:after { content:'Turn your device';position: absolute;bottom: -40px;width: 200px;left: -15px; } .page-template-galaxsea-project .logo-project {display:none;} .alter-us img {top:-5vh;} .page.page-template-we article.default {padding-bottom:0;} } @media screen and (max-width: 320px){ body, .miniature, .miniature p { font-size: 12px;line-height:16px; } article.us .years .column span { font-size: 10px;line-height: 12px; } section.responsive-nav .social { bottom: 45px; } header a.logo {top:15px;left:15px;} .toggle-menu, .close-menu {top:17px;} nav#menu ul li {padding:13px 0;} .page-template-galaxsea-project .logo-project { background-size: 260px auto;width: 260px;height: 70px; } footer {height:25px;} .copyright {font-size:10px;} section.us, article.us .timeline, article.us .years { width: 900px; } body.page-template-us { width: 900px; } article.us .years .column div:first-child {padding-bottom:40px;} article.us .years .column div:last-child { padding-top: 5px; } article.us .years .column div:first-child span.year { margin-top: 10px; } article.us .years .column div:last-child span.year { margin-bottom: 10px;} .page.page-template-we article.default {padding-bottom:40px;} } @media screen and (max-height: 480px){ nav#mbl-menu ul li {padding:9px 0;} } @media screen and (max-height: 400px){ section.responsive-nav .social {bottom:30px;} } /* Print ----- */ @media print { * { background:transparent !important; color:#000 !important; box-shadow:none !important; text-shadow:none !important;} a, a:visited { text-decoration:underline;} a[href]:after { content:" (" attr(href) ")";} abbr[title]:after { content:" (" attr(title) ")";} .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content:"";} pre,blockquote { border:1px solid #999; page-break-inside:avoid;} thead { display:table-header-group;} tr,img { page-break-inside:avoid;} img { max-width:100% !important;} @page { margin:0.4cm;} p, h2, h3 { orphans:3; widows:3;} h2, h3 { page-break-after:avoid;} }