/*-------Reset----------------------------------------------------------------------------------------*/

a, abbr, acronym, address, applet, article, aside, audio,b, blockquote, big, body,center, canvas, caption, cite, code, command,datalist, dd, del, details, dfn, dl, div, dt, em, embed,fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html,i, iframe, img, ins,kbd, keygen,label, legend, li, meter,nav,object, ol, output,p, pre, progress,q, s, samp, section, small, span, source, strike, strong, sub, sup,table, tbody, tfoot, thead, th, tr, tdvideo, tt,u, ul, var{background: transparent;border: 0 none;font-size: 100%; margin: 0;padding: 0;border: 0;outline: 0;vertical-align: top;  }ol, ul {list-style: none;}blockquote,q {quotes: none;}img {vertical-align:top; }embed { vertical-align:top;}

/*-----------------------------------------------------------------------------------------------*/

@import url(//fonts.googleapis.com/earlyaccess/hanna.css);
@import url(//fonts.googleapis.com/earlyaccess/jejugothic.css);

html,body {height: 100%; margin: 0; padding: 0;}


body {background:#eee; font-family: 'Jeju Gothic', sans-serif;  letter-spacing:0px; overflow-x:hidden; font-weight:bold; text-transform:uppercase; }


.locations{ position:relative; height:100%;}
.locations li{ position:absolute; height:90%; min-height:90%; width:50%; padding-top:15%; text-align:center;

-webkit-transition-duration: 0.5s;

-moz-transition-duration: 0.5s;

-o-transition-duration: 0.5s;

-ms-transition-duration: 0.5s;

transition-duration: 0.5s;}

.locations li:hover{ z-index:2; 
-webkit-filter: saturate(1.3);
    filter: saturate(1.3);
}

.locations li img{width:100%; max-width:299px; height:auto;}

#bt1 img, #bt2 img{width:100%; max-width:299px; height:auto;}

#bt1{font-family: 'Jeju Gothic', sans-serif; background:url(../images/english.jpg) center no-repeat; left:50%; background-size:auto 120%; color:#000;}
#bt1:hover{background-size:auto 130%;}
#bt2{font-family: 'Jeju Gothic', sans-serif; background:url(../images/korean.jpg) center no-repeat; left:0; background-size:auto 120%; color:#fff;}
#bt2:hover{background-size:auto 130%;}




h2{ font-size:26px; line-height:35px; text-transform:uppercase; font-weight:normal;}

p{margin:0px 0 0px 0;}

.enter1{ display:block; width:230px; margin:auto; margin-top:15px; padding:25px; border:2px solid #fff; color:#fff;    font-size:20px; text-decoration:none;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-ms-transition-duration: 0.2s;
transition-duration: 0.2s;
}

.enter1:hover{ background:#222; color:#fff; border:2px solid #222; }



@media(max-width:980px){
.locations li{ position: absolute; height: auto; width:100%;  left:0 !important; float:left; }

p{margin:10px 0 10px 0;}

.enter{ display:block; width:60%; margin:auto; padding:15px; border:1px solid #fff; color:#fff; font-size:14px; text-decoration:none; margin-bottom:20px;}

.enter1{ display:block; width:60%; margin:auto; padding:15px;  font-size:14px; text-decoration:none; margin-bottom:20px;}

h2{ font-size:16px; line-height:45px; text-transform:uppercase; font-weight:normal;}

#bt1{ top:50%;  overflow:hidden; z-index:10;}
#bt2{top:0%;  overflow:hidden;}
#bt1 img, #bt2 img {width: 100%;max-width: 299px;height: auto; }

#bt1{ background:url(../images/english.jpg) center no-repeat; left:50%; background-size:cover; color:#000;}
#bt1:hover{background-size:cover;}
#bt2{ background:url(../images/korean.jpg) center no-repeat; left:0; background-size:cover; color:#fff;}
#bt2:hover{background-size:cover;}

.locations li{min-height:50%; padding-top:15%;}
}




@media(max-width:360px){

.locations li img{width:100%; max-width:200px; height:auto;}	

}