@font-face {
    font-family: 'medium';
    src: url('../fonts/euclidflex-medium.eot');
    src: url('../fonts/euclidflex-medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/euclidflex-medium.woff2') format('woff2'),
         url('../fonts/euclidflex-medium.woff') format('woff'),
         url('../fonts/euclidflex-medium.ttf') format('truetype'),
         url('../fonts/euclidflex-medium.svg#medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'medium-alt';
    src: url('../fonts/alt-medium.eot');
    src: url('../fonts/alt-medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/alt-medium.woff2') format('woff2'),
         url('../fonts/alt-medium.woff') format('woff'),
         url('../fonts/alt-medium.ttf') format('truetype'),
         url('../fonts/alt-medium.svg#medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'gardenbeats';
  src: url('../fonts/gardenbeats.eot?68321853');
  src: url('../fonts/gardenbeats.eot?68321853#iefix') format('embedded-opentype'),
       url('../fonts/gardenbeats.woff2?68321853') format('woff2'),
       url('../fonts/gardenbeats.woff?68321853') format('woff'),
       url('../fonts/gardenbeats.ttf?68321853') format('truetype'),
       url('../fonts/gardenbeats.svg?68321853#gardenbeats') format('svg');
  font-weight: normal;
  font-style: normal;
}


.gb-icon:before{font-family:"gardenbeats";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing: grayscale;}
 
.gb-icon-close:before{content:'\e800';}
.gb-icon-right:before{content:'\e801';}
.gb-icon-left:before{content: '\e802';}
.gb-icon-up:before{content:'\e803';}
.gb-icon-down:before{content:'\e804';}
.gb-icon-double-left:before{content:'\e821';}
.gb-icon-double-right:before{content:'\e822';}
.gb-icon-go-up:before{content:'\e824';}
.gb-icon-down-line:before{content:'\e825';}
.gb-icon-left-line:before{content:'\e826';}
.gb-icon-right-line:before{content:'\e827';}
.gb-icon-up-line:before{content:'\e828';}
.gb-icon-link:before{content:'\e805';left:-0.075em;position:relative;}

/* GRID */

.container{padding-left:20px;padding-right:20px;}

@media (min-width: 1280px) {
.container{width:1210px;}	
}

@media (min-width: 1440px) {
.container{width:1320px;}	
}

@media (min-width: 1660px) {
.container{width:1540px;}	
}

@media (max-width: 1023px) {
	
}





*{padding:0;margin:0;}

a{-webkit-transition:color 0.5s;-moz-transition:color 0.5s;-o-transition:color 0.5s;transition:color 0.5s;}
a,a:visited{color:inherit;outline:none;text-decoration:none;}
a:hover,a:focus{color:inherit;outline:none;text-decoration:none;}
a:hover{color:inherit;-webkit-transition:color 0.5s;-moz-transition:color 0.5s;-o-transition:color 0.5s;transition:color 0.5s;}
a.no-hover{color:inherit !important;}

p em a,p em a:hover{text-decoration:underline;}

html,body{font-family:'medium',sans-serif;font-style:normal;font-weight:normal;font-size:14px;line-height:1.5;background-color:#FDFAF2;color:#3f357b;text-align:left;-webkit-overflow-scrolling:touch;position:relative;height:100%;}

span.alternate{font-family:'medium-alt',sans-serif;}

h1,h2,h3,h4,h5{font-weight:500;font-style:normal;font-stretch:normal;line-height:1;color:#3f357b;padding:0;margin:0;}
b,strong{font-weight:500;}
p{margin:0;padding:0;font-size:1em;}
em{font-style:normal;}

hr{border-top:2px solid #dadada;margin:0 0 30px 0;padding:0;}

::-moz-selection { background:#3f357b;color: #fff; text-shadow: none; }
::selection { background:#3f357b; color: #fff; text-shadow: none; }

#preloader{display:block;position:fixed;top:0;left:0;right:0;bottom:0;background:#FDFAF2;z-index:245;-webkit-transition:background-color 1s;-moz-transition:background-color 1s;-o-transition:background-color 1s;transition:background-color 1s;}


@media (max-width: 1279px) {
	html,body{font-size:13px;}
}

@media (max-width: 1099px) {
	html,body{font-size:12px;}
}








/* PACE */
.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;}
.pace-inactive{display:none;}
.pace .pace-progress{background:#3f357b;position:fixed;z-index:2000;top:0;right:100%;width:100%;height:3px;}

@media (max-width: 1023px) {
.pace .pace-progress{height:1px;}	
}

/* SVG HANDLING */
object{display:inline-block;width:auto;}

.lores{display:block;}
.hires{display:none;}

@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and ( min--moz-device-pixel-ratio: 2),only screen and ( -o-min-device-pixel-ratio: 2),only screen and ( min-device-pixel-ratio: 2),only screen and ( min-resolution: 192dpi),only screen and ( min-resolution: 2dppx) {
.lores{display:none;}
.hires{display:block;}
}




#screen{width:100%;height:auto;min-height:500px;background:#FDFAF2 url(../svg/bottom-durians.svg) center bottom no-repeat;background-size:125% auto;color:#3f357b;position:relative;padding:50px 25px 200px 25px;display:flex;align-items:center;justify-content:center;overflow:hidden;}

.contents{width:100%;height:auto;position:relative;z-index:50;}

.logo{display:block;margin:0 auto;width:100%;height:auto;max-width:170px;}

#screen h1{font-size:40px;line-height:1.25;text-transform:uppercase;padding:75px 0;margin:0;text-align:center;}
#screen p{font-size:17px;line-height:1.25;text-align:center;margin:0;padding:0;}

.durian1{display:block;position:absolute;bottom:57%;right:85%;width:75px;height:auto;z-index:25;}
.durian2{display:block;position:absolute;bottom:57.5%;left:85%;width:150px;height:auto;z-index:25;}

@media (max-height: 650px) {
	#screen h1{padding:50px 0;}
}

@media (max-height: 600px) {
	#screen h1{font-size:35px;padding:40px 0;}
}


@media (max-width: 1024px) {
	#screen{padding:50px 25px 150px 25px;}
	#screen h1{font-size:30px;}
	#screen p{font-size:15px;}
	
	.durian1{width:50px;}
	.durian2{width:100px;}
}

@media (max-width: 767px) {
	.logo{max-width:140px;}
	#screen{padding:50px 25px 100px 25px;}
	#screen h1{font-size:20px;}
	#screen p{font-size:13px;}
	
	.durian1{width:35px;}
	.durian2{width:70px;}
}

@media (max-width: 500px) {
	.logo{max-width:120px;}
	#screen{padding:30px 20px 70px 20px;}
	#screen h1{font-size:17px;}
	#screen p{font-size:12px;}
}