@charset "utf-8";
/* CSS Document */

body {
	font-family:'Quicksand', sans-serif;
	font-weight:400;
	color:#555555; font-size:1.1em; line-height:1.75em;
}

* { box-sizing: border-box;}

h1, h2, h3, h4, h5 { font-family:'ZCOOL XiaoWei', serif;}

section { margin:0; padding:0;}
p { margin-bottom:1.75em;}

a, a:visited { color:#3781b5;}
a:hover { text-decoration:underline;}

.clearing { clear:both;}

.img_right { float:right; padding:0 0 2em 2em;}

.table {
	display: table;   /* Allow the centering to work */
	margin: 0 auto;
	color:#707070;
}
.row {display:table-row;}
.cell {display:table-cell; padding:0.5em;}

ul.table { padding:0;}

.btn { background:#a7a178; border-radius:0.25em; border:1px solid #a7a178; font-size:0.9em; padding:0.35em 1.25em; margin-top:0.5em;}
.btn:hover { background:#fff; color:#a7a178;}
a.btn, a.btn:visited { color:#fff;}
a.btn:hover { color:#8c8764;}

.gridContainer img { max-width:100%; margin:0 auto;}

.line-divider { border-bottom:1px solid #e1e1e1;}

.mark { color:#F00; background:none;}
.error { color:#F00;}
.msg { /*color:#09F;*/}
.dispnon { display: none;}
.smallTxt { font-size:75%;}


.header { background:#0F3;}

.content { padding:4em 0;}
.content h1 { color:#000; text-align:left;}
.content h2 { margin:1em 0; font-size:1.8em;}

section.content:nth-child(even) { background:#f4f5ef;}

.topContent h1 { margin:1.5em 0 1em; color:#555;}

#home .content { text-align:center;}
#home .content h2 { color:#b0a77e; font-size:2.4em;}

.generalList { margin:1em 0 2em; padding:0;}
.generalList li { margin:0 0.5em; padding:0; list-style:none; display:inline-block; line-height:1.4em;}
.generalList li img { max-height:300px;}

#accessCont .generalList li { font-size:1.25em; font-weight:500; max-width:310px; vertical-align:top; margin:0.5em 1.5em;}
#accessCont .generalList li img { 
	max-height:300px;
	margin-bottom:1em; border-radius: 50% 10%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	border:15px inset rgba(255, 255, 255, 0.5);
}

#facilityList { margin:0 auto 2.5em auto; max-width: 2000px;}
#facilityList li { float:left; margin:0 10px; width:18%; text-align:left;}

#layoutPlans { margin:0; padding:0;}
#layoutPlans li { margin:0 0.5em; padding:0; list-style:none; display:inline-block; line-height:1.4em;}
#layoutPlans li h4 { font-size:1.3em; font-weight:500; color:#333;}
#layoutPlans li img { max-height:460px;}
#layoutPlans .cell { vertical-align:middle;}

#contactCont .btn { margin:0 0.75em;}

.footer { color:#555;  width:100%; padding:4em 0 3em 0; border-top:1px solid #e5e6df; font-size:0.8em; text-align:center;}

#floatWhatsapp {
    width: 60px;
    height: 60px;
    text-indent: -9999px;
    background:url(../img/whatsapp.png) no-repeat;
	background-size:cover;
    overflow: hidden;
    position: fixed;
    right: 11.25%;
    top: 15%;
	z-index:10000;
}

#to-top {opacity: 0.3;border-radius: 50% 50% 50% 50%;}
#to-top {
    width: 40px;
    height: 40px;
    text-align: left;
    text-indent: -9999px;
    background: url(../img/sprite.png) no-repeat scroll -120px -50px transparent;
    overflow: hidden;
    display: none;
    position: fixed;
	right: 11.5%;
    bottom: 20px;
}

#to-top:hover {opacity: 1;}

@media only screen and ( max-width: 90em ) /* 1440 */
{
#accessCont .generalList li img { max-height:250px;}

#layoutPlans li img { max-height:400px;}
}

@media only screen and ( max-width: 86em ) /* 1376 */
{
#facilityList li { width:30%;}

#layoutPlans li img { max-height:380px;}
}

@media only screen and ( max-width: 80em ) /* 1280 */
{
#accessCont .generalList li { font-size:1.1em; max-width:250px;}
#accessCont .generalList li img { max-height:240px;}

#layoutPlans li img { max-height:330px;}
}

@media only screen and ( max-width: 64em ) /* 1024 */
{
.content { padding:2em 0;}

#home .content h2 { font-size:2em;}

#accessCont .generalList li { font-size:1em; max-width:210px; margin:0.5em 0.75em;}
#accessCont .generalList li img { max-height:200px;}

#layoutPlans li img { max-height:460px;}
}

@media only screen and ( max-width: 62em ) /* 992 */
{
#accessCont .generalList { margin:0;}
#accessCont .generalList li { font-size:1.1em; max-width:260px; margin:1em 1.5em;}
#accessCont .generalList li img { max-height:250px;}
}

@media screen and (max-width: 56em) /* 896 */
{
#floatWhatsapp, #to-top { right:10%;}
}

@media screen and (max-width: 53.5em) /* 856 */
{
#facilityList li { width:45%;}
}

@media screen and (max-width: 51em) /* 816 */
{
#home .content h2 { line-height:normal;}

#accessCont .generalList li { max-width:250px; margin:1em;}
#accessCont .generalList li img { max-height:240px;}

#floatWhatsapp, #to-top { right:6%;}
}

@media screen and (max-width: 43.5em) /* 696 */
{
#accessCont .generalList li { max-width:240px;}
#accessCont .generalList li img { max-height:230px;}

#layoutPlans li img { max-height:400px;}
}

@media screen and (max-width: 42em) /* 672 */
{
#layoutPlans li img { max-height:360px;}
#layoutPlans li .btn { font-size:0.8em;}

#floatWhatsapp { width: 50px; height: 50px;}
}

@media screen and (max-width: 40em) /* 640 */
{
.content { padding-top:1em;}

#accessCont .generalList li { font-size:1.1em; max-width:260px; margin:1em 0;}
#accessCont .generalList li img { max-height:250px;}

#layoutPlans li img { max-height:330px;}
}

@media screen and (max-width: 35.5em) /* 568 */
{
#layoutPlans li img { max-height:310px;}
#layoutPlans li { font-size:0.95em;}
}

@media screen and (max-width: 33.5em) /* 536 */
{
#facilityList li { width:90%; font-size:0.9em; line-height:1.5em;}

#layoutPlans .cell { display:block; padding:0.25em 0;}
#layoutPlans li { font-size:1em; margin-bottom:1em;}
#layoutPlans li img { max-height:460px;}
#layoutPlans li .btn { font-size:1em;}
}

@media screen and (max-width: 31.5em) /* 504 */
{
}

@media screen and (max-width: 30em) /* 480 */
{
}

@media screen and (max-width: 26em) /* 416 */
{
.footer { line-height:1.5em;}
}

@media screen and (max-width: 24.5em) /* 392 */
{
#floatWhatsapp { width:45px; height:45px;}
}

@media screen and (max-width: 24em) /* 384 */
{
#contactCont .btn { margin:0.25em 0.75em;}
}

@media screen and (max-width: 20em) /* 320 */
{
#accessCont .generalList li { max-width:240px; }
#accessCont .generalList li img { max-height:230px;}
}