* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
 

body {  line-height: 1.8;
  color: var(--text); 
  font-family: "Almarai", Tahoma, Arial, sans-serif;
  background: url( "../../images/texture.png" );
}

img {
  max-width: 100%;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
}

ul {
  list-style: none;
}
main{/*box-shadow: 10px -8px 6px rgba(0,0,0,0.1);  */

}


/* ===================================================
   BRAND COLORS & TYPOGRAPHY
=================================================== */

:root {

  /* Brand Colors */
  --primary: #1c2d44;   /* كحلي */
  --gold:    #d6ae6b;   /* ذهبي */
  --text:    #3d3d3d;   /* نص أساسي */
  --light:   #f9f9f9;
  --border:  #e5e7eb;
  --footer-height:150px ; /* عدّلها حسب ارتفاع الفوتر الحقيقي */
}

/* Button Text */
/* Buttons */

.btn {
  display: inline-block;
  padding: 12px 22px;
  border-radius: 10px;
  font-weight: 700;
  transition: 0.3s;
  cursor: pointer;
  transition:all 0.3s ease;
  width: 160px;
}
 .primary {
  background-color: var(--gold);
  color: #111;
    transition:all 0.3s ease;
}

 .secondary {
 background-color: var(--primary);
  color: #fff;
  border: 1px solid #334155;
    transition:all 0.3s ease;
}

 .primary:hover {
  opacity: 0.9;  
  background-color:var(--primary)
}
 .secondary:hover {
  opacity: 0.9; 
}
/* Active */


.btn:active {
  transform: scale(.98);
  box-shadow: none;
}


/* Headings */

h1, h2, h3, h4, h5, h6 {
  color: var(--primary);
  font-weight: 800;
  line-height: 1.4;
  margin-bottom: 12px;
}


/* Typography Scale */

h1 { font-size: 44px; }
h2 { font-size: 36px; }
h3 { font-size: 28px; }
h4 { font-size: 22px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }

p {
  font-size: 17px;
  line-height: 1.9;
  margin-bottom: 14px;
  color: var(--text);
}


/* Links */

a {
  color: var(--primary);
  transition: .2s;
}

a:hover {
  color: var(--gold);
}


/* Buttons */
 
 
/* ===================================================
   ELEGANT FORM & BUTTONS (Luxury Law Firm)
=================================================== */

/* Form Container */

.form-box,
.demo-box,
.contact-form {
  max-width: 640px;
  margin: auto;
}


/* Labels */

label {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 6px;
  display: block;
  color: var(--primary);
}


/* Inputs / Select / Textarea */

input,
select,
textarea {
  width: 100%;
  font-size: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #d1d5db;
  background: #fff;
  font-family: "Almarai", Tahoma, Arial, sans-serif;
  color: var(--text);
  transition: all .25s ease;
}


/* Placeholder */

input::placeholder,
textarea::placeholder {
  color: #9ca3af;
}


/* Focus Effect */

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(214,174,107,.25);
}


/* Form Spacing */

.form-grid > div {
  margin-bottom: 14px;
}



