
@media only screen and (min-width: 320px) and (max-width: 479px)  {

html
{
	overflow-y: auto;
	overflow-x: hidden;
}


#mobile-before:after{
 
   content : '\A';
   white-space: pre;

}

.center-contact {
width: 80%;
position: relative;
z-index: 99;
height: auto;
min-height: 300px;
background: rgba(0, 0, 0, 0.8);
top: 50px;
float: none;
border: 2px solid rgba(255, 255, 255, 0.3);
text-align: left;
padding: 10px;
}

h1.h1-mobile {
font-size: 12px;
font-weight: 400;
color: #d49a32;
border-bottom: 1px solid #333;
line-height: 1;
 text-transform: uppercase;
}


span.form-rese {
padding: 5px;
line-height: 220%;
}


input.johnny-contact-forminfo-sub
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 220px;
}

textarea.johnny-contact-forminfo-text
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 218px;
max-height: 80px;

}

span.center-contact-p {
line-height: 150%;
letter-spacing: 0px;
font-family: 'Arial', Tahoma;
font-size: 8pt;
}



.johnny-img-tour{
float: left;
margin: 5px 15px 5px 0px;
max-width: 295px;
height: auto;
border: 6px solid #fbfbfb;
padding: 5px;

}

.table-trans{
width: 100%;
border: 0;
background: #000;
font-size: 9pt;
text-align: left;
}

.table-trans-first-tr{
background: #a95d03;
line-height: 200%;
border-bottom: 1px solid #636261;


}

.table-trans-first{
padding-left: 6px;
}

.table-trans-second{
width: 17%;
padding-left: 6px;
}

.table-trans-con{
font-size: 7pt;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
padding-top: 7px;
font-family: 'Arial', Tahoma;
line-height: 160%;
border-bottom: 1px dotted #8c8b8b;
color: #bbbbbb;
}


.noidung-home-black {
text-align: left;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 5px;
	margin-right: 5px;
	padding-top: 20px;
	padding-bottom: 20px;
	background: #000;
}

img.khanh-img {width: 130px; max-width: 115px; height: auto; left: 20px;}
#language { visibility: hidden;}

.small-fancy-box {
width: 130px;
max-width: 130px;
border: 4px solid #f1f1f1;
height: auto;
padding: 4px;
margin: 5px;

}

.small-fancy-box-services{
width: 110px;
max-width: 130px;
border: 4px solid #f1f1f1;
height: auto;
padding: 4px;
margin: 5px;
}


.header-slider {
margin-top: 30px;
}

.div-header-center {
top: 0;
margin: 0;
background: rgba(0, 0, 0, 1);
width: 100%;
height: 50px;
text-align: left;
box-shadow: 0px 1px 1px #FFF;
position: absolute;
z-index: 999;
}


.resever {
visibility: hidden;}

img.hinh-auto-home {
max-width: 91%;
height: auto;
padding: 1px;
border: 2px solid #000;
}

img.hinh-auto-room {
max-width: 95%;
height: auto;
padding: 2px;
border: 2px solid #fbfbfb;
}

.small-room-slice-show {
max-width: 65px;
border: 3px solid #f1f1f1;
height: auto;
padding: 3px;
margin: 3px;
}


img.johnny-img-auto {
max-width: 90%;
height: auto;
border: 0;
}



}

/* -----------------------------------------------------------------------------------------*/


@media only screen and (min-width: 480px) and (max-width: 640px)  {
html
{
	overflow-y: auto;
	overflow-x: hidden;
}

.telephone-hidden-mobile {
visibility: hidden;
display:none;
}

.telephone-hidden {
visibility: initial;
display:inline;
}

.footer-fixed-contact {
background: #000;
position: fixed;
width: 100%;
height: auto;
bottom: 0px;
z-index: 1;
margin: 0 0 0 0;
border-top: 1px solid #333;
}

.mobile-before-2: {
 
  width: 100%;
  min-height: 1550px;
position: relative;
}

.center-contact {
width: 70%;
position: relative;
z-index: 99;
height: auto;
min-height: 300px;
background: rgba(0, 0, 0, 0.8);
top: 10px;
float: right;
margin-right: 10px;
border: 2px solid rgba(255, 255, 255, 0.3);
text-align: left;
padding: 10px;
margin-bottom: 50px;
}

h1.h1-mobile {
font-size: 12px;
font-weight: 400;
color: #d49a32;
border-bottom: 1px solid #333;
line-height: 1;
 text-transform: uppercase;
}


span.form-rese {
padding: 5px;
line-height: 220%;
}


input.johnny-contact-forminfo-sub
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 220px;
}

