.btn-secondary {
  color: #fff !important; }

img {
  width: 100%; }

  .logo {
    width: 75px;
    height: 75px;
   }

  .logo2 {
    width: 180px; }

  .logo3 {
    width: 158px;
    height: 158px }

  .profile-small{
    border-radius: 50%;
    width: 40px;
    height: 40px}

  .news-small{
    width: 40px;
    height: 40px}

  .profile-big{
    border-radius: 50%;
    width: 200px;
    height: 200px}

  .sig {
    width: 130px;
    height: 50px;
   }

   .sig2 {
     width: 200px;
     height: 110px;
    }

  .news_img {
    width: 50%;
    height: 50%;
    }
=======
.logo {
  width: 80px; }

.logo2 {
  width: 180px; }

.logo3 {
  width: 158px;
  height: 158px }

.sig {
  width: 130px;
  height: 50px;
 }

 .sig2 {
   width: 200px;
   height: 110px;
  }

.news_img {
  width: 50%;
  height: 50%;
  }
>>>>>>> 221184f680b28065f815f25d581c3bf78f22eef9

.navbar {
  opacity: 0.9;
}

.social a {
  margin-right: 0.4rem; }

.wrapper{
  width: 100%;
  margin-right: 0rem;
  padding-right: 0rem;
  overflow-x: hidden;
  position: relative;
}

.bg-light_blue {
  background-color: #1aafd0 !important; }

.text-light_blue {
  color: #00a7c9 !important; }

.text-deep {
  color: #3f2d7d !important; }

.text-orange {
  color: #f28239 !important; }

  .bg-orange {
    background-color: #f28239 !important; }


.text-orange {
  color: #f28239 !important; }

.bg-deep {
  background-color: #3f2d7d !important; }

.bg-faint {
  background-color: #c2bbda !important; }

  /* #bg {
    background-position: top;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }

  #circle{
    border-radius: 100px
  } */


    body{
    	background-color: hsl(0, 0%, 98%);
    }

    /* h1,h2,h3,h4,h5,h6{
    	color:hsl(0, 0%, 30%);
    } */

    .box-element{
    	box-shadow:hsl(0, 0%, 80%) 0 0 16px;
    	background-color: #fff;
    	border-radius: 4px;
    	padding: 1px;
    }

    .thumbnail{
    	width: 100%;
    	height: 200px;
    	-webkit-box-shadow: -1px -3px 5px -2px rgba(214,214,214,1);
        -moz-box-shadow: -1px -3px 5px -2px rgba(214,214,214,1);
        box-shadow: -1px -3px 5px -2px rgba(214,214,214,1);
    }

    .product{
    	border-radius: 4px 4px 4px 4px;
    }

    .bg-dark{
    	background-color: #4f868c!important;
    }


    .col-lg-4, .col-lg-6, .col-lg-8, .col-lg-12{
    	margin-top: 10px;
    }

    .btn{
    	border-radius: 0;
    }

    .row-image{
    	width: 100px;
    }

    .form-field{
    	width:250px;
    	display: inline-block;
    	padding: 5px;
    }

    .cart-row{
    	display: flex;
        align-items: flex-stretch;
        padding-bottom: 10px;
        margin-bottom: 10px;
        border-bottom: 1px solid #ececec;

    }

    .quantity{
    	display: inline-block;
    	font-weight: 700;
    	padding-right:10px;

    }

    .chg-quantity{
    	width: 12px;
    	cursor: pointer;
    	display: block;
    	margin-top: 5px;
    	transition:.1s;
    }

    .chg-quantity:hover{
    	opacity: .6;
    }

    .hidden{
    	display: none!important;
    }

    .icon-background {
      color: #c2bbda;
    }

    /*sidebar starts here*/
    .sidebar {
    height: 100%;
    width: 180px;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: ;
    overflow-x: hidden;
    padding-top: 210px;
    padding-top: 90px;
    }

    /* Style sidebar links */
    .sidebar a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 20px;
    color: #818181;
    display: block;
    }

    /* Style links on mouse-over */
    .sidebar a:hover {
    color: #f1f1f1;
    }

    /* Style the main content */
    .main {
    margin-left: 230px; /* Same as the width of the sidenav */
    padding: 0px 10px;
    }

    /* Add media queries for small screens (when the height of the screen is less than 450px, add a smaller padding and font-size) */
    @media screen and (max-height: 450px) {
    .sidebar {padding-top: 15px;}
    .sidebar a {font-size: 18px;}
    }

    /* Style the sidenav links and the dropdown button */
    .sidebar a, .dropdown-btn {
      padding: 6px 8px 6px 16px;
      text-decoration: none;
      font-size: 15px;
      color: rgba(255, 255, 255, 0.75);;
      display: block;
      border: none;
      background: #3f2d7d;
      width:100%;
      text-align: left;
      cursor: pointer;
      outline: none;
    }
    /* On mouse-over */
    .sidebar a:hover, .dropdown-btn:hover {
      color: #ffffff;
    }

    /* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
    .dropdown-container {
      display: none;
      background-color: #262626;
      padding-left: 8px;
    }

    /* Optional: Style the caret down icon */
    .fa-caret-down {
      float: right;
      padding-right: 8px;
    }

    .p1 {
      font-family: "Times New Roman", Times, serif;
    }

    .p2 {
      font-family: "Lucida Handwriting", cursive;
    }

    .p3 {
      font-family: "Bush Script MT", cursive;
      font-size:  18px;
    }

    .p4 {
      font-family: "Lucida Bright", cursive;
    }

    .p5 {
      font-family: "Arial", Helvetical, sans-serif;
      font-size:  16px;
    }

    .p6 {
      font-family: "Times New Roman", Times, serif;
      font-size:  16px;
    }

    .p7 {
      font-family: "Bush Script MT", cursive;

    }

=======
    @font-face {
    font-family: myFont;
    src: url("/includes/fonts/CSDiwany4S_Inormal.ttf");
    }

    .div {
    font-family: myFont;
    }

    .p5 {
      font-family: "Lucida Bright", cursive;
    }
    @import url(https://fonts.googleapis.com/earlyaccess/amiri.css);
    .amiri{
      font-family: 'Amiri', serif;
    }
    /*
    @import url(https://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
    @import url(https://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
    @import url(https://fonts.googleapis.com/earlyaccess/lateef.css);
    @import url(https://fonts.googleapis.com/earlyaccess/scheherazade.css);
    @import url(https://fonts.googleapis.com/earlyaccess/thabit.css);

    *{
      direction:rtl;
      color:#444;
    }

    h3{
      background:#222;
      color:#f9f9f9;
       padding:5px;
    }

    .amiri{font-family: 'Amiri', serif;}
    .droid-arabic-kufi{font-family: 'Droid Arabic Kufi', serif;}
    .droid-arabic-naskh{font-family: 'Droid Arabic Naskh', serif;}
    .lateef{font-family: 'Lateef', serif;}
    .scheherazade{font-family: 'Scheherazade', serif;}
    .thabit{font-family: 'Thabit', serif;} */




    .lh {
      line-height: 1px;
    }

    .lh2 {
      line-height: 16px;
    }

    .lh3 {
      line-height: 40px;
    }

    .lh4 {
      line-height: 65px;
    }

    .rotate {
    	width:44px;
    	height:80px;
    	background:#ffffff;
    	float:left;
    	text-align:center;
    	display:table;
    }
    .rotate p {
    	-webkit-transform: rotate(-90deg);
    	-moz-transform: rotate(-90deg);
    	-ms-transform: rotate(-90deg);
    	-o-transform: rotate(-90deg);
    	transform: rotate(-90deg);
    	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    	display:table-cell;
    	vertical-align:middle;
    }

    .tab{
      width:50px;
    }

ul#navmenu, ul.sub1, ul.sub2 {
  list-style-type: none;
  /* outline: 1px solid red; */

}

ul#navmenu li {
  width: 125px;
  text-align: center;
  position: relative;
  float: left;
  margin-right: 4px;
}

ul#navmenu a {
  text-decoration: none;
  display: block;
  width: 125px;
  height:25px;
  line-height: 25px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
}

ul#navmenu .sub1 li{
  /* border: 1px solid green; */
  margin-top: 5px;
}

ul#navmenu .sub1 a{
  margin-top: -5px;
}

ul#navmenu .sub2 a {
  margin-left: 0px;
}

ul#navmenu li:hover > a {
  background-color: #cfc;
}

ul#navmenu li:hover a:hover {
  background-color: #ff0;
}

ul#navmenu ul.sub1 {
  display: none;
  position: absolute;
  top: 26px;
  left: -40px;
}

ul#navmenu ul.sub2 {
  display: none;
  position: absolute;
  top: -5px;
  left: 85px;
}

ul#navmenu li:hover .sub1 {
  display: block;
}

ul#navmenu .sub1 li:hover .sub2 {
  display: block;

}