.req{color:#b91c1c;}

textarea{
  resize: vertical;
  min-height: 140px;
}

.error{
  display:block;
  color:#b91c1c;
  font-size:13px;
  margin-top:6px;
  min-height:18px;
}

.form-response{
  margin-top:10px;
  font-size:15px;
  font-weight:700;
  min-height:24px;
}

.form-response.success{ color:#166534; }
.form-response.error{ color:#b91c1c; }

.btn-submit[disabled]{
  opacity:.7;
  cursor:not-allowed;
}



/* ===================================================
   LAYOUT (Structure + Grid + Header + Footer)
=================================================== */

/* =========================
   Containers
========================= */

.container {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
}

.container-fluid {
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
}

/* =========================
   Row
========================= */

.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
}

/* =========================
   Columns (Base)
========================= */

[class^="col-"] {
  padding: 10px;
  box-sizing: border-box;
}

/* =========================
   12 Grid System
========================= */

.col-1  { width: 8.33%; }
.col-2  { width: 16.66%; }
.col-3  { width: 25%; }
.col-4  { width: 33.33%; }
.col-5  { width: 41.66%; }
.col-6  { width: 50%; }
.col-7  { width: 58.33%; }
.col-8  { width: 66.66%; }
.col-9  { width: 75%; }
.col-10 { width: 83.33%; }
.col-11 { width: 91.66%; }
.col-12 { width: 100%; }


/* =========================
   Text Align
========================= */

.textLeft {
  text-align: left;
}

.textRight {
  text-align: right;
}

.textCenter {
  text-align: center;
}

.textJustify {
  text-align: justify;
}


/* =========================
   Vertical Align (Inline / Table Cells)
========================= */

.verTop {
  vertical-align: top;
}

.verMiddle {
  vertical-align: middle;
}

.verBottom {
  vertical-align: bottom;
}


/* =========================
   Mobile Responsive
========================= */

@media (max-width: 768px) {

  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11 {
    width: 100%;
  }

}


/* Header */

.main-header {  
  padding:   0; 
}

.header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;padding:25px 20px 3px 25px
}
/* ===================================================
   LAW NAV (Elegant checkbox menu)
=================================================== */

.law-nav{
  position: relative;
  height: 56px;
  display: flex;
  align-items: center;z-index: 999999;
}

/* اخفاء checkbox */
.law-nav__cb{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* container */
.law-nav__content{
  position: relative;
  width: 56px;              /* مقفول */
  height: 56px;
  border-radius: 12px;
  background: rgba(255,255,255,0.8);
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
  border: 1px solid rgba(28,45,68,.10);
  transition: width 1s cubic-bezier(.49,-0.25,.68,1.15);
  overflow: hidden;
}

/* عند الفتح */
.law-nav__cb:checked ~ .law-nav__content{
  width: 100%;             /* افتحها على قد العناصر */
}

/* items row */
.law-nav__items{
  display: flex;
  align-items: center;
  height: 56px;
  gap: 6px;
  padding-inline: 12px;
  /* اترك مساحة للزر */
  padding-inline-end: 70px;
  margin: 0;
  list-style: none;
}

/* items */
.law-nav__item{
  display: flex;
  align-items: center;
  height: 56px;
  padding: 0 8px;
  color: var(--primary);
  font-weight: 700;
  font-size: 14px;
}

/* link */
.law-nav__link,
.law-nav__lang{
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 12px;
  border-radius: 10px;
  color: var(--primary);
  transition: 1s;
}

/* hover */
.law-nav__link:hover,
.law-nav__lang:hover{
  background: rgba(28,45,68,.06);
}

/* text animation */
.law-nav__item-text{
  display: inline-block;
  transform: rotateY(-70deg);
  opacity: 0;
  transition: transform .6s cubic-bezier(.48,.43,.7,2.2), opacity 1s;
  transform-origin: 50% 50%;
  white-space: nowrap;
}

.law-nav__cb:checked ~ .law-nav__content .law-nav__item-text{
  transform: rotateY(0);
  opacity: 1;
}

/* CTA داخل المنيو */
.law-nav__cta{
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 14px;
  border-radius: 10px;
  background: var(--gold);
  color: var(--primary);
  font-weight: 800;
  transition: 1s;
}

.law-nav__cta:hover{
  filter: brightness(.98);
  box-shadow: 0 8px 18px rgba(214,174,107,.25);
}

/* زر الهامبرغر */
.law-nav__btn{
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  width: 56px;
  height: 56px;
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 50;
}

/* نعمل 3 خطوط: before + after + span */
.law-nav__btn::before,
.law-nav__btn::after{
  content:"";
  display:block;
  width: 22px;
  height: 3px;
  border-radius: 2px;
  background: var(--primary);
  transition: all 1s ease ;
  position: absolute;
}

.law-nav__btn::before{ transform: translateY(-7px); }
.law-nav__btn::after { transform: translateY( 7px); }

/* الخط الأوسط نعمله بـ box-shadow على عنصر مساعد */
.law-nav__btn span{
  display:block;
  width: 22px;
  height: 3px;
  border-radius: 2px;
  background: var(--primary);
  transition: opacity 1s ease, background-color 1s;
}

/* hover */
.law-nav__btn:hover::before,
.law-nav__btn:hover::after,
.law-nav__btn:hover span{
  background: var(--gold);
}

/* ✅ عند التفعيل: X حقيقي */
.law-nav__cb:checked ~ .law-nav__content .law-nav__btn::before { transform: rotate(45deg); }
.law-nav__cb:checked ~ .law-nav__content .law-nav__btn::after  { transform: rotate(-45deg); }
.law-nav__cb:checked ~ .law-nav__content .law-nav__btn span    { opacity: 0; }


/* Responsive: على الموبايل خليها تفتح أقل */
@media (max-width: 780px){
  .law-nav__cb:checked ~ .law-nav__content{
    width: min(92vw, 520px);
  }
  .law-nav__items{
    gap: 4px;
  }
  .law-nav__link, .law-nav__lang, .law-nav__cta{
    padding: 0 10px;
  }
}


/* Footer */

.main-footer { 
color: #fff;
text-align: center;
padding: 25px 0; 
width: 100%;
bottom: 0;
background: url( "../../images/texture20.png" );
position: relative;
padding: 40px 0;
background-color: var(--primary); 
transition: background-color 1.5s ease , padding 1s ease  ;
}

/* Sections */

.section {
  padding: 70px 0;
}

.section.alt {
  background: #f3f4f6;
}


/* ===================================================
   COMPONENTS (Buttons + Cards + UI Elements)
=================================================== */
 


.fsec{
  position: relative;
  min-height: 550px;
  overflow: hidden;
    background-repeat: no-repeat;
  background-size: 130%; /* بدل cover */
  background-color:rgba(255,255,255,0.9);

}

.ssec{
  position: relative;
  padding: 75px 0;
    background: url( "../../images/bg5.png" );
 
  background-position: center;
  background-repeat: no-repeat; 
 
    animation: posBackImag1 120s ease  infinite;
	}
.sebr1{
	 background: url( "../../images/texture20.png" );
  position: relative;
  padding: 40px 0;
 background-color: var(--primary); 
 transition: background-color 1.5s ease , padding 1s ease  ;
 
	}
.sebr1:hover{
	 
  position: relative;
  padding: 70px 0;
 background-color: var(--gold);
 
	}

  

@keyframes posBackImag1{
  0%   { background-position: left top; }
  50%  { background-position: right center; }
  100% { background-position: left center; }
}
/* طبقتين للخلفية */
.bg-layer{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 3s ease-in-out;
  z-index: 1;
    animation: posBackImag 60s ease  infinite;
 
   
}

@keyframes posBackImag{
  0%   { background-position: top center; }
  50%  { background-position: bottom center; }
  100% { background-position: top center; }
}

.bg-layer.active{
  opacity: 1;
}

/* نخلي المحتوى فوق الخلفية */
.fsec-content{
  position: relative;
  z-index: 5;
}

/* Buttons */



/* Cards */

.card {
  background: #fff;
  padding: 22px;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  line-height: 1.9;
}


/* Grid */

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}


/* Hero */

.hero {
  background: linear-gradient(to left,#0f172a,#1e293b);
  color: white;
  padding: 90px 0;
  text-align: center;
}

.hero .lead {
  margin-top: 16px;
  opacity: .95;
}

.hero-badges {
  margin-top: 18px;
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.badge {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  padding: 6px 14px;
  border-radius: 999px;
}


/* Stats */

.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
  gap: 16px;
}

.stat {
  background: white;
  border-radius: 12px;
  padding: 18px;
  text-align: center;
}

.stat .num {
  font-size: 26px;
  font-weight: 900;
}


/* Testimonials */

.quote {
  background: #fff;
  border-radius: 12px;
  padding: 18px;
  line-height: 1.9;
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
}


/* FAQ */

.faq details {
  background: #fff;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 10px;
}

.faq summary {
  font-weight: 800;
  cursor: pointer;
}


/* ===================================================
   LANGUAGE (RTL / LTR Support)
=================================================== */
/*
body[dir="rtl"] {
  direction: rtl;
  text-align: right;
}

body[dir="ltr"] {
  direction: ltr;
  text-align: left;
}
*/

.logo img{width:90px}

.headConim img{ margin:0 auto}
.headContxt{text-align: center}

/* =====================
   Slider Main
===================== */

.slideSec {
  position: relative;
  min-height: 650px;
  overflow: hidden;
}

/* Wrapper */
.sliderWrapper {
  width: 100%;
  height: 550px;
  position: relative;
}

/* Slides */
.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.8s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Active */
.slide.active {
  opacity: 1;
  z-index: 2;
}

/* Example Backgrounds */
 


/* =====================
   Buttons
===================== */

.prev,
.next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%); 
  color:  rgba(0,0,0,0.5);
  border: none;
  font-size: 30px; 
  cursor: pointer;
  z-index: 10;
    background: rgba(0,0,0,00);
	transition:color 0.3s ease;font-weight:bold
}

