body{
 
    padding-top: 80px; /* ضرورى عشان الشريط ميغطيش العناصر اللى تحته */
    height: 4000px;

}


/* نغير لون لينك الاكتف */
.navbar-inverse .navbar-nav > .active > a
, .navbar-inverse .navbar-nav >
 .active > a:hover, .navbar-inverse
  .navbar-nav > .active > a:focus 
  {
   background-color:  #e41b17;

  }
  
  /* نغير لون كتابه اللينكات من جوه*/
  .navbar-inverse 
  .navbar-nav > li > a 
  {
    color: #888;
    font-size: 17px;
  }
  /* نغير لون عنوان الناف*/
  .navbar-inverse .navbar-brand {
    color: #888;
    font-size: 30px;
    line-height: 40px;
}
.navbar-inverse .navbar-brand span {
    color: #e41b17;
    
}

/*تغير لون القائمه بتاعت اللينك الاخير وعمل خط احمر فى بدايه القائمه*/
.dropdown-menu
{
background-color: #333;
border-top: 3px solid #e41b17  ;
min-width: 200px; /* فى حاله زودنا حجم العنصر*/
left: 0;
right: auto;
}

/* نغير لون عناصر القائمه*/
.dropdown-menu > li > a
{
color: #fff;
}
/* نغير لون عنوان الناف*/

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus
{
  background-color: #e41b17;
  color: #fff;
  padding-left: 25px;
 transition:padding 0.5s ease ;
 /* نخليه يتحرك شويه بعد مانجى عليه بالسهم   */
  
} 

/* نغير حجم الينكات  */
.navbar-nav > li > a
 {
 padding-top: 25px ;
 padding-bottom: 25px ;
}

.navbar{
    min-height: 70px;
}

/* نغير لون الخط الفاصل*/
.dropdown-menu .divider
{
 background-color: #871818;   
}
/* نغير المسافه بين كل عنصر والتانى*/
.dropdown-menu > li > a
{
padding: 6px 20px;
}
/* فى حاله الصفحه صغيره هيظهر زر اللينكات ده فانغير مكانه  */
.navbar.toggle
{
margin-top: 18px;
}
.navbar-nav {
    padding-right: 50px;
}



  
  .co, .osm, .pr {
    width: 100%;
    height: 100px;
  }
  
  .carousel-inner .item {
    width: 100%;
    height: 500px; 
  }
  
  .carousel-caption {
    background-color: #00000040;
    position: absolute;
    left: 0;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
  }
  
  .carousel-indicators li {
    height: 13px;
    width: 13px;
  }
  
  .carousel-indicators .active {
    height: 13px;
    width: 13px;
    background: #f36;
  }
  
  .ha {
    padding-right: 5%;
  }
  
  .hali {
    font-weight: bold;
    font-size: 30px;
    font-style: italic;
    color: #888;
  }
  
  .back {
    background-color: beige;
  }
  
  span {
    color: #f36;
  }
  
@media (max-width: 767px) {
    .co, .osm, .pr {
      width: 100%;
      height: auto;
      max-height: 150px;
    }      
  
    .carousel-inner .item {
      width: 100%;
      height: auto; 
      max-height: 150px; 
    }
  }