textarea.johnny-contact-forminfo-text
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 218px;
max-height: 80px;

}

span.center-contact-p {
line-height: 150%;
letter-spacing: 0px;
font-family: 'Arial', Tahoma;
font-size: 8pt;
}



.johnny-img-tour{
float: left;
margin: 5px 15px 5px 0px;
max-width: 295px;
height: auto;
border: 6px solid #fbfbfb;
padding: 5px;

}

.table-trans{
width: 100%;
border: 0;
background: #000;
font-size: 9pt;
text-align: left;
}

.table-trans-first-tr{
background: #a95d03;
line-height: 200%;
border-bottom: 1px solid #636261;


}

.table-trans-first{
padding-left: 6px;
}

.table-trans-second{
width: 17%;
padding-left: 6px;
}

.table-trans-con{
font-size: 7pt;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
padding-top: 7px;
font-family: 'Arial', Tahoma;
line-height: 160%;
border-bottom: 1px dotted #8c8b8b;
color: #bbbbbb;
}


.noidung-home-black {
text-align: left;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 5px;
	margin-right: 5px;
	padding-top: 20px;
	padding-bottom: 20px;
	background: #000;
}

img.khanh-img {width: 130px; max-width: 115px; height: auto; left: 20px;}
#language { visibility: hidden;}

.small-fancy-box {
width: 130px;
max-width: 130px;
border: 4px solid #f1f1f1;
height: auto;
padding: 4px;
margin: 5px;

}

.small-fancy-box-services{
width: 110px;
max-width: 130px;
border: 4px solid #f1f1f1;
height: auto;
padding: 4px;
margin: 5px;
}


.header-slider {
margin-top: 30px;
}

.div-header-center {
top: 0;
margin: 0;
background: rgba(0, 0, 0, 1);
width: 100%;
height: 50px;
text-align: left;
box-shadow: 0px 1px 1px #FFF;
position: absolute;
z-index: 999;
}


.resever {
visibility: hidden;}

img.hinh-auto-home {
max-width: 91%;
height: auto;
padding: 1px;
border: 2px solid #000;
}

img.hinh-auto-room {
max-width: 95%;
height: auto;
padding: 2px;
border: 2px solid #fbfbfb;
}

.small-room-slice-show {
max-width: 65px;
border: 3px solid #f1f1f1;
height: auto;
padding: 3px;
margin: 3px;
}


img.johnny-img-auto {
max-width: 90%;
height: auto;
border: 0;
}

}

/* cho laptop ne */
@media only screen and (min-width: 1365px) and (max-width: 3000px)  {

/* End laptop ne */

}
@media only screen and (min-width: 1200px) and (max-width: 1280px)  {

img.khanh-img {width: 150px; max-width: 150px; height: auto; left: 20px;}

.small-fancy-box {
width: 125px;
max-width: 125px;
border: 6px solid #f1f1f1;
padding: 5px;
margin: 5px;
}

.small-room-slice-show {
max-width: 65px;
border: 3px solid #f1f1f1;
height: auto;
padding: 3px;
margin: 3px;
}
/* Nexus Lanscape */
}


@media only screen and (min-width: 1024px) and (max-width: 1190px)  {

input.johnny-contact-forminfo-fone
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 120px;
}


input.johnny-contact-forminfo-fone:hover {
    border:1px solid #c48416;
    
}


input.johnny-contact-forminfo
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 200px;
}


input.johnny-contact-forminfo:hover {
    border:1px solid #c48416;
    
}

textarea.johnny-contact-forminfo-text
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 560px;
}


textarea.johnny-contact-forminfo-text:hover {
    border:1px solid #c48416;
    
}
.johnny-lang{
position: absolute;
top: 0;
right: 0px;
}