.prev { left: 10px; }
.next { right: 10px; }

.prev:hover,
.next:hover {
 
  color:  var(--gold)
}

  .xnumb{
  color: var(--gold); font-size:3em}
  
  
  .headContxt h1{font-size:22px !important}
  
  

.vicons{width:50px; margin:20px auto; }  
.vicons1{width:70px; margin:5px auto; }  
  
  
  .ssec .col-3{Padding:25px}
  
  .vlogosec{width:150px; margin:10px auto; } 
  .vlogosecbrand{width:40px; margin:10px auto;vertical-align:middle ;display:inline-block;} 
  .vlogo{width:80px; margin:10px auto; } 
  
  .hwhite h4{color:#fff;}
  
.h4val{ 
opacity:0;
height:0;
transition:all 1s ease}

.sebr1:hover .h4val{ 
opacity:1;
height:100px; }


  
  
  .dropdownreach {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity .7s ease,
    transform .7s cubic-bezier(.22,.61,.36,1);
}

/* قبل التفعيل */
.dropdownreach.is-ready {
  opacity: 0;
}

/* بعد التفعيل */
.dropdownreach.drop-in {
  opacity: 1;
  transform: translateY(0);
}

/* اتجاهات اختيارية */
.dropdownreach.from-left { transform: translateX(-50px); }
.dropdownreach.from-right { transform: translateX(50px); }

.dropdownreach.drop-in.from-left,
.dropdownreach.drop-in.from-right {
  transform: translateX(0);
}

  
  .dropdownreach.is-ready {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .7s ease, transform .7s ease;
}
.dropdownreach.drop-in {
  opacity: 1;
  transform: translateY(0);
}
.dropdownreach.from-left { transform: translateX(-50px); }
.dropdownreach.from-right { transform: translateX(50px); }
.dropdownreach.drop-in.from-left,
.dropdownreach.drop-in.from-right { transform: translateX(0); }

  
  .longSc{padding:1000px 0}
  
  /*
  .workTimeline{
  direction: rtl; 
}
*/
.tlTitle{
  text-align:center;
  font-size: 28px;
  margin-bottom: 5px;
}

.tl{
  position: relative;
  max-width: 920px;
  margin: 0 auto;
  padding: 10px 18px;
}

 
.tlItem{
  position: relative;
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: start;
  gap: 18px;
  padding: 18px 0;
}

/* الدائرة */
.tlDot{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
  background: #0f172a;
  color:#fff;
  border: 3px solid #fff;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
  position: relative;
  right: 6px;
}

/* الكارد */
.tlCard{ 
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

.tlCard h3{
  margin: 0 0 8px;
  font-size: 18px;
}

.tlCard p{
  margin: 0;
  line-height: 1.8;
  color: rgba(0,0,0,.72);
  font-size: 15px;
}

  
  /* ================= Numbers Section ================= */

.numbers{
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 24px;
  
}

/* Card */
.numCard{
  flex: 1; 
  border-radius: 16px;
  padding: 24px 0px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transform:Scale(0.8);
  transition: transform .35s ease, box-shadow .35s ease; 
}

/* subtle gold line */
.numCard::before{
  content: "";
  position: absolute;
  inset: 0;
  border-top: 3px solid var(--gold);
  opacity: .6;
}

/* hover */
.numCard:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 45px rgba(0,0,0,0.12);
}

/* Icon */
.numIcon{
  width: 55px;
  height: 55px;
  margin: 0 auto ;
  display: grid;
  place-items: center;
  border-radius: 40%;
  background: linear-gradient(
    135deg,
    rgba(28,45,68,0.08),
    rgba(214,174,107,0.25)
  );
  color: var(--gold);
  font-size: 28px;
}

/* Number */
.numCard .count{
  display: inline-block;
  font-size: 42px;
  font-weight: 800;
  color: var(--primary);
  line-height: 1;
  letter-spacing: .5px;
}

 

/* Description */
.numCard p{
  margin: 10px 0 0;
  font-size: 15px;
  color: var(--text);
  opacity: .85;
  line-height: 1.6;
}


.features {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin:0 40px;
}

.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 30px;
  background: var(--light);
  border: 1px solid var(--border);
  border-radius: 10px;
  transition: all 0.25s ease;
}

