body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      width:100%;
      height:100%;
      position:absolute;
    }

    /* نوار منو */
    .navbar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background-color: #333;
      //background: linear-gradient(180deg, rgba(0,0,0,0.5) 0px, transparent 100%);
      color: white;
      padding: 10px 20px;
      position:fixed;
      width:100%;
      z-index:1;
    }

    .cnt1 {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width : 99%;
    }

    .logo {
      width :35%;
      height:80px;
    }

    .logoLink {
      width:50%;
      height:100%;
      display: inline-block;
    }

    .logoImg {
      width:100%;
      height:100%;
    }

    .languageBox {
      //width : 10%;
      display: flex;
      margin-right:2%;
    }

    #LanguageDrop {
      border:0px;
      border-radius:7px;
      background-color:whitesmoke;
    }
  
    #FlagImg {
      width:30px;
      height:30px;
      padding-left:2px;
      padding-right:2px
    }

    .menu {
      display : flex;
      justify-content: start;
      gap: 20px;
      width: 55%;
    }

    .menu a {
      text-decoration: none;
      color: white;
      font-size: 18px;
    }

    .menu a:hover {
      text-decoration: underline;
    }

    /* دکمه همبرگر */
    .hamburger {
      display: none;
      flex-direction: column;
      justify-content: space-around;
      width: 30px;
      height: 30px;
      cursor: pointer;
    }

    .hamburger div {
      width: 100%;
      height: 3px;
      background-color: white;
    }

    /* منو کشويي */
    .dropdown {
      display: none;
      height:100%;
      width : 100%;
      flex-direction: column;
      background-color: #444;
      //position: absolute;
      position: fixed;
      //top: 60px;
      //right: 20px;
      padding: 10px;
      //margin : 0px;
      //margin-left : 0%;
      border-radius: 5px;
      direction : ltr;
    }

    .dropdown a {
      color: white;
      padding: 5px 5px;
      //margin-left : 5px;
      text-decoration :none;
    }

    #CloseIcon {
      width:25px;
      height:25px;
      margin-left:95%;
      cursor: pointer;
    }

    .dropdown a:hover {
      background-color: #555;
    }
     
    #dropdownList-Content {
      width:100%;
      height:auto;
      background-color:gray;
      display:none;
    }
     
    #dropdownList-Content a {
      display : flex;
    }

    .arrowHmb {
      border: solid white;
      border-width: 0 3px 3px 0;
      display: inline-block;
      padding: 3px;
      margin-left: 5px;
      transform: rotate(-45deg); // right
      -webkit-transform: rotate(-45deg); // right
     }

     .arrowDownHmb {
      border: solid white;
      border-width: 0 3px 3px 0;
      display: inline-block;
      padding: 3px;
      margin-left: 5px;
      transform: rotate(45deg); // down
      -webkit-transform: rotate(45deg); // down
     }

    /* ريسپانسيو */
    @media (max-width: 1150px) {
      .menu {
        display: none;
      }

      .hamburger {
        display: flex;
      }

      .dropdown {
        display: none;
      }

      .dropdown.active {
        display: flex;
        z-index:1;
      }

      .navbar {
        direction : rtl;
       }
	
      .cnt1 {
        direction : ltr;
        justify-content: center;
      }
      
      .logo{
        width : 90%;
        display : flex;
	justify-content: center;
      }
      .languageBox {
        margin-right:7%;
      }

    }

/* Style The Drop Menu Start Block*/

/* The container <div> - needed to position the dropdown content */
.dropList {
  position: relative;
  display: inline-block;
}

/* DropList Content (Hidden by Default) */
.dropList-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  //right: 0;
}

/* Links inside the dropdown */
.dropList-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  //direction : rtl;
}

/* Change color of dropdown links on hover */
.dropList-content a:hover {background-color: #f1f1f1}

/* Show the dropList menu on hover */
.dropList:hover .dropList-content {
  display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropList:hover .dropMenu {
  color: lightgreen;
}

/*dropdown menu*/
.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid\9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
/* Style The Drop Menu End Block*/

.content {
width : 100%;
height : 100%;
min-height:600px;
position : relative;
}
.footer {
width : 80%;
height : 350px;
position : relative;
margin-top:850px;
margin-left:auto;
margin-right:auto;
display:flex;
border-top:1px solid whitesmoke;
}
.footerPart1 {
width:40%;
height : 350px;
position:absolute;
margin-left:0%;
}
.footerPart2 {
width:30%;
height : 350px;
position:absolute;
margin-left:40%;
}
.footerPart3 {
width:30%;
height : 350px;
position:absolute;
margin-left:70%;
}
.icon {
width:20px;
height:20px;
}
.footer3Item {
width:90%;
height:30px;
margin-top:25px;
margin-left:5%;
margin-right:5%;
direction:ltr;
}
.footer2Item {
width: 90%;
height: 15px;
margin-top: 25px;
margin-left: 5%;
margin-right:5%;
direction: ltr;
}
.footer2Item a {
text-decoration:none;
}
.footer1Item1 {
width:90%;
height:130px;
margin-top:25px;
margin-left:5%;
direction:ltr;
}
.logoFooter {
width : 300px;
height:130px;
}
.footer1Item2 {
width:90%;
height:100px;
margin-top:15px;
margin-left:5%;
overflow:hidden;
direction:ltr;
}
#footerDesc {
color: var(--steel-500, #6e798d);
text-align: justify;
//font-family: "SFCompact";
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 20px;
letter-spacing: 0.16px;
max-width: 360px;
height: 70px;
overflow: hidden;
}
#footerRead {
text-decoration:none;
line-height: 22px;
}
.footer1Item3 {
width:90%;
height:50px;
margin-top:15px;
margin-left:5%;
display:flex;
direction:ltr;
}
#social {
//font-size: 16px;
//font-style: normal;
//font-weight: 400;
line-height: 22px;
}
.SocialIcon {
width:30px;
height:30px;
margin-left:20px;
}
   @media (max-width: 1200px) {
     .footer {
        width:100%;
        display:block;
        margin-top:2300px;
      }
      .footerPart1 {
        width:100%;
        position: unset;
        margin-left: auto;
        margin-right: auto;
        text-align:center;
      }

      .footerPart2{
        width:100%;
        position: unset;
        margin-left: auto;
        margin-right: auto;
        text-align:center;
      }

      .footerPart3{
        width:100%;
        position: unset;
        margin-left: auto;
        margin-right: auto;
        text-align:center;
      }

     .footer1Item1 {
       margin-left:5%;
       margin-right:5%;
     }
     
     .footer1Item2 {
       margin-left:5%;
       margin-right:5%;
     }

     .footer1Item3 {
       width:420px;
       margin-left:auto;
       margin-right:auto;
       justify-content: center;
     }
     #social {
       margin-left:5%;
     }

}

@media (max-width: 768px) {
   #CloseIcon {
      margin-left:90%;
    }
}

@media (max-width: 440px) {
    html, body {
    max-width: 100%;
    overflow-x: hidden;
    }
   .footer1Item3 {
       width:380px;   
   }
   .SocialIcon {
       margin-left:10px;
   }
   .navbar {
       padding-right:0px;
       padding-left:0px; 
   }
   .languageBox {
       margin-right:3%;
   } 
   .hamburger {
       margin-left:3%;
   }
   .logoLink {
       width:60%;
   }
   #CloseIcon {
       margin-left:88%;      
   }
}