img.khanh-img {width: 150px; max-width: 150px; height: auto; left: 20px;}

.small-fancy-box {
width: 100px;
max-width: 100px;
border: 6px solid #f1f1f1;
padding: 5px;
margin: 5px;
}


.fa-2x {
font-size: 1.5em;
}

.support-font-a {
font-size: 8pt;
}

.johnny-iframe {
width: 93%;
height: 300px;
border: 0;
text-align: center;
overflow: hidden;
}


/* 1024px */
}


@media only screen and (min-width: 641px) and (max-width: 1023px)  {
html
{
	overflow-y: auto;
	overflow-x: hidden;
}


.footer-fixed-contact {
background: #000;
position: fixed;
width: 100%;
height: auto;
bottom: 0px;
z-index: 1;
margin: 0 0 0 0;
border-top: 1px solid #333;
}

.mobile-before-2: {
 
  width: 100%;
  min-height: 1550px;
position: relative;
}

.center-contact {
width: 70%;
position: relative;
z-index: 99;
height: auto;
min-height: 300px;
background: rgba(0, 0, 0, 0.8);
top: 10px;
float: right;
margin-right: 10px;
border: 2px solid rgba(255, 255, 255, 0.3);
text-align: left;
padding: 10px;
margin-bottom: 60px;
}

h1.h1-mobile {
font-size: 12px;
font-weight: 400;
color: #d49a32;
border-bottom: 1px solid #333;
line-height: 1;
 text-transform: uppercase;
}


span.form-rese {
padding: 5px;
line-height: 220%;
}


input.johnny-contact-forminfo-sub
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 220px;
}

textarea.johnny-contact-forminfo-text
{
font-size: 10.5pt;
margin: 0;
border-radius: 0px;
border:1px solid  rgb(169, 169, 169);  
overflow: hidden;
-webkit-appearance: none;
background: #000;
color: #c0c0c0;
padding-top: 4px; padding-bottom: 4px; padding-left: 5px;
max-width: 646px;
max-height: 80px;

}

span.center-contact-p {
line-height: 150%;
letter-spacing: 0px;
font-family: 'Arial', Tahoma;
font-size: 8pt;
}



img.khanh-img {width: 200px; max-width: 200px; height: auto; left: 20px;}

.header-slider {
margin-top: 26px;
}

.div-header-center {
top: 0;
margin: 0;
background: rgba(0, 0, 0, 1);
width: 100%;
height: 50px;
text-align: left;
box-shadow: 0px 1px 1px #FFF;
position: absolute;
z-index: 999;
}

.johnny-lang{
position: absolute;
top: 0;
right: 150px;
}

.small-fancy-box {
width: 100px;
max-width: 100px;
border: 4px solid #f1f1f1;
padding: 5px;
margin: 5px;
}

.small-fancy-box-services {
width: 100px;
max-width: 100px;
border: 4px solid #f1f1f1;
padding: 5px;
margin: 5px;
}

.small-room-slice-show {
max-width: 65px;
border: 3px solid #f1f1f1;
height: auto;
padding: 3px;
margin: 3px;
}

img.johnny-img-auto {
max-width: 90%;
height: auto;
border: 0;
}

.support-font-a {
font-size: 8pt;
}


.fa-2x {
font-size: 1.5em;
}

.johnny-iframe {
width: 93%;
height: 300px;
border: 0;
text-align: center;
overflow: hidden;
}

.small-fancy-box-services{
width: 115px;
max-width: 130px;
border: 4px solid #f1f1f1;
height: auto;
padding: 4px;
margin: 5px;
}


.table-trans{
width: 100%;
border: 0;
background: #000;
font-size: 9pt;
text-align: left;
}

.table-trans-first-tr{
background: #a95d03;
line-height: 200%;
border-bottom: 1px solid #636261;


}

.table-trans-first{
padding-left: 6px;
}

.table-trans-second{
width: 15%;
padding-left: 6px;
}

.table-trans-con{
font-size: 7pt;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
padding-top: 7px;
font-family: 'Arial', Tahoma;
line-height: 160%;
border-bottom: 1px dotted #8c8b8b;
color: #bbbbbb;
}












}


