/*CSS*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,500;0,600;0,700;1,300;1,400&display=swap');
@font-face{font-family: Brandon_thin; src: url('font/Brandon_thin.otf')}
@font-face{font-family: Brandon_reg; src: url('font/Brandon_reg.otf')}
@font-face{font-family: Brandon_med; src: url('font/Brandon_med.otf')}
@font-face{font-family: Brandon_light; src: url('font/Brandon_light.otf')}
@font-face{font-family: Brandon_bld; src: url('font/Brandon_bld.otf')}

@font-face{font-family: raleway_bold; src: url('font/Raleway-Bold.ttf')}
@font-face{font-family: raleway_reg; src: url('font/Raleway-Regular.ttf')}

html{scroll-behavior: smooth;}
body{background:#fff !important; padding:0px; margin:0px; font-family:Poppins, sans-serif, raleway_reg, arial, tahoma; font-size:14px; overflow-x:hidden;}

tr:nth-child(even) {background:#ade0ff;}
tr:nth-child(odd) {background:#FFF;}

h1{font-family:Poppins, sans-serif, raleway_bold; font-size:92px; color:#0f1f28;}
h2{font-family:Poppins, sans-serif, raleway_bold; font-size:42px; color:#0f1f28; line-height:.9em; padding:0px !important;}
/*p{font-family:sans-serif, raleway_reg; font-size:14px; line-height:25px; font-weight:400; }*/
a{text-decoration:none; font-family: inherit;}

input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], input:not([type]), textarea, select{
	display: block;
    font-family: inherit;
    font-size: 1rem;
    border: 1px solid #e6e6e6;
    border-radius: 0;
    box-sizing: border-box;
    margin: 0;
    /*-webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    background-color: transparent;*/
    color: #666;
    padding: 1rem;
}

input[type="checkbox"]{height:16px; width:16px; display:inline;}

/*============ IDS ==============*/
#container{width:100%; margin-left:0%; position:relative; z-index:10; overflow-x:hidden !important; transition:0.32s;}

#header{background:transparent; position:absolute; z-index:9999999; width:100%;}

