@import url('https://fonts.googleapis.com/css2?family=Style+Script&display=swap');

*{ box-sizing:border-box;}
html{font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased; scroll-behavior: smooth;}
body{font:normal 16px/20px 'pf_handbook_proregular', sans-serif; margin: 0; background: #292929; color: #fff;  counter-reset: my-sec-counter;}
.clear{content:".";display:block;clear:both;height:0;visibility:hidden;}
img{max-width:100%;width:auto\9;height:auto;border:0;-ms-interpolation-mode:bicubic; vertical-align: middle;}
i{display: inline-block; vertical-align: middle;}
a{text-decoration: none; color: inherit;}
ul{ margin:0; list-style: none; padding:0px; }
i,span{display: inline-block; vertical-align: middle;}
h1,h2,h3,h4,h5,h6{font-weight: normal; margin:0;}

:root {
	--black: #000000;
  --grey: #a2a2a2;
	--white: #fff;
	--maroon: #b90303;
  --blue: #0077ff;
  --primary: #FFC351;
  --secondary: #A30505;
  --offwhite: #fffdf2;
}


.container{max-width: 1180px; margin:0 auto;}
.cta-btn{ display: block; border: 1px solid #FC2828; background: linear-gradient(180deg, #F00 0%, #BD0404 100%); font-size: 26px; padding: 18px 30px;}
.title-red{color: var(--secondary); font-size: 38px; text-align: center;}
.title-yellow{color: var(--primary); font-size: 38px; border-left: 10px solid var(--primary); padding: 6px 16px;}

.text-center{text-align: center;}
.mt-6x{margin-top: 60px;}

header{position: relative; box-shadow: 0px 6px 10px 5px rgba(0, 0, 0, 0.25); font-size:22px;}
header .container{display: grid; grid-template-columns: max-content auto; align-items: center; padding:0 10px;}
nav{justify-self: flex-end;}
nav ul{display: inline-flex; align-items: center; grid-gap: 60px;}
nav ul li a{color: var(--white);font-size:22px;padding: 20px 15px; display: inline-block;}
nav ul li.active a{background-color: var(--black); border-top: 4px solid var(--primary);}


.banner-wrapper{ position: relative; height: 645px; overflow: hidden;}
.banner-wrapper .item{ position: relative;}
.banner-content{ /* background-image: linear-gradient(48deg, #000 -1.4%, #000 94.95%); */ position: absolute; top:0; right: 0; height: 100%; width: 58%; text-align: center;}
.banner-content:before{content: ""; position: absolute; left: 0px; top: -25px; height: 105%; background-color: rgba(0,0,0,0.8); transform: skew(348deg, -2deg); width: 150%;}
.banner-content-sec{position: relative; padding-top: 50px; padding-right: 5px;}
.banner-content-sec h1{color: var(--primary);font-size: 128px; line-height: 80px; font-weight: 700; text-transform: uppercase;}
.banner-content-sec h1 span{ font-weight: normal; font-size: 40px; display: block;}
.banner-content-sec h2{ font-size: 56px; margin-top: 36px;}
.banner-content-sec h3{color: var(--primary); font-size: 96px; margin: 60px 0;}
.banner-content-sec h3 span{ color: rgba(255,255,255,0.5); display: inline-block; vertical-align: middle; font-size: 36px;}
.banner-content-sec h4{ font-size: 48px; margin-bottom: 40px;}
.banner-content-sec h5{font-size: 96px; line-height: 100px; color: var(--primary); margin-bottom: 36px;}
.banner-content-sec h5 span{ display: block; color: var(--white);}
.banner-content-sec .cta-btn{ width: 430px; height: 90px; line-height: 84px; margin: 0 auto;  padding: 0 10px;}
.banner-wrapper.owl-carousel .owl-item img{ margin: 0;}

.why-paradise{ background-color: var(--white); padding: 40px 10px; color: var(--black);}
.why-paradise-grid{display: flex; flex-wrap: wrap; grid-gap: 10px; grid-row-gap: 60px; justify-content: center; text-align: center; margin-top: 60px;}
.why-paradise-box{min-width:300px; max-width: 300px;}
.why-paradise-box .count{ font-size: 40px; color: #D28A01;}
.why-paradise-box h3{ font-size: 28px; margin: 18px 0 12px;}
.why-paradise-box p{ font-size: 15px; margin: 0; padding: 0 40px;}

.home-cutomer-stories-wrapper{ background-color: var(--black); padding: 40px 0;}
.customer-story{margin-top:40px; background-image: url("../images/customer-bg.png"); background-size: 100%; background-repeat: no-repeat; height: 560px; text-align: center; color: var(--black); padding: 0 50px;}
.customer-story img{ width: 150px; height: 150px; border-radius: 50%; border: 6px solid var(--black);}
.customer-story h6{ margin-top: 30px; font-size: 30px;}
.customer-story p{ font-size: 22px; line-height: 38px; text-align: left; max-width: 85%; margin: 25px auto;}

.home-about-wrapper{ background-color: var(--white); padding: 60px 10px;}
.home-about-grid{display: grid; grid-template-columns: repeat(2, 1fr); background: #f7f7f7; margin-top: 40px;}
.home-about-grid p{ color: var(--black); padding: 20px; font-size: 26px; line-height: 46px; margin: 0;}

.gallery-wrapper{background-color: var(--black); padding: 40px 10px;}
.gallery-grid{ display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 30px; grid-gap: 40px;}
.gallery-cta{ text-align: center; margin-top:40px;}
.gallery-cta a{ color: var(--white); display: inline-block; font-size: 26px;}
.gallery-cta a:hover{ color: var(--primary);}

footer .container{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; align-items: center; padding: 30px 0; color: rgba(255, 255, 255, 0.5);}
footer a{color: rgba(255, 255, 255, 0.5);}
.footer-menu{ border-right: 1px solid var(--black);  display: flex; grid-gap: 60px;}
.footer-menu li a{ margin: 8px 0; display: inline-block; font-size: 18px;}
.footer-social-share{ text-align: center;}
.copyrights{ margin-top: 20px;}

.banner-bg-wrapper{ background-color: var(--black); height: 600px; overflow: hidden;}
.inner-banner-wrapper{ position: relative;}
.overlay-title{ position: absolute; top: 50%; left: 0; transform: translateY(-50%); background-color: rgba(0,0,0,0.7); color: var(--primary); font-size: 30px; font-size: 50px; padding: 25px 40px; text-transform: uppercase;}
.image-sec.menu-banner{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; width: 100%;}
.image-sec.menu-banner img{ width: 100%; height: 100%;}
.image-sec{position: relative; height: 600px;}
.play{ position: absolute; bottom: 20px; left: 20px; /*transform: translate(-50%, -50%);*/ width: 40px; height: 40px;}

.quotes-rate{ margin-bottom: 40px;}
.quotes-rate h2{ max-width: 70%; margin: 0 auto 20px; text-align: center; color: var(--primary); font-family: 'Style Script', cursive; font-size: 44px; line-height: 68px;}
.quotes-rate .rating{ background-color: var(--white); padding: 10px 20px;}

.our-menu-wrapper{ background-color: var(--black); padding: 40px 10px;}
.menu-title{display: grid; grid-template-columns: auto max-content; grid-gap: 10px; align-items: center; margin-bottom: 30px;}
.download-menu{font-size: 26px; display: block;}
.download-menu img{ width: 26px; margin-right: 5px;}
.our-menu-wrapper .title-yellow { margin-bottom: 30px;}
.menu-title .title-yellow { margin-bottom: 0;}
.download-menu span:hover{color: var(--primary); cursor: pointer;}

.our-menu-list{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 150px; margin: 60px 0;}
.our-menu-list.no-m{margin: 0;}
.our-menu-list ul{padding-left: 30px;}
.our-menu-list ul li{display: grid; grid-template-columns: auto max-content; margin: 10px 0;}
.our-menu-list ul li h6{ color: var(--primary); font-size: 20px; vertical-align: middle;}
.our-menu-list ul li h6 span{ font-size: 14px; display: inline-block; vertical-align: middle; margin-left: 5px;}
.our-menu-list ul li h5{font-size: 22px;}

.contact-wrapper{ background-color: var(--black); padding: 40px 0;}
.contact-grid{display: grid; grid-template-columns: auto max-content; grid-gap: 50px; margin: 40px 0;}
.address{padding-left: 30px; margin-top: 20px; font-size: 20px;}
.address p{ margin: 10px 0;}
.address span.caption{ color: var(--primary); margin-right: 50px;}
.mail-no{margin-top: 40px;}
.opening-hrs ul{margin-top: 30px; padding-left: 30px;}
.opening-hrs ul li{display: grid; grid-template-columns: 150px 150px 150px; grid-gap: 30px; width: max-content; margin: 5px 0; font-size: 20px;}
.opening-hrs ul li span:first-child{color: var(--primary);}

.reservation-grid{display: grid; grid-template-columns: 60% 30%; grid-gap: 80px; margin-top: 30px;}
.reservation-form{ border-right: 1px solid #515151; padding-right: 80px; font-size: 20px;}
.select{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px;}
.select select{ width: 100%; border: 1px solid #fff; border-radius: 5px; background-color: transparent; color: var(--white); padding: 15px; font-size: 16px;}
.select select option{color: var(--black);}
.reservation-grid label{display: block; margin-bottom: 8px;}
.input-style{ margin: 20px 0;}
.input-style input{ width: 100%; border: 1px solid #fff; border-radius: 5px; background-color: transparent; color: var(--white); padding: 15px; font-size: 16px;}
.form-width{ width: 66%;}
.reservation-grid .cta-btn{width: 300px; text-align: center; margin-top: 20px; display: inline-block;}
.reservation-grid p{ color: rgba(255, 255, 255, 0.5); margin-top: 5px; font-size: 14px;}

.reserve-table p{ color: var(--primary); margin: 6px 0; font-size: 24px;}
.book-table{ border: 1px solid #717070; border-radius: 5px; padding: 20px; text-align: center; margin-top: 15px; font-size: 30px; vertical-align: middle;}
.book-table span{ display: inline-block; vertical-align: middle; font-size: 20px; margin-right: 20px; color: var(--primary);}
.delivery-options{margin-top: 100px;}
.delivery-options ul{ list-style-type: disc; padding-left: 20px; font-size: 18px;}
.delivery-options ul li{ margin: 10px 0;}

.menu-icon{display: none;}

.thankyou-wrapper{ padding: 80px 10px 120px; background-color: var(--black);}
.thankyou-wrapper .container{ display: grid; grid-gap: 60px; text-align: center; max-width: 70%;}
.thankyou-sec h6{color: var(--primary); margin: 0; font-size: 64px; line-height: 70px;}
.thankyou-sec p{font-size: 34px; line-height: 40px; margin: 0;}
.thankyou-sec h5{color: var(--primary); font-size: 64px; margin-top: 30px; margin-bottom: 20px;}
.thankyou-sec h4{font-size: 96px; line-height: 66px; font-style: italic; color: var(--primary); margin-top: 20px;}
@media only screen and (max-width: 767px) {
  header{ padding: 15px 10px;}
  nav{display: none; position: absolute; width: 100%; background: var(--black); left: 0; top: 50px; z-index: 2;}
  nav ul{display: block;}
  nav ul li a{display: block;}
  nav ul li.active a{border-left: 4px solid var(--primary); border-top: 0;}
  .menu-icon{display: block; position: absolute; right: 10px; top: 18px;}
  .banner-content-sec{padding-top: 20px; padding-right: 15px;}
  .banner-content:before{left: -25px; width: 130%; background-color: rgba(0,0,0,0.8);}
  .banner-content{ width: 200px; background-image: none;}
  .banner-content-sec h4 { font-size: 20px; margin-bottom: 5px; }
  .banner-content-sec h1{font-size: 32px; line-height: 32px;}
  .banner-content-sec h1 span{font-size: 20px;}
  .banner-content-sec h2 { font-size: 26px; margin-top: 10px; }
  .banner-content-sec h3{ font-size: 28px; margin: 14px 0 10px;}
  .banner-content-sec h3 span{font-size: 24px;}
  .banner-content-sec h5{font-size: 30px; line-height: 32px;}
  .cta-btn{font-size: 20px; padding: 12px 30px;}
  .banner-wrapper{height: 272px;}
  .banner-wrapper.owl-carousel .owl-item img{ height: 272px; object-fit: cover; }
  .why-paradise{padding: 30px 10px;}
  .title-red{font-size: 34px;}
  .why-paradise-grid{ margin-top: 40px; grid-row-gap: 30px; }
  .home-cutomer-stories-wrapper{padding: 25px 10px 50px;}
  .customer-story{background-size: auto; padding: 0 10px; height: 500px; margin-top: 20px;}
  .customer-story p{font-size: 18px; line-height: 32px; max-width: 90%; margin: 12px auto;}
  .home-about-wrapper{padding: 40px 10px;}
  .home-about-grid{grid-template-columns: 1fr;}
  .home-about-grid p{order: 2; font-size: 22px; line-height: 32px;}
  .gallery-wrapper{padding: 30px 10px;}
  .gallery-grid { grid-template-columns: repeat(2, 1fr); margin-top: 25px; grid-gap: 10px; }
  footer .container{ grid-template-columns: repeat(1, 1fr); padding: 20px 10px;}
  .footer-menu{ border-bottom: 1px solid var(--black); border-right: 0; padding-bottom: 20px;}
  .customer-story h6{font-size: 24px; line-height: 30px;}
  .overlay-title{font-size: 28px; padding: 15px 25px;}
  .quotes-rate h2{max-width: 100%; font-size: 26px; line-height: 40px;}
  .banner-bg-wrapper{height: auto;}
  .menu-title{margin-bottom: 20px;}
  .our-menu-list{grid-template-columns: repeat(1, 1fr); grid-gap: 15px; margin: 30px 0;}
  .our-menu-list ul { padding-left: 8px; }
  .our-menu-list ul li{grid-gap: 10px;}
  .our-menu-list ul li h6{font-size: 16px;}
  .contact-wrapper{padding: 30px 10px;}
  .reservation-grid{grid-template-columns: 1fr; grid-gap: 10px;}
  .reservation-form{padding-right: 0; border-right: 0;}
  .title-yellow{font-size: 28px; padding: 6px 10px;}
  .form-width{width: 100%;}
  .delivery-options { margin-top: 30px; }
  .contact-grid{grid-template-columns: 1fr;}
  .thankyou-wrapper { padding: 40px 10px 40px; }
  .thankyou-wrapper .container{max-width: 95%; grid-gap: 40px;}
  .thankyou-sec h6{ font-size: 30px; line-height: 32px;}
  .thankyou-sec p{font-size: 20px; line-height: 26px;}
  .thankyou-sec h5{ font-size: 40px; margin-top: 15px;}
  .thankyou-sec h4{font-size: 50px; margin-top: 0px;}
  .image-sec{height: auto;}
  .gallery-cta a{font-size: 22px;}
  .download-menu img { width: 18px; margin-right: 2px; }
  .download-menu { font-size: 16px; }
  .our-menu-list ul li h5{font-size: 20px;}
  .select{grid-template-columns: repeat(1, 1fr); grid-gap: 15px;}
  .banner-content-sec .cta-btn{width: auto; height: 45px; line-height: 45px;}
}

/** Footer Start **/
    footer .container
    {
        grid-template-columns: repeat(3, 1fr);
        align-items: flex-start;
    }
    footer .delivery-options ul {
        display: grid;
        grid-template-columns: auto auto auto;
        gap: 50px;
        justify-content: center;
        align-content: center;
        list-style: none;
        padding-left: 0;
    }
    footer .delivery-options {
        margin-top: 0;
        text-align: center;
    }
    footer .clicklogo
    {
        font-size: 20px !important;
    }
    footer .book-table a
    {
        color:#fff;
    }
    footer .footer-menu
    {
        border-right:0 !important;
    }
    footer .reserve-table span,footer .reserve-table a,footer .reserve-table p
    {
        color: rgba(255, 255, 255, 0.5) !important;
    }
    footer .container
    {
        grid-template-columns: auto 1fr 1fr;
        gap: 40px;
    }
    .reviewsections {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 30px;
    }
    .rating {
        padding-bottom:40px;
    }
    .rating p
    {
        padding-bottom:10px;
        margin: 6px 0;
        font-size: 24px;
    }
    img.footersixty {
        width: 12vw;
        position: relative;
        left: -25px;
        top: 30px;
    }
    @media screen and (max-width:768px)
    {
        /** Footer **/
        footer .container
        {
            grid-template-columns: repeat(1, 1fr);
            gap:20px;
        }
        footer .delivery
        {
            padding-top: 10px;
            padding-bottom: 10px;
        }
        .customer-story
        {
            height:700px !important;
        }
        
        img.footersixty {
            width: 160px;
            position: relative;
            left: -15px;
            top: 30px;
        }
    }
@media only screen and (max-width: 768px) and (orientation: landscape) {
  }
  @media only screen and (min-width: 768px) and (max-width: 1024px){
  }
  
/*  header .container*/
/*  {*/
/*      justify-content: center;*/
/*  }*/
/*  .logo-panel {*/
/*    padding-right: 50px;*/
/*}*/
/*@media screen and (max-width:768px)*/
/*{*/
/*    header .container*/
/*    {*/
/*        justify-content:unset;*/
/*    }*/
/*}*/