body:lang(tc-HK),
body:lang(tc-HK) button,
body:lang(tc-HK) select,
body:lang(tc-HK) input,
body:lang(tc-HK) textarea
{font-family: Microsoft JhengHei;
-moz-appearance: none;
-webkit-appearance: none;
}
button{cursor: pointer;}
.container{
width: 1200px;
margin:0 auto;
padding: 0 15px;
}
.header{
position: relative;
width: 100%;
padding: 30px;
background-color: #fff;
-webkit-box-shadow: 0px 2px 5px 0px rgba(230,230,230,1);
-moz-box-shadow: 0px 2px 5px 0px rgba(230,230,230,1);
box-shadow: 0px 2px 5px 0px rgba(230,230,230,1);
z-index: 2;
}
.header .logo img{width: auto;
height: 35px;
}
.nav img{
position: relative;top: 2px;
width: auto;height: 18px;
}
.nav-controls{display: none;}
.fade{
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.font14{font-size: 14px;}
li.active a{color: #0c6362 !important;}
.headpin{position: relative;}
.headpin span{
position: absolute;
top: -6px;
right: -8px;
border-radius: 50%;
width: 15px;
height: 15px;
background-color: #0c6362;
color: #fff;
font-size: 10px;
font-family: 'Roboto', sans-serif;
text-align: center;
}
.home-searching{position: relative;margin-bottom: -5px;}
.home-searching .banner{
height: auto;
width: 100%;
min-height: 520px;
object-fit:cover;
}
.search-box{
position: absolute;
top: 30%;
width: 80%;
left: 50%;
transform: translate(-50%, 0);
background-color: rgba(0,0,0,0.65);
color: #fff;
padding: 25px;
border-radius: 5px;
}
.search-box h2{font-size: 34px;}
.logoheading{
width: auto;
height: 30px;
position: relative;
top: 2px;
}
.hotitems a{display: inline-block;
color: #fff;
text-decoration: underline;
margin:0 5px;
}
.searching{width: 100%;margin: 20px 0}
.selectLocation{
width: 20%;
float: left;
}
.selectLocation select,.inputLocation input{
width: 100%;
font-size: 18px;
padding: 12px;
border:1px solid #fff;
border-radius: 3px;
background-color: #fff;
}
.inputLocation{
position: relative;
width: 65%;
float: left;
padding: 0 15px;
}
.search-btn{
float: left;
width: 15%;
}
.selector{position: relative;}
.selector i{position: absolute;
top: 20px;
right: 10px;
font-size: 12px;color: #222;}
.selector i.inpadding{right: 25px;}
.inline-block{display: inline-block;}
.searching button.search-btn{
display: inline-block;
width: 100%;
border-radius: 3px;
background-color: #0c6362;
color: #fff;
font-size: 18px;
padding: 12px;
border: 0;
}
.section{
width: 100%;
padding: 65px 0;
}
.regionbggrey{background-color: #f1f2f3;}
h2.h236Title{
font-size: 36px;
}
.search-region{
margin-top: 45px;
}
.region-lg{width: 48%;float: left;padding: 0 15px;margin-bottom: 30px;}
.region-sm{width: 26%;float: left;padding: 0 15px;margin-bottom: 30px;}
.regionbox {
position: relative;
overflow: hidden;
border-radius: 5px;
height: 280px;
}
.regionbox img {
position: relative;
width: 100%;
height: 100%;
object-fit:cover;
border-radius: 5px;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.regionbox:hover img {
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.regionbox::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(255,255,255,0);
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,0.45)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 );
opacity: .6;
}
.regionbox .title{
position: absolute;
bottom: 15px;
left: 50%;
text-align: center;
transform: translate(-50%, 0);
color: #fff;
z-index: 2;
width: 100%;
}
.regionbox .title h2{font-size: 28px;}
.latest-container .col-3{width: 33.33%;float: left;padding: 0 15px;margin-bottom: 50px;}
.latest-container .borderbox{background-color: #fff;
-webkit-box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
-moz-box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
}
.latest-container .imgbox{height: 240px;}
.imgbox {
position: relative;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
border-bottom: 0;
overflow: hidden;
}
.imgbox img {
position: relative;
width: 100%;
height: 100%;
object-fit:cover;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
border-bottom: 0;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
margin-bottom: -5px;
}
.imgbox:hover img {
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.imgbox::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(255,255,255,0);
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,0.45)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,0.45) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 );
opacity: .6;
}
.imgbox .title{
position: absolute;
bottom: 15px;
text-align: left;
color: #fff;
padding-left: 15px;
z-index: 2;
}
.latest-container .features .items{
width: 25%;float: left;
text-align: center;
font-size: 14px;
}
.latest-container h3{font-size: 24px;font-weight: normal;}
.latest-container h4{font-family: 'Roboto', sans-serif;font-size: 24px;font-weight: normal;}
.latest-container h4 span{font-size: 14px}
.latest-container .location{
margin:12px 0;
padding: 0 12px;
text-align: center;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.latest-container .location img{
position: relative;top: 1px;
width: auto;
height: 16px;
}
.latest-container .features{
width: 100%;
border-top: 1px solid #eee;
padding: 15px 0;
}
.latest-container .features p{
margin:0;
padding: 0;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.ads{
width: 100%;
padding: 80px 0;
min-height: 700px;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
}
.ads .content{
background-color: rgba(255,255,255,0.90);
padding: 30px;
max-width: 630px;
border-radius: 5px;
}
.ads .content h2{font-size: 30px;}
.ads .content p{line-height: 1.8;}
.border-greenlink{
border-radius:2px;
display: inline-block;
background-color: #0c6362;
border:0;
color: #fff;
text-decoration: none;
padding: 9px 20px;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
font-size: 15px;
}
.border-greenlink:hover{background-color: #034a49;}
.news .col-3{width: 100%;float: left;padding: 0 15px;margin-bottom: 10px;}
.news .newsbox{
border-top-left-radius: 5px;
border-top-right-radius: 5px;
background-color: #fff;
-webkit-box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
-moz-box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
box-shadow: 0px 3px 5px 0px rgba(219,219,219,1);
}
.newsbox .details{padding: 15px;}
.newsbox img.cover{
width: 100%;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.newsbox h3{
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.newsbox p{
line-height: 1.6;margin-bottom: 10px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
height: 75px;
}
.newsbox .date{font-family: 'Roboto', sans-serif; font-size: 14px;}
.newsbox .date img{position: relative;top: 1px;width: auto;height: 12px;display: inline-block;}
.partners-container{
width: 100%;
}
.partners{
width: 16.66%;
float: left;
padding: 0 15px;
}
.partners img{
width: 100%;
border-radius: 5px;
border:1px solid #eee;
margin-bottom: 30px;
}
footer{
width: 100%;
background-color: #222222;
padding: 30px 0 30px 0;
}
.footer-logo{text-align: center;margin-top: 40px;margin-bottom: 50px;}
.footer-logo img{width: auto;height: 36px;}
.footer-links{text-align: center;}
.footer-links a{color: #fff;text-decoration: none;display: inline-block;margin:0 30px;}
.footer-links a:hover,.copyright a:hover{text-decoration: underline;}
.footer-media {margin:30px 0;text-align: center;}
.footer-media a{margin:0 15px;display: inline-block;}
.copyright{
position: relative;
text-align: center;
width: 100%;
color: #fff;
padding-top: 30px;
line-height: 1.8;
border-top: 2px solid #393939;
}
.copyright a{color: #fff;text-decoration: none;font-size: 14px;}
.copyright img{
position: absolute;
right: 0;
bottom: 0;
}
/*scroll top*/
.scrollToTop{
width:40px;
height:40px;
padding:10px;
text-align:center;
font-weight: bold;
color: #444;
text-decoration: none;
position:fixed;
right: 40px;
bottom: 50px;
display:none;
z-index: 99;
}
.scrollToTop img{
width: 40px;
height: 40px;
}
.scrollToTop:hover{
text-decoration:none;
}
.whatsappchat{
position: fixed;
right: 30px;
bottom: 120px;
z-index: 999;
}
.whatsappchat{width: 45px;height: auto;}
.subpagebanner{
position: relative;
margin-bottom: -5px;
}
.subpagebanner img{min-height: 300px;object-fit:cover;}
.subpagebanner .item{
position: absolute;
left: 20px;
bottom: 20px;
color: #fff;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}
.subpagebanner .item h2{font-size: 34px;}
.subpagebanner .item h3{font-size: 28px;}
.search{padding: 25px 0;}
.search-centre h2{
border-bottom: 1px solid #eee;
padding: 15px 0;
}
.full-col{width: 100%;padding: 0 15px;float: left;}
.search-centre .search-item{
width: 25%;float: left;
padding: 0 15px;
margin-bottom: 30px;
}
.search-toggle{
display: none;
background-color: transparent;color: #222;font-size: 18px;padding: 0;
border:0;
position: absolute;right: 15px;
top: 20px;
cursor: pointer;
}
.form-control{
width: 100%;
border:1px solid #eee;
padding: 12px;font-size: 15px;
height: 48px;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.form-control:focus{border:1px solid #0c6362;}
.facilityOption{
cursor: pointer;
position: relative;
top: 10px;
border:0;
padding: 0;
background-color: transparent;
}
.facilityOption img{position: relative;top: 2px;}
.confirm-btn{
border:0;
font-size: 15px;
background-color: #0c6362;
color: #fff;
padding: 12px;
width: 100%;text-align: center;
height: 48px;
}
.other-features{display: none;}
.other-features .col-4{width: 25%;float: left;padding: 0 15px;}
/* The container */
.checklabel {
display: block;
position: relative;
padding-left: 30px;
margin-bottom: 12px;
cursor: pointer;
font-size: 15px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* Hide the browser's default checkbox */
.checklabel input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
/* Create a custom checkbox */
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 22px;
width: 22px;
background-color: #eee;
}
/* On mouse-over, add a grey background color */
.checklabel:hover input ~ .checkmark {
background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.checklabel input:checked ~ .checkmark {
background-color: #0c6362;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
content: "";
position: absolute;
display: none;
}
/* Show the checkmark when checked */
.checklabel input:checked ~ .checkmark:after {
display: block;
}
/* Style the checkmark/indicator */
.checklabel .checkmark:after {
left: 7px;
top: 2px;
width: 8px;
height: 15px;
border: solid white;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.slider-labels span{display: inline-block;font-family: 'Roboto', sans-serif;}
.list{
width: 100%;
padding: 45px 0;
background-color: #f5f5f5;
}
.list .box{margin-bottom: 50px;}
.list .venue{
width: 80%;
float: left;background-color: #fff;
min-height: 180px;
border-top-right-radius:12px;
border-bottom-right-radius:12px;
-webkit-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
-moz-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
}
.list .venueimg{
width: 30%;float: left;height: 180px;
}
.list .venueimg img{width: 100%;height: 180px;object-fit:cover;}
.list .details{
position: relative;
padding: 20px;
width: 70%;float: left;
}
.list .myfav{
position: absolute;right: 15px;top: 15px;
cursor: pointer;
}
.list .details h2{font-size: 20px;font-weight: normal;}
.list .details h3{font-size: 14px;font-weight: normal; color: #999999;}
.list .details p{font-size: 14px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.list .features{margin-top: 15px;}
.list .features img{width: auto;height: 20px;margin-right: 10px;}
.list .offer-box{
position: relative;
width: 20%;
min-height: 180px;
float: left;
text-align: center;
background-color: #fff;
border-radius: 12px;
border-left: 2px dashed #ddd;
-webkit-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
-moz-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
}
.list .offer{
width: 80%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
.list .offer h2{
font-family: 'Roboto', sans-serif;
font-size: 34px;
}
.list .offer h4{color: #999;font-weight: normal;font-size: 13px;}
.list .offer a{
color: #fff;
background-color: #0c6362;
padding: 13px 25px;
border-radius: 5px;
text-decoration: none;
display: inline-block;
margin-top: 15px;
width: 100%;
}
.loading{
float: left;
margin: 20px 0;
width: 100%;text-align: center;
}
.loading img{width: auto;height: 80px;}
.pagelocation{color: #777777;font-size: 14px;margin-bottom: 15px;}
.pagelocation a{text-decoration: none; color: #777777;}
.pagelocation .active{color: #0c6362;}
.pagelocation a:hover{color: #0c6362;text-decoration: underline;}
/*venue centre*/
.venue-container{
width: 100%;
padding: 45px 0;
}
.venue-info{width: 68%;padding: 0 15px;float: left;}
.venue-data{width: 32%;padding: 0 15px;float: left;}
.venue-info h1{font-size: 32px;margin-bottom: 10px;}
.venuelocation{font-size: 15px;margin-bottom: 12px;}
.tags{margin-bottom: 12px;}
.tags a{
display: inline-block;
background-color: #0c6362;
color: #fff;
padding: 5px 10px;
text-decoration: none;
font-size: 14px;
margin-bottom: 5px;
}
.lightslider{margin-bottom: 20px;}
.lslide img {
width: 100%;
height: auto;
}
.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
border: 3px solid #006564;
}
.venuedetails{margin-bottom: 20px;}
.venuedetails h2{padding: 7px 0;margin-bottom: 20px;}
.venuedetails p{line-height: 1.7;font-size: 15px;}
.venueoffer{
width: 100%;
background-color: #0c6362;
padding:15px 20px;
color: #fff;
}
.venueoffer span,.venueoffer .offer-price{font-family: 'Roboto', sans-serif;display: inline-block;}
.venueoffer span{font-size: 14px;position: relative;top: -10px;margin-right: 5px;}
.venueoffer .offer-price{font-size: 28px;}
.contactvendor{
background-color: #f9f9f9;
padding: 20px;
}
.contactvendor .actionRow{margin-bottom: 20px;position: relative;}
.contactvendor .actionRow:last-child{margin-bottom: 0;}
.contactvendor .actionRow input{padding-left: 40px;border-radius: 3px;}
.contactvendor .actionRow button{border-radius: 3px; cursor: pointer;}
.contactvendor .actionRow img{
position: absolute;
top: 17px;
left: 12px;
}
.contactvendor p{
padding-bottom: 20px;
text-align: center;color: #888;
margin:0 0 20px 0;font-size: 14px;
border-bottom: 1px dashed #ddd;
}
.action-btn{
width: 100%;
border: 1px solid #eee;
padding: 12px;
font-size: 15px;
height: 48px;
background-color: #fff;
color: #282f35;
}
.action-btn:hover{background-color: #0c6362;color: #fff;border:1px solid #0c6362;}
.actionRow i{position: relative;top: 2px;margin-right: 4px;}
.media{margin: 20px 0;text-align: center;}
.media img{max-width: 100%;}
.googlemap{margin-bottom: 30px;}
#map{width: 100%;min-height: 250px;}
.venuedata h2{color: #fff;background-color: #0c6362;padding: 15px 0;text-align: center;
font-size: 20px;font-weight: normal;
}
.venuedata .box{padding: 10px;background-color: #f9f9f9;}
.Datarow{border-bottom: 1px solid #ddd;margin-bottom: 5px;}
.Datarow:last-child{border:0;}
.Datarow img{position: relative;top: 6px;}
.Datarow h5{font-size: 14px;font-weight: normal;}
.Datarow p{margin: 5px 0 8px 0;font-size: 15px;}
/**/
.bggrey{background-color: #f7f8f9;}
.subsection-grey{background-color: #f7f8f9;padding: 40px 0;}
.heading{
position: relative;
font-size: 32px;font-weight: bold;
border-bottom: 1px solid #ddd;
padding: 10px 0;
margin-bottom: 30px;
}
.heading .member{
position: absolute;
top: 22px;
right: 0;
font-size: 16px;
font-weight: normal;
}
.heading .member img{position: relative;top: 3px;}
.newsRow{width: 100%;margin-bottom: 40px;}
.newsRow .newsimg{width: 30%;float: left;
height: 246px;}
.newsRow .newsimg img{width: 100%;object-fit:cover;
height: 246px;}
.newsRow .newsContent{
width: 70%;float: left;
padding: 25px;
background-color: #fff;
height: 246px;
}
.newsRow .newsContent h2{font-size: 22px;color: #0c6362;margin-bottom: 5px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.newsRow .newsContent .date{font-size: 15px;color: #989898;}
.newsRow .newsContent p{line-height: 1.6;font-size: 15px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
min-height: 72px;
}
.news-details{margin-top: 30px;line-height: 1.7;}
.news-details h1{font-size: 30px;color: #0c6362;margin-bottom: 20px;}
.news-details img{max-width: 100%;}
.news-details a{color: #0c6362;text-decoration: none;}
.news-details a:hover{text-decoration: underline;}
/*login*/
.login-container{padding: 70px 15px;}
.login-box{
width: 100%;
max-width: 600px;
margin:0 auto;
border-radius: 3px;
background-color: #fff;
padding: 20px;
-webkit-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
-moz-box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
box-shadow: 0px 3px 3px 0px rgba(237,237,237,1);
}
a.login-imgbtn {
position: relative;
padding: 15px;
width: 100%;
color: #333 !important;
text-align: center;
display: block;
border-radius: 3px;
letter-spacing: -0.6px;
text-decoration: none;
border: 1px solid #ddd;
font-size: 18px;
margin-bottom: 20px;
}
img.btnLogo {
position: absolute;
left: 15px;
top: 15px;
width: auto;
height: 24px;
}
a.fb-btn {background-color: #3b5998;color: #fff !important;border: 1px solid #3b5998;}
.login-box p{font-size: 15px;}
.login-box h3{font-weight: normal;font-size: 15px;margin-bottom: 10px;}
.login-box a{text-decoration: none;color: #0c6362;}
.login-box input{border-radius: 3px;}
.login-box a:hover{text-decoration: underline;}
.login-box hr{border:0;border-top: 1px solid #ddd;}
.login-box button{
padding: 15px 0;
font-size: 18px;
height: auto;
border-radius: 3px;
}
.bgimg{
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.myact-container{
margin-top: 40px;
}
.myact-container .col-4{width: 25%;float: left;padding: 0 15px;}
.myact-container .card{
width: 100%;min-height: 300px;background-color: #fff;position: relative;
display: block;
text-decoration: none;
text-align: center;
padding: 0 12px;
color: #555;
margin-bottom: 30px;
}
.myact-container .card .option{
position: absolute;
top: 50%;
width: 100%;
left: 50%;
transform: translate(-50%,-50%);
}
.myact-container .card .option i{font-size: 70px;}
.myact-container .card .option h3{margin-bottom: 0;}
.myact-container .card .option p{font-size: 14px;margin:7px 0;}
.myact-container .card:hover{
background-color: #0c6362;
color: #fff;
}
.profile-box{
width: 100%;
padding: 15px 20px;
background-color: #fff;
}
.profile-box .Data{font-size: 16px;}
.profileRow{
width: 100%;
display: table;
margin: 15px 0;
line-height: 1.8;
padding-bottom: 25px;
font-size: 15px;
border-bottom: 1px solid #ddd;
}
.profileRow:last-child{border:0;}
.profileRow .title{
display: table-cell;
width: 200px;
font-size: 20px;
vertical-align: top;
}
.profileRow .Data{
display: table-cell;
vertical-align: top;
}
button.editDataBtn{
color: #666;
background-color: transparent;
border:0;
padding: 0;
font-size: 15px;
border:1px solid #ddd;
padding: 6px 10px;
margin-top: 10px;
}
.editProfile{
width: 70%;
}
.editRow{width: 100%;}
.editRow h6{font-weight: normal;font-size: 15px;padding: 3px 0;}
.editRow input{
border:0;
width: 100%;
background-color: #fff;
padding: 12px;
font-size: 15px;
border:1px solid #ddd;
border-radius: 3px;
margin-bottom: 14px;
}
.editRow input:focus{
border:1px solid #006564;
}
.editRow button{
width: 120px;
text-align: center;
color: #666;
border:0;
background-color: #e0e0e0;
padding: 8px 0;
margin-right: 10px;
font-size: 15px;
border-radius: 2px;
}
.editRow button[type="submit"]{
color: #fff;
background-color: #006564;
}
.mycard{width: 50%;float: left;position: relative;}
.cardimg{max-width: 400px;height: auto;position: relative;text-align: center;margin: 50px auto;}
.cardimg img{width: 100%;height: auto;}
.cardno{
color: #fff;
font-size: 30px;
font-family: 'Inconsolata', monospace;
position: absolute;
top: 40%;
width: 100%;
left: 50%;
transform: translate(-50%,-40%);
}
.CardOption input{display: none;}
.CardOption label > input + img{ /* IMAGE STYLES */
cursor:pointer;
width: auto;height: 40px;
margin-right: 10px;
border:2px solid transparent;
opacity: 0.4;
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
}
.CardOption label > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
border:2px solid #006564;
opacity: 1;
-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
filter: grayscale(0%);
}
.mycard-details{width: 50%;float: left;padding-left: 50px;border-left: 1px solid #eee;padding-top: 20px;}
.mycard-details .inputRow{margin-bottom: 20px;}
.mycard-details .inputRow h4{margin-bottom: 7px;font-weight: normal;}
.mycard-details .inputRow select{
width: 150px;
margin-right: 10px;
}
.myorder,.myhistory{background-color: transparent;padding: 0;}
.myorder .venue{width: 100%;margin-bottom: 40px;}
.list.myorder .details p{
font-size: 14px;
-webkit-line-clamp: 3;
line-height: 1.5;
}