.slidetext{position:absolute; z-index:99999; top:50%; left:10%; text-align:center; font-family:Brandon_thin; font-size:72px; color:#fff; font-weight:400; line-height:.9em; padding-bottom:10px;}

/*==================== SLIDESHOW  ====================*/
#banner{display:block; width:100%; height:90vh; margin:auto; background:#fff;}
#bannerContainer{display:block; width:100%; height:90vh;}
#prev{background-image: url('../images/left.png'); background-size:50%; background-repeat: no-repeat; background-position: center center; left:0px; height:90vh; width:100px; position:absolute; z-index: 9999; cursor: pointer; opacity:.9; transition:0.64s;}
#next{background-image: url('../images/right.png'); background-size:50%; background-repeat: no-repeat; background-position: center center; right:0px; height:90vh; width:100px; position:absolute; z-index: 9999; cursor: pointer; opacity:.9; transition:0.64s;}
#slider{display:block; height:90vh; width:100%; position:absolute; overflow:hidden;}
#slider .slides{background-size:cover; height:90vh; width:100%;}
#bannerContainer section{position:absolute; /*margin-left:7%;*/ right:7%; margin-top:12%; padding:0px; text-align:left; font-family:arial; z-index:999;}
/*#slider section{position:absolute; width:350px; right:3%; top:8%; background:rgba(0,0,0,0.5); padding:24px; color:#fff; font-weight:bold; font-family:arial; z-index:99999;}*/
#slider section{position:absolute; /*margin-left:7%;*/ right:7%; margin-top:12%; padding:0px; text-align:left; font-family:arial; z-index:999;}

#banner-still{background-image:url('../images/slider.jpg'); background-size:cover; background-position:center; height:100vh; width:100%;}
#banner-still section{width:350px; margin-left:3%; top:8%; background:rgba(0,0,0,0.5); padding:24px; color:#fff; font-weight:bold; font-family:arial; z-index:99999;}

/*============ BANNERS =======*/
.banner{position:relative; height:100vh; width:100%; background-size:cover; background-repeat:no-repeat;  background-attachment:fixed; background-image: url('../images/slider.jpg');}
.banner section{position:relative; top:46%; width:100%; text-align:center; font-family:Poppins, Brandon_thin; font-size:72px; color:#fff; font-weight:400; line-height:.9em; padding-bottom:10px; z-index:999999;}
.banner div{margin:auto; width:50%; text-align:center; position:relative; top:46%; font-weight:bold; font-family:arial; color:#fff; font-size:18px; letter-spacing:1px; padding:16px 0px; border-top:1px solid #fff; z-index:999999;}
 
.banner2{position:relative; height:250px; width:100%; background-size:cover; background-repeat:no-repeat; background-position:center; background-image:linear-gradient(rgba(0,0,0,0.42),rgba(0,0,0,0.42)),url('../images/slider.jpg');}
.banner2 div{position:absolute; left:5%; right:5%; padding:58px 24px;} .banner2 div h1{font-size:54px !important; line-height:18px; font-family:inherit;}

.banner3{position:relative; height:350px; width:100%; background-size:cover; background-repeat:no-repeat;}
.banner3 div{position:absolute; left:5%; right:5%; padding:24px; font-family:inherit;} 

#playvid{display:none; position:fixed; left:0px; top:0px; z-index:99999; width:100%; height:100%; padding-top:3%; background:rgba(0,0,0,0.5); text-align:center; vertical-align:middle;}
#playerid{width:760px; height:515px;} #playerid div{margin:auto; width:760px; text-align:right;}

/*============== NAVIGATIONS ============*/
#navpanel{width:100%; background:#fff; transition:0.64s;}
#logo{display:inline-block; width:20%; font-family:times-new-romans; font-size:32px; color:#fff; cursor:pointer;} 
#logo img{height:40px; /*padding:4px 10px;*/ border:none !important; position:absolute; z-index:200; top:5px; left:5%; transition:0.75s;}
#nav{display:inline-block; width:75%; text-align:right; vertical-align:top; padding:0px;}
#nav ul{list-style:none; margin:0px; padding:12px 0px;} 
#nav li{display:inline-block; padding:15px 0px;} /*border-right:1px solid #eee;*/
#nav li a{text-decoration:none; padding:10px; color:#0e44be; font-family:raleway_bold, arial; text-transform:uppercase; font-size:14px; transition:0.42s;}
#nav li a:hover{color:#fff; background:#0e44be; border-radius:7px 0px 7px 0px;} /*background:#02e3f2;*/
#nav li ul{position:absolute; z-index:9999999; padding:0px; margin-top:15px; width:170px; background:#fff; border:1px solid #ddd; box-shadow:0px 0px 4px #ddd; border-radius:4px; display:none; transition:0.64s; animation:fadeout 0.64s;}
#nav ul ul li{display:block; border:none; padding:0px; transition:0.42s;} #nav ul ul li:hover{background:#003185;}
#nav li li a{display:block; border-bottom:1px solid #ddd; padding:8px !important; text-align:left; font-size:14px; transition:0.24s;} #nav li li a:hover{padding-left:12px !important; color:#fff;}
/*#nav li li a:hover{color:#333333;}*/
#nav li:hover ul{display:block; animation:fadein 0.64s;}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@keyframes fadeout {
    from { opacity: 1; }
    to   { opacity: 0; }
}

.navpanel2{width:100%; background:#fff;}
.nav2 a{display:inline-block; text-decoration:none; font-family:Poppins, arial, tahoma, Brandon_light, ; font-size:14px; letter-spacing: 1px; padding:0px 10px; color:#fff; transition:0.90s;} 
.nav2 a:hover{color:#40cfd3;}

#logo2 img{height:92px;}


/* ============ NAV #3 =====================*/
.logo3{height:52px; padding:8px 0px; width:auto;}
.nav3{text-align:right; vertical-align:top; padding:0px;}
.nav3 ul{list-style:none; margin:0px; padding:0px;} 
.nav3 li{display:inline-block; padding:28px 0px;}
.nav3 li a{text-decoration:none; padding:24px 10px; font-weight:bold; color:#555; font-family:Poppins, sans-serif, raleway_bold, arial; text-transform:uppercase; font-size:12px; transition:0.32s;}
.nav3 li a:hover{color:#f85f0f;}
.nav3 li ul{position:absolute; z-index:9999999; padding:0px; margin-top:22px; width:170px; background:#fff; border:1px solid #ddd; box-shadow:0px 0px 4px #bbb; border-radius:4px; display:none; transition:0.64s; animation:fadeout 0.64s;}
.nav3 ul ul li{display:block; border-bottom:1px solid #bbb; padding:0px; transition:0.32s;} .nav3 ul ul li:hover{background:#26ff26; padding-left:2px;}
.nav3 li li a{display:block; padding:12px 8px !important; text-align:left; font-size:12px; transition:0.24s;} .nav3 li li a:hover{color:#000;}
.nav3 li:hover ul{display:block; animation:fadein 0.64s;}

/* ============ NAV #4 =====================*/
.logo4{height:auto; width:90%; padding:10px;}
.nav4{text-align:left; vertical-align:top; padding:0px;}
.nav4 ul{list-style:none; margin:0px; padding-top:10px;} 
.nav4 li{display:block; padding:10px 0px;}
.nav4 li a{text-decoration:none; padding:10px 0px; font-weight:bold; color:#555; font-family:Poppins, sans-serif, raleway_bold, arial; text-transform:uppercase; font-size:14px; transition:0.32s;}
.nav4 li a div{width:100%;}
.nav4 li a:hover{color:#f85f0f;}
.nav4 li ul{position:absolute; z-index:9999999; padding:0px; margin-top:15px; width:170px; background:#fff; border:1px solid #ddd; box-shadow:0px 0px 4px #ddd; border-radius:4px; display:none; transition:0.64s; animation:fadeout 0.64s;}
.nav4 ul ul li{display:block; border:none; padding:0px; transition:0.32s;} #nav ul ul li:hover{background:#003185;}
.nav4 li li a{display:block; padding:12px 8px !important; text-align:left; font-size:14px; transition:0.24s;} #nav li li a:hover{padding-left:12px !important; color:#fff;}
.nav4 li:hover ul{display:block; animation:fadein 0.64s;}



#menu{display:none; position:fixed; top:0px; left:0px; width:100%; height:100vh; background-image:linear-gradient(rgba(0,0,0,1),rgba(10,34,53,1));}
#menucontainer{overflow-y:scroll;} #menucontainer div{width:100%; padding:16px 0px; text-align:center; border-bottom:1px solid #fff;}
#menucontainer div a{width:100%; padding:16px 0px; color:#fff; text-decoration:none; text-transform:uppercase; font-size:18px;}

/*=========== MOBILE =========== */
#mbmenu{width:100%; height:auto; background:#282828; z-index:999999999; position:absolute; left:-100%; display:block;}
#mbmenu ul{list-style:none; margin:0px; padding:0px;} 
#mbmenu li{display:block; padding:21px 0px; border-bottom:1px solid #eee;}
#mbmenu li a{text-decoration:none; padding:21px 0px; color:#fff; text-transform:uppercase; font-family:Poppins, tahoma; text-align:center; font-size:18px; transition:0.32s;}
#mbmenu li a:hover{color:#fff; background:teal;}
#mbmenu li ul{display:none; background:#333; margin-top:16px; padding:12px 0px; transition:0.32s;}
#mbmenu li li{border:none; padding:12px 0px; text-align:center;} #mbmenu li li a{color:#eee;}

#footer{background:#05031b; color:#fff;} 
#footer a{text-decoration:none; color:#fff; display:block; padding:7px 0px; transition:0.32s;}
#footer a:hover{color:#fcc236;}
#footer .social a{display:inline-block; padding:12px;}

.trans-data{padding:2px 0px; background:#eeefff; border-bottom:1px solid #ccc;}
.trans-data a{padding:12px 0px; color:#222222; text-decoration:none;} .trans-data a h2{font-size:32px;}
.trans-data .info-source{display:none;} .trans-data .show{display:block;}

/* ====== SPECIAL IDs ==================== */
#home{background-image:url('../images/rpl-membership/bg.jpg'); background-size:100% 800px; background-repeat:no-repeat; height:800px;}
#gold-card-car{padding:92px 0px; height:100vh; background-image:url('../images/rpl-membership/section-2-luxury.jpg'); background-size:cover;}
#membership-signup{background-image:url('../images/rpl-membership/Section-5.jpg'); background-size:cover;}
#membershipcards{}
#seccardholder{display:none;}

#gold{background-image:url('../images/rpl-membership/bg-card-rpl.jpg'); background-size:100% 850px; background-repeat:no-repeat; height:850px; overflow:hidden;}
#platinum{background-image:url('../images/rpl-membership/bg-card-rpl-1.jpg'); background-size:100% 850px; background-repeat:no-repeat; height:850px; overflow:hidden;}

.activate-shadow, #orderconfirmation, #alternatepayment{position:fixed; z-index:9999999; left:0%; top:0%; width:100%;; height:100%; background: rgba(0, 0, 0,0.85);}


/*.slides{background-image:linear-gradient(to bottom, rgba(0,0,0,0.24),rgba(0,0,0,0.24)),url('../images/banner/RPL Club Membership.jpg');}*/


/* ====== HOME FORM SUBMIT ======= */
#reg_user_mb{display:none;}
#reg_user{display:block;}

/*==================================
				CLASSES
====================================*/
/*============ PLUGIN ================*/
.plug-scroll{position:absolute; top:70%; width:100%; text-align:center; z-index: 9999;}

.advert{width:100%; height:520px; background-image:url('../images/adverts/RPL-AGM-Banner.png'); background-position:center; background-size:cover;}
.adv-btn{text-align:right; padding:350px 0px; margin-right:5%;}
/* =========== BOOKING ==============*/
.booking{width:50%; height:auto; margin:auto; overflow:hidden; margin-top:1.5%; background:#fff;}
.bookingcontainer{width:100%; height:auto; overflow-y:scroll;} 
.bookingcontainer div{padding:12px 0px; margin:auto; width:90%;}

#confrmbooking{display:none;}

.relyoption{background:rgba(0,0,0,0.7); position:absolute; left:0px; top:0px; width:100%; height:100%; z-index:99999999;}

.form-field{width:100%; padding:1rem 0rem;} .form-field div{padding:6px 0px; line-height:32px;} .form-field input, .form-field select, .form-field textarea{width:100%; max-width:100%; min-width:100%; border-radius:4px;}
.form-field-2{border:1px solid #ddd; background:#f5f5f5; font-family:Poppins, arial;} .form-field-2 div{padding:12px 0px; width:80%; margin:auto;}
.form-field-2 input, .form-field-2 select{width:100%; border:1px solid #ddd; border-radius:4px; padding:4px; font-size:18px; height:42px;}
.form-field-2 textarea{min-width:80%; max-width:80%; border:1px solid #ddd; border-radius:4px; padding:4px; font-size:18px; font-family:arial; min-height:140px; max-height:140px;}
.robot{
    background:#F9F9F9;
    border:solid 1px #D3D3D3;
    border-radius:4px;
    width:260px;
    overflow:hidden;
    margin-left:auto; margin-right:auto;
    text-align:left;
    padding:12px 0px;
    background-image: url('../images/robot.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 20%;
}
.robot input[type=checkbox]{width:40px; float:left;}
.robot input[type=text]{width:200px; background: transparent; border:none;}


/*=========== FAQs ==================*/
.link{cursor:pointer; transition:0.24s;}
.info{display:none; width:80%; color:#083f54; font-family:Poppins, tahoma; font-size:16px;}


.content-1{width:100%; margin:auto;}
.content-2{margin:auto; width:80%;}
.content-3{margin:auto; width:70%;}
.content-4{width:90%; margin:auto;}
.content-5{width:75%; margin:auto;}

/*============ FLOATERS ===========*/
.left{float:left;}
.right{float:right;}
.clear{clear:both;}

.perma-left{float:left;}
.perma-right{float:right;}

/*============ WIDTH ===========*/
.half{width:50%;}
.quart{width:33%;}
.percent5{width:5%;}
.percent10{width:10%;}
.percent15{width:15%;}
.percent20{width:20%;}
.percent25{width:25%;}
.percent30{width:30%;}
.percent35{width:35%;}
.percent40{width:40%;}
.percent45{width:45%;}
.percent50{width:50%;}
.percent55{width:55%;}
.percent60{width:60%;}
.percent65{width:65%;}
.percent70{width:70%;}
.percent75{width:75%;}
.percent80{width:80%;}
.percent85{width:85%;}
.percent90{width:90%;}
.percent95{width:95%;}

.perma-percent5{width:5%;}
.perma-percent10{width:10%;}
.perma-percent20{width:20%;}
.perma-percent25{width:25%;}
.perma-percent30{width:30%;}
.perma-percent35{width:35%;}
.perma-percent40{width:40%;}
.perma-percent45{width:45%;}
.perma-percent50{width:50%;}
.perma-percent60{width:60%;}
.perma-percent70{width:70%;}
.perma-percent80{width:80%;}
.perma-percent90{width:90%;}
.perma-percent95{width:95%;}

/*============ BORDER ===========*/
.border-top-bottom{border-top:2px solid #bbb; border-bottom:2px solid #bbb;}
.border-top{border-top:2px solid #bbb;}
.border-bottom{border-bottom:2px solid #bbb;}
.border-left{border-left:2px solid #bbb;}
.border-right{border-right:2px solid #bbb;}
.border-full{border:2px solid #bbb;}

/*============ PADDING ===========*/
.padding4{padding:4px;}
.padding12{padding:12px;}
.padding14{padding:14px;}
.padding16{padding:16px;}
.padding24{padding:24px;}
.padding42{padding:42px;}

.padd4{padding:4px 0px !important;}
.padd7{padding:7px 0px;}
.padd12{padding:12px 0px;}
.padd14{padding:14px 0px;}
.padd18{padding:18px 0px;}
.padd24{padding:24px 0px;}
.padd30{padding:30px 0px;}
.padd42{padding:42px 0px;}
.padd64{padding:64px 0px;}
.padd72{padding:72px 0px;}
.padd92{padding:92px 0px;}
.padd128{padding:128px 0px;}

.space4{padding:0px 4px;}
.space12{padding:0px 12px;}
.space24{padding:0px 24px;}
.space42{padding:0px 42px;}
.space64{padding:0px 64px;}

/*============ LINE HEIGHT ===============*/
.line12{line-height:12px;}
.line14{line-height:14px;}
.line16{line-height:16px;}
.line18{line-height:18px;}
.line20{line-height:20px;}
.line24{line-height:24px;}
.line30{line-height:30px;}
.line34{line-height:34px;}
.line40{line-height:40px;}

/*============ COLOR ===============*/
.color-white{color:#fff !important;}
.color-black{color:#000 !important;}
.color-grey{color:grey !important;}
.color-dark-grey{color:#555 !important;}
.color-blue{color:#16bacf !important;}
.color-green{color:#1b9445 !important;}
.color-orange{color:#f85f0f !important;}
.color-red{color:#f7665f !important;}
.color-yellow{color:#f7d800 !important;}
.color-theme{color:#00b0f0 !important;}
.color-theme1{color:#1f2d30 !important;}
.color-theme-text{color:#454545 !important;}

/*============ ALIGNMENT ===========*/
.align-left{text-align:left;}
.align-right{text-align:right;}
.align-center{text-align:center !important;}
.align-justify{text-align:justify;}
.block{display:block;}
.inline{display:inline-block;}

/*============ WEIGHT ===========*/
.bold{font-weight:bold;}
.normal{font-weight:normal !important;}
.italic{font-weight:italic;}

/*============ FONT SIZE ===========*/
.font12{font-size:12px;}
.font14{font-size:14px;}
.font16{font-size:16px;}
.font18{font-size:18px;}
.font21{font-size:21px;}
.font28{font-size:28px;}
.font32{font-size:32px;}
.font42{font-size:42px;}
.font62{font-size:62px;}
.font72{font-size:72px;}
.font92{font-size:92px;}
.font112{font-size:112px;}

/*============ FONT TYPE ===========*/
.font-arial{font-family:arial;}
.font-tahoma{font-family:tahoma;}
.font-timesroman{font-family:times-new-roman;}
.font-arial{font-family:arial;}

/*============ HEADERS ===========*/
.head1{font-size:72px;}
.head2{font-size:64px;}
.head3{font-size:42px;}
.head4{font-size:24px;}

/*=========== CHECK MARKERS =======*/
.check-listing{list-style:none;}
.check-listing li:before {
    color: #dd4454;
    font-weight: bold;
    content: '✓ '; 
}

/*============ TEXT TRANSFORM ===========*/
.upper{text-transform:uppercase;}
.capital{text-transform:capitalize;}

.overlay-text{height:100vh; position:relative; z-index:99999;}

/*============ BUTTONS ===========*/
.btn{padding:12px 24px; text-decoration:none; border:none; border-radius:4px; transition:0.75s;} .btn:hover{background:#222222; color:#fff;}
.btn-error{background:#fc4438; color:#fff;}
.btn-info{background:#009ddc; color:#fff;}
.btn-orange{background:#ee8031; color:#fff;}
.btn-green{background:#22975e; color:#fff;}
.btn-white{background:#fff; color:#000;}
.btn-gold{background:#f6d733; color:#000;}

.btn-border-white{border:solid 1px #fff;}
.btn-border-black{border:solid 1px #000;}
.btn-border-green{border:solid 1px #1b9445;}

.btn-theme{background:#00b0f0; color:#fff;}
.btn-theme-b{background:#00b0f0; color:#fff; border: 1px solid #fff;}
.btn-theme1{background:#fcc236; color:#fff;}
.btn-theme2{background:#00ff00; color:#fff;}

.btn-rounded{border-radius:7px; overflow:hidden;}

.svr{width:30%; padding:4px;}
.svr a{color:#1f2d30; transition:0.24s;} .svr:hover a{color:#fcc236;}
.svr img{transition:0.24s;}
.svr:hover img{transform:rotateY(180deg);}

.logo-list img{height:auto; width:180px; padding:24px; transition:0.32s;} .logo-list img:hover{box-shadow:0px 0px 12px #ddd; transform:scale(1.5,1.5); }

/*=========== DROP DOWN ===========*/
.account-opt{background:#fff; width:100%; height:100vh; position:fixed; z-index:99999; display:none;}
.close-acc{float:right; font-size:32px; color:#222; cursor:pointer; padding:24px;}

/*================ SOCIAL MEDIA ===============*/
.social-link{padding:14px 7px !important;}

.floater{position:fixed; z-index:99999; top:40%; right:-40px; color:#fff; transition:0.32s;} .floater:hover{right:0px;}
.floater div{position:absolute; right:0px; transition:0.32s;}
.floater a{color:#fff; padding:0px;}
.wp{background:#075e54; padding:12px; top:96px;} .ig{background:#ed8128; padding:12px;} .fb{background:#395693; padding:12px 10.5px; top:48px;} .ph{background:#222; padding:12px 10.5px; top:142px;}
.wp:hover{padding-right:24px;} .ig:hover{padding-right:24px;} .fb:hover{padding-right:24px;} .ph:hover{padding-right:24px;}

/*=========== GRAIDENT ===========*/
.overlay{background-image: linear-gradient(to bottom, rgba(0,0,0,0.6), rgba(0,0,0,0)); position:absolute; top:0px; left:0px; width:100%; height:100vh; z-index:99;} /*rgba(7,65,102,1), rgba(7,65,102,0)*/
.overlay-1{background-image: linear-gradient(to bottom, rgba(7,65,102,1), rgba(0,157,220,0.2)); position:absolute; width:100%; height:100vh; z-index:20;}


/*=========== BACKGROUND ===========*/
.teal{background:teal;}
.blue{background:#009ddc;}
.gray{background:#222222;}
.lightgrey{background:#f1f6f5;}
.white{background:#fff;}
.black{background:#000201;}
.red{background:#f7665f;}
.green{background:#22975e;}
.theme-gbcolor{background:#00b0f0;}
.grey{background:#555;}

.coolgrey{background:#f5f5f3;}

/*========= SHADOW ===============*/
.shadow{display:none; position:fixed; top:0; left:0px; width:100%; height:100%; z-index:999999999; background:rgba(0,0,0,0.7); transition:0.42s;}
.box-shadow{box-shadow:1px 1px 2px #555;}

/*========== MAP ==============*/
 #map {
   width: 100%;
   height: 600px;
   background-color: grey;
 }


/*=========== LIST STYLES ============*/
.gallery-img img{height:auto; width:200px; padding:6px; transition:0.32s;} .gallery-img img:hover{box-shadow:0px 0px 12px #ddd; transform:scale(1.5,1.5); }

.list{}
.list ul{list-style:none; padding:0px; margin:0px; width:100%;}

.list-1 li{display:inline-block; width:33%; height:auto; overflow:hidden; text-align:center; padding:0px;}
.list-1 li div{width:100%; height:auto; padding:0px;} .list-1 li div div{height: auto;}
.list-1 i{color:#0f1b1c;}
.list-1 li div a{position:relative; top:190px;}
/*.list-1 li img{width:100%; height:100%; transform:scale(4); opacity:0; transition:4s;}*/

.list-1a li{display:inline-block; width:30%; height:auto; overflow:hidden; text-align:center; padding:0px;}
.list-1a li div{width:100%; height:auto; padding:21px 0px;} .list-1a li div div{height: auto;}
.list-1a i{color:#0e44be; font-size:72px; padding:12px 0px;}

.list-2 li{display:block; width:100%; height:190px; font-family:arial !important; padding:12px 0px; border-bottom:1px solid #222222;}
.list-2 li div{width:100%; height:100%; padding:12px 0px;}
.list-2 li div section img{height:150px;} .list-2 p{font-family:arial !important; font-size:18px;}

.list-3 li{display:inline-block; width:350px; height:380px; overflow:hidden;}
.list-3 li div{width:98%; height:100%; overflow:hidden;}
.list-3 li div img{width:80%; height:80%; border-radius:50%; transition:0.32s;}
.list-3 li div section{height:20%;}
.list-3 li div section a:hover li div div img{transform:scale(1.05); opacity:0.7;}

.list-4 li{display:inline-block; width:30%; height:300px; overflow:hidden; vertical-align:top;}
.list-4 li div{width:95%; height:95%; margin:auto; overflow:hidden; text-align:center; background:#fff; border:1px solid #bbb; border-radius:7px; transition:0.32s;}
.list-4 li div img{width:100%; height:200px; transition:0.32s;}
.list-4 li article{text-align:center; padding:24px 0px; width:100%; margin:auto; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
.list-4 li a{text-decoration:none; color:#000; font-size:18px; padding:18px 0px; width:350px;}
.list-4 li a:hover img{transform:scale(1.05); opacity:0.7;}
.list-4 li div:hover{box-shadow:2px 2px 8px #ddd; background:#46f006; letter-spacing:1px;}

.list-5 li{display:inline-block; width:240px; height:310px; overflow:hidden; vertical-align:top;}
.list-5 li div{width:98%; height:300px; margin:auto; overflow:hidden; text-align:center; background:#fff; transition:.32s;}
.list-5 li div img{width:100%; height:210px;}
.list-5 li article{text-align:center; width:240px; margin:auto; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
.list-5 li a{text-decoration:none; color:#000; font-size:18px; padding:18px 0px; width:350px;}
.list-5 li div div{opacity:0; position:relative; margin-top:-305px; z-index:9999; width:100%; height:100%; background:#fe4e3f; color:#fff; transition:0.32s;}
.list-5 li div div section{padding:7px;}
.list-5 li:hover div div{opacity:1; transform: rotateY(180deg);}
.list-5 li:hover div{transform: rotateY(180deg);}

.list-6{padding:12px 0px; width:100%;}
.list-6 ul{list-style:none; margin:0px; padding:0px;}
.list-6 li{display:inline-block; padding:12px; width:24%;}
.list-6 li div{width:100%; height:280px; padding:7px; border:1px solid #ddd; overflow:hidden !important; background:#fff; transition:0.32s;}
.list-6 li section{background:#ddd; width:100%; padding:12px 1px; font-size:14px; letter-spacing:1px; text-transform:uppercase; text-align:left;}
.list-6 li section article{margin:auto; width:80%; white-space:nowrap; overflow: hidden; text-overflow: ellipsis;}
.list-6 li img{width:100%; height:250px; transition:0.75s;}
.list-6 a{width:100%; text-decoration:none; color:#333333;}
.list-6 a:hover>div img{transform: scale(1.5);}

.list-7{width:100%; height:auto;}
.list-7 div{display:inline-block; width:260px; height:260px; vertical-align:top;}
.list-7 div div{margin:auto; height:250px; width:250px; color:#fff; text-align:center;}

.list-8{width:100%;}
.list-8 ul{list-style:none; margin:0px; padding:0px; text-align:center;}
.list-8 li{display:inline-block; padding:10px; width:23%; font-size:18px; font-weight:bold; text-align:center;}
.list-8 li img{height:312px; width:270px;}

.list-9{width:100%;}
.list-9 ul{list-style:none; margin:0px; padding:0px; text-align:center;}
.list-9 li{display:inline-block; width:20%; text-align:center; padding:12px 0px;}
.list-9 li div{width:90%; margin:auto; background:#fff; padding:24px 0px; border-radius:12px; box-shadow:0px 0px 8px #aaa;}
.list-9 li div section{padding:10px;}
.list-9 li img{height:200px; width:200px; border-radius:50%; border:4px solid #00ff00;}

.list-10{width:100%;}
.list-10 ul{list-style:none; margin:0px; padding:0px;}
.list-10 li{display:block; width:100%; font-size:14px;}
.list-10 li img{height:320px; width:auto;}

.desktop{display:block;} .mobile{display:none;} .leftside{}

 .profile{height:650px;}
 .contact{}

 .sel{font-weight:bold; border-bottom:2px solid #555;}

 #s1{background-image:linear-gradient(to bottom, rgba(0,0,0,0.10),rgba(0,0,0,0.10)),url('../images/banner/RPL Club Membership.jpg');}
 #s2{background-image:linear-gradient(to bottom, rgba(0,0,0,0),rgba(0,0,0,0)),url('../images/adverts/RPL-AGM-advert-2025.jpg');}
 /*#s2{background-image:linear-gradient(to bottom, rgba(0,0,0,0),rgba(0,0,0,0)),url('../images/banner/rpl-sunday-closure.jpg');}*/

@media screen and (max-width: 1100px){
    h1{font-size:47px;}

    /*.slides{background-image:url('../images/banner/RPL Club Membership-mb.png');}*/
    #s1{background-image:url('../images/banner/RPL Club Membership-mb.png');}
    #s2{background-image:url('../images/advert/RPL-AGM-advert-2025-mb.jpg');}
    /*#s2{background-image:url('../images/banner/rpl-sunday-closure-mb.jpg');}*/

    .profile{height:550px;}
    .contact{text-align:center !important; padding:4px 0px;}

    #next, #prev{visibility:hidden;}
    .banner{background-size:100% 100% !important;}
    #banner{width:100%;}
    #bannerContainer section{position:absolute; width:90%; margin:auto; padding:24px 0px; text-align:center;}
    #bannerContainer section form{width:90%; margin:auto;}
    #slider div{background-size:cover !important; background-position:center;}

    .banner2 div h1{font-size:42px !important; line-height:30px;}

    #home{background-image:url('../images/rpl-membership/bg-mb.jpg'); background-size:cover; background-position:center; height:auto;}
    #home div .padd128{padding:32px 0px;}
    #home .font62{font-size:42px;}
    #gold{background-image:url('../images/rpl-membership/bg-mb-2.jpg'); background-size:cover; background-position:center; height:auto;}
    #gold .padd92{padding:24px 0px;}
    #gold .font72{font-size:42px;}
    #gold img{width:100%; height:auto;}
    #platinum{background-image:url('../images/rpl-membership/bg-mb-3.jpg'); background-size:cover; background-position:center; height:auto;}
    #platinum .padd92{padding:24px 0px;}
    #platinum .font72{font-size:42px;}
    #platinum img{width:100%; height:auto;}
    #membership-signup{background-image:url('../images/rpl-membership/Section-5m.jpg');}
    #gold-card-car{background-image:url('../images/rpl-membership/section-2-luxury-mobile.jpg'); background-size:100%; height:500px;}
    #gold-card-car div .padd42{padding:0px;}
    #gold-card-car div .font62{font-size:52px;}
    #membershipcards{width:90%; margin:auto;}

    .logopanel{width:50% !important;}
    .nav3{width:30% !important; float:right !important; margin-top:-40px; padding:0px;} .nav3 li{padding:0px;} .nav3 li a{font-size:42px;}

    #logo{width:65%;}#nav{width:30%; text-align:right;}
    #logo2 img{height:72px;}
    .desktop{display:none;} .mobile{display:block;}
    .mob-center{clear:both; text-align:center; width:100% !important;}
    .mobl-nav{position:fixed; width:100%;}

    #playerid{width:100%;} #playvid{padding-top:30%;}
    .booking{width:90%;}

    .padd128{padding:64px 0px;}
    .leftside .padd24{padding:4px 0px;}

    .percent30{width:45%; padding:12px 0px;}
    .percent20, .percent25, .percent35, .percent40, .percent45, .percent50, .percent55, .percent60, .percent65, .percent70, .percent75, .percent80, .percent85, .percent90, .percent95{width:100%; clear:both !important;}

    .quart{width:100%; clear:both !important;}

    .overlay-text{height:auto; background:rgba(7,65,102,0.8); padding:14px;}

    /* ====== HOME FORM SUBMIT ======= */
    #reg_user_mb{display:block;}
    #reg_user{display:none;}

    /*============ PLUNGIN ===========*/
    .plug-scroll{top:97%;}

    .advert{background-image:url('../images/adverts/RPL-AGM-Banner-m.png');}
    .adv-btn{padding:450px 0px; text-align:center;}

    /*============ HEADERS ===========*/
    .head1{font-size:36px;}
    .head2{font-size:32px; font-family:raleway_bold;}
    .head3{font-size:21px;}
    .head4{font-size:12px;}

    /*=========== LIST STYLES ============*/
    .list-1 li{width:100%;}

    .list-2 li{height:auto;} .list-2 li div{padding:0px;} .list-2 li div section img{height:260px; width:auto;}
    .list-2 section{display:block !important; width:100%;}

    .list-4 li{width:100%; padding:6px 0px;} .list-4 li div{width:100%; padding:0px;} .list-4 li div img{height:250px; width:100%;}

    .list-6 li{width:100%;}

    .list-9 li{width:45%; padding:10px;}

    #footer .nav a{display:inline-block; padding:14px;}
}

@media screen and (max-width: 600px){
    .list-9 li{width:100%; padding:10px;}

    .percent30{width:100%; clear:both;}
}