/* -- reset -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ html{color:#222222;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000} * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* a, input, button, *:focus { outline: 0; } input:read-only { background-color: rgba(255,255,255,0.4); } * { -webkit-tap-highlight-color: rgba(0,0,0,0); appearance: none; -moz-appearance: none; -webkit-appearance: none; } select, button, input { appearance: button; -moz-appearance: button; -webkit-appearance: button; } input[type="text"], input[type="number"], input[type="email"], input[type="password"], input[type="number"] { -webkit-user-select: auto !important; -khtml-user-select: auto !important; -moz-user-select: auto !important; -ms-user-select: auto !important; user-select: auto !important; } * { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -moz-touch-callout: none; -ms-touch-callout: none; touch-callout: none; -webkit-user-drag: none; -moz-user-drag: none; -ms-user-drag: none; user-drag: none; } */[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{transition-delay:3s}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos^=fade][data-aos^=fade]{opacity:0;transition-property:opacity,transform}[data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;transform:translateZ(0)}[data-aos=fade-up]{transform:translate3d(0,100px,0)}[data-aos=fade-down]{transform:translate3d(0,-100px,0)}[data-aos=fade-right]{transform:translate3d(-100px,0,0)}[data-aos=fade-left]{transform:translate3d(100px,0,0)}[data-aos=fade-up-right]{transform:translate3d(-100px,100px,0)}[data-aos=fade-up-left]{transform:translate3d(100px,100px,0)}[data-aos=fade-down-right]{transform:translate3d(-100px,-100px,0)}[data-aos=fade-down-left]{transform:translate3d(100px,-100px,0)}[data-aos^=zoom][data-aos^=zoom]{opacity:0;transition-property:opacity,transform}[data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;transform:translateZ(0) scale(1)}[data-aos=zoom-in]{transform:scale(.6)}[data-aos=zoom-in-up]{transform:translate3d(0,100px,0) scale(.6)}[data-aos=zoom-in-down]{transform:translate3d(0,-100px,0) scale(.6)}[data-aos=zoom-in-right]{transform:translate3d(-100px,0,0) scale(.6)}[data-aos=zoom-in-left]{transform:translate3d(100px,0,0) scale(.6)}[data-aos=zoom-out]{transform:scale(1.2)}[data-aos=zoom-out-up]{transform:translate3d(0,100px,0) scale(1.2)}[data-aos=zoom-out-down]{transform:translate3d(0,-100px,0) scale(1.2)}[data-aos=zoom-out-right]{transform:translate3d(-100px,0,0) scale(1.2)}[data-aos=zoom-out-left]{transform:translate3d(100px,0,0) scale(1.2)}[data-aos^=slide][data-aos^=slide]{transition-property:transform}[data-aos^=slide][data-aos^=slide].aos-animate{transform:translateZ(0)}[data-aos=slide-up]{transform:translate3d(0,100%,0)}[data-aos=slide-down]{transform:translate3d(0,-100%,0)}[data-aos=slide-right]{transform:translate3d(-100%,0,0)}[data-aos=slide-left]{transform:translate3d(100%,0,0)}[data-aos^=flip][data-aos^=flip]{backface-visibility:hidden;transition-property:transform}[data-aos=flip-left]{transform:perspective(2500px) rotateY(-100deg)}[data-aos=flip-left].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-right]{transform:perspective(2500px) rotateY(100deg)}[data-aos=flip-right].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-up]{transform:perspective(2500px) rotateX(-100deg)}[data-aos=flip-up].aos-animate{transform:perspective(2500px) rotateX(0)}[data-aos=flip-down]{transform:perspective(2500px) rotateX(100deg)}[data-aos=flip-down].aos-animate{transform:perspective(2500px) rotateX(0)} /* -- font -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ /* @font-face { font-family: 'brandon_grotesquethin'; src: url('../font/brandon_thin-webfont.eot'); src: url('../font/brandon_thin-webfont.eot?#iefix') format('embedded-opentype'), url('../font/brandon_thin-webfont.woff') format('woff'), url('../font/brandon_thin-webfont.ttf') format('truetype'), url('../font/brandon_thin-webfont.svg#brandon_grotesquethin') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'brandon_grotesquemedium'; src: url('../font/brandon_med-webfont.eot'); src: url('../font/brandon_med-webfont.eot?#iefix') format('embedded-opentype'), url('../font/brandon_med-webfont.woff') format('woff'), url('../font/brandon_med-webfont.ttf') format('truetype'), url('../font/brandon_med-webfont.svg#brandon_grotesquemedium') format('svg'); font-weight: normal; font-style: normal; } */ /* Europa --------------------------------------------------------------------------------------------------------------*/ @font-face { font-family: 'Europa-Bold'; src: url('../../font/europa/europa-bold.eot'); src: url('../../font/europa/europa-bold.eot?#iefix') format('embedded-opentype'), url('../../font/europa/europa-bold.woff') format('woff'), url('../../font/europa/europa-bold.ttf') format('truetype'), url('../../font/europa/europa-bold.svg#europa-bold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Europa-Light'; src: url('../../font/europa/europa-light.eot'); src: url('../../font/europa/europa-light.eot?#iefix') format('embedded-opentype'), url('../../font/europa/europa-light.woff') format('woff'), url('../../font/europa/europa-light.ttf') format('truetype'), url('../../font/europa/europa-light.svg#europa-light') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Europa-Regular'; src: url('../../font/europa/europa-regular.eot'); src: url('../../font/europa/europa-regular.eot?#iefix') format('embedded-opentype'), url('../../font/europa/europa-regular.woff') format('woff'), url('../../font/europa/europa-regular.ttf') format('truetype'), url('../../font/europa/europa-regular.svg#europa-regular') format('svg'); font-weight: normal; font-style: normal; } /* Brown --------------------------------------------------------------------------------------------------------------*/ @font-face { font-family: 'Brown-Bold'; src: url('../../font/brown/brown-bold.eot'); src: url('../../font/brown/brown-bold.eot?#iefix') format('embedded-opentype'), url('../../font/brown/brown-bold.woff') format('woff'), url('../../font/brown/brown-bold.ttf') format('truetype'), url('../../font/brown/brown-bold.svg#brown-bold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Brown-Light'; src: url('../../font/brown/brown-light.eot'); src: url('../../font/brown/brown-light.eot?#iefix') format('embedded-opentype'), url('../../font/brown/brown-light.woff') format('woff'), url('../../font/brown/brown-light.ttf') format('truetype'), url('../../font/brown/brown-light.svg#brown-light') format('svg'); font-weight: normal; font-style: normal; } /* TrendSansOne --------------------------------------------------------------------------------------------------------------*/ @font-face { font-family: 'TrendSansOne'; src: url('../../font/TrendSansOne/TrendSansOne.eot'); src: url('../../font/TrendSansOne/TrendSansOne.eot?#iefix') format('embedded-opentype'), url('../../font/TrendSansOne/TrendSansOne.woff') format('woff'), url('../../font/TrendSansOne/TrendSansOne.ttf') format('truetype'), url('../../font/TrendSansOne/TrendSansOne.svg#TrendSansOne') format('svg'); font-weight: normal; font-style: normal; } /* -- nav button -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ #layout { position: relative; background: white; } #layout .overlay { opacity: 0; visibility: hidden; position: fixed; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.3); z-index: 8000; position: fixed; left: 220px; left: 0; right: 0; top: 0; bottom: 0; } /*#navm { position: fixed; top: 0; bottom: 0; left: -120px; width: 220px; overflow: auto; overflow-x: hidden; box-sizing: border-box; background: #3be775; opacity: 0; visibility: hidden; z-index: 9000; }*/ #navm { position: fixed; top: 0; bottom: 0; left: 0; right: 0; overflow: auto; overflow-x: hidden; box-sizing: border-box; background: #3be775; z-index: 12000; opacity: 0; visibility: hidden; transform: translate(100%,-100%); -webkit-transform: translate(100%,-100%); -moz-transform: translate(100%,-100%); -o-transform: translate(100%,-100%); -ms-transform: translate(100%,-100%); background: -moz-linear-gradient(45deg, rgba(82,255,197,1) 0%, rgba(56,172,201,1) 100%); background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(82,255,197,1)), color-stop(100%, rgba(56,172,201,1))); background: -webkit-linear-gradient(45deg, rgba(82,255,197,1) 0%, rgba(56,172,201,1) 100%); background: -o-linear-gradient(45deg, rgba(82,255,197,1) 0%, rgba(56,172,201,1) 100%); background: -ms-linear-gradient(45deg, rgba(82,255,197,1) 0%, rgba(56,172,201,1) 100%); background: linear-gradient(45deg, rgba(82,255,197,1) 0%, rgba(56,172,201,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38ACC9', endColorstr='#52ffc5',GradientType=1 ); } html.mobile #navm { opacity: 1; visibility:visible; transform: translate(0,0); -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -o-transform: translate(0,0); -ms-transform: translate(0,0); } #navm ul, #navm li { list-style: none; margin: 0; padding: 0; border: 0; width: 100%; } #navm ul { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); opacity: 0; } #navm li a { display: block; padding: 15px 20px; color: white; text-transform: uppercase; text-decoration: none; width: 100%; box-sizing: border-box; text-align: center; letter-spacing: 1px; font-family: 'TrendSansOne'; font-size: 30px; line-height: 30px; } #navm ul ul { position: relative; width:100%; top:auto; left:auto; transform: translate(0,0); -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -o-transform: translate(0,0); -ms-transform: translate(0,0); } #navm ul li ul li a { /*padding: 8px 30px 8px 20px;*/ /*font-size: 13px;*/ text-align: center!important; } #navm li a:hover { background: rgba(255,255,255,0.1); color:#373a3b; } #header h1 { display: none; } #header .nav-button { height: 60px; width: 60px; box-sizing: border-box; padding: 34px 30px 0; position: absolute; right: 15px; top: 15px; z-index: 100; cursor: pointer; display: none; background-position: center; background-repeat: no-repeat; background-size:60px; background-image: url(../../img/png/logo-navigation.png); } html.mobile #header .nav-button{ background-image: url(../../img/png/logo-navigation_w.png); } html.mobile #header .nav-button{ transform: rotate(90deg) ; -webkit-transform: rotate(90deg) ; -moz-transform: rotate(90deg) ; -o-transform: rotate(90deg) ; -ms-transform: rotate(90deg) ; } /* #header .nav-button span { height: 4px; background: #ffffff; margin: 4px 0 4px; display: block; position: relative; } */ @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } /* -- media ipad -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 1000px) { /* ----------- nav mobile --------------- */ #header .nav-button { display: block; } /* html.mobile #navm { left: 0; opacity: 1; visibility: visible; } html.mobile body { overflow: hidden; } html.mobile #layout { margin-left: 220px; margin-right: -220px; } html.mobile #layout .overlay { opacity: 1; visibility: visible; cursor: pointer; } html.mobile #layout .overlay:hover { background: rgba(0,0,0,0); } */ } /* -- scrollbar -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ ::-webkit-scrollbar { width: 5px; } ::-webkit-scrollbar-track { background: #eee; margin-right: 0; margin-top: 0; } ::-webkit-scrollbar-thumb { background: #ccc; } .owl-carousel .owl-stage, .owl-carousel.owl-drag .owl-item{ -ms-touch-action: auto; touch-action: auto; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; } /* -- general -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ input::selection, ::selection { color: #4d555a; background: #ffcc00; } input::-moz-selection, ::-moz-selection { color: #4d555a; background: #ffcc00; } html, body { -webkit-overflow-scrolling: touch; } body { -webkit-text-size-adjust: 100%; } html, body, img { margin: 0; padding: 0; border: 0; } button, input, textarea, body { font-family: 'Europa-Light', sans-serif; font-size: 13px; } a, input, button { outline: 0; } a { text-decoration: none; color: inherit; } h1, h2, h3, h4, h5, h6, p { margin-top: 0; font-family: 'Europa-Light'; } /* p{ font-size: 18px; } */ p { font-size: 20px; line-height: 130%; } #page{ position: relative; } /* -- general class -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ .section { position: relative; background-color: #fff; overflow: hidden; } .bg-eee { background-color: #eee; } .bg-white, .bg-fff { background-color: #fff; } .bg-999 { background-color: #999; } .clear { clear: both; } .bg-100{ background-position: center; background-repeat: no-repeat; background-size: 100%; } .bg-cover{ background-position: center; background-repeat: no-repeat; background-size: cover; } .bg-grey{ background-color: #efefef; } .bg-fixed{ background-attachment: fixed; background-position: center; background-size: cover; } .bg-d-grey{ /*background-color: #222222;*/ background-color: #222; } .bg-60{ background-size: 60%; background-position: center; background-repeat: no-repeat; } select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; text-overflow: ''; } select::-ms-expand { display: none; } body{ overflow-x: hidden!important; text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; min-height: 100%; background-color: #ffffff; } .mask{ overflow: hidden; } .prlx{ padding:20%; } .prlx .cover-slide.hide{ width:100%; } .prlx .cover-slide{ position: absolute; top:0; left:0; width:0; bottom: 0; z-index: 1; background: -moz-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(82,255,197,0.45)), color-stop(100%, rgba(56,172,201,1))); background: -webkit-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -o-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -ms-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38ACC9', endColorstr='#52ffc5',GradientType=1 ); } /* -- align -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ .align-center { text-align: center!important; } .align-left { text-align: left!important; } .align-right { text-align: right!important; } /* -- cookie -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ html.cookie #cookie { bottom: 0; } #cookie { position: fixed; bottom: -110%; left: 0; right: 0; width: 100%; /* background: #222222;*/ background: #222; z-index: 9999; overflow: hidden; border-top: 1px solid #3be775; transition: All .8s ease; -webkit-transition: All .8s ease; -moz-transition: All .8s ease; -o-transition: All .8s ease; -webkit-box-shadow: 0px 0 20px rgba(0,0,0,0.4); box-shadow: 0px 0 20px rgba(0,0,0,0.4); display: -webkit-box; display: -ms-flexbox; display: flex; } #cookie span { width: 50px; height: 50px; display: block; background-image: url(../../img/png/close.png); background-repeat: no-repeat; background-position: center; background-size: 25px; float: right; position: relative; z-index: 1000; cursor: pointer; -webkit-transition: .3s; transition: .3s; } /* #cookie span:hover { background-image: url(../../img/png/close2.png); } */ #cookie .cookie-btns-wrap { /* float: right;*/ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #cookie button { display: block; /* float: right;*/ position: relative; z-index: 10000; cursor: pointer; margin: 15px 15px 15px 0; border: none; background-color: #3be775; border: 1px solid #3be775; padding: 2px 10px; border-radius: 10px; color: #222; font-size: 16px; width: 200px; } #cookie button.deny-cookies { background-color: transparent; color: #3be775; } #cookie button:hover { background-color: #3be775; border: 1px solid #3be775; color: #fff; } #cookie span:hover { opacity: 0.6; } #cookie p { position: relative; /* width: 100%;*/ /* padding: 14px 55px 14px 0px;*/ padding: 15px; text-align: center; font-size: 16px; color: #fff; margin-bottom: 0; margin-top: 0; /* float: left;*/ } #cookie a { color: #3be775; -webkit-transition: .3s; transition: .3s; } #cookie a:hover { opacity: 0.6; } /* -- w -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ .w.w25p { width: 25%; } .w.w50p { width: 50%; } .w.w75p { width: 75%; } .w.w100p { width: 100%; } input{ -webkit-appearance: none; } /* -- extra -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ .publisher { opacity: 0; visibility: hidden; height: 0; width: 0; display: block; overflow: hidden; } /* -- Core -- */ /* ---------------------------------------------------------------------------------------------------------------------------------------------------*/ html, body, #layout, #page, #wrapper, .module-full-screen, .module-full-screen .module-slider-fullscreen, .module-full-screen .module-slider-fullscreen .slick-list, .module-full-screen .module-slider-fullscreen .slick-track, .module-full-screen .module-slider-fullscreen .slide{ width:100%; height: 100%; } .bg-fix{ background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } span.line{ width:25px; height: 3px; /*background-color:#222222;*/ background-color:#222; display: block; margin-bottom: 50px; } span.line.green{ background-color: #3be775; } span.line.white{ background-color: #fff; } .d span.line{ background-color:#c6c6c4; } .link{ position: absolute; top: 73%; right: 30%; width: 17%; height: 8%; } .module-full-screen .scroll { position: absolute; bottom: 50px; left: 50%; transform: translate(-50%, 0px); -webkit-transform: translate(-50%, 0px); -moz-transform: translate(-50%, 0px); -o-transform: translate(-50%, 0px); -ms-transform: translate(-50%, 0px); width: 20px; height: 20px; z-index: 1000; background-position: 50% 0; background-size: 50px; background-repeat: repeat-y; border-radius: 100%; cursor: pointer; box-shadow: 0 0 0 0 rgba(59, 255, 117, 0.5); -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1); -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1); -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1); animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1); } @-webkit-keyframes pulse {to {box-shadow: 0 0 0 33px rgba(232, 76, 61, 0);}} @-moz-keyframes pulse {to {box-shadow: 0 0 0 33px rgba(232, 76, 61, 0);}} @-ms-keyframes pulse {to {box-shadow: 0 0 0 33px rgba(232, 76, 61, 0);}} @keyframes pulse {to {box-shadow: 0 0 0 33px rgba(232, 76, 61, 0);}} .module-full-screen .scroll:hover{ background-color: #3bff75; } .module-full-screen .scroll:hover span{ -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; } html .sec1{ opacity: 1; -webkit-transform: scale(1); transform: scale(1); } /* html.is-loaded .sec1{ opacity: 1; -webkit-transform: scale(1); transform: scale(1); } html .load-gif{ opacity: 1; } html.is-loaded .load-gif{ opacity: 0; margin-left: -600px; transform: skew(-5deg); left: 0; } #wrapper{ z-index: 1; } html.is-loaded .nav__overlay__box { left: 50%; } */ html .load-gif{ opacity: 1; } .load-gif{ background-color: #3be775; position: fixed; bottom: 0; top: 0; right: 0; bottom: 0; transform-origin: 0% 100%; margin-left: 0; transform: skew(-90deg); left: 110%; z-index: 10; pointer-events: none; } .nav__overlay__box { /*background-color: #444e53;*/ z-index: 10; top: 0; bottom: 0; right: 0; position: absolute; left: 0; transition: 0.7s; } html.is-loaded .load-gif{ opacity: 0; margin-left: -600px; transform: skew(-5deg); left: 0; } html.is-loaded .nav__overlay__box { left: 50%; } .mobileBox{ display: none; } .d p{ /*color:#c6c6c4;*/ color:#fff; } .module-center-box-parent{ /*padding:45%;*/ padding:50%; position: relative; } .module-center-box-parent.morePadd{ padding: 53% 0; } .module-center-box-parent.d{ /*background-color: #353533; */ background-color: #222; } .module-center-box-parent.b{ background-color: #000; } .module-center-box-parent .module-center-box{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .module-center-box-parent .bottom-box{ position: absolute; bottom: 0; left:0; right:0; /* background-color: rgba(64,64,66,0.95);*/ background-color: #222; height: calc(100% - 200px); } .text-big p{ /* font-size: 30px; line-height: 40px; */ font-size: 25px; line-height: 35px; } /* -- media desktop -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 1320px) { .module-center-box-parent .module-center-box { width: 80%; } .text-big p { font-size: 24px; line-height: 30px; } span.line { margin-bottom: 25px; } } @media screen and (max-width: 1100px) { .module-center-box-parent .module-center-box { width: 80%; } .text-big p { font-size: 18px; line-height: 24px; } .bg-fix{ background-attachment: scroll; } p { font-size: 20px; } #cookie { display: block; } #cookie button { margin-top: 0; } } @media screen and (max-width: 767px) { .module-center-box-parent{ padding:50px 25px; } .module-center-box-parent .module-center-box{ position:relative; top:0; left:0; transform: none; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; width:100%; } .prlx{ padding:35%; } .mobileBox{ display: block; } .noMobP{ display: none!important; } .bg-fixed { background-attachment: scroll; } .load-gif{ display: none; } p { font-size: 16px; } #cookie span { width: 30px; height: 30px; } #cookie p { /* padding: 10px 80px 10px 10px;*/ font-size: 12px; } #cookie button { margin: 0 10px 10px; font-size: 12px; width: 150px; float: none; } }/* -- tooltip -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ #tooltip { margin: 20px 0 0 10px; margin-left: -60px; width: 160px; padding: 10px; z-index: 9900; position: absolute; text-align: center; color: #4a4f52; box-shadow: 5px 5px 0 rgba(0,0,0,0.1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-transform: uppercase; display: none; background: #ffcc00; } #tooltip.right { margin-left: -80px; }/* -- loading -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ #loading{ position: fixed; top:50%; left:50%; height: 100%; width:100%; z-index: 11000; overflow: hidden; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } #loading .img-bg{ background-image: url(../../img/jpg/home-a.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-animation: zoomin 20s ease-in infinite; animation: zoomin 20s ease-in infinite; transition: all .5s ease-in-out; position: absolute; top:0; left:0; bottom:0; right:0; z-index: 2; } #loading .logo-loading{ width: 350px; height: 110px; float: left; margin-top: 40px; margin-left: 40px; position: relative; z-index: 6; } #loading .logo-loading svg path{ fill :#4ae9e1; } #loading .cover{ position: absolute; top:0; left:0; bottom:0; right:0; z-index: 5; background: -moz-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(82,255,197,0.45)), color-stop(100%, rgba(56,172,201,1))); /* safari4+,chrome */ background: -webkit-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); /* safari5.1+,chrome10+ */ background: -o-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); /* opera 11.10+ */ background: -ms-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); /* ie10+ */ background: linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); /* w3c */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38ACC9', endColorstr='#52ffc5',GradientType=1 ); /* ie6-9 */ } #loading.act{ height: 10px; } #loading.act.a{ width:10px; } #loading.act.b{ height:0; width:0; } #loading.act.b .cover{ background: #fff; } #loading .module-slide-boxes{ position: absolute; bottom:3vw; right:10vw; width:500px; z-index: 6; } #loading .module-slide-boxes span.line{ width:50px; background-color: #3bff75; } .slick-slide-panel{ position:relative; margin-bottom: 25px; overflow:hidden; } .slick-slide-panel .slide{ width:100%; } .slick-slide-panel .slide span{ display: block; font-size: 55px; letter-spacing: 1px; font-family: 'Europa-Light'; color:#3bff75; text-transform: uppercase; } html #loading .logo-loading{ transform: translate(-120%, 0px); -webkit-transform: translate(-120%, 0px); -moz-transform: translate(-120%, 0px); -o-transform: translate(-120%, 0px); -ms-transform: translate(-120%, 0px); } html .module-slide-boxes{ transform: translate(1600%, 0px); -webkit-transform: translate(160%, 0px); -moz-transform: translate(160%, 0px); -o-transform: translate(160%, 0px); -ms-transform: translate(160%, 0px); } html.step1 .module-slide-boxes{ transition-delay: .5s; } html.step1 .module-slide-boxes, html.step1 #loading .logo-loading{ transform: translate(0,0); -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -o-transform: translate(0,0); -ms-transform: translate(0,0); } /* Zoom in Keyframes */ @-webkit-keyframes zoomin { 0% {transform: scale(1);} 50% {transform: scale(1.5);} 100% {transform: scale(1);} } @keyframes zoomin { 0% {transform: scale(1);} 50% {transform: scale(1.5);} 100% {transform: scale(1);} } /*End of Zoom in Keyframes */ /* Zoom out Keyframes */ @-webkit-keyframes zoomout { 0% {transform: scale(1);} 50% {transform: scale(0.67);} 100% {transform: scale(1);} } @keyframes zoomout { 0% {transform: scale(1);} 50% {transform: scale(0.67);} 100% {transform: scale(1);} }/*End of Zoom out Keyframes */ @media screen and (max-width: 1150px) { #loading .module-slide-boxes { right: 6vw; } } @media screen and (max-width: 1050px) { #loading .module-slide-boxes { right: 6vw; bottom:15vw; } } @media screen and (max-width: 767px) { #loading .module-slide-boxes { width:100%; right:0; padding:0 25px; } .slick-slide-panel .slide span{ font-size: 25px; } html #loading .logo-loading{ width: 180px; height: 60px; margin-left: 25px; } html #loading .logo-loading svg{ width:100%; } } /* #47daff - blue #52ffc5 - Green */#loading-wrap { position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 13500; display: block; /* display: none;*/ /* pointer-events: none;*/ } @keyframes hide-loading { 0% { display: block; } 100% { display: none; } } .loading-wrap-img { position: absolute; top: 0; left: 0; height: 100%; width: 100%; /* background-image: url(../../img/jpg/location-hero.jpg);*/ background-image: url(../../img/jpg/contact-par.jpg); } .loading-wrap-img::after { content: ''; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: rgba(0,0,0,0.5); } #loading-wrap.vid-ended .loading-wrap-img { -webkit-animation: .5s hide-loading-img 6s forwards; animation: .5s hide-loading-img 6s forwards; } @keyframes hide-loading-img { 0% { opacity: 1; } 100% { opacity: 0; } } .loading-video-wrap { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1000; background-color: #161c1c; z-index: 1000; opacity: 1; /* display: none;*/ } #loading-wrap.vid-ended .loading-video-wrap { -webkit-animation: 1s hide-vid forwards; animation: 1s hide-vid forwards; } @keyframes hide-vid { 0% { opacity: 1; } 100% { opacity: 0; } } .loading-video-wrap video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; /* z-index: -100;*/ transform: translateX(-50%) translateY(-50%); /* background: url('//demosthenes.info/assets/images/polina.jpg') no-repeat; background-size: cover; transition: 1s opacity; */ } .loading-anim-wrap { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; z-index: 100; } .loading-anim-box { width: 33.33%; height: 100%; position: relative; overflow: hidden; } #loading-wrap.vid-ended .loading-anim-box:first-child { /* border-right: 2px solid #3bff75;*/ -webkit-animation: 2s anim-box-stretch-1 forwards; animation: 2s anim-box-stretch-1 forwards; } #loading-wrap.vid-ended .loading-anim-box:last-child { /* border-left: 2px solid #3bff75;*/ -webkit-animation: 2s anim-box-stretch-1 forwards; animation: 2s anim-box-stretch-1 forwards; } #loading-wrap.vid-ended .loading-anim-box:nth-child(2) { width: 0; -webkit-animation: 2s anim-box-stretch-2 forwards; animation: 2s anim-box-stretch-2 forwards; } @keyframes anim-box-stretch-1 { 0% { width: 50%; } 100% { width: 33.33%; } } @keyframes anim-box-stretch-2 { 0% { width: 0; } 100% { width: 33.33%; } } .loading-anim-box::before { content: ''; position: absolute; top: 0; right: 0; height: 100%; width: 2px; background-color: #3bff75; z-index: 1; opacity: 0; } .loading-anim-box:last-child::before { display: none; } #loading-wrap.vid-ended .loading-anim-box::before { opacity: 1; -webkit-animation: 1s anim-box-border-hide 5s forwards; animation: 1s anim-box-border-hide 5s forwards; } @keyframes anim-box-border-hide { 0% { width: 2px; opacity: 1; } 100% { width: 0; opacity: 0; } } .loading-anim-box::after { content: ''; position: absolute; height: 100%; width: 100%; background-color: #161c1c; top: 0; left: 100%; z-index: 5; } #loading-wrap.vid-ended .loading-anim-box::after { -webkit-animation: 2s anim-box-shade 5s forwards; animation: 2s anim-box-shade 5s forwards; } @keyframes anim-box-shade { 0% { left: 100%; } 45% { left: 0%; } 65% { left: 0%; } 100% { left: 100%; } } /*--- Animation Icons ------*/ .load-icon { position: absolute; height: 10vw; width: 10vw; /* top: -50vw; left: -50vw; */ opacity: 0; } #loading-wrap.vid-ended .load-icon { opacity: 1; } #loading-wrap.vid-ended .load-icon.ld-leaf { height: 20vw; width: 20vw; /* transform: rotate(25deg); top: 3vw; left: 3vw; */ left: -24vw; top: 5vw; transform: rotate(0deg); -webkit-animation: 4.5s show-icon-1 0.5s forwards; animation: 4.5s show-icon-1 0.5s forwards; } @keyframes show-icon-1 { 0% { left: -24vw; top: 5vw; transform: rotate(0deg); } 45% { left: 3vw; top: 3vw; transform: rotate(25deg); } 65% { left: 3vw; top: 3vw; transform: rotate(25deg); } 100% { left: -24vw; top: 5vw; transform: rotate(0deg); } } #loading-wrap.vid-ended .load-icon.ld-chicken { height: 26vw; width: 18vw; /* bottom: 1vw; left: -3vw; transform: rotate(10deg); */ left: -23vw; bottom: -2vw; transform: rotate(35deg); -webkit-animation: 4.5s show-icon-2 0.5s forwards; animation: 4.5s show-icon-2 0.5s forwards; } @keyframes show-icon-2 { 0% { left: -23vw; bottom: -2vw; transform: rotate(35deg); } 45% { bottom: 1vw; left: -3vw; transform: rotate(10deg); } 65% { bottom: 1vw; left: -3vw; transform: rotate(10deg); } 100% { left: -23vw; bottom: -2vw; transform: rotate(35deg); } } #loading-wrap.vid-ended .load-icon.ld-rawr { width: 18vw; height: 9vw; /* top: 2vw; left: -1vw; */ top: 4vw; left: -19vw; -webkit-animation: 4.5s show-icon-3 0.5s forwards; animation: 4.5s show-icon-3 0.5s forwards; } @keyframes show-icon-3 { 0% { top: 4vw; left: -19vw; } 45% { top: 2vw; left: -1vw; } 65% { top: 2vw; left: -1vw; } 100% { top: 4vw; left: -19vw; } } #loading-wrap.vid-ended .load-icon.ld-white-pine { width: 7vw; height: 9vw; /* left: 5vw; top: 17vw; transform: rotate(35deg); */ left: -9vw; top: 20vw; transform: rotate(0deg); -webkit-animation: 4.5s show-icon-4 0.5s forwards; animation: 4.5s show-icon-4 0.5s forwards; } @keyframes show-icon-4 { 0% { left: -9vw; top: 20vw; transform: rotate(0deg); } 45% { left: 5vw; top: 17vw; transform: rotate(35deg); } 65% { left: 5vw; top: 17vw; transform: rotate(35deg); } 100% { left: -9vw; top: 20vw; transform: rotate(0deg); } } #loading-wrap.vid-ended .load-icon.ld-digme { height: 16vw; width: 10vw; /* left: 19vw; top: 11vw; */ left: -12vw; top: 9vw; transform: rotate(0deg); -webkit-animation: 4.5s show-icon-5 0.5s forwards; animation: 4.5s show-icon-5 0.5s forwards; } @keyframes show-icon-5 { 0% { left: -12vw; top: 9vw; transform: rotate(-30deg); } 45% { left: 19vw; top: 11vw; transform: rotate(0deg); } 65% { left: 19vw; top: 11vw; transform: rotate(0deg); } 100% { left: -12vw; top: 9vw; transform: rotate(-30deg); } } #loading-wrap.vid-ended .load-icon.ld-lab-store { height: 10vw; width: 10vw; /* bottom: 9vw; left: 19vw; transform: rotate(20deg); */ bottom: 13vw; left: -14vw; transform: rotate(-30deg); -webkit-animation: 4.5s show-icon-6 0.5s forwards; animation: 4.5s show-icon-6 0.5s forwards; } @keyframes show-icon-6 { 0% { bottom: 13vw; left: -14vw; transform: rotate(-30deg); } 45% { bottom: 9vw; left: 19vw; transform: rotate(20deg); } 65% { bottom: 9vw; left: 19vw; transform: rotate(20deg); } 100% { bottom: 13vw; left: -14vw; transform: rotate(-30deg); } } #loading-wrap.vid-ended .load-icon.ld-crosstown { height: 15vw; width: 15vw; /* bottom: 2vw; left: 1vw; transform: rotate(40deg); */ bottom: 0vw; left: -18vw; transform: rotate(-30deg); -webkit-animation: 4.5s show-icon-7 0.5s forwards; animation: 4.5s show-icon-7 0.5s forwards; } @keyframes show-icon-7 { 0% { bottom: 0vw; left: -18vw; transform: rotate(120deg); } 45% { bottom: 2vw; left: 1vw; transform: rotate(40deg); } 65% { bottom: 2vw; left: 1vw; transform: rotate(40deg); } 100% { bottom: 0vw; left: -18vw; transform: rotate(120deg); } } #loading-wrap.vid-ended .load-icon.ld-cloud { width: 22vw; height: 13vw; /* top: 12vw; left: -9vw; */ top: 15vw; left: -25vw; -webkit-animation: 4.5s show-icon-8 0.5s forwards; animation: 4.5s show-icon-8 0.5s forwards; } @keyframes show-icon-8 { 0% { top: 15vw; left: -25vw; } 45% { top: 12vw; left: -9vw; } 65% { top: 12vw; left: -9vw; } 100% { top: 15vw; left: -25vw; } } #loading-wrap.vid-ended .load-icon.ld-plate { width: 30vw; height: 30vw; /* bottom: -15vw; left: -15vw; transform: rotate(0deg); */ bottom: -11vw; left: -33vw; transform: rotate(0deg); -webkit-animation: 4.5s show-icon-9 0.5s forwards; animation: 4.5s show-icon-9 0.5s forwards; } @keyframes show-icon-9 { 0% { bottom: -11vw; left: -33vw; transform: rotate(0deg); } 45% { bottom: -15vw; left: -15vw; } 65% { bottom: -15vw; left: -15vw; } 100% { bottom: -11vw; left: -33vw; transform: rotate(120deg); } } #loading-wrap.vid-ended .load-icon.ld-mug { width: 15vw; height: 12vw; /* bottom: 10vw; left: 16vw; transform: rotate(-20deg); */ bottom: 13vw; left: -19vw; transform: rotate(20deg); -webkit-animation: 4.5s show-icon-10 0.5s forwards; animation: 4.5s show-icon-10 0.5s forwards; } @keyframes show-icon-10 { 0% { bottom: 13vw; left: -19vw; transform: rotate(20deg); } 45% { bottom: 10vw; left: 16vw; transform: rotate(-20deg); } 65% { bottom: 10vw; left: 16vw; transform: rotate(-20deg); } 100% { bottom: 13vw; left: -19vw; transform: rotate(20deg); } } /*============= Responsiveness =================*/ @media screen and (max-width: 1100px) { .loading-anim-box { width: 50% !important; -webkit-animation: none !important; animation: none !important; } .loading-anim-box:first-child { display: none; } #loading-wrap.vid-ended .load-icon.ld-rawr { width: 27vw; height: 14vw; top: 6vw; left: -29vw; -webkit-animation: 4.5s show-icon-3-ipad 0.5s forwards; animation: 4.5s show-icon-3-ipad 0.5s forwards; } @keyframes show-icon-3-ipad { 0% { top: 6vw; left: -29vw; } 45% { top: 2vw; left: -1vw; } 65% { top: 2vw; left: -1vw; } 100% { top: 6vw; left: -29vw; } } #loading-wrap.vid-ended .load-icon.ld-white-pine { width: 10vw; height: 13vw; /* left: 9vw; top: 29vw; */ left: -14vw; top: 24vw; -webkit-animation: 4.5s show-icon-4-ipad 0.5s forwards; animation: 4.5s show-icon-4-ipad 0.5s forwards; } @keyframes show-icon-4-ipad { 0% { left: -14vw; top: 24vw; transform: rotate(0deg); } 45% { left: 9vw; top: 29vw; transform: rotate(35deg); } 65% { left: 9vw; top: 29vw; transform: rotate(35deg); } 100% { left: -14vw; top: 24vw; transform: rotate(0deg); } } #loading-wrap.vid-ended .load-icon.ld-digme { height: 25vw; width: 15vw; /* left: 26vw; top: 19vw; */ left: -20vw; top: 13vw; -webkit-animation: 4.5s show-icon-5-ipad 0.5s forwards; animation: 4.5s show-icon-5-ipad 0.5s forwards; } @keyframes show-icon-5-ipad { 0% { left: -20vw; top: 13vw; transform: rotate(-30deg); } 45% { left: 26vw; top: 19vw; transform: rotate(0deg); } 65% { left: 26vw; top: 19vw; transform: rotate(0deg); } 100% { left: -20vw; top: 13vw; transform: rotate(-30deg); } } #loading-wrap.vid-ended .load-icon.ld-lab-store { height: 14vw; width: 14vw; /* bottom: 16vw; left: 30vw; */ bottom: 10vw; left: -18vw; -webkit-animation: 4.5s show-icon-6-ipad 0.5s forwards; animation: 4.5s show-icon-6-ipad 0.5s forwards; } @keyframes show-icon-6-ipad { 0% { bottom: 10vw; left: -18vw; transform: rotate(-30deg); } 45% { bottom: 16vw; left: 30vw; transform: rotate(20deg); } 65% { bottom: 16vw; left: 30vw; transform: rotate(20deg); } 100% { bottom: 10vw; left: -18vw; transform: rotate(-30deg); } } #loading-wrap.vid-ended .load-icon.ld-crosstown { height: 22vw; width: 22vw; /* left: 4vw;*/ bottom: -2vw; left: -26vw; -webkit-animation: 4.5s show-icon-7-ipad 0.5s forwards; animation: 4.5s show-icon-7-ipad 0.5s forwards; } @keyframes show-icon-7-ipad { 0% { bottom: -2vw; left: -26vw; transform: rotate(120deg); } 45% { bottom: 2vw; left: 4vw; transform: rotate(40deg); } 65% { bottom: 2vw; left: 4vw; transform: rotate(40deg); } 100% { bottom: -2vw; left: -26vw; transform: rotate(120deg); } } #loading-wrap.vid-ended .load-icon.ld-cloud { width: 38vw; height: 23vw; /* top: 14vw; left: -40vw; */ top: 14vw; left: -40vw; -webkit-animation: 4.5s show-icon-8-ipad 0.5s forwards; animation: 4.5s show-icon-8-ipad 0.5s forwards; } @keyframes show-icon-8-ipad { 0% { top: 14vw; left: -40vw; } 45% { top: 12vw; left: -9vw; } 65% { top: 12vw; left: -9vw; } 100% { top: 14vw; left: -40vw; } } #loading-wrap.vid-ended .load-icon.ld-plate { width: 40vw; height: 40vw; bottom: -11vw; left: -42vw; transform: rotate(0deg); -webkit-animation: 4.5s show-icon-9-ipad 0.5s forwards; animation: 4.5s show-icon-9-ipad 0.5s forwards; } @keyframes show-icon-9-ipad { 0% { bottom: -11vw; left: -42vw; transform: rotate(0deg); } 45% { bottom: -15vw; left: -15vw; } 65% { bottom: -15vw; left: -15vw; } 100% { bottom: -11vw; left: -42vw; transform: rotate(120deg); } } #loading-wrap.vid-ended .load-icon.ld-mug { width: 23vw; height: 18vw; /* bottom: 21vw; left: 23vw; */ bottom: 13vw; left: -26vw; -webkit-animation: 4.5s show-icon-10-ipad 0.5s forwards; animation: 4.5s show-icon-10-ipad 0.5s forwards; } @keyframes show-icon-10-ipad { 0% { bottom: 13vw; left: -26vw; transform: rotate(20deg); } 45% { bottom: 21vw; left: 23vw; transform: rotate(-20deg); } 65% { bottom: 21vw; left: 23vw; transform: rotate(-20deg); } 100% { bottom: 13vw; left: -26vw; transform: rotate(20deg); } } } /*============= Responsiveness =================*/ @media screen and (max-width: 767px) { #loading-wrap.vid-ended { pointer-events: none; } .loading-wrap-img { display: none; } .loading-anim-box { width: 100% !important; display: none; } .loading-anim-box:last-child { display: none; } .load-icon { display: none; } }/* -- transition -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ #header .nav-button span, #header .nav-button, #layout .overlay, #layout, #navm, #loading .load, .transition { transition: .3s; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } .notransition { transition: none; -o-transition: none; -ms-transition: none; -moz-transition: none; -webkit-transition: none; } a.btn, .module-full-screen .scroll, .module-full-screen .scroll span, ul.nav li a, .colision-prev, #header .logo .pages-title, html #navigation, html.nav-open #navigation, .notransition{ transition: .5s; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; } /*#loading.act .cover, #loading .cover, #loading.act, #loading,*/ #btn-bg .fix.active, #btn-bg .fix, .hover-bg .fix, .hover-bg .fix.active, .prlx .cover-slide.hide, .prlx .cover-slide, .module-featured-spaces .col.col3 .text-box table tr td, .module-featured-spaces .col.col3 .text-box h4, .module-featured-spaces .col.col3 .img-box .image-main, .module-featured-spaces .col.col3 .img-box, .module-featured-spaces .link-page, .more-info-box .center-box a.link, .more-info-box .center-box .back-btn:hover:after, .more-info-box .center-box .back-btn:after, .brand-info-module.active .more-info-box, .brand-info-module .more-info-box, .brand-info-module.active .small-image-brand, .brand-info-module .small-image-brand, .btn-findMore:hover:after, .btn-findMore:after, .btn-findMore:before, .btn-findMore:hover:before, .btn-findMore, .module-full-screen.map-module.active .close:before, .module-full-screen.map-module .close:before, .module-full-screen.map-module.active .close:after, .module-full-screen.map-module .close:hover:after, .module-full-screen.map-module .close:after, .graph-sec .graph-wrap .graph-box .graph span, .graph-sec .graph-wrap .graph-values .val p, .graph-sec .graph-box .graph, html.is-loaded .sec1, html .sec1, html .module-slide-boxes, html #loading .logo-loading, html ul.nav, html.nav-open ul.nav, .notransition{ transition: .8s; -o-transition: .8s; -ms-transition: .8s; -moz-transition: .8s; -webkit-transition: .8s; } .module-full-screen.map-module.active .close, .module-full-screen.map-module .close, .module-full-screen.map-module.active .half-box, .module-full-screen.map-module .half-box, html .load-gif, html.is-loaded .load-gif, html.nav-open #header, html.nav-in #header, #header, #header.active, html.nav-open .wrap-hidden, .wrap-hidden, html ul.social, html.nav-open ul.social, .notransition{ transition: 1s; -o-transition: 1s; -ms-transition: 1s; -moz-transition: 1s; -webkit-transition: 1s; }.small-container, .container { position: relative; margin: 0 auto; width: 1440px; box-sizing: border-box; -moz-box-sizing: border-box; min-height: 1px; } .small-container{ width: 960px; } /* -- media desktop -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 1460px) { .container { width: 1280px; } } @media screen and (max-width: 1320px) { .container { width: 960px; } } /* -- media ipad -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 1024px) { .small-container, .container { width: 720px; } } /* -- media mobile -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 767px) { /* body { overflow: hidden; overflow-y: auto; } */ .small-container, .container { width: auto; } } /* -- cols -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ .col { float: left; width: 100%; position: relative; min-height: 1px; } .col.col2 { width: 50%; } .col.col3 { width: 33.33%; } .col.col3x2 { width: 66.66%; } .col.col4 { width: 25%; } .col.col4x3 { width: 75%; } .col.col5 { width: 20%; } .col.col5x4 { width: 80%; } .col.col5x3 { width: 60%; } .col.col5x2 { width: 40%; } .col.col6 { width: 16.66%; } /* -- cols + margin -- */ .col.col2.margin { width: 48%; margin-right: 4%; } .col.col3.margin { width: 32%; margin-right: 2%; } .col.col3x2.margin.col-left { width: 64%; margin-right: 4%; } .col.col3x2.margin.col-right { width: 64%; margin-left: 2%; } .col.col4.margin { width: 23.5%; margin-right: 2%; } .col.col4x3.margin.col-left { width: 74.5%; margin-right: 2%; } .col.col4x3.margin.col-right { width: 74.5%; margin-left: 2%; } .col.col5.margin { width: 18.4%; margin-right: 2%; } .col.col6.margin { width: 15%; margin-right: 2%; } .col.margin.last { margin-right: 0 !important; } /* -- media mobile -- */ /* ------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width: 767px) { .col { float: none !important; clear: both !important; width: 100% !important; margin-right: 0 !important; } } /* Animations --------------------------------------------------------------------------------------------------------------------------------------*/ .anim { transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -o-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -ms-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -moz-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); transform: translateY(0%) translateX(0%) !important; -o-transform: translateY(0%) translateX(0%) !important; -ms-transform: translateY(0%) translateX(0%) !important; -moz-transform: translateY(0%) translateX(0%) !important; -webkit-transform: translateY(0%) translateX(0%) !important; opacity: 1; z-index: 1100; } /* .anim.load-left, .anim.come-left { transform: translateX(-130%) !important; -o-transform: translateX(-130%) !important; -ms-transform: translateX(-130%) !important; -moz-transform: translateX(-130%) !important; -webkit-transform: translateX(-130%) !important; } .anim.load-right, .anim.come-right { transform: translateX(130%) !important; -o-transform: translateX(130%) !important; -ms-transform: translateX(130%) !important; -moz-transform: translateX(130%) !important; -webkit-transform: translateX(130%) !important; } .anim.come-top { transform: translateY(-130%) !important; -o-transform: translateY(-130%) !important; -ms-transform: translateY(-130%) !important; -moz-transform: translateY(-130%) !important; -webkit-transform: translateY(-130%) !important; } */ .anim.come-bott { transform: translateY(130%) !important; -o-transform: translateY(130%) !important; -ms-transform: translateY(130%) !important; -moz-transform: translateY(130%) !important; -webkit-transform: translateY(130%) !important; } .anim.come-fade{ opacity: 0; } .anim-fade{ opacity: 0; transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -o-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -ms-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); -moz-transition: all 0.8s cubic-bezier(0.39, 0.575, 0.565, 1); } .anim-fade.come{ opacity:1; } @-webkit-keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .come-right { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .come-left { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } .anim-box { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 0; /*opacity: 1;*/ } /* h1.anim-box { opacity: 1; } */ .delay{ transition-delay: 4s; } #map-anim .st0{ fill:none; stroke:#3BE075; stroke-width:10; stroke-linejoin:round; stroke-miterlimit:1.414; } #map-anim{ position: absolute; top: 7.7vw; width: 69.2vw; height: 66vw; right: 0; } #map-anim.come-right path{ fill-opacity:0; stroke-dasharray: 155%; stroke-dashoffset:155%; -moz-animation:DASH3 5s ease-in-out 1s forwards; -webkit-animation:DASH3 5s ease-in-out 1s forwards; animation:DASH3 5s ease-in-out 1s forwards; } @-webkit-keyframes DASH3{ 0% {stroke-dashoffset:155%;} 80% {stroke-dashoffset:0;fill-opacity:0;} 100%{stroke-dashoffset:0;fill-opacity:1;} } @-moz-keyframes DASH3{ 0% {stroke-dashoffset:155%;} 80% {stroke-dashoffset:0;fill-opacity:0;} 100%{stroke-dashoffset:0;fill-opacity:1;} } @media screen and (max-width: 1440px) { #map-anim { top: 18.7vw; height: 55vw; } } @media screen and (max-width: 1150px) { #map-anim { top: 21.7vw; height: 55vw; } } @media screen and (max-width: 767px) { .anim.come-bott { transform: translateY(0%) !important; -o-transform: translateY(0%) !important; -ms-transform: translateY(0%) !important; -moz-transform: translateY(0%) !important; -webkit-transform: translateY(0%) !important; } #map-anim { position: relative; top: 0; width: 100%; right: auto; height: 55vw; float: right; margin-bottom: 40px; } } #footer{ /*background-color: #222222;*/ background-color: #222; clear: both; padding:100px 50px 80px; } #footer #footer-logo{ width:220px; } #footer ul li a:hover{ color:#3bff75; } #footer #footer-logo path{ fill:#3bff75; } #footer .text-right{ margin-top: 50px; } /* #footer .col.col3x2 .col.col3.bord{ border-top:1px solid #fff; } */ #footer .col.col3x2 .col.col3{ margin-right:6%; width:29%; } /* #footer ul{ margin-top: 50px; } */ #footer ul li{ margin:5px 0; } #footer ul li a, #footer ul li, #footer p { color:#fff; font-size: 20px; } #footer .col.col3x2 .col.col3 img{ height: 50px; /* margin-top: 25px;*/ } #footer ul li.green{ color: #3be775; } html #footer ul.social{ right: 0; position: relative; transform: translate(0, 0); -webkit-transform: translate(0,0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); } #footer ul.social li{ /*float: left;*/ margin-right: 10px; } #footer ul.social li:last-child { margin-right: 0; } html #footer ul.social{ /* margin-top: 10px;*/ /* display: block;*/ margin-bottom: 39px; } #footer ul.social li:hover{ opacity: 0.5; transition:.8s; -webkit-transition:.8s; -moz-transition:.8s; -o-transition:.8s; } /* #footer ul.footer-nav { margin-top: 78px; } */ ul.social li a{ width:30px; height: 30px; border:2px solid #fff; border-radius:100%; display: block; } html.nav-open ul.nav{ right:0; } .wrap-nav{ position: absolute; top:0; /* width:635px; */ /*width:720px; */ width: 800px; right: 70px; overflow: hidden; display: none; } #footer ul.social{ right:0; position: relative; transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); -o-transform: translate(0, -100%); -ms-transform: translate(0, -100%); } #footer ul.social li.ico a{ background-position: center; background-repeat: no-repeat; background-size: 100%; } #footer ul.social li.ico.fb a{ background-image: url(../../img/png/fb.png); } #footer ul.social li.ico.tw a{ background-image: url(../../img/png/tw.png); } #footer ul.social li.ico.insta a{ background-image: url(../../img/png/insta.png); } #footer ul.social li.ico.trip a{ background-image: url(../../img/png/trip.png); } @media screen and (max-width: 1400px) { #footer ul li a, #footer ul li, #footer p{ font-size: 16px; } /* #footer ul { margin-top: 25px; } */ /* #footer ul.footer-nav { margin-top: 54px; } */ #footer #footer-logo { width: 140px; } } @media screen and (max-width: 1100px) { #footer { /* background-color: #222222;*/ clear: both; padding: 50px 50px; } } @media screen and (max-width: 1000px) { #footer .col.col3x2 .col.col3, #footer .col.col3x2, #footer .col.col3{ width:100%; clear: both!important; float:none!important; } #footer{ text-align:center; } /*#footer .col.col3x2 .col.col3.bord { margin: 25px 0 0; }*/ html #footer ul.social{ display: block; text-align: center; margin-top: 25px; } #footer ul.social li{ display: inline-block; float: none; } /* #footer ul.footer-nav { margin-top: 25px; } */ } .module-full-screen .module-slider-fullscreen{ width:100%; height:100%; position: relative; clear:both; } .module-full-screen .module-slider-fullscreen .slide{ background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; float: left; overflow: hidden; } .module-full-screen.fade-effect .module-slider-fullscreen .slideTop{ position: absolute; top:0; left:0; bottom:0; right:0; } .module-full-screen.fade-effect .module-slider-fullscreen .slideTop.a{ z-index: 3; } .module-full-screen.fade-effect .module-slider-fullscreen .slideTop.b{ z-index: 1; } .module-full-screen .mask{ height: 100%; } .module-full-screen .col.col2{ height: 100%; background-color: rgba(64,64,66,0.8); } .module-full-screen.sec1 .slide.zoom{ -webkit-animation: zoomin 25s ease-in; animation: zoomin 25s ease-in; transition: all .8s ease-in-out; } html.step2 .module-full-screen.sec1 .slide{ -webkit-animation: none; animation: none; transition: none; } .module-full-screen.sec1 .slide .bg{ position: absolute; height: 100%; width:100%; min-height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; transition: 1s; transform: scale(1); } /* html.loaded-shade .module-full-screen.sec1 .slide .bg{ transform: scale(1.1); } */ /* Zoom in Keyframes */ @-webkit-keyframes zoomin { 0% {transform: scale(1);} 50% {transform: scale(1.5);} 100% {transform: scale(1);} } @keyframes zoomin { 0% {transform: scale(1);} 50% {transform: scale(1.5);} 100% {transform: scale(1);} } /*End of Zoom in Keyframes */ /* @-webkit-keyframes zoomout { 0% {transform: scale(1);} 50% {transform: scale(0.67);} 100% {transform: scale(1);} } @keyframes zoomout { 0% {transform: scale(1);} 50% {transform: scale(0.67);} 100% {transform: scale(1);} }*/ /* .module-all-image img{ display: block; position: relative; margin: 0 auto; width:100%; } */ .cover-locate{ position: absolute; top:0; left:0; bottom:0; right:0; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url(../../img/jpg/cover-locate.png); } .cover-green{ position: absolute; top:0; left:0; bottom:0; right:0; z-index: 5; background: -moz-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(82,255,197,0.45)), color-stop(100%, rgba(56,172,201,1))); background: -webkit-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -o-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -ms-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38ACC9', endColorstr='#52ffc5',GradientType=1 ); } .sec1 h1{ position: absolute; bottom:50px; right:50px; color:#fff; font-size: 45px; font-family: 'Europa-Light'; z-index: 10; padding-left: 50px; } .sec1 h2 { position: absolute; bottom: 20px; right: 50px; color: #fff; font-size: 25px; font-family: 'Europa-Light'; z-index: 10; } .sec1 h1.green{ text-transform: uppercase; color:#3be775; } .sec1 h1 span{ font-family: 'Europa-Bold'; } .sec1 .rail-image{ position: absolute; top:50%; left:50%; display: block; width:300px; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .hero-video-wrap { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 100; background-color: #000; -webkit-transition: 1s; transition: 1s; opacity: 1; } .hero-video-wrap.end { opacity: 0; } .hero-video { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); min-width: 100%; min-height: 100%; display: none; width: auto; height: auto; overflow: hidden; } .hero-video.desk { display: block; } @media screen and (max-width: 1100px) { .sec1 h1 { font-size: 28px; } .sec1 .rail-image{ width:200px; } } @media screen and (max-width: 1100px) { .sec1 h1 { bottom: 100px; right: 0; left: 0; text-align: center; padding-left: 0; } .sec1 h2 { bottom: 75px; right: 0; left: 0; text-align: center; } .sec1 .rail-image{ width:150px; } } @media screen and (max-width: 767px) { .hero-video.desk { display: none; } .hero-video.mob { display: block; } } /* module-norm-screen -------------------------------------------------------------------------------------------------------------------------------*/ .module-slide-left .col.col2{ background-color: rgba(255,255,255,0.8); margin-top: 300px; padding:20%; } .module-slide-left .col.col2 p{ font-size: 33px; } .module-slide-left .col.col2 h4{ text-transform: uppercase; font-size:26px; margin-top:30px; } .module-slide-left .col.col2 img{ width:100px; display: block; margin-top: 50px; } @media screen and (max-width: 1320px) { .module-slide-left .col.col2 h4, .module-slide-left .col.col2 p { font-size: 24px; line-height: 30px; } .module-slide-left .col.col2 img { width: 50px; margin-top: 20px; } } @media screen and (max-width: 1100px) { .module-slide-left .col.col2 { margin-top: 0px; padding: 40% 0px; } .module-slide-left .col.col2 h4, .module-slide-left .col.col2 p { font-size: 18px; line-height: 24px; } } @media screen and (max-width: 767px) { .module-slide-left .col.col2 .module-center-box{ position: relative; top:0; left:0; transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform:translate(0, 0); width: 100%; } .module-slide-left .col.col2 { margin-top: 0px; padding:0; padding: 25% 20px; } } /* module-center-box --------------------------------------------------------------------------------------------------------------------------------------*/ .module-center-box{ position: absolute; top:55%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); width:70%; } .module-center-box .module-route-info{ margin-bottom: 25px; } .module-center-box .module-route-info h3, .module-center-box .module-route-info h3 span{ color:#fff; font-size: 70px; display: inline-block; -webkit-text-stroke: 1px #3bff75; text-stroke: 1px #3bff75; color: transparent; } .module-center-box .module-route-info h4{ color:#3be775; font-size: 20px; font-family: 'Europa-Bold'; }.sec2 .module-imagebox{ padding:37%; background-color: #ccc; margin-top: 250px; position: relative; z-index: 10; } .sec2 .module-center-box-parent .module-center-box .logo-img{ width:50px; margin-top: 50px; display: inline-block; } .sec2 .col.col2.right h2{ font-family: 'Europa-Bold'; font-size: 70px; margin-top: 50px; text-align: left; color: #c6c6c4; padding-left: 18vw; } .sec2 .col.col2.right h2 span{ color:#3be775; } .sec2 .col.col2.right .graph-svg{ padding: 50%; } .sec2 .col.col2.right .graph-svg img{ margin: 100px 0 50px; position: absolute; right: 0; top: 10vw; width: 69vw; z-index: 0; } @media screen and (max-width: 1100px) { .sec2 .module-imagebox{ margin-top: 200px; } .sec2 .col.col2.right h2 { font-size: 55px; } } @media screen and (max-width: 767px) { .sec2 .module-imagebox { margin-top: 0; } .sec2 .col.col2.right{ padding:50px 0 50px 25px; } .sec2 .col.col2.right h2 { font-size: 70px; margin-top: 0; padding-left: 0; } .sec2 .col.col2.right .graph-svg img { margin: 0; position: relative; right: 0; top: 0; width: 100%; } .sec2 .col.col2.right .graph-svg { padding: 0; } .module-video { height: 40%; } } @media screen and (max-width: 480px) { .sec2 .col.col2.right h2 { font-size: 50px; line-height: 50px; } } .module-video{ width: 100%; height: 100%; } .module-video .video_home { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%) scale(1.2); -moz-transform: translateX(-50%) translateY(-50%) scale(1.2); -ms-transform: translateX(-50%) translateY(-50%) scale(1.2); -o-transform: translateX(-50%) translateY(-50%) scale(1.2); transform: translateX(-50%) translateY(-50%) scale(1.2); min-width: 100%; min-height: 100%; width: auto; height: auto; overflow: hidden; } .controllsVideo{ position: absolute; width:150px; bottom:25px; right:25px; padding:10px; z-index: 10; } .controllsVideo span{ width:60px; height:60px; float:left; display: block; margin-right: 10px; background-position: center; background-repeat: no-repeat; background-size: 50px; } .controllsVideo span#play{ background-image: url(../../img/png/play.png); } .controllsVideo span#play.pause{ background-image: url(../../img/png/pause2.png); } .controllsVideo span#enlarge{ background-image: url(../../img/png/enlarge.png); } .controllsVideo span:nth-child(2){ margin-right: 0; } .video{ width:100%; height: 100%; position: relative; } #video, .video{ width:100%; height: 100%; } #video{ transform: scale(1.3); -webkit-transform:scale(1.3); -moz-transform:scale(1.3); -o-transform:scale(1.3); -ms-transform:scale(1.3); position:absolute; top:0; left:0; width:100%; height:100%; } .module-video.no-iframe { position: relative; width: 100%; height: 0 !important; padding-bottom: 56.25%; } .module-video.no-iframe video { margin: 0 auto; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media screen and (max-width: 1320px) { .module-video{ height: 45vw; } .module-video .video_home { height: auto; width: 100vw; -webkit-transform: translateX(-50%) translateY(-50%) scale(1); -moz-transform: translateX(-50%) translateY(-50%) scale(1); -ms-transform: translateX(-50%) translateY(-50%) scale(1); -o-transform: translateX(-50%) translateY(-50%) scale(1); transform: translateX(-50%) translateY(-50%) scale(1); } } @media screen and (max-width: 768px) { .controllsVideo { position: absolute; width: 150px; bottom: 10px; right: 10px; padding: 10px; } .module-video{ height: 56vw; } .module-video .video_home { height: 100%; width: 100%; } #video{ transform: scale(1); -webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); -ms-transform:scale(1); } } .sec4 .module-center-box-parent{ padding: 50% 0; } .sec4 .col.col2.left .module-center-box-parent .logo-img{ width:300px; margin-top: 50px; } .module-imagebox{ position: absolute; top:0; left:0; bottom:0; right:0; } .sec4 .col.col2.right .cover{ position: absolute; left:0; bottom:0; right:0; top:0; background-color: rgba(0,0,0,0.6); } .sec4 .col.col2.right .module-center-box-parent .module-center-box p{ color:#3be775; font-size: 60px; line-height: 70px; text-transform: uppercase; } .sec4.locate .module-center-box-parent .module-imagebox{ background-position: center top; } .sec4 .module-center-box-parent #locate_map{ width:35vw; position:absolute; top:0; left: 0; } #locate_map .st0{fill:none;stroke:#3BFF75;stroke-width:0.4552;stroke-miterlimit:10;} #locate_map .st1{fill:none;stroke:#3BFF75;stroke-width:6;stroke-miterlimit:10;} #locate_map .st2{fill:#1C3E93;} #locate_map .st3{fill:none;stroke:#DC241F;stroke-width:20;} #locate_map .st4{fill:none;stroke:#0019A8;stroke-width:20;} #locate_map .st5{fill:none;stroke:#BFBFBF;stroke-width:6;stroke-miterlimit:10;} #locate_map .st6{fill:#231F20;} #locate_map .st7{font-family:'Europa-Light';} #locate_map .st8{font-size:36.3983px;} #locate_map .st9{letter-spacing:1;} #locate_map .st10{fill:#A8A6A7;} #locate_map .st11{font-family:'Europa-Regular';stroke:none;} #locate_map .st12{font-size:23.2392px;} #locate_map .st13{fill:#FFFFFF;} #locate_map .st14{fill:#3BFF75;} #locate_map .st15{font-family:'Europa-Regular';} #locate_map .st16{font-size:47.1458px;} #locate_map .st17{letter-spacing:2;} #locate_map .st18{font-size:45.1948px;} @media screen and (max-width: 1320px) { .sec4 .col.col2.right .module-center-box-parent .module-center-box p { font-size: 45px; line-height: 55px; } } @media screen and (max-width: 1100px) { .sec4 .col.col2.right .module-center-box-parent .module-center-box p{ font-size: 30px; line-height: 40px; } .sec4 .col.col2.left .module-center-box-parent .logo-img { width: 150px; margin-top: 25px; } } @media screen and (max-width: 767px) { .sec4 .module-center-box-parent { padding: 40px 25px; } .sec4 .col.col2.right .module-center-box-parent{ padding: 20%; } .sec4 .col.col2.right .module-center-box-parent.mob-nopadd{ padding: 0; } .module-imagebox { position: relative; padding: 50%; } .sec4 .col.col2.right .module-center-box-parent.contain-img{ padding: 20px; } .sec4 .col.col2.right.fb .cover{ display: none; } .sec4 .col.col2.right.fb .module-center-box .anim-box{ padding:20px; } .sec4 .module-center-box-parent #locate_map{ width:100%; position:relative; top:0; left: 0; } } .sec5 .full-image-module-top{ position: relative; padding: 22vw; width:100%; } .sec5 .col.col2.left .module-center-box-parent{ margin-top: calc(-100% + 23vw); background-color: #fff; } .sec5 .col.col2.right .image-box{ width: 100%; height: 23vw; } a.btn{ display: inline-block; border: 1px solid #222222; margin-top: 50px; width: 300px; height: 65px; text-transform: uppercase; font-family: 'Europa-Light'; padding: 20px; font-size: 16px; color: #222222; letter-spacing: 2px; } a.btn:hover{ border: 1px solid #3be775!important; color:#fff!important; background-color: #3be775; } a.btn.w{ border: 1px solid #fff; color:#fff; } a.btn.w:hover{ border: 1px solid #222222!important; color:#222222!important; } @media screen and (max-width: 767px) { .sec5 .col.col2.left .module-center-box-parent{ margin-top: 0; } .sec5 .col.col2.right .image-box{ padding: 25%; height:0; } } .sec6 h3{ font-size: 40px; line-height: 50px; text-transform: uppercase; margin-bottom: 50px; } .sec6 .cover{ position: absolute; top:0; left:0; right:0; bottom:0; background-color: #3bff75; } #logo-small{ position: absolute; right:50px; bottom:50px; width:140px; } #logo-small path{ fill:#fff!important; stroke:none; } @media screen and (max-width: 1400px) { #logo-small { right: 20px; bottom: 20px; width: 100px; } } @media screen and (max-width: 1320px) { #logo-small { right: 20px; bottom: 20px; width: 50px; } } @media screen and (max-width: 1100px) { .sec6 h3{ margin-bottom: 20px; } a.btn{ margin-top: 20px; } } @media screen and (max-width: 767px) { .sec6 .col.col2.left .module-center-box-parent{ padding:25%; } .sec6.mob-nopadd .col.col2.left .module-center-box-parent{ padding:0; } } .views-spaces-module .view-info-area{ background-color: #222222 } .views-spaces-module .map-area, .views-spaces-module .view-info-area { padding: 28% 0; } .views-spaces-module .view-info-area.single .map-area, .views-spaces-module .view-info-area.single{ padding: 0; } .views-spaces-module .map-area{ background-color: #6a6a68; } .views-spaces-module .view-info-area.single .module-info-box{ position: relative; } .views-spaces-module .module-info-box{ position: absolute; top:0; left:0; width:100%; height: 100%; padding:100px 50px; display: none; } .views-spaces-module .module-info-box.active, .views-spaces-module .module-info-box.vis { display: block; } .views-spaces-module .module-info-box h1, .views-spaces-module .module-info-box h2 { color:#c6c6c4; font-size: 32px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 25px; } .views-spaces-module .module-info-box h2 small{ font-size: 15px; color:#3be775; } .views-spaces-module .module-info-box .image-box-area{ width:100%; padding:25%; background-color: #ccc; } .views-spaces-module .module-info-box .table-box-area{ margin-top: 25px; } .views-spaces-module .module-info-box .table-box-area .col.col3{ margin-right: 6%; width:29%; } .views-spaces-module .module-info-box .table-box-area h3{ font-size: 16px; letter-spacing: 2px; color:#3be775; font-family:'Europa-Regular'; text-transform: uppercase; border-top:1px solid #3be775; border-bottom:1px solid #3be775; padding-bottom:25px; padding-top: 5px; } .views-spaces-module .table-area table { width:100%; } .views-spaces-module .table-area table tr td{ color:#fff; padding:10px 0; } .views-spaces-module .table-area table tr:first-child td{ font-size: 20px; font-family: 'Europa-Regular'; } .views-spaces-module .table-area table tr td:nth-child(2){ text-align: right; } .views-spaces-module .table-area table tr.sec td{ color: #c6c6c4; font-size: 16px; } .views-spaces-module .module-info-box a.btn{ border: 1px solid #c6c6c4; color:#c6c6c4; } .views-spaces-module .map-area .space_map_svg{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform:translate(-50%, -50%); } .views-spaces-module .map-area .space_map_svg #spaces_map{ display: block; width:700px; height: 774px; } /* Default setting */ .st0,.st3,.st4{fill:none;stroke:#333;stroke-width:2;stroke-miterlimit:10} .st3,.st4{stroke:#3be775;stroke-width:.2862} .st4{stroke-width:3} .st8{font-size:22px} .st10{letter-spacing:-1} .st16{font-size:42px} .st20{font-size:33px} .st22{font-size:47px} .st26{fill:#3b5998!important} .st6{fill:#3be775} .st11{fill:none;stroke:#3be775;stroke-width:5;stroke-miterlimit:10} .st25{fill:none;stroke:#3b5998;stroke-width:5;stroke-miterlimit:10} .st6{font-family:'Europa-Bold'; fill:#3be775; } .st28 { font-size: 28px; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space, .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space path, .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space .st6{ transition: all .8s; -o-transition: all .8s; -ms-transition: all .8s; -moz-transition: all .8s; -webkit-transition: all .8s; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space path{ fill: #6a6a68; } .views-spaces-module .map-area .space_map_svg #spaces_map g.space.active path{ fill:#3be775; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space:hover, .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space:hover a{ cursor: pointer; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space:hover path{ fill:#3be775; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space:hover .st6, .views-spaces-module .map-area .space_map_svg #spaces_map g.space.active .st6{ fill:#fff; } .views-spaces-module .map-area .space_map_svg #spaces_map .none{ display: none; } .views-spaces-module .map-area .space_map_svg #spaces_map.act g.space.no-hover:hover path{ fill:#6a6a68; stroke:#3b5998; } .views-spaces-module .map-area .space_map_svg #spaces_map #facebook_small path.st25, .views-spaces-module .map-area .space_map_svg #spaces_map #facebook_big path.st25{ fill:#3b5998; cursor: auto; } .views-spaces-module .map-area .space_map_svg #spaces_map #facebook_small path.st26, .views-spaces-module .map-area .space_map_svg #spaces_map #facebook_big path.st26{ fill:#fff!important; } .views-spaces-module .map-area .space_map_svg #spaces_map g.space.no-hover.occupate .st6{ fill:#fff; letter-spacing: 1px; cursor:auto; } .views-spaces-module .map-area .space_map_svg.highlightOn #spaces_map.act g.space path{ fill:#3be775; } .views-spaces-module .map-area .space_map_svg.highlightOn #spaces_map g.space .st6{ fill:#ffffff; } .views-spaces-module .view-info-area.single .map-area .space_map_svg{ position: relative; top:0; left:0; transform:none; -webkit-transform:none; -moz-transform:none; -o-transform:none; -ms-transform:none; padding:72px 0; } .views-spaces-module .view-info-area.single .map-area .space_map_svg svg{ display: block; margin: 0 auto; } .module-space-information .space-info .space-image-bott{ width:100%; background-color: #ccc; height: 570px; } .views-spaces-module .view-info-area.single .module-info-box{ height: 820px; } .views-spaces-module .view-info-area.single .map-area{ height: 920px; } .views-spaces-module .map-area .space_map_svg #spaces_map g.space.no-hover.occupate path{ fill:#222222!important; stroke:#222222!important; cursor: auto; } .views-spaces-module .map-area .space_map_svg #spaces_map g.space.no-hover.occupate a.space-pointer path, .views-spaces-module .map-area .space_map_svg #spaces_map g.space.no-hover.occupate a.space-pointer text{ cursor: pointer; } @media screen and (max-width: 1440px) { .views-spaces-module .module-info-box{ padding:50px; } .views-spaces-module .map-area .space_map_svg #spaces_map { display: block; width: 550px; height: 608px; } .views-spaces-module .module-info-box .table-box-area h3{ font-size: 15px; } } @media screen and (max-width: 1350px) { .views-spaces-module .module-info-box .table-box-area .col.col3{ width:47%; } .views-spaces-module .module-info-box .table-box-area .col.col3:nth-child(2){ width:; margin-right: 0; } .views-spaces-module .module-info-box .table-box-area .col.col3.last{ width:100%; } .views-spaces-module .module-info-box a.btn{ margin-top: 20px; } .views-spaces-module .map-area, .views-spaces-module .view-info-area { padding: 33% 0; } } @media screen and (max-width: 1200px) { .views-spaces-module .map-area, .views-spaces-module .view-info-area { padding: 40% 0; } } @media screen and (max-width: 1100px) { .views-spaces-module .map-area, .views-spaces-module .view-info-area { padding: 40% 0; } .views-spaces-module .map-area .space_map_svg{ width:100%; } .views-spaces-module .map-area .space_map_svg #spaces_map{ width:100%; height: auto; } } @media screen and (max-width: 950px) { .views-spaces-module .map-area, .views-spaces-module .view-info-area{ width:100%; } .views-spaces-module .map-area .space_map_svg #spaces_map { width:550px; height:608px; margin: 0 auto; } .views-spaces-module .map-area .space_map_svg { position: relative; top: 0; left: 0; transform: none; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; } .views-spaces-module .module-info-box { position: relative; padding: 0; } .views-spaces-module .map-area, .views-spaces-module .view-info-area{ padding:50px; } } @media screen and (max-width: 600px) { .views-spaces-module .map-area, .views-spaces-module .view-info-area { padding:40px 25px; } .views-spaces-module .map-area .space_map_svg #spaces_map { width:100%; height:auto; margin: 0 auto; } }.graph-sec .center-box{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); width:1280px; } .graph-sec .graph-box{ position: relative; height:400px; } .graph-sec .graph-box .graph{ width:150px; position: absolute; bottom:0; -webkit-box-shadow: 0 8px 10px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0 8px 10px 0px rgba(0,0,0,0.2); box-shadow: 0 8px 10px 0px rgba(0,0,0,0.2); background-color: #3be775; float:left; text-align: center; font-size: 24px; letter-spacing: 1px; font-family:'Europa-Regular'; padding: 10px 0 0; } .graph-sec .graph-box .graph.a.act{ } .graph-sec .graph-box .graph.b{ left:50%; margin-left: -75px; } .graph-sec .graph-box .graph.c{ right: 0; } .graph-sec.module-full-screen .col.col2{ background-color: transparent; margin-right: 10%; width: 45%; } .graph-sec .graph-values{ position: relative; height: 150px; } .graph-sec .graph-values .val{ position: absolute; top:0; width:150px; height:150px; text-align: center; font-size: 20px; letter-spacing: 1px; text-transform: uppercase; padding-top:25px; } .graph-sec .graph-values .val.a{ left:0; } .graph-sec .graph-values .val.b{ left:50%; margin-left: -75px; } .graph-sec .graph-values .val.c{ right:0; } .graph-sec .col.col2.text-box h2{ font-size: 60px; text-transform: uppercase; color:#3be775; letter-spacing: 2px; } .graph-sec .col.col2.text-box p { color:#fff; font-size: 26px; margin-top: 10px; } .graph-sec .graph-wrap{ overflow: hidden; } .graph-sec .graph-wrap .graph-box .graph{ padding:0; height: 0; } .graph-sec .graph-wrap .graph-values .val p, .graph-sec .graph-wrap .graph-box .graph span{ opacity:0; -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); } .graph-sec .graph-box .graph.act{ padding:10px 0 0; } .graph-sec .graph-box .graph.a.act{ height:200px; } .graph-sec .graph-box .graph.b.act{ height:300px; } .graph-sec .graph-box .graph.c.act{ height:400px; } .graph-sec .graph-wrap .graph-box .graph span.act, .graph-sec .graph-wrap .graph-values .val p.act{ opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } @media screen and (max-width: 1100px) { .graph-sec .col.col2.text-box p { color: #fff; font-size: 18px; margin-top: 10px; } } @media screen and (max-width: 767px) { .graph-sec{ height: 115%; } .graph-sec .col.col2.text-box p { /*color:#222222;*/ color:#222; background-color: rgba(255,255,255,0.2); padding:10px; } .graph-sec span.line.green{ display: none; } .graph-sec .graph-values { height: 65px; } .graph-sec .col.col2.text-box h2 { font-size: 20px!important; } .graph-sec .graph-values .val{ padding-top:0; } .graph-sec .col.col2.text-box p{ font-size: 16px; } }.module-center-box.logos-companies .box-logos{ width:calc(100% / 3 - 14px); float: left; margin-right: 20px; margin-bottom: 20px; opacity: 0; } .module-center-box.logos-companies .box-logos:nth-child(3n+3){ margin-right: 0; } .module-center-box.logos-companies .box-logos .cycle-slideshow{ position: relative; } .module-center-box.logos-companies .box-logos .cycle-slideshow .display-logos{ width:100%; padding:25%; background-position: center; background-repeat: no-repeat; background-size: contain; } @media screen and (max-width: 1100px) { .module-center-box-parent .bottom-box { height: 100%; } .module-full-screen.map-module{ height: auto; } } @media screen and (max-width: 767px) { .module-center-box-parent .bottom-box { height:auto; padding: 40px 25px; } .module-center-box-parent.morePadd { padding: 0 0; } .module-center-box-parent .bottom-box{ position: relative; } .module-center-box-parent.morePadd.fadeR { padding: 25% 0; background-image: url(../../img/jpg/home/full-locate.jpg)!important; } } @media screen and (max-width: 480px) { .module-center-box.logos-companies .box-logos{ width: calc(100% / 2 - 5px); margin-right: 10px; } .box-logos:nth-child(3n+3) { margin-right: 10px; } .box-logos:nth-child(2n+2) { margin-right: 0!important; } .sec4 .col.col2.right .module-center-box-parent.mob-padd{ padding: 40px 25px; } } #map-location{ width:100%; height: 100%; } .module-full-screen.map-module .half-box{ position: absolute; top:0; left:0; bottom: 0; width:50%; z-index: 1000; background: -moz-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(82,255,197,0.45)), color-stop(100%, rgba(56,172,201,1))); background: -webkit-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -o-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: -ms-linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); background: linear-gradient(45deg, rgba(82,255,197,0.45) 0%, rgba(56,172,201,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#38ACC9', endColorstr='#52ffc5',GradientType=1 ); } .module-full-screen.map-module.active .half-box{ left:-50%; } .module-full-screen.map-module .half-box .module-center-box{ width:auto; top:50%; } .module-full-screen.map-module .half-box p{ color: #fff; font-size: 60px; line-height: 70px; text-transform: uppercase; } .module-full-screen.map-module .close{ position: absolute; top:50%; left:100%; width:50px; height:50px; z-index: 1100; margin-left: -50px; background-position: center; background-repeat: no-repeat; background-size: 50px; cursor: pointer; margin-top: -25px; } .module-full-screen.map-module .close:after{ content: '<'; position: absolute; top:10px; /* top:50%;*/ left:50%; transform: translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform:translate(-50%, -50%); -ms-transform: translate(-50%, -50%); font-family: 'TrendSansOne'; font-size: 60px; -webkit-text-stroke: 1px #3bff75; text-stroke: 1px #3bff75; color: transparent; } .module-full-screen.map-module .close:before{ content: '>'; position: absolute; top:10px; /* top:50%;*/ left:50%; transform: translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform:translate(-50%, -50%); -ms-transform: translate(-50%, -50%); font-family: 'TrendSansOne'; font-size: 60px; -webkit-text-stroke: 1px #3bff75; text-stroke: 1px #3bff75; color: transparent; opacity: 0; } .module-full-screen.map-module.active .close:before{ opacity: 1; color:#3bff75; } .module-full-screen.map-module.active .close:after{ opacity: 0; } .module-full-screen.map-module .close:hover:after{ color:#3bff75; } .module-full-screen.map-module.active .close{ left:calc(100% + 50px); background-color: rgba(56,172,201,0.8) } @media screen and (max-width: 1440px) { .graph-sec .center-box { width: 960px; } .graph-sec .graph-box .graph{ width:100px; } .graph-sec .graph-box .graph.b { margin-left: -50px; } .graph-sec .col.col2.text-box h2 { font-size: 50px; } .graph-sec .graph-values .val { width: 100px; } .graph-sec .graph-values .val p{ font-size: 13px; color:#fff; } .graph-sec .graph-values .val.b { margin-left: -50px; } } @media screen and (max-width: 1100px) { .graph-sec .center-box { width: 720px; } .graph-sec .graph-box .graph{ font-size: 18px; } .graph-sec .col.col2.text-box h2 { font-size: 40px; } .graph-sec .graph-box .graph.c.act { height: 300px; } .graph-sec .graph-box .graph.b.act { height: 220px; } .graph-sec .graph-box .graph.a.act { height: 150px; } .graph-sec .graph-box { height: 300px; } .graph-sec.module-full-screen .col.col2 { background-color: transparent; margin-right: 5%; width: 47%; } .module-full-screen.map-module .half-box{ position: relative; width:100%; } .module-full-screen.map-module .half-box .module-center-box { width: 100%; top: auto; position: relative; left:0; transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); padding: 40px 25px; } .module-full-screen.map-module .half-box p { text-align: center; font-size: 40px; line-height: 50px; } .module-full-screen.map-module .close, .module-full-screen.map-module span.line{ display: none; } #map-location{ /* height: 350px;*/ height: auto; padding: 40%; } /* .module-full-screen.map-module .half-box .module-center-box { padding: 150px 20px 40px; } */ } @media screen and (max-width: 767px) { .graph-sec .center-box { width: 100%; padding: 0 20px; } .graph-sec.module-full-screen .col.col2{ width: 320px!important; margin: 0 auto!important; } .graph-sec .graph-wrap .graph-values .val p{ font-size: 11px; height: 50px; background-color: rgba(255,255,255,0.5); padding: 10px 0; /* color:#222222;*/ color:#222; } .graph-sec .graph-values .val{ height: 50px; } .graph-sec .col.col2.text-box h2 { font-size: 28px; } } @media screen and (max-width: 767px) { #map-location { height: 250px; } .module-full-screen.map-module .half-box .module-center-box { padding: 40px 25px; } }.big-image-brand, .brand-info-module{ width:100%; height: 100%; position: relative; } .small-image-brand{ position: absolute; width:50%; background-color: rgba(0,0,0,0.8); z-index: 10; height: calc(100% - 200px); } .brand-info-module .small-image-brand .image-brand.p100{ position: absolute; top:0; bottom:0; right:0; left:0; } .brand-info-module .small-image-brand .image-brand .bott-img{ width:100%; position: absolute; left:0; bottom: 0; } .brand-info-module .btn-findMore{ position: absolute; display: inline-block; height: 50px; padding:15px 40px; width:210px; font-size: 16px; font-family: 'Europa-Light'; color:#fff; letter-spacing: 2px; cursor: pointer; border:2px solid #fff; } .brand-info-module .btn-findMore:before, .brand-info-module .btn-findMore:after{ content: 'View Details'; position: absolute; left: 0; top: 0; height: 50px; display: block; width: 100%; text-align: center; padding: 13px 0; opacity: 1; } .brand-info-module .btn-findMore[data-shop="JoeandTheJuice"]:before{ content: 'Joe & The Juice'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Omotesando"]:before{ content: 'Omotesando Koffee'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="AdamGroomingAtelier"]:before{ content: 'Adam Grooming Atelier'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="CrossTown"]:before{ content: 'CrossTown'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Available"]:before{ content: 'Available'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Omotesando"]:before { content: 'Omotesando Koffee'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="pilates"]:before { content: 'Pilates'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="yoga"]:before { content: 'Yoga'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="kerb"]:before { content: 'KERB'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Digme-Fitness"]:before { content: 'Digme Fitness'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="White-Pine"]:before { content: 'White Pine'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Caffe-Terra"]:before { content: 'Caffe Terra'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Circolo-Popolare"]:before { content: 'Circolo Popolare'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="LabStore"]:before { content: 'Lab Store London'; opacity: 0; } .brand-info-module .btn-findMore[data-shop="Rawr"]:before { content: 'Rawr'; opacity: 0; } .brand-info-module .btn-findMore:hover{ background-color: #3be775; border: 2px solid #3be775; } .brand-info-module .btn-findMore:hover:before{ opacity: 1; } .brand-info-module .btn-findMore:hover:after{ opacity: 0; } .brand-info-module.top-right .btn-findMore { bottom:25px; left:25px; } .brand-info-module.bottom-left .btn-findMore { bottom:25px; right:25px; } .brand-info-module.bottom-left .btn-findMore { bottom:25px; right:25px; } .brand-info-module.top-left .btn-findMore { bottom:25px; right:25px; } .brand-info-module.bottom-right .btn-findMore { bottom:25px; left:25px; } .more-info-box{ position: absolute; width:50%; background-color: rgba(0,0,0,0.8); bottom:0; top:0; } .more-info-box.green{ background-color: rgba(59, 231, 117,0.9); } .brand-info-module .small-image-brand .image-brand .center-box, .more-info-box .center-box{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .more-info-box .center-box h2{ color:#3be775; text-transform: uppercase; font-size: 28px; font-family: 'TrendSansOne'; margin-bottom: 10px; } .more-info-box.green .center-box h2{ /* color:#222222;*/ color:#222; } .more-info-box .center-box h3{ color:#c6c6c4; font-size: 24px; margin: 20px 0 10px; } .more-info-box.green .center-box h3{ /* color:#222222;*/ color:#222; font-family: Europa-Regular; } .more-info-box .center-box table tr td, .more-info-box .center-box p.small{ color:#8f8f8a; font-size: 18px; line-height: 22px; letter-spacing: 2px; } .more-info-box.green .center-box table tr td, .more-info-box.green .center-box p.small{ color:#f2f2f2; } .more-info-box .center-box p{ color:#c6c6c4; font-size: 30px; line-height: 40px; } .more-info-box .center-box table tr td{ padding: 5px 0; } .more-info-box .center-box table tr td:nth-child(1){ padding-right: 15px; text-align: left; } .more-info-box .center-box table tr td:nth-child(2){ text-align: right; } .more-info-box .center-box .back-btn{ display: inline-block; height: 50px; width:50px; position: relative; cursor: pointer; } .more-info-box .center-box .back-btn:after{ content: '<'; display: block; position: absolute; top:0; left:0; width:50px; height: 50px; line-height: 50px; font-family: 'TrendSansOne'; font-size: 50px; -webkit-text-stroke: 1px #3bff75; text-stroke: 1px #3bff75; color: transparent; } .more-info-box.green .center-box .back-btn:after{ -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; } .more-info-box.green .center-box .back-btn:hover:after{ -webkit-text-stroke: 1px #fff; text-stroke: 1px #fff; color: #fff; } .more-info-box .center-box .back-btn:hover:after{ color: #3bff75; } .brand-info-module .small-image-brand .image-brand .center-box h4 { line-height: 60px; font-family: 'TrendSansOne'; font-size: 60px; -webkit-text-stroke: 1px #3bff75; text-stroke: 1px #3bff75; color: transparent; text-align: center; } /* anim on click -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /* Top right */ .brand-info-module.top-right.active .small-image-brand{ top:0; right:-50%; } .brand-info-module.top-right .more-info-box{ top:0; right:-50%; bottom:0; } .brand-info-module.top-right.active .more-info-box{ right:0; } .brand-info-module.top-right .small-image-brand{ top:0; right:0; } /* Top Left */ .brand-info-module.top-left .small-image-brand{ top:0; left:0; } .brand-info-module.top-left .more-info-box{ left:-50%; } .brand-info-module.top-left.active .more-info-box{ left:0; } .brand-info-module.top-left .small-image-brand{ top:0; left:0; } .brand-info-module.top-left.active .small-image-brand{ top:0; left:-50%; } /* bottom Left */ .brand-info-module.bottom-left .small-image-brand{ bottom:0; left:0; } .brand-info-module.bottom-left .more-info-box{ left:-50%; } .brand-info-module.bottom-left.active .more-info-box{ left:0; } .brand-info-module.bottom-left .small-image-brand{ bottom:0; left:0; } .brand-info-module.bottom-left.active .small-image-brand{ bottom:0; left:-50%; } /* bottom Right */ .brand-info-module.bottom-right .small-image-brand{ bottom:0; right:0; } .brand-info-module.bottom-right .more-info-box{ right:-50%; } .brand-info-module.bottom-right.active .more-info-box{ right:0; } .brand-info-module.bottom-right .small-image-brand{ bottom:0; right:0; } .brand-info-module.bottom-right.active .small-image-brand{ bottom:0; right:-50%; } .more-info-box .center-box a.link{ color:#3be775; font-size: 20px; font-family: 'Europa-Regular'; position: relative; margin: 5px 0; top:0; left:0; bottom:0; display: block; right:0; width:auto; height:auto; } .more-info-box.green .center-box a.link{ /*color:#222222;*/ color:#222; } .more-info-box .center-box a.link:hover{ color:#fff; } .type-b .more-info-box .center-box h2{ font-size: 20px; line-height: 28px; } .more-info-box .center-box table tr td, .more-info-box .center-box p.small{ margin-bottom: 10px; font-size: 16px; } .type-b .more-info-box.green .center-box p.small a{ /*color:#222222;*/ color:#222; } .type-b .more-info-box .center-box p.small a{ color:#3be775; } .type-b .more-info-box .center-box p.small a:hover{ color:#fff; } .type-b .more-info-box .center-box h3{ font-size: 20px; } .type-b table{ margin-bottom: 10px; } @media screen and (max-width: 1440px) { .more-info-box .center-box{ width:60%; } } @media screen and (max-width: 1100px) { .more-info-box .center-box{ width:80%; } } @media screen and (max-width: 1000px) { .big-image-brand, .brand-info-module{ height: auto; } .small-image-brand { position: relative; padding: 25%; width: 100%; } .more-info-box .center-box { width: 100%; padding: 40px 25px; } .more-info-box .center-box { position: relative; top:0; left:0; transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); } .brand-info-module .more-info-box { top: 0!important; right:0!important; left:0!important; bottom:0!important; position: relative!important; width:100%!important; } .more-info-box .center-box .back-btn, .brand-info-module .btn-findMore{ display: none; } } @media screen and (max-width: 1000px) { .more-info-box .center-box h2 { font-size: 20px; } .brand-info-module .more-info-box table{ width:100%; } .more-info-box .center-box table tr td:nth-child(1){ padding-right: 0; } .more-info-box .center-box table tr td, .more-info-box .center-box p.small { color: #8f8f8a; font-size: 14px; line-height: 18px; letter-spacing: 0px; } .small-image-brand { padding: 40%; } } .module-download .col.col3{ padding: 15%; } .module-download { padding: 50px 0; } .module-download a{ display: block; top:50%; left:50%; position: absolute; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .module-download .icon-d{ width:200px; height: 200px; } .module-download a h4{ text-align: center; font-size: 26px; font-family: 'Europa-Regular'; margin-top: 20px; color:#c6c6c4; text-transform: uppercase; letter-spacing: 2px; } .module-download .col.col3 a:hover h4{ color:#3BE175; } .downloadSvg .dwn{ fill:none; stroke:#3BE175; stroke-width:40; stroke-linejoin:round; stroke-miterlimit:1.414; } .module-download a h4, .module-download svg.downloadSvg path{ transition: all .5s; -o-transition: all .5s; -ms-transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; /*fill:#222222;*/ fill:#222; } .module-download .col.col3 a:hover .downloadSvg .dwn.base{ stroke:#fff; } .downloadSvg .dwn.arrow{ -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .module-download .col.col3 a:hover .downloadSvg .dwn.arrow{ fill:#3BE175; -webkit-transform: translate(0px, 10%); -moz-transform: translate(0px, 10%); -o-transform: translate(0px, 10%); -ms-transform: translate(0px, 10%); transform: translate(0px, 10%); } @media screen and (max-width: 1000px) { .module-download { padding: 100px 0; } } @media screen and (max-width: 767px) { .module-download .icon-d { margin: 25px auto; } .module-download .col.col3 { padding: 0%; } .module-download a { display: block; top: 0; left: 0; position: relative; transform: none; -webkit-transform: none; -moz-transform:none; -o-transform: none; -ms-transform: none; } .module-download { padding: 40px 0; } } .module-space-information{ /*background-color: #222222;*/ background-color: #222; } .module-space-information .bg-green.box{ margin-top: 250px; background-color: #3be775; position: relative; height: 920px; } .module-space-information .bg-green.box .center-text-box{ position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform:translate(-50%, -50%); width:700px; } .module-space-information .bg-green.box .center-text-box h2{ font-size: 60px; } .module-space-information .bg-green.box .center-text-box h3{ font-size: 30px; margin-bottom: 25px; } .module-space-information .bg-green.box .center-text-box p{ font-size: 25px; line-height: 35px; }.module-text-info-space{ padding:250px 0; } .module-text-info-space.lessPadd{ padding: 150px 0; } .module-text-info-space .cover{ position: absolute; top:0; left:0; right:0; bottom:0; background-color: rgba(255,255,255,0.6); } .module-text-info-space .row{ margin-bottom: 20px; } .module-text-info-space .row h3{ font-family: 'Europa-Regular'; font-size: 26px; margin-bottom: 5px; } .module-text-info-space .row p{ font-size: 20px; } .module-text-info-space .col.col3{ width:29.33%; margin-right: 6%; } @media screen and (max-width: 767px) { .module-text-info-space.lessPadd { padding: 40px 25px; } } .module-featured-spaces{ padding:100px; } .module-featured-spaces .col.col3 .img-box{ position: relative; padding:100%; padding:30%; overflow: hidden; } .module-featured-spaces .col.col3 .img-box .image-main{ position: absolute; top:0; left: 0; bottom:0; right:0; transform: scale(1) rotate(0deg); -webkit-transform: scale(1) rotate(0deg);; -moz-transform: scale(1) rotate(0deg);; -o-transform: scale(1) rotate(0deg);; -ms-transform: scale(1) rotate(0deg);; } .module-featured-spaces .col.col3:hover .img-box .image-main{ transform: scale(1.2) rotate(-45deg); -webkit-transform: scale(1.2) rotate(-3deg); -moz-transform: scale(1.2) rotate(-3deg); -o-transform: scale(1.2) rotate(-3deg); -ms-transform: scale(1.2) rotate(-3deg); } .module-featured-spaces .col.col3 .text-box h4{ padding:15px 0; font-size: 28px; border-bottom: 1px solid #c6c6c4; } .module-featured-spaces .col.col3 .text-box table{ width:100%; } .module-featured-spaces .col.col3 .text-box table tr td{ font-size: 28px; padding: 15px 0; border-bottom: 1px solid #c6c6c4; } .module-featured-spaces .title{ text-align: center; } .module-featured-spaces a{ /*color:#222222;*/ color:#222; } .module-featured-spaces .title h2{ font-size: 30px; letter-spacing: 1px; padding: 0 0 40px 0; font-family: 'TrendSansOne'; border-bottom: 1px solid #c6c6c4; margin-bottom: 40px; } .module-featured-spaces .link-page{ font-size: 24px; display: inline-block; margin-top: 80px; /*color:#222222;*/ color:#222; font-family: 'Europa-Bold'; } .module-featured-spaces .link-page:hover{ color:#3be775; } .module-featured-spaces .col.col3:hover .text-box table tr td, .module-featured-spaces .col.col3:hover .text-box h4{ color:#3be775; padding:15px 10px; } @media screen and (max-width: 1440px) { .module-space-information .bg-green.box .center-text-box{ width:550px; } .views-spaces-module .view-info-area.single .map-area { height: 750px; } .module-space-information .space-info .space-image-bott { height: 400px; } .module-space-information .bg-green.box .center-text-box p { font-size: 24px; line-height: 35px; } } @media screen and (max-width: 1250px) { .module-space-information .bg-green.box .center-text-box { width: 100%; padding: 25px; } .module-text-info-space { padding: 100px 0; } } @media screen and (max-width: 1000px) { .module-space-information .col.col2{ width:100%; } .module-space-information .bg-green.box{ margin-top: 0; height: auto; } .views-spaces-module .view-info-area.single .module-info-box{ height: auto; padding:40px 25px; } .module-space-information .space-info .space-image-bott, .views-spaces-module .view-info-area.single .map-area{ height:auto; } .views-spaces-module .view-info-area.single .map-area .space_map_svg{ padding:40px 25px; } .module-space-information .bg-green.box .center-text-box { padding:0; position: relative; top:0; left:0; transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0); padding:40px 25px; } .module-space-information .space-info .space-image-bott{ padding:25%; } .module-space-information .bg-green.box .center-text-box h2 { font-size: 30px; } .module-space-information .bg-green.box .center-text-box h3 { font-size: 20px; margin-bottom: 25px; } .module-featured-spaces .col.col3 .text-box h4, .module-featured-spaces .col.col3 .text-box table tr td { font-size: 20px; padding: 15px 0; } .module-download { padding: 50px 0; } .module-featured-spaces { padding: 50px; } .module-featured-spaces .link-page{ margin-top: 40px; } .module-text-info-space { padding: 40px 25px; } .module-featured-spaces { padding: 40px 25px; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { #map-anim.come-right path{ fill-opacity:0; stroke-dasharray: none; stroke-dashoffset:none; -moz-animation: none 0 ease 0 1 normal none running -webkit-animation: none 0 ease 0 1 normal none running animation: none 0 ease 0 1 normal none running } .anim-box { opacity: 1; } .bg-fixed, .bg-fix{ background-attachment: scroll; } #logo-small{ display: none; } ul.nav li a{ padding:20px 8px 30px; } } @supports (-ms-ime-align:auto) { #map-anim.come-right path{ fill-opacity:0; stroke-dasharray: none; stroke-dashoffset:none; -moz-animation: none 0 ease 0 1 normal none running -webkit-animation: none 0 ease 0 1 normal none running animation: none 0 ease 0 1 normal none running } } /* Popup */ .ie-update-popup { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.9); z-index: 14000; display: none; } .ie-update-popup .box-update { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); background-color: #fff; padding: 60px 50px; width: 720px; text-align: center; } .ie-update-popup .box-update h4 { font-size: 32px; color: #000; margin-bottom: 30px; font-family: 'brandon_grotesquebold', sans-serif; font-weight: 700; } .ie-update-popup .box-update p { margin-bottom: 30px; font-size: 18px; font-family: 'brandon_grotesquebold', sans-serif; } .ie-update-popup .box-update a.btn-update { padding: 15px 20px; font-size: 18px; background-color: #000; color: #fff; text-align: center; display: inline-block; width: 49%; font-family: 'brandon_grotesquebold', sans-serif; transition: All 0.5s ease; -webkit-transition: All 0.5s ease; -moz-transition: All 0.5s ease; -o-transition: All 0.5s ease; } .ie-update-popup .box-update a.btn-update:hover { opacity: 0.5; } @media (max-width: 768px) { .ie-update-popup .box-update p { font-size: 16px; margin-bottom: 20px; } .ie-update-popup .box-update h4 { font-size: 28px; margin-bottom: 20px; } .ie-update-popup .box-update { padding: 40px 25px; width: 90%; } .ie-update-popup .box-update a.btn-update { width: 100%; margin-bottom: 5px; } .cms-style img { width: 300px; height: auto; margin: 10px auto 10px; display: block; } }/*------ Generic Classes --------------*/ .flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } .bg-contain { background-size: contain; background-repeat: no-repeat; background-position: center; } .bg-cover { background-size: cover; background-repeat: no-repeat; background-position: center; } /*------------ MAIN BLOGS PAGE --------------------*/ .module-blog-main-intro { padding: 100px 50px; /* background-color: #222222;*/ background-color: #222; } .module-blog-main-intro h2 { font-family: 'Europa-Bold'; font-size: 50px; text-align: left; color: #3be775; margin-bottom: 25px; } .module-blog-main-intro p { color: #fff; } .blog-posts { /* background-color: #222222;*/ background-color: #222; } .blog-post-box { width: 33.33%; position: relative; /* height: 50vh;*/ padding: 15%; overflow: hidden; display: block; } .blog-post-box::after { content: ''; position: absolute; top: 0; left: 110%; height: 100%; width: 120%; background-color: rgba(59, 231, 117,0.7); z-index: 1; -webkit-transform: skew(-5deg); transform: skew(-5deg); -webkit-transition: .7s; transition: .7s; } .blog-post-box:hover::after { left: -10%; } .blog-post-box-img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; -webkit-transition: .7s; transition: .7s; } .blog-post-box:hover .blog-post-box-img { height: 105%; } .blog-post-box h3 { font-size: 20px; line-height: 28px; /* color: #3be775;*/ color: #fff; text-transform: uppercase; font-size: 28px; font-family: 'TrendSansOne'; margin-bottom: 10px; z-index: 5; position: absolute; top: 0; left: 0; padding: 25px 50px; text-shadow: 0 0 30px rgba(0,0,0,0.5); } .blog-post-box .btn-findMore { position: absolute; display: inline-block; height: 50px; padding: 15px 40px; width: 210px; font-size: 16px; font-family: 'Europa-Light'; color: #fff; letter-spacing: 2px; cursor: pointer; border: 2px solid #fff; bottom: 25px; right: 25px; z-index: 5; text-align: center; } .blog-post-box:hover .btn-findMore { background-color: #fff; /* color: #222222;*/ color: #222; } /*------------------------------------------------------*/ /*------------ INDIVIDUAL BLOG PAGE --------------------*/ .blog-content { padding: 100px 0; } .blog-social-links-wrap ul.social-links { display: block; position: relative; margin-bottom: 50px; float: left; padding-left: 0; list-style: none; } .blog-social-links-wrap ul.social-links li { float: left; margin-right: 5px; } .blog-social-links-wrap ul.social-links li a { background-position: center; background-repeat: no-repeat; background-size: 100%; color: #3be775; font-size: 20px; width: 30px; height: 30px; border: 2px solid #3be775; border-radius: 100%; display: block; -webkit-transition: .3s; transition: .3s; } .blog-social-links-wrap ul.social-links li a:hover { opacity: 0.7; } .blog-social-links-wrap ul.social-links li.ico.fb a { background-image: url(../../img/png/fb-green.png); } .blog-social-links-wrap ul.social-links li.ico.tw a { background-image: url(../../img/png/tw-green.png); } .blog-content h3.date { font-size: 20px; line-height: 28px; font-family: 'Europa-Bold'; margin-bottom: 10px; /* color: #222222;*/ color: #222; float: right; } .blog-content h2 { font-size: 24px; font-family: 'Europa-Bold'; margin-bottom: 10px; } .blog-content h3 { font-size: 20px; font-family: 'Europa-Bold'; margin-bottom: 10px; } .blog-content strong, .blog-content b { font-family: 'Europa-Bold'; } .blog-content p { margin-bottom: 20px; text-align: justify; } .blog-content a { color: #3be775; } .blog-content ul { margin-bottom: 20px; list-style: disc; padding-left: 20px; } .blog-content ol { margin-bottom: 20px; list-style: decimal; padding-left: 30px; } .blog-content li { margin-bottom: 5px; font-size: 18px; } .back-blog-btn { display: table; margin: 100px auto 0; padding: 10px 20px; color: #3be775; background-color: transparent; font-size: 16px; cursor: pointer; -webkit-transition: .3s; transition: .3s; border: 2px solid #3be775; } .back-blog-btn:hover { background-color: #3be775; color: #fff; } .blog-content img { max-width: 60%; display: block; height: auto; margin: 20px auto; } .blog-content .blog-img-wrap { position: relative; max-width: 60%; display: block; height: auto; margin: 20px auto; } .blog-content .blog-img-wrap img { max-width: 100%; } .img-credit { position: absolute; bottom: 0; left: 0; padding: 10px 20px; background-color: rgba(59,231,117,0.7); z-index: 5; } .img-credit p { color: #fff; text-align: center; font-size: 16px; margin: 0; } .img-credit a { color: #fff; } /*------------------------------------------------------*/ /*=================== RESPONSIVENESS ==========================*/ @media screen and (max-width: 1320px) { .module-blog-main-intro { padding: 50px; } .module-blog-main-intro h2 { font-size: 30px; margin-bottom: 15px; text-align: center; } .blog-post-box { width: 50%; padding: 20%; } .blog-post-box h3 { font-size: 24px; } .blog-post-box .btn-findMore { height: 42px; padding: 10px 20px; width: 150px; font-size: 14px; bottom: 15px; right: 15px; } .blog-content { padding: 50px 0; } .back-blog-btn { margin: 50px auto 0; } } @media screen and (max-width: 1000px) { .module-blog-main-intro { padding: 30px 15px; } .blog-post-box h3 { padding: 15px; font-size: 20px; } .blog-content { padding: 30px 0; } .back-blog-btn { margin: 30px auto 0; } .blog-social-links-wrap ul.social-links { margin-bottom: 30px; } } @media screen and (max-width: 767px) { .blog-post-box { width: 100%; padding: 40%; } .blog-post-box h3 { text-align: center; width: 100%; } .blog-post-box .btn-findMore { right: auto; left: 50%; transform: translateX(-50%); } .blog-content .container { padding: 0 15px; } .blog-content h2 { font-size: 18px; } .blog-content h3 { font-size: 16px; } .blog-content p { font-size: 14px; } .blog-content h3.date { font-size: 16px; line-height: 20px; margin: 5px 0; } .blog-content li { font-size: 14px; } .blog-content img { max-width: 100%; } .blog-content .blog-img-wrap { max-width: 100%; } .img-credit { padding: 7px 10px; } .img-credit p { font-size: 12px; } }/*====================== SUBSCRIBE SECTION =======================*/ .subscribe-wrap { background-color: #222222; padding: 100px 50px 0; } .subscribe-wrap h2 { font-family: 'Europa-Bold'; font-size: 50px; text-align: center; color: #3be775; margin-bottom: 25px; } .subscribe-wrap p { color: #fff; text-align: center; } .subscribe-wrap .subscribe-btn { background-color: transparent; border: 2px solid #3be775; padding: 15px 40px; color: #3be775; font-size: 16px; margin: 25px auto 0; display: block; cursor: pointer; -webkit-transition: .3s; transition: .3s; font-family: 'Europa-Light'; } .subscribe-wrap .subscribe-btn:hover { color: #fff; background-color: #3be775; } /*====================== SUBSCRIBE POPUP =======================*/ .popup { position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; background-color: rgba(0,0,0,0.5); z-index: 1000; display: none; } .popup.active { display: block; } .popup-overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: 100%; width: 100%; } .popup-container { width: 720px; position: absolute; top: 200%; left: 50%; -webkit-transform: translateX(-50%) translateY(-200%); -ms-transform: translateX(-50%) translateY(-200%); transform: translateX(-50%) translateY(-200%); box-shadow: 0px 5px 10px rgba(0,0,0,0.3); background: #222222; padding: 50px; color: #fff; opacity: 0; } .popup.active .popup-container { animation: reveal-popup 1.5s ease-out 2s forwards; /* opacity: 1;*/ /* top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); opacity: 1; */ } @-webkit-keyframes reveal-popup { 0% { top: 200%; -webkit-transform: translateX(-50%) translateY(-200%); -ms-transform: translateX(-50%) translateY(-200%); transform: translateX(-50%) translateY(-200%); opacity: 0; } 100% { top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); opacity: 1; } } @keyframes reveal-popup { 0% { top: 200%; -webkit-transform: translateX(-50%) translateY(-200%); -ms-transform: translateX(-50%) translateY(-200%); transform: translateX(-50%) translateY(-200%); opacity: 0; } 100% { top: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); opacity: 1; } } .popup-close { background-image: url(../../img/png/close.png); background-size: 30px; position: absolute; top: 0; right: 0; width: 50px; height: 50px; cursor: pointer; z-index: 300; background-size: 50% !important; -webkit-transition: .3s; transition: .3s; } .popup-close:hover { background-image: url(../../img/png/close2.png); } .popup .logo { height: 75px; width: 250px; margin: 0 auto 25px; /* background-image: url(../../img/png/logo.svg);*/ } .popup .logo svg { height: 100%; } .popup .logo svg path { fill: #3be775 !important; } .popup h2 { font-family: 'Europa-Bold'; font-size: 30px; text-align: center; color: #3be775; margin-bottom: 25px; } .popup p { color: #fff; text-align: center; margin: 0 auto 25px; width: 75%; } .covid-popup p { width: 100%; } .popup p.subscribe-terms { font-size: 12px; line-height: 120%; color: #fff; margin: 0 auto; } .popup p.subscribe-terms a { color: #fff; } .popup .policy-checkbox-wrap input { margin: 0 10px 0 0; height: 20px; width: 20px; -webkit-appearance: checkbox; } .popup .policy-checkbox-wrap label { text-align: justify; line-height: 120%; font-size: 12px; } .popup form .subscribe-inputs input { display: block; width: 49%; margin-bottom: 10px; padding: 10px; font-size: 16px; font-family: 'Europa-Light'; color: #fff; margin-right: 2%; float: left; border: 2px solid #fff; background-color: transparent; } .popup form .subscribe-inputs input:last-of-type { margin-right: 0; } .popup form .subscribe-inputs input.error { border: 2px solid #ee485f; } .popup form input.submit-btn { font-family: 'Europa-Regular'; width: auto; padding: 10px 40px; background-color: transparent; color: #3be775; margin: 20px auto 0; font-size: 20px; border: none; cursor: pointer; display: block; -webkit-transition: .3s; transition: .3s; border: 2px solid #3be775; } .popup form input.submit-btn:hover { color: #fff; background-color: #3be775; } .popup form img { margin: 0 auto; display: block; } .popup form h4.title { text-align: center; font-size: 20px; line-height: 25px; margin-bottom: 20px; } .policy-checkbox-wrap { margin-top: 15px; } .covid-popup a.btn { display: table; margin: 20px auto 0; border: 1px solid #3be775!important; color: #fff!important; background-color: transparent; text-align: center; width: auto; padding: 15px 30px; height: auto; } .covid-popup a.btn:hover { background-color: #3be775; } /*------- FORM --------*/ #popup-form-wrap form { margin: 0; padding: 0; width: 100%; background: transparent !important; } #popup-form-wrap form ._form-title, #popup-form-wrap form ._form_element._x65616857, #popup-form-wrap form ._form_element ._form-label, #popup-form-wrap form ._form-branding { display: none !important; } #popup-form-wrap form ._form_element input[type="text"], #popup-form-wrap form ._form_element input[type="email"] { display: block; width: 100%; margin-bottom: 10px; border: none; padding: 5px; font-size: 16px; font-family: 'Europa-Light'; color: #383838 !important; border-radius: 0; } #popup-form-wrap form ._row._checkbox-radio { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } #popup-form-wrap form ._row._checkbox-radio input { margin: 3px 10px 0 0 !important; height: auto !important; width: auto !important; } #popup-form-wrap form ._row._checkbox-radio span { line-height: 120%; width: calc(100% - 25px); } #popup-form-wrap form ._form_element label { text-align: justify; line-height: 120%; font-size: 12px; color: #fff; } #popup-form-wrap form ._submit { /* font-family: 'Europa-Bold' !important; width: auto; padding: 10px 40px !important; background-color: #383838 !important; color: #fff !important; margin: 20px auto; border-radius: 50px !important; font-size: 20px; border: none !important; cursor: pointer; display: block; */ font-family: 'Europa-Regular' !important; width: auto; padding: 10px 40px !important; background-color: transparent !important; color: #3be775 !important; margin: 20px auto; font-size: 20px; cursor: pointer; display: block; -webkit-transition: .3s; transition: .3s; border-radius: 0 !important; border: 2px solid #3be775 !important; } #popup-form-wrap form ._submit:hover { color: #fff !important; background-color: #3be775 !important; } #popup-form-wrap form ._form-thank-you { margin-bottom: 20px; } #popup-form-wrap form ._form-thank-you { color: #fff !important; } #popup-form-wrap form ._row._checkbox-radio input { -webkit-appearance: checkbox; } /*================ RESPONSIVENESS =======================*/ @media screen and (max-width: 1320px) { .subscribe-wrap { padding: 50px; } .subscribe-wrap h2 { font-size: 30px; margin-bottom: 15px; } .subscribe-wrap .subscribe-btn { padding: 15px 30px; } } @media screen and (max-width: 1000px) { .subscribe-wrap { padding: 30px 15px; } .subscribe-wrap .subscribe-btn { padding: 10px 25px; } .popup-container { padding: 25px; } .popup .logo { height: 50px; width: 170px; margin: 0 auto 15px; } .popup h2 { font-size: 25px; margin-bottom: 15px; } .popup p { margin: 0 auto 15px; width: 100%; font-size: 16px; } .popup form input.submit-btn { padding: 7px 30px; font-size: 18px; } } @media screen and (max-width: 767px) { .popup-container { padding: 25px; width: calc(100% - 50px); } .popup-close { background-size: 25px; width: 40px; height: 40px; } .popup form .subscribe-inputs input { font-size: 14px; } .popup form input.submit-btn { padding: 10px 30px; } .popup form h4.title { font-size: 16px; line-height: 20px; } .popup form .subscribe-inputs input { width: 100%; margin-right: 0; } #popup-form-wrap form ._form_element input[type="text"], #popup-form-wrap form ._form_element input[type="email"] { font-size: 14px; } #popup-form-wrap form ._submit { padding: 10px 30px !important; font-size: 16px !important; } #popup-form-wrap ._form_element { margin: 0 !important; } .popup h2 { font-size: 20px; } .popup p { font-size: 14px; } }.policies { padding: 100px 0; } .policies strong { font-family: 'Europa-Bold'; } .policies h3, .policies h4, .policies h5 { font-family: 'Europa-Bold'; margin-bottom: 10px; } .policies h3 { font-size: 32px; } .policies h4 { font-size: 24px; } .policies h5 { font-size: 20px; } .policies p { margin-bottom: 10px; } .policies ul, .policies ol { margin-bottom: 10px; padding-left: 20px; } .policies ul { list-style: disc; } .policies ol { list-style: decimal; } .policies ul li, .policies ol li { margin-bottom: 5px; } .policies ul li, .policies ol li, .policies th, .policies td { font-size: 18px; } .policies td { padding: 5px; border: 1px solid #ccc; } .policies a { text-decoration: none; color: #3be775; } @media screen and (max-width: 1320px) { .policies { padding: 50px 0; } } @media screen and (max-width: 767px) { .policies .container { padding: 0 15px; } }/** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ /* * Owl Carousel - Core */ .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; } .owl-carousel.owl-loaded { display: block; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item { /** This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong calculation of the height of the owl-item that breaks page layouts */ } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } html.home, html.home body{ overflow: hidden; } .wrapper-scroll{ position: relative; } .scroll-slider{ position: relative; transition: .8s; } .scroll-slider:after{ content:''; clear: both; display: table; } .slider{ position: fixed; height: 100vh; width:100%; top:50%; left:50%; transform: translate(-50%,-50%); overflow: hidden; } .slider .img-slide{ position: absolute; top:-5px; right: -5px; left: -5px; bottom: -5px; background-position: center; background-repeat: no-repeat; background-size: cover; z-index: 2; transition: 4s; /* transform: scale(1); */ } .slider .shade-slide{ z-index: 5; position: absolute; top:0px; left: 0px; width: 100%; height: 100%; /* background-color: rgba(0,0,0,1);*/ background-color: #161c1c; transition: 1s; transform: translate3d(0, 0, 0); } .slider .text-slide{ position: absolute; /* bottom: 100px;*/ bottom: 150px; left:60px; z-index: 4; width: calc(100% - 120px); } .slider:after{ content: ''; position: absolute; display: block; top:0; z-index: 3; left:0; bottom: 0; right:0; background-color: rgba(0,0,0,0.1); } .slider .text-slide h2{ font-size: 40px; height: 60px; font-family: 'Europa-Bold'; } .slider .text-slide h3{ font-size: 26px; height: 35px; font-family: 'Europa-Light'; } .slider .text-slide h2, .slider .text-slide h3{ color:#fff; position: relative; overflow: hidden; top:0; margin: 0; } .slider .text-slide h2 .hidden-text, .slider .text-slide h3 .hidden-text{ position: absolute; z-index: 40; } .slider .link-slide{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .btn-round .inner-box, .btn-round .btn-text{ transition: .4s -webkit-transform cubic-bezier(.19,1,.22,1),.4s background ease; transition: .4s transform cubic-bezier(.19,1,.22,1),.4s background ease; display: inline-block; } .btn-round{ position: fixed; bottom:2.5rem; width:45px; height: 45px; border-radius:50%; z-index: 10000; transition: .8s -webkit-transform cubic-bezier(.19,1,.22,1),.6s opacity cubic-bezier(.19,1,.22,1); transition: .8s transform cubic-bezier(.19,1,.22,1),.6s opacity cubic-bezier(.19,1,.22,1); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); overflow: hidden; opacity: 0; visibility: hidden; display: none; cursor: pointer; } html.theme-page .btn-round{ visibility: visible; display: block; opacity: 1; } .btn-round.center{ left:50%; margin-left: -22.5px; } .btn-round:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 45px; background: #000; opacity: .22; transition: .4s opacity cubic-bezier(.19,1,.22,1); } .btn-round .btn-text{ position: absolute; top: 0; right: 0; overflow: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); white-space: nowrap; border-radius: 45px; } .btn-round .inner-box{ background: rgba(0,0,0,.22); -webkit-transform: translateX(-100%); transform: translateX(-100%); border-radius: 45px; padding: 0 55px 0 22px; color: #fff; font-size: 14px; line-height: 45px; } .btn-round .inner-box span{ opacity: 0; transition: .4s opacity ease; } .btn-round .back-icon{ width: 100%; height: 100%; overflow: hidden; border-radius: 50%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; transition: .4s background ease; } .btn-round.center:hover{ overflow: visible; -webkit-transform: translateX(70px); transform: translateX(70px) } .btn-round:before:hover{ opacity: .7; } .btn-round:hover .btn-text, .btn-round:hover .inner-box{ -webkit-transform: translateX(0); transform: translateX(0) } .btn-round:hover .inner-box span{ opacity: 1 } html.loaded-shade .slider .shade-slide { transform: translate3d(100%, 0, 0); } /* Slider --------> */ .owl-carousel .owl-item{ min-height: 100vh!important; cursor: pointer; } .owl-carousel .owl-item:not(.clicked):hover .img-slide{ transform: scale(1.2); } .owl-carousel .owl-item.active{ transition: 1s!important; } html.slide-active .owl-carousel .owl-item:not(.active){ width:0%!important; } html.slide-active .owl-carousel .owl-stage{ transform: translate3d(0, 0, 0)!important; width:100%!important; transition: none!important; } html.slide-anim-true .owl-item.active.clicked{ width: 100%!important; } html.slide-anim-true .owl-item.active{ width: 0%!important; } /* html.slide-anim-true{ overflow: auto; } */ .btn-icon{ width: 100%; height: 100%; overflow: hidden; border-radius: 50%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; transition: .4s background ease; } .btn-icon b{ position: absolute; width: 15px; height: 15px; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; display: block; transition: 0.3s; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url(../../img/png/grid_w.png); } /* Header ------ > */ #header{ position: fixed; top:0; left:0; width:100%; background-color: rgba(0,0,0,0.5); z-index: 13000; height: auto; } #header .site-logo{ width: 250px; height: 80px; position: absolute; top:50px; left: 60px; opacity: 0; /* opacity: 1;*/ transition: 0.5s; /* transition-delay: .8s;*/ } #header .btn-nav{ position: absolute; top:50px; right: 60px; width:50px; height: 50px; background-image: url(../../img/png/logo-navigation.png); background-position: center; background-repeat: no-repeat; background-size: 60px; /* opacity: 0;*/ opacity: 1; transition: 0.5s; /* transition-delay: .8s; */ transform: rotate(0deg); cursor: pointer; } html.nav-open #header .btn-nav{ transform: rotate(90deg); transition-delay: none; } html.loaded-shade #header .site-logo, html.loaded-shade #header .btn-nav{ opacity: 1; } .nav-slide-box{ position: fixed; top:0; left:0; width:100%; height:0; z-index: 12999; overflow: hidden; } html.nav-open .nav-slide-box{ height:100vh; } .bg-slide-box{ position: absolute; top:0; left:0; width:100%; z-index: 1; } .bg-slide-box .slide-nav{ width:33.33%; height:100vh; position:relative; float:left; overflow: hidden; } .bg-slide-box .slide-nav .slide-anim{ background-color: rgba(0,0,0,1); position:absolute; top:0; left:0; transition: .8s; height:100%; width:100%; transform: translate3d(-100%,0,0); } html.nav-anim .bg-slide-box .slide-nav .slide-anim{ transform: translate3d(0%,0,0); } .bg-slide-box:after{ content: ''; clear: both; display: table; } .nav-box{ position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:960px; z-index: 5; display: flex; justify-content: space-between; overflow: hidden; } .nav-box .list-box{ flex: 1; position: relative; overflow: hidden; opacity: 0; } .nav-box .list-box h2{ color:#3bff75; font-size: 35px; margin-bottom: 20px; font-family: 'Europa-Regular'; } .nav-box ul li a{ font-size: 40px; display: block; padding: 2px 0; position: relative; overflow: hidden; } .nav-box ul li a span{ transition: .3s; position: relative; display: block; transform: translate3d(0,0,0); } .nav-box ul li a span.active{ color:#3bff75; } .nav-box ul.default-ul li a:hover span{ transform: translate3d(0,-50px,0); } .nav-box ul.small-ul li a{ font-size: 25px; height: 35px; } .nav-box ul.small-ul li a:hover span{ transform: translate3d(0,-35px,0); } .nav-box ul li a { color:#fff; } .nav-box ul.default-ul li a{ margin: 14px 0; font-family: 'Europa-Regular'; padding: 0; overflow: hidden; position: relative; height: 50px; } .hover-bg{ position: fixed; top:0; left:0; width:100%; height: 100%; z-index: 5000; display: none; } .hover-bg.visible{ display: block; } .hover-bg .fix{ position: fixed; top:0; left:0; width:100%; height: 100%; z-index: 100; opacity: 0; background-position:center; background-repeat: no-repeat; background-size: cover; } .hover-bg .fix.visible, .hover-bg .fix.active{ opacity: 1; } /* Pages ----------> */ .hidden-title{ overflow: hidden; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); width: calc(100% - 150px); z-index: 2; } .sec1 h1.title-pages{ position: relative; font-family: 'Europa-Bold'; /* font-size:200px; line-height: 200px; */ font-size:150px; line-height: 150px; text-transform: uppercase; bottom: auto; right: auto; color: rgba(255,255,255,0.1); -webkit-text-stroke:3px #fff; transform: translate(0%, 150%) matrix(1, 0, 0, 1, 0, 0); padding-left: 0; } .ov-hid{ position: relative; overflow: hidden; } .sec1 h2{ position: relative; font-family: 'Europa-Light'; font-size:50px; bottom: auto; right: auto; } .sec1:after{ z-index: 1; content: ''; position: absolute; display: block; top:0; z-index: 1; left:0; bottom: 0; right:0; background-color: rgba(0,0,0,0.1); transition: 1s; } html.loaded-shade .sec1:after{ background-color: rgba(0,0,0,0.2); } /*----- General CSS ---------*/ .min-full { min-height: 100vh; width: 100%; } .min-full-50 { min-height: 50vh; width: 100%; } .flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } .flex-col { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .flex-cent { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .flex-sp-bet { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .flex-end { -webkit-box-pack: end; -ms-flex-pack: end;justify-content: flex-end; } .bg-cover { background-size: cover; background-position: center; background-repeat: no-repeat; } .bg-contain { background-size: contain; background-position: center; background-repeat: no-repeat; } .bg-dark-grey { background-color: #222; } .bg-l { background-position: left; } .bg-t { background-position: top; } .bg-r { background-position: right; } .bg-b { background-position: bottom; } .parallax { background-attachment: fixed; } .sec-ov { position: relative; } .sec-ov::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2); z-index: 1; /* opacity: 0; animation: 2s reveal 2s forwards; */ } a { -webkit-transition: .3s; transition: .3s; } /* a:hover { color: #3bff75; } */ .owl-dots { display: none; } .wrapper-scroll { position: relative; max-height: 100vh; overflow-y: hidden; } /*----- Header ---------*/ #header { height: 130px; -webkit-transition: .3s; transition: .3s; background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(221,221,221,0) 13%, rgba(0,0,0,0) 100%); } html.nav-in #header { background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(221,221,221,0) 13%, rgba(0,0,0,0.7) 100%); } #header .site-logo { overflow: hidden; -webkit-transition: .5s; transition: .5s; } html.nav-in #header .site-logo { width: 62px; } #header .site-logo svg, #header .site-logo .logo-img { width: 250px; height: 85px; background-image: url(../../img/svg/rathbone-logo-green.svg); background-position: left top; } /*----- Footer ---------*/ #footer .col.col3x2 .col.col3 { margin-right: 2%; width: 32%; margin-bottom: 25px; } #footer .nav-box { position: relative; top: auto; left: auto; height: auto; width: auto; -webkit-transform: none; transform: none; display: block; } #footer .nav-box h2 { color: #3bff75; font-size: 35px; margin-bottom: 20px; font-family: 'Europa-Regular'; } #footer p { color: #fff; } #footer img { margin-bottom: 20px; } #footer .nav-box ul { margin-bottom: 20px; } #footer .nav-box ul.small-ul li { font-size: 20px; } #footer .nav-box ul.small-ul li a { font-size: 20px; height: 30px; } #footer .nav-box ul.small-ul li a:hover span { transform: translate3d(0,-28px,0); } /*----- Hero slider ---------*/ .hero-text-wrap { z-index: 10; } .hero-text-wrap * { color: #fff; } .hero-text { width: 50%; } .hero-slider .slick-arrow { position: absolute; /* bottom: 50px;*/ bottom: 2.5rem; z-index: 100; border-radius: 50%; border: none; font-size: 0; height: 45px; width: 45px; background-color: rgba(255,255,255,0.3); cursor: pointer; background-repeat: no-repeat; background-size: 40%; background-position: center; } .hero-slider .slick-arrow.slick-prev { /* left: 50px;*/ left: 2.5rem; background-image: url(../../img/png/arrow-left-w.png); } .hero-slider .slick-arrow.slick-next { /* right: 50px;*/ right: 2.5rem; background-image: url(../../img/png/arrow-right-w.png); } /* .back-btn { display: block; position: absolute; bottom: 50px; z-index: 100; border-radius: 50%; border: none; font-size: 0; height: 45px; width: 45px; background-color: rgba(255,255,255,0.5); cursor: pointer; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background-repeat: no-repeat; background-size: 40%; background-position: center; background-image: url(../../img/png/menu-squares-w.png); } */ .hero-text-wrap p { font-size: 20px; } /*---- Two boxes - overlay and dark ------*/ .sec-2-box-a { position: relative; } .sec-2-box-a .ov-box { /* background-color: rgba(255,255,255,0.7);*/ width: 66.66%; padding: 200px 100px; position: relative; } .sec-2-box-a .ov-box::after { content: ''; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: rgba(255,255,255,0.7); } .sec-2-box-a .ov-box * { color: #000; } .sec-2-box-a .ov-box-content { position: relative; z-index: 5; } .sec-2-box-a .ov-box h2 { font-size: 35px; font-family: 'Europa-Regular'; } .sec-2-box-a .dark-box { background-color: #222222; width: 33.33%; padding: 200px 50px; } .sec-2-box-a .dark-box * { color: #fff; } .sec-2-box-a .dark-box-info-box:not(:last-child) { margin-bottom: 20px; } .sec-2-box-a .dark-box-info h6 { font-size: 24px; font-family: 'Europa-Regular'; } .sec-2-box-a .dark-box-info p { font-size: 20px; } .sec-2-box-a .dark-box a:hover { color: #3bff75; } /*---- Video ------*/ .brand-vid-wrap { position: relative; margin-bottom: -4px; /* width: 100%; height: 0; padding-bottom: 56.25%; */ } .brand-vid { width: 100%; height: auto; } /* .brand-vid { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } */ /*---- Overlay image and text------*/ .sec-ov-dark-text { padding: 100px; position: relative; } .sec-ov-dark-text .ov-box-content { width: 50%; z-index: 20; } .sec-ov-dark-text .ov-box-content * { color: #fff; } .sec-ov-dark-text .ov-box-content h6 { font-size: 24px; margin-bottom: 10px; font-family: 'Europa-Regular'; } .sec-ov-dark-text .ov-box-content p { font-size: 20px; } /*---- Two boxes - two images and text ------*/ .sec-2-box-b .box-1 { width: 33.33%; } .sec-2-box-b .box-2 { width: 66.66%; } .sec-2-box-b .box-1-img { padding: 40%; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .sec-2-box-b .box-1-text { padding: 50px 100px; } .sec-2-box-b .box-1-text * { color: #fff; } .sec-2-box-b .box-1-text h6 { font-size: 24px; margin-bottom: 10px; font-family: 'Europa-Regular'; } .sec-2-box-b .box-1-text p { font-size: 20px; margin-bottom: 10px; } .read-more-btn { font-size: 20px; float: right; margin-top: 20px; } /*---- Contact Pg ------*/ .contact-info-box { position: absolute; right: 0; top: 0; height: 100%; width: 33.33%; overflow: hidden; z-index: 10; } .contact-info-box * { color: #fff; } .contact-info-box .patterns-wrap { height: 100%; width: 100%; /* opacity: 1;*/ } .contact-info-wrap { height: 100%; width: 100%; padding: 100px; position: relative; z-index: 5; } .sec1 .contact-info-box h1 { position: relative; top: auto; left: auto; right: auto; bottom: auto; margin-bottom: 50px; text-align: center; padding: 0; } .cont-info-box { margin-bottom: 25px; text-align: center; } .cont-info-box h6 { font-size: 18px; font-family: 'Europa-Regular'; } .contact-social { display: table; margin: 50px auto 0; } .contact-social ul { display: flex; } .contact-social ul li { margin: 0 5px; } .contact-social ul li .soc-ico { display: block; height: 30px; width: 30px; border-radius: 50%; border: 2px solid #fff; background-size: 90%; -webkit-transition: .3s; transition: .3s; } .contact-social ul li .soc-ico:hover { opacity: 0.7; } .contact-social ul li .soc-ico.fb { background-image: url(../../img/png/fb.png); } .contact-social ul li .soc-ico.tw { background-image: url(../../img/png/tw.png); } .contact-social ul li .soc-ico.insta { background-image: url(../../img/png/insta.png); } /*---- Split img sec ------*/ .split-img { padding: 50%; position: relative; } .left.split-img { background-position: right center; } .right.split-img { background-position: left center; } .split-img-text-wrap { position: absolute; bottom: 0; left: 0; width: 100%; padding: 100px; } /*---- Scroll btn ------*/ .scroll-btn-wrap { position: absolute; left: 50%; bottom: -100px; transform: translateX(-50%); z-index: 100; -webkit-animation: reveal-disc-btn 2s ease-out 2s forwards; animation: reveal-disc-btn 2s ease-out 2s forwards; } @-webkit-keyframes reveal-disc-btn { 0% { bottom: -100px; } 65% { bottom: 60px; } 100% { bottom: 50px; } } @keyframes reveal-disc-btn { 0% { bottom: -100px; } 65% { bottom: 60px; } 100% { bottom: 50px; } } .scroll-btn { display: block; width: 40px; height: 40px; background-image: url(../../img/png/mouse.png); /* -webkit-animation: pulse 1s 1s infinite; animation: pulse 1s 1s infinite; */ } .scroll-btn::before, .scroll-btn::after { content: ''; position: absolute; top: 0; height: 100%; width: 100%; background-repeat: no-repeat; background-position: center; background-size: 50%; } /* @-webkit-keyframes pulse { 0% { box-shadow: 0 0 0 0px rgba(210,168,123,0.5); } 100% { box-shadow: 0 0 0 30px rgba(210,168,123,0); } } @keyframes pulse { 0% { box-shadow: 0 0 0 0px rgba(210,168,123,0.5); } 100% { box-shadow: 0 0 0 30px rgba(210,168,123,0); } } */ .scroll-btn::before { left: -70%; background-image: url(../../img/png/arrow-left.png); -webkit-animation: pulse-left 1.5s 3.5s infinite; animation: pulse-left 1.5s 3.5s infinite; } @-webkit-keyframes pulse-left { 0% { left: -70%; } 50% { left: -120%; } 100% { left: -70%; } } @keyframes pulse-left { 0% { left: -70%; } 50% { left: -120%; } 100% { left: -70%; } } .scroll-btn::after { right: -70%; background-image: url(../../img/png/arrow-right.png); -webkit-animation: pulse-right 1.5s 3.5s infinite; animation: pulse-right 1.5s 3.5s infinite; } @-webkit-keyframes pulse-right { 0% { right: -70%; } 50% { right: -120%; } 100% { right: -70%; } } @keyframes pulse-right { 0% { right: -70%; } 50% { right: -120%; } 100% { right: -70%; } } .rel-units-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .rel-units-wrap .col.col3:last-child { display: none; } .rel-units-wrap .col.col3 { width: 50%; } /*============= Responsiveness =================*/ @media screen and (max-width: 1400px) { #footer .col.col3 { width: 20%; } #footer .col.col3x2 { width: 80%; } } @media screen and (max-width: 1320px) { .sec1 h1.title-pages { font-size: 125px; line-height: 125px; } .sec-2-box-a .ov-box { padding: 200px 50px; } .sec-2-box-a .ov-box h2 { font-size: 25px; } .sec-2-box-b .box-1-text { padding: 50px; } .sec-2-box-b .box-1 { width: 50%; } .sec-2-box-b .box-2 { width: 50%; } .contact-info-box { width: 50%; } .slider .text-slide { left: 40px; width: calc(100% - 80px); } .slider .text-slide h2 { font-size: 30px; height: 45px; } .slider .text-slide h3 { font-size: 20px; height: 30px; } #footer .nav-box ul.default-ul li a { margin: 10px 0; height: 40px; font-size: 30px; } #footer .nav-box ul.default-ul li a:hover span { transform: translate3d(0,-40px,0); } #footer .nav-box h2 { font-size: 30px; margin-bottom: 10px; } /* #footer .nav-box ul.small-ul li a { font-size: 20px; height: 30px; } #footer .nav-box ul.small-ul li a:hover span { transform: translate3d(0,-28px,0); } .nav-box ul.small-ul li { font-size: 20px; } */ .nav-box ul.small-ul li a, #footer .nav-box ul.small-ul li a { font-size: 16px; height: 25px; } #footer .nav-box ul.small-ul li { font-size: 16px; } .nav-box ul.default-ul li a:hover span, #footer.nav-box ul.default-ul li a:hover span { transform: translate3d(0,-40px,0); } .nav-box ul.small-ul li a:hover span, #footer .nav-box ul.small-ul li a:hover span { transform: translate3d(0,-21px,0); } .sec1 h2 { font-size: 40px; } } @media screen and (max-width: 1100px) { .hidden-title { width: calc(100% - 100px); } .sec1 h1.title-pages { font-size: 100px; line-height: 100px; } .hero-text { width: 100%; } .hero-text p { text-align: center; } .sec-2-box-a .ov-box { width: 100%; } .sec-2-box-a .dark-box { width: 100%; padding: 50px; } .sec-ov-dark-text { padding: 50px; } .sec-ov-dark-text .ov-box-content { width: 100%; } .sec-2-box-b .box-1 { width: 100%; } .sec-2-box-b .box-2 { width: 100%; padding: 40%; } .parallax { background-attachment: scroll; } .nav-box { width: 650px; } .nav-box ul.default-ul li a { margin: 10px 0; height: 40px; } .nav-box ul li a { font-size: 30px; } .nav-box .list-box h2 { font-size: 30px; margin-bottom: 10px; } .nav-box ul.small-ul li a { font-size: 20px; height: 30px; } .nav-box ul.default-ul li a:hover span, #footer.nav-box ul.default-ul li a:hover span { transform: translate3d(0,-40px,0); } .nav-box ul.small-ul li a:hover span { transform: translate3d(0,-28px,0); } #footer { padding: 50px 50px 100px; } #footer .col.col3 { width: 100%; clear: both!important; float: none!important; } #footer .col.col3x2 { width: 100%; clear: both!important; float: none!important; } #footer .col.col3x2 .col.col3 { margin-right: 0; /* width: 33.33%;*/ width: 100%; margin-top: 50px; } #footer { text-align: center; } #footer .text-right { margin: 25px auto; } .sec1 h2 { font-size: 30px; } #footer img { margin-bottom: 10px; } html #footer ul.social { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } a.btn { width: auto; height: auto; padding: 15px 30px; font-size: 14px; } .sec-split-img .col.col2 { float: none !important; clear: both !important; width: 100% !important; margin-right: 0 !important; } .split-img-text-wrap { padding: 40px 25px; } } @media screen and (max-width: 767px) { .btn-round { bottom: 1.2rem; } #header { height: 100px; } #header .site-logo { top: 20px; left: 20px; } html.nav-in #header .site-logo { width: 50px; } /* #header .site-logo svg { width: 200px; } */ #header .site-logo svg, #header .site-logo .logo-img { width: 200px; height: 69px; background-image: url(../../img/svg/rathbone-logo-green.svg); } #header .btn-nav { top: 25px; right: 25px; width: 40px; height: 40px; background-size: 45px; } .sec1 h1.title-pages { font-size: 50px; line-height: 50px; -webkit-text-stroke: 1px #fff; margin-bottom: 20px; } .hidden-title { width: calc(100% - 50px); } .hero-text p { font-size: 14px; } .hero-slider .slick-arrow { height: 35px; width: 35px; bottom: 1.5rem; } .hero-slider .slick-arrow.slick-prev { left: 1.5rem; } .hero-slider .slick-arrow.slick-next { right: 1.5rem; } .sec-2-box-a .ov-box { padding: 200px 25px; } .sec-2-box-a .ov-box h2 { font-size: 20px; } .sec-2-box-a .dark-box { padding: 50px 25px; } .sec-2-box-a .dark-box-info h6 { font-size: 14px; } .sec-2-box-a .dark-box-info p { font-size: 14px; } .sec-ov-dark-text { padding: 25px; } .sec-ov-dark-text .ov-box-content h6 { font-size: 14px; } .sec-ov-dark-text .ov-box-content p { font-size: 14px; } .sec-2-box-b .box-2 { padding: 50%; } .sec-2-box-b .box-1-text { padding: 25px; } .sec-2-box-b .box-1-text h6 { font-size: 14px; } .sec-2-box-b .box-1-text p { font-size: 14px; } .nav-box { /* width: 300px;*/ width: 310px; } .read-more-btn { font-size: 14px; margin-top: 10px; } .nav-box .list-box { flex: unset; } .nav-box ul.default-ul li a { margin: 5px 0; /* height: 25px; font-size: 18px; */ height: 23px; font-size: 16px; } .nav-box .list-box h2 { /* font-size: 18px;*/ font-size: 16px; margin-bottom: 5px; } .nav-box ul.small-ul li a { font-size: 14px; height: 22px; } .nav-box ul.default-ul li a:hover span{ transform: translate3d(0,-22px,0); } .nav-box ul.small-ul li a:hover span{ transform: translate3d(0,-19px,0); } .contact-info-box { top: auto; bottom: 0; width: 100%; height: auto; } .contact-info-wrap { padding: 25px; } .sec1 .contact-info-box h1 { margin-bottom: 25px; } .cont-info-box { margin-bottom: 15px; text-align: center; } .cont-info-box h6, .cont-info-box p { font-size: 14px; } .contact-social { margin: 25px auto 0; } .contact-social ul li .soc-ico { height: 25px; width: 25px; } .slider .text-slide { bottom: 150px; left: 25px; width: calc(100% - 50px); } .slider .text-slide h2 { font-size: 25px; height: 35px; } .slider .text-slide h3 { font-size: 16px; height: 24px; } #footer .nav-box ul.default-ul li a { margin: 5px 0; height: 25px; font-size: 18px; } #footer .nav-box ul.default-ul li a:hover span { transform: translate3d(0,-22px,0); } #footer .nav-box h2 { font-size: 18px; margin-bottom: 5px; } #footer .nav-box ul.small-ul li a { font-size: 14px; height: 22px; } #footer .nav-box ul.small-ul li a:hover span { transform: translate3d(0,-19px,0); } .nav-box ul.small-ul li { font-size: 14px; } #footer .col.col3x2 .col.col3 { width: 100%; } .sec1 h2 { font-size: 20px; } .scroll-btn { width: 30px; height: 30px; background-image: url(../../img/png/finger-1.png); } @-webkit-keyframes reveal-disc-btn { 0% { bottom: -100px; } 65% { bottom: 120px; } 100% { bottom: 100px; } } @keyframes reveal-disc-btn { 0% { bottom: -100px; } 65% { bottom: 120px; } 100% { bottom: 100px; } } .covid-popup a.btn { padding: 10px 20px; } }/* #patterns-wrap-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } */ .patterns-wrap { position: absolute; width: calc(100% - 100px); height: calc(100vh - 100px); /* top: 50px; left: 50px; */ top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 2; opacity: 0; } html.nav-open .nav-slide-box .patterns-wrap { /* animation: 3s reveal 1s forwards;*/ opacity: 1; transition: 3s; transition-delay: 1s; } .contact-info-box .patterns-wrap { animation: 3s reveal 2s forwards; } .patt { width: 100px; height: 100px; position: absolute; top: 50px; right: 50px; background-repeat: no-repeat; background-position: center; background-size: contain; opacity: 0.5; animation-iteration-count: infinite; animation-timing-function: linear; } .contact-info-box .patt { top: 50%; right: 50%; } .patt.one { animation-name: pattern-turns-one; animation-duration: 30s; animation-direction: alternate; animation-delay: 0s; } .patt.two { animation-name: pattern-turns-one; animation-duration: 35s; animation-direction: normal; animation-delay: 0s; } .patt.three { animation-name: pattern-turns-two; animation-duration: 30s; animation-direction: alternate; animation-delay: 0s; } .patt.four { animation-name: pattern-turns-two; animation-duration: 35s; animation-direction: reverse; animation-delay: 0s; } /* Pattersn - Brands */ .patt:nth-child(1) { background-image: url(../../img/svg/icon-adam.png); width: 200px; height: 200px; } .patt:nth-child(2) { background-image: url(../../img/svg/icon-crosstown-doughnuts.svg); } /* .patt:nth-child(3) { background-image: url(../../img/svg/icon-digme.svg); width: 200px; height: 200px; } */ .patt:nth-child(4) { background-image: url(../../img/svg/icon-lab-store.svg); } .patt:nth-child(5) { background-image: url(../../img/svg/icon-rawr.svg); width: 200px; height: 200px; } .patt:nth-child(6) { background-image: url(../../img/svg/icon-white-pine.svg); } /* Pattersn - Extras */ .patt:nth-child(7) { background-image: url(../../img/svg/icon-flowers.svg); width: 250px; height: 250px; } .patt:nth-child(8) { background-image: url(../../img/svg/icon-leaf.svg); width: 200px; height: 200px; } .patt:nth-child(9) { background-image: url(../../img/svg/icon-leaves.svg); width: 200px; height: 200px; } .patt:nth-child(10) { background-image: url(../../img/svg/icon-square.svg); width: 50px; height: 50px; } .patt:nth-child(11) { background-image: url(../../img/svg/icon-stingray-leaf.svg); width: 350px; height: 350px; } @keyframes pattern-turns-one { 0% { transform: rotate(0deg) scale(1.1); opacity: 0.5; } 50% { transform: rotate(180deg) scale(0.9); opacity: 0.2; } 100% { transform: rotate(360deg) scale(1.1); opacity: 0.5; } } @keyframes pattern-turns-two { 0% { transform: rotate(0deg) scale(0.9); opacity: 0.2; } 50% { transform: rotate(180deg) scale(1.1); opacity: 0.5; } 100% { transform: rotate(360deg) scale(0.9); opacity: 0.2; } } @keyframes reveal { 0% { opacity: 0; } 100% { opacity: 1; } } @media screen and (max-width: 1100px) { .patterns-wrap { width: calc(100% - 100px); height: calc(100vh - 100px); } .patt { width: 75px; height: 75px; } /* Pattersn - Brands */ .patt:nth-child(1) { width: 150px; height: 150px; } .patt:nth-child(3) { width: 150px; height: 150px; } .patt:nth-child(5) { width: 150px; height: 150px; } /* Patterns - Extras */ .patt:nth-child(7) { width: 200px; height: 200px; } .patt:nth-child(8) { width: 150px; height: 150px; } .patt:nth-child(9) { width: 150px; height: 150px; } .patt:nth-child(10) { width: 40px; height: 40px; } .patt:nth-child(11) { width: 250px; height: 250px; } } @media screen and (max-width: 767px) { .patt { width: 50px; height: 50px; } /* Pattersn - Brands */ .patt:nth-child(1) { width: 100px; height: 100px; } .patt:nth-child(3) { width: 100px; height: 100px; } .patt:nth-child(5) { width: 100px; height: 100px; } /* Patterns - Extras */ .patt:nth-child(7) { width: 150px; height: 150px; } .patt:nth-child(8) { width: 100px; height: 100px; } .patt:nth-child(9) { width: 100px; height: 100px; } .patt:nth-child(10) { width: 30px; height: 30px; } .patt:nth-child(11) { width: 175px; height: 175px; } .contact-info-box .patterns-wrap { display: none; } }