.feature-item:hover {
  border-color: var(--gold);
  background: #fff;
}

.feature-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(214, 174, 107, 0.15);
  color: var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.feature-content h4 {
  margin: 0 0 6px;
  font-size: 16px;
  color: var(--primary);
}

.feature-content p {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--text);
}

.numPlus{color:var(--gold) ; font-size:40px;}




/* ================= Responsive ================= */

@media (max-width: 991px){
  .numbers{
    flex-direction: column;
  }
}

  
  .service-box{
            position: relative;
            overflow: hidden;
            margin-bottom:10px;
            perspective:1000px;
            -webkit-perspective:1000px;
			width: 70%;
			margin: 0 auto;
			 background-color:var(--gold);
			 border-radius:10px;
        }
		.secr{
  background: url( "../../images/texture20.png" );}
        .service-icon{
            width: 100%;
            height: 220px;
            padding: 20px;
            text-align: center;
            transition: all .5s ease;
        }

        .service-content{
			
			 border-radius:25px; 
			align-content: center;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            opacity: 0;
            width: 100%;
            height: 220px;
            padding: 20px;
            text-align: center;
            transition: all .5s ease;
            background-color: var(--primary);
            backface-visibility:hidden;
            transform-style: preserve-3d;
            -webkit-transform: translateY(110px) rotateX(-90deg);
            -moz-transform: translateY(110px) rotateX(-90deg);
            -ms-transform: translateY(110px) rotateX(-90deg);
            -o-transform: translateY(110px) rotateX(-90deg);
            transform: translateY(110px) rotateX(-90deg);
        }
        .service-box .service-icon .front-content{
            position: relative;
            top:80px;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .service-box .service-icon .front-content i {
            font-size: 60px;
            color:var(--primary);
        }

        .service-box .service-icon .front-content h3 {
            font-size: 15px;
            color: var(--primary);
            text-align: center;
            margin-bottom: 15px;
            text-transform: uppercase;
        }
        .service-box .service-content h3 {
            font-size: 15px;
            font-weight: 700;
            color: #b1b1b1;
            margin-bottom:10px;
            text-transform: uppercase;
        }
        .service-box .service-content p {
            font-size: 13px;
            color: #b1b1b1;
            margin:0;
        }
      
	  .goldColor{ background-color:var(--gold);
	  }
	  
        .service-box:hover .service-icon{
            opacity: 0;
            -webkit-transform: translateY(-110px) rotateX(90deg);
            -moz-transform: translateY(-110px) rotateX(90deg);
            -ms-transform: translateY(-110px) rotateX(90deg);
            -o-transform: translateY(-110px) rotateX(90deg);
            transform: translateY(-110px) rotateX(90deg);
        }
        .service-box:hover .service-content {
            opacity: 1;
            -webkit-transform: rotateX(0);
            -moz-transform: rotateX(0);
            -ms-transform: rotateX(0);
            -o-transform: rotateX(0);
            transform: rotateX(0);
        }
  
  
  .servIconsHolder{position:relative; text-align:center}
  
  .servIconsHolder div {
  display: inline-block;
  margin: 25px;
  padding: 15px; 
  width: 200px;
  border-radius: 5%;
  height: 135px; 
  border-bottom:3px solid var(--gold);

   transition:all 1s ease;
}

  .servIconsHolder1 div {
  display: inline-block;
  margin:10px;
  padding: 10px; 
  width: 180px;
  border-radius: 5%;
  height: 135px; 
  border-bottom:3px solid var(--gold);
   transition:all 1s ease;
}


.servIconsHolder1 div:hover { 
  padding: 10px;  
  align-content: center; 
  border-bottom:3px solid var(--primary);
}
.service-box {width:98%;}
.service-content { 
  padding: 5px;}
  .service-box .service-content h3 {
  font-size: 13px;}
  .service-box .service-content p {
  font-size: 12px;}
  .smallMh6{  font-size: 11px;}
  
  .servIconsHolder div:hover { 
  padding: 10px;  
  align-content: center; 
  border-bottom:3px solid var(--primary);
}

  
  .servIconsItem img{width:65px; margin:0 auto;}
  
  
  
  .reviews-chat-copy {
  padding: 0;
}
   
 
  .reviews-chat-section .wrap { 
    gap: 0;
  }
 
  
  
  .logosHolder{ white-space: nowrap;}
  .logos-slide{position:relative;}  
  .logos-slide img{display:inline-block}
  
  
  .laws{display:inline-block;width:120px ;margin:10px}
  
  
  .faq-section{
    padding:15px 5px; 
	width:100%
}

.faq-title{
    text-align:center;
    font-size:32px;
    color:var(--primary);
    margin-bottom:40px;
    font-weight:700;
}

.faq-accordion{
    max-width:900px;
    margin:auto;
}

.faq-item{
    border-bottom:1px solid var(--border);
}

.faq-question{
    width:100%;
    background:rgba(255,255,255,0.1);
    border:none;
    padding:20px;
    font-size:18px;
    text-align:right;
    cursor:pointer;
    display:flex;
    justify-content:space-between;
    align-items:center;
    color:var(--primary);
    transition:0.3s;
}

.faq-question:hover{
    background:#f5f7fa;
}

.faq-icon{
    font-size:22px;
    color:var(--gold);
    transition:0.3s;
}

.faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height .4s ease;
    padding:0 20px;
    color:var(--text);
    line-height:1.8;
}