.about {
    margin-top: 5rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.about .lead {
    color: #888;
    font-size: 20px;
    margin-top: 15px;
}


.os {
    text-align: center;
    margin-bottom: 20px;
  }
  
  .os img {
    width: 200px;
    height: 200px; 
  }
  
  .btn-success {
    margin-top: 10px;
    width: 200px; 
  }
  
  .btn-danger {
    margin-top: 10px;
    width: 200px; 
  }

  .btn-danger:hover {
    background-color: #333;

  }

.btn-success:hover {
    background-color: #333;

  }


  .ser{

    text-wrap: nowrap;
    color: #888;
    font-weight: bold;
 }


 .cont{
    background-color:#eee;
      
  } 
  
  @media (min-width: 1200px) {
    .os {
      width: 33.33%;
    }
  }
  
  @media (max-width: 1199px) and (min-width: 768px) {
    .os {
      width: 50%;
    }
  }
  
  @media (max-width: 767px) {
    .os {
      width: 100%;
    }
  }
  

  @media (min-width: 768px) {
    .cont {
      padding-left: 150px;
    }
  }





/* لوضعية الشاشات الكبيرة */
@media (min-width: 992px) {
    .col-lg-4 {
      flex-basis: 33.33%;
      max-width: 33.33%;
    }
  }
  
  /* لوضعية الشاشات المتوسطة */
  @media (max-width: 991px) {
    .col-lg-4 {
      flex-basis: 50%;
      max-width: 50%;
    }
  }
  
  /* لوضعية الشاشات الصغيرة */
  @media (max-width: 767px) {
    .col-lg-4 {
      flex-basis: 100%;
      max-width: 100%;
    }
  }
  



.testimonlas
{
padding-top: 50px;
padding-bottom: 50px;
}
.testimonlas h1
{
font-weight: bold;
margin-bottom: 20px;
}
.testimonlas .lead
{
    line-height: 2em;
    margin-bottom: 10px;
    font-size: 17px;
}
.testimonlas span{
    font-size: 18px;
    font-weight: bold;
    color: #f36;
}
.testimonlas .carousel-inner{
min-height:160px ;
}
.testimonlas .carousel-indicators
{
    position: static;
    width: 100%;
    margin-left: auto;
    padding-top: 20px;
}
.testimonlas .carousel-indicators li
{
    text-indent: 0;
    width: 80px;
    height: 80px;
    opacity: 0.4;
    margin: 8px;
    transition:all 0.5s ease ;
}
.testimonlas .carousel-indicators li.active
{
    opacity: 1;

}
.testimonlas .carousel-indicators li img
{
max-width: 100%;
}
.testimonlas .carousel-indicators li .active{
    background: #f36;
}






.price_table 
{ 
background: #eee;
padding-top: 40px;
padding-bottom: 40px;

}
.price_table h1
{ 
margin-bottom: 40px;
}

.price_table .price-box
{
    background: #fff;
    padding: 10px;
    border:1px solid #ddd ;
}
.price_table .price-box h2 
{
    margin: 5px 0 15px;
}

.price_table .price-box p
{
    font-size: 20px; 
    font-weight: bold;
    color: #666;
}

.price_table .price-box ul
{
    line-height: 2em;
    font-size: 15px;
}
.price_table .btn{
    margin: 0;
}
.price_table .price-box:hover{
    transform:scale(1.1,1.1);
}






.our-actors {
    
    background:url("../umg/ka.jpg")no-repeat fixed;
    background-size: cover;
    min-height:400px;
   
}
.our-actors h1
{
    margin-bottom:60px ;
}
.our-actors .team{
   background: rgb(2 2 2 / 60%);
   color: #fff;
   min-height: 500px;
   padding-top: 60px;
   padding-bottom: 60px;
}

.our-actors .person{
    margin-bottom:40px ;
}

.our-actors img:hover
{
    transform:scale(1.1,1.1);
}




.sub {
    padding-top: 40px;
    padding-bottom: 70px;
    background: #eee;
  }
  
  .sub h1 {
    color: #888;
    letter-spacing: 2px;
    margin-bottom: 20px;
  }
  
  .sub p {
    margin-bottom: 30px;
  }
  
  .sub .form-control {
    border-radius: 0;
    margin-right: 5px;
    height: 40px;
    width: 300px;
  }



  @media (min-width: 768px) {
    .sub .form-inline {
      text-align: center; 
    }
  
    .sub .form-control {
      margin-right: 0; 
    }
  
    .sub .btn {
      margin-bottom: 10px;
      height: 40px;
      
    }
  }
  





.contact
{
    background:url("../umg/conta.jpg")no-repeat fixed;
    background-size: cover;
    min-height:500px;
   
}

.contact .fields
{
background: rgb(9 9 9 / 60%);
min-height: 500px;
color: #ddd;
padding-top: 40px;
padding-bottom: 40px;
}


.contact p
{
margin-bottom: 40px;
}
.contact textarea
{
    height:108px ;
}

.contact input[type="text"],
.contact textarea
{
    background: rgb(82 78 78 / 60%);
    color: #fff;
    border: none;
}





.container
{
padding-bottom: 50px;
}
.features
{
background: #eee;
padding-top: 50px;
padding-bottom: 50px;
}

ic{
    text-align: center;
}
.ic i{
    padding-left: 30px;
 
}