.faq-item.active .faq-answer{
    max-height:300px;
    padding-bottom:20px;
}

.faq-item.active .faq-icon{
    transform:rotate(45deg);
}

.faq-answer ul{
    margin-top:10px;
    padding-right:20px;
}
  
  
  
  
  
  
  .scalesm{transform:scale(0.7)}
  .scalesm1{transform:scale(0.9)}
  .scalesm2{transform:scale(0.8)}
  
  
  .mapmaj{background-color:var(--primary);height:400px}
  .mapmaj iframe {opacity:0.4 ;transition:all 1s ease}
  .mapmaj iframe:hover {opacity:1 }
  
  
  
  .wight *{color:#fff}
  
  
  
  
  .contactInfo{
  margin-top:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
  text-align:center;
}

.contactInfo .citem{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:16px;
  color:var(--text);
}

.contactInfo .citem i{
  color:var(--gold);
  font-size:18px;
  width:22px;
}

.contactInfo a{
  color:var(--primary);
  text-decoration:none;
  transition:.2s;
}

.contactInfo a:hover{
  color:var(--gold);
}
  
  
  .contacty{align-content: center;padding: 25px;
  }
  
  
  
  
  
  .alignsce{align-content: center;
  }
  
  
  .aboutus{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
 /* direction: rtl;*/
  text-align: right;
}

.aboutus-box{
  width: 100%;
  max-width: 650px;  
  border-radius: 16px;
  padding: 12px 30px; 
  position: relative;
  overflow: hidden;
  margin: 0 auto;
}

.aboutus-box::before{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 28%;
  height:7px;
  background: var(--gold);
  border-radius: 0 0 0 6px;
  transition:all 1s ease;
}

.aboutus-box:hover::before{
  width: 100%; 
  background: var(--primary);
  border-radius: 0 0 0 10px;
}

.aboutus-tag{
  display: inline-block;
  margin-bottom: 12px;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.5px;
}

 

.aboutus-box p{
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 2;
  color: var(--text);
}

.aboutus-box p:last-child{
  margin-bottom: 0;
}

.abouimg img{
  max-width: 100%;
  height: auto;
  display: block;
  width: 280px;
  margin: 0 auto;
}
  .abouimg1 img{
  max-width: 100%;
  height: auto;
  display: block;
  width: 240px;
  margin: 0 auto;
}
  
  
  .textgold{color:var(--gold)}
  
  .full-width{
  grid-column: 1 / -1;
}

.upload-box{
  border: 2px dashed var(--border);
  border-radius: 14px;
  background: #fff;
  padding: 28px 20px;
  text-align: center;
  cursor: pointer;
  transition: 0.25s ease;
}

.upload-box:hover,
.upload-box.dragover{
  border-color: var(--gold);
  background: rgba(214, 174, 107, 0.05);
}

.upload-inner i{
  font-size: 30px;
  color: var(--gold);
  margin-bottom: 12px;
}

.upload-inner p{
  margin: 0 0 6px;
  font-size: 15px;
  color: var(--primary);
}

.upload-inner p span{
  color: var(--gold);
  font-weight: 700;
}

.upload-inner small{
  color: var(--text);
  opacity: 0.8;
  font-size: 12px;
}

.file-list{
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.file-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: var(--light);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 14px;
}

.file-item .file-name{
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-size: 14px;
  word-break: break-word;
}

.file-item .file-name i{
  color: var(--gold);
}

.file-remove{
  border: 0;
  background: transparent;
  color: #b42318;
  cursor: pointer;
  font-size: 14px;
}

.file-remove:hover{
  opacity: 0.8;
}


.consulting-text{
  font-size: 15px;
  line-height: 1.9;
  color: var(--text);
  margin: 0 0 22px;
}

.consult-steps{
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 10px auto;
}

.consult-step{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  text-align: right;
}

.step-num{
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 15px;
  line-height: 1;
}

.step-text{
  font-size: 14px;
  line-height: 1.9;
  color: var(--text);
  padding-top: 3px;
}

.whatsapp-float{
position: fixed;
  bottom: 7%;
  right: 4%;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  text-decoration: none;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  z-index: 9999;
  transition: all 0.25s ease;  animation: waPulse 2s infinite;
}

.whatsapp-float:hover{
	color: var(--primary);
  transform: scale(1.08);
  box-shadow: 0 14px 35px rgba(0,0,0,0.2);
}

 

@keyframes waPulse{
  0%{ box-shadow:0 0 0 0 rgba(214,174,107,0.5); }
  70%{ box-shadow:0 0 0 12px rgba(214,174,107,0); }
  100%{ box-shadow:0 0 0 0 rgba(214,174,107,0); }
}
  .alignCenter{align-content: center;}
  
  
  
  
  
  
  
  
  
  .teamHolder {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  padding: 40px 0;
}

.teamEach {
  background: #f3f3f3;
  text-align: center;
  padding: 34px 22px 30px;
  border-radius: 2px;
  box-shadow: 0 8px 22px rgba(0,0,0,0.12);
  transition: 0.3s ease;
}

.teamEach:hover {
  transform: translateY(-6px);
}



.teamEach img {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: 55%;
  border: 4px solid #b9a36b;
  margin: 0 auto 22px;
  filter: grayscale(100%);
  transition: all 1s ease;
}

.teamEach:hover img {
  filter: grayscale(0%);
  transform: scale(1.05);
}

.teamEach h4 {
  font-size: 18px;
  font-weight: 800;
  color: #111;
  margin: 0 0 10px;
}

.teamEach h6 {
  font-size: 12px;
  font-weight: 600;
  color: #777;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin: 0;
}


.dmonYes{display: none}
.eachVal{display: inline-block;
  width: 200px;
 margin: 5px auto;}

@media (max-width: 992px) {
  .teamHolder {
    grid-template-columns: repeat(2, 1fr);
  }
}

 


@media (max-width: 576px) {
	
	

  .law-nav__cb:checked ~ .law-nav__content{
    width: 92vw;left: -5%;
  }

  .law-nav__item{
    font-size: 13px;
  }
	
		
	.law-nav {
  position: relative;
  height: auto;
    width: 100%;
  display:flex; 
  }

  .law-nav__content{
    width: 56px;
  }

  .law-nav__cb:checked ~ .law-nav__content{
    width: min(92vw, 360px);
    height: auto;
    min-height: 56px;
  }

  .law-nav__items{
    height: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 68px 12px 14px;
  }

  .law-nav__item{
    width: 100%;
    height: auto;
    padding: 0;
  }

  .law-nav__link,
  .law-nav__lang,
  .law-nav__cta{
    width: 100%;
    height: 42px;
    justify-content: center;
  }

  .law-nav__btn{
    top: 0;
    inset-inline-end: 0;
  }
  
  .contactInfo {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  text-align: center;
  padding: 10px;
}


.contact-section{Padding:10px}


	
	
  .teamHolder {
    grid-template-columns: 1fr;
  }
  
 
  .servIconsHolder1 div {
    display: inline-block;
    margin: 13px 11px;
    padding: 10px;
    width: 105px;
    border-radius: 5%;
    height: 124px;
    border-bottom: 3px solid var(--gold);
    transition: all 1s ease;
    vertical-align: bottom;
}


 .servIconsHolder  div {
    display: inline-block;
    margin: 13px 11px;
    padding: 10px;
    width: 105px;
    border-radius: 5%;
    height: 124px;
    border-bottom: 3px solid var(--gold);
    transition: all 1s ease;
    vertical-align: bottom;
}


.servIconsItem  h6 {
  font-size: 12px;
  text-align: center;
margin: 0 auto;}
.dmonNone{display:none}
.dmonYes{display: block}
.eachVal{display: inline-block;
  width: 75px;
 margin: 5px auto;}

 .logosHolder{ white-space: normal;}
 .logos-slide img {
  display: inline-block;
  width: 65px;
}

  .phone {
    transform: scale(0.8) !important;
    margin: 0 auto !important;
  }
  
  
.laws {
  display: inline-block;
  width: 65px;
  margin: 10px;
}


 .numbers {
    flex-direction: row;
  }

.numCard .count {
  display: inline-block;
  font-size: 25px;
  font-weight: 800;
  color: var(--primary);
  line-height: 1;
  letter-spacing: .5px;
}
 
}




 
/* ===================================================
   HOVER → DESKTOP ONLY
=================================================== */
@media (hover: hover) and (pointer: fine) {

  .primary:hover { opacity: 0.9; background-color: var(--primary); }
  .secondary:hover { opacity: 0.9; }
  a:hover { color: var(--gold); }
  .law-nav__link:hover, .law-nav__lang:hover { background: rgba(28,45,68,.06); }
  .law-nav__cta:hover { filter: brightness(.98); box-shadow: 0 8px 18px rgba(214,174,107,.25); }
  .law-nav__btn:hover::before,
  .law-nav__btn:hover::after,
  .law-nav__btn:hover span { background: var(--gold); }
  .sebr1:hover { position: relative; padding: 70px 0; background-color: var(--gold); }
  .sebr1:hover .h4val { opacity: 1; height: 100px; }
  .prev:hover, .next:hover { color: var(--gold); }
  .numCard:hover { transform: translateY(-6px); box-shadow: 0 18px 45px rgba(0,0,0,0.12); }
  .feature-item:hover { border-color: var(--gold); background: #fff; }
  .service-box:hover .service-icon { opacity: 0; transform: translateY(-110px) rotateX(90deg); }
  .service-box:hover .service-content { opacity: 1; transform: rotateX(0); }
  .servIconsHolder1 div:hover,
  .servIconsHolder div:hover { padding: 10px; align-content: center; border-bottom: 3px solid var(--primary); }
  .faq-question:hover { background: #f5f7fa; }
  .mapmaj iframe:hover { opacity: 1; }
  .contactInfo a:hover { color: var(--gold); }
  .aboutus-box:hover::before { width: 100%; background: var(--primary); border-radius: 0 0 0 10px; }
  .file-remove:hover { opacity: 0.8; }
  .whatsapp-float:hover { color: var(--primary); transform: scale(1.08); box-shadow: 0 14px 35px rgba(0,0,0,0.2); }
  .teamEach:hover { transform: translateY(-6px); }
  .teamEach:hover img { filter: grayscale(0%); transform: scale(1.05); }
  .ceoparCon:hover .ceopar { opacity: 1; }

}


/* ===================================================
   ACTIVE → MOBILE (touch devices)
=================================================== */
@media (hover: none) and (pointer: coarse) {

  .primary:active { opacity: 0.9; background-color: var(--primary); }
  .secondary:active { opacity: 0.9; }
  a:active { color: var(--gold); }
  .law-nav__link:active, .law-nav__lang:active { background: rgba(28,45,68,.06); }
  .law-nav__cta:active { filter: brightness(.98); box-shadow: 0 8px 18px rgba(214,174,107,.25); }
  .law-nav__btn:active::before,
  .law-nav__btn:active::after,
  .law-nav__btn:active span { background: var(--gold); }
  .sebr1:active { position: relative; padding: 70px 0; background-color: var(--gold); }
  .sebr1:active .h4val { opacity: 1; height: 100px; }
  .prev:active, .next:active { color: var(--gold); }
  .numCard:active { transform: translateY(-6px); box-shadow: 0 18px 45px rgba(0,0,0,0.12); }
  .feature-item:active { border-color: var(--gold); background: #fff; }
  .service-box:active .service-icon { opacity: 0; transform: translateY(-110px) rotateX(90deg); }
  .service-box:active .service-content { opacity: 1; transform: rotateX(0); }
  .servIconsHolder1 div:active,
  .servIconsHolder div:active { padding: 10px; align-content: center; border-bottom: 3px solid var(--primary); }
  .faq-question:active { background: #f5f7fa; }
  .mapmaj iframe:active { opacity: 1; }
  .contactInfo a:active { color: var(--gold); }
  .aboutus-box:active::before { width: 100%; background: var(--primary); border-radius: 0 0 0 10px; }
  .file-remove:active { opacity: 0.8; }
  .whatsapp-float:active { color: var(--primary); transform: scale(1.08); box-shadow: 0 14px 35px rgba(0,0,0,0.2); }
  .teamEach:active { transform: translateY(-6px); }
  .teamEach:active img { filter: grayscale(0%); transform: scale(1.05); }
  .ceoparCon:active .ceopar { opacity: 1; }

}






















  
  .ceopar{position: absolute;
  bottom: 72px;
  left: 152px;
  opacity: 0.5;
  transition: all 1s ease;}
 
  
  .ceoparCon{
	position:relative;
}

  .ceoparCon:hover .ceopar{ 
  opacity: 1; }
 
  .ceopar h6{background: var(--gold);
Padding: 7px 19px;
  margin: 0 auto;
  text-align: center;
  border-radius: 50px 20px;}
  
  .ceopar p{background: var(--primary);
  Padding: 3px 6px;
  margin: -2px 10px;
  color: #fff;
  text-align: center;
  border-radius: 50px 20px;
  font-size: 0.8em;}
  
  
  /* =========================
   Opacity Utilities
========================= */

.opa0{opacity:0;}

.opa1{opacity:0.1;}
.opa2{opacity:0.2;}
.opa3{opacity:0.3;}
.opa4{opacity:0.4;}
.opa5{opacity:0.5;}
.opa6{opacity:0.6;}
.opa7{opacity:0.7;}
.opa8{opacity:0.8;}
.opa9{opacity:0.9;}

.opa10{opacity:1;}


  
  /* =========================
   Margin Utilities
========================= */
  
/* Auto Center */
  
  .mauto{margin:0 auto}
/* All Sides */

.m-0{margin:0;}
.m-1{margin:4px;}
.m-2{margin:8px;}
.m-3{margin:12px;}
.m-4{margin:16px;}
.m-5{margin:24px;}


/* Top */

.mt-0{margin-top:0;}
.mt-1{margin-top:4px;}
.mt-2{margin-top:8px;}
.mt-3{margin-top:12px;}
.mt-4{margin-top:16px;}
.mt-5{margin-top:24px;}
.mt-50{margin-top:50px;}

/* Right */

.mr-0{margin-right:0;}
.mr-1{margin-right:4px;}
.mr-2{margin-right:8px;}
.mr-3{margin-right:12px;}
.mr-4{margin-right:16px;}
.mr-5{margin-right:24px;}


/* Bottom */

.mb-0{margin-bottom:0;}
.mb-1{margin-bottom:4px;}
.mb-2{margin-bottom:8px;}
.mb-3{margin-bottom:12px;}
.mb-4{margin-bottom:16px;}
.mb-5{margin-bottom:24px;}


/* Left */

.ml-0{margin-left:0;}
.ml-1{margin-left:4px;}
.ml-2{margin-left:8px;}
.ml-3{margin-left:12px;}
.ml-4{margin-left:16px;}
.ml-5{margin-left:24px;}



 

  
  /* =========================
   Padding Utilities
========================= */

/* All Sides */

.p-0{padding:0;}
.p-1{padding:4px;}
.p-2{padding:8px;}
.p-3{padding:12px;}
.p-4{padding:16px;}
.p-5{padding:24px;}


/* Top */

.pt-0{padding-top:0;}
.pt-1{padding-top:4px;}
.pt-2{padding-top:8px;}
.pt-3{padding-top:12px;}
.pt-4{padding-top:16px;}
.pt-5{padding-top:24px;}


/* Right */

.pr-0{padding-right:0;}
.pr-1{padding-right:4px;}
.pr-2{padding-right:8px;}
.pr-3{padding-right:12px;}
.pr-4{padding-right:16px;}
.pr-5{padding-right:24px;}


/* Bottom */

.pb-0{padding-bottom:0;}
.pb-1{padding-bottom:4px;}
.pb-2{padding-bottom:8px;}
.pb-3{padding-bottom:12px;}
.pb-4{padding-bottom:16px;}
.pb-5{padding-bottom:24px;}


/* Left */

.pl-0{padding-left:0;}
.pl-1{padding-left:4px;}
.pl-2{padding-left:8px;}
.pl-3{padding-left:12px;}
.pl-4{padding-left:16px;}
.pl-5{padding-left:24px;}

  
  
  /* =========================
   Full Width System
========================= */

.w1 {width:1%;}
.w2 {width:2%;}
.w3 {width:3%;}
.w4 {width:4%;}
.w5 {width:5%;}
.w6 {width:6%;}
.w7 {width:7%;}
.w8 {width:8%;}
.w9 {width:9%;}
.w10 {width:10%;}
.w11 {width:11%;}
.w12 {width:12%;}
.w13 {width:13%;}
.w14 {width:14%;}
.w15 {width:15%;}
.w16 {width:16%;}
.w17 {width:17%;}
.w18 {width:18%;}
.w19 {width:19%;}
.w20 {width:20%;}
.w21 {width:21%;}
.w22 {width:22%;}
.w23 {width:23%;}
.w24 {width:24%;}
.w25 {width:25%;}
.w26 {width:26%;}
.w27 {width:27%;}
.w28 {width:28%;}
.w29 {width:29%;}
.w30 {width:30%;}
.w31 {width:31%;}
.w32 {width:32%;}
.w33 {width:33%;}
.w34 {width:34%;}
.w35 {width:35%;}
.w36 {width:36%;}
.w37 {width:37%;}
.w38 {width:38%;}
.w39 {width:39%;}
.w40 {width:40%;}
.w41 {width:41%;}
.w42 {width:42%;}
.w43 {width:43%;}
.w44 {width:44%;}
.w45 {width:45%;}
.w46 {width:46%;}
.w47 {width:47%;}
.w48 {width:48%;}
.w49 {width:49%;}
.w50 {width:50%;}
.w51 {width:51%;}
.w52 {width:52%;}
.w53 {width:53%;}
.w54 {width:54%;}
.w55 {width:55%;}
.w56 {width:56%;}
.w57 {width:57%;}
.w58 {width:58%;}
.w59 {width:59%;}
.w60 {width:60%;}
.w61 {width:61%;}
.w62 {width:62%;}
.w63 {width:63%;}
.w64 {width:64%;}
.w65 {width:65%;}
.w66 {width:66%;}
.w67 {width:67%;}
.w68 {width:68%;}
.w69 {width:69%;}
.w70 {width:70%;}
.w71 {width:71%;}
.w72 {width:72%;}
.w73 {width:73%;}
.w74 {width:74%;}
.w75 {width:75%;}
.w76 {width:76%;}
.w77 {width:77%;}
.w78 {width:78%;}
.w79 {width:79%;}
.w80 {width:80%;}
.w81 {width:81%;}
.w82 {width:82%;}
.w83 {width:83%;}
.w84 {width:84%;}
.w85 {width:85%;}
.w86 {width:86%;}
.w87 {width:87%;}
.w88 {width:88%;}
.w89 {width:89%;}
.w90 {width:90%;}
.w91 {width:91%;}
.w92 {width:92%;}
.w93 {width:93%;}
.w94 {width:94%;}
.w95 {width:95%;}
.w96 {width:96%;}
.w97 {width:97%;}
.w98 {width:98%;}
.w99 {width:99%;}
.w100 {width:100%;}
/* =========================
   Height Utilities (1% → 100%)
========================= */

.h1 {height:1%;}
.h2 {height:2%;}
.h3 {height:3%;}
.h4 {height:4%;}
.h5 {height:5%;}
.h6 {height:6%;}
.h7 {height:7%;}
.h8 {height:8%;}
.h9 {height:9%;}
.h10 {height:10%;}
.h11 {height:11%;}
.h12 {height:12%;}
.h13 {height:13%;}
.h14 {height:14%;}
.h15 {height:15%;}
.h16 {height:16%;}
.h17 {height:17%;}
.h18 {height:18%;}
.h19 {height:19%;}
.h20 {height:20%;}
.h21 {height:21%;}
.h22 {height:22%;}
.h23 {height:23%;}
.h24 {height:24%;}
.h25 {height:25%;}
.h26 {height:26%;}
.h27 {height:27%;}
.h28 {height:28%;}
.h29 {height:29%;}
.h30 {height:30%;}
.h31 {height:31%;}
.h32 {height:32%;}
.h33 {height:33%;}
.h34 {height:34%;}
.h35 {height:35%;}
.h36 {height:36%;}
.h37 {height:37%;}
.h38 {height:38%;}
.h39 {height:39%;}
.h40 {height:40%;}
.h41 {height:41%;}
.h42 {height:42%;}
.h43 {height:43%;}
.h44 {height:44%;}
.h45 {height:45%;}
.h46 {height:46%;}
.h47 {height:47%;}
.h48 {height:48%;}
.h49 {height:49%;}
.h50 {height:50%;}
.h51 {height:51%;}
.h52 {height:52%;}
.h53 {height:53%;}
.h54 {height:54%;}
.h55 {height:55%;}
.h56 {height:56%;}
.h57 {height:57%;}
.h58 {height:58%;}
.h59 {height:59%;}
.h60 {height:60%;}
.h61 {height:61%;}
.h62 {height:62%;}
.h63 {height:63%;}
.h64 {height:64%;}
.h65 {height:65%;}
.h66 {height:66%;}
.h67 {height:67%;}
.h68 {height:68%;}
.h69 {height:69%;}
.h70 {height:70%;}
.h71 {height:71%;}
.h72 {height:72%;}
.h73 {height:73%;}
.h74 {height:74%;}
.h75 {height:75%;}
.h76 {height:76%;}
.h77 {height:77%;}
.h78 {height:78%;}
.h79 {height:79%;}
.h80 {height:80%;}
.h81 {height:81%;}
.h82 {height:82%;}
.h83 {height:83%;}
.h84 {height:84%;}
.h85 {height:85%;}
.h86 {height:86%;}
.h87 {height:87%;}
.h88 {height:88%;}
.h89 {height:89%;}
.h90 {height:90%;}
.h91 {height:91%;}
.h92 {height:92%;}
.h93 {height:93%;}
.h94 {height:94%;}
.h95 {height:95%;}
.h96 {height:96%;}
.h97 {height:97%;}
.h98 {height:98%;}
.h99 {height:99%;}
.h100 {height:100%;}