/* ksksksNAVIGATION -starttttttttttt*/
* {
  margin: 0;
  padding: 0;
  font-family: 'Arial', sans-serif;
  box-sizing: border-box;
}
body {
    margin: 100px;
    height: 100vh;
    background: #fffefe;
    font-family: 'Arial', sans-serif;
    display: grid;
} 

.web {
  width: 100%;
  background-color: rgb(238, 238, 238);    
  background-position: left;
}

.menu {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  padding-left: 50px;
  background-color: rgb(238, 238, 238);    

}

.logo{
    cursor: pointer;
    width: 400px;
    height: 120px;
    display: block; /* Ensure it's treated as a block-level element */
    background-color: rgb(238, 238, 238);    
  }

nav { /*navigation*/
    width: 100%;
    left: 0%;
    margin: auto;
    display: flex;
    line-height: 1px;
    position: fixed;
    top: 0;
    font-family: 'Arial', sans-serif;
    font-weight: bolder;
    font-size: medium;
    background-color: rgb(238, 238, 238);    
    z-index: 1;
    border-bottom: 1px solid #f7f7f7;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    background-color: rgb(238, 238, 238);    
  

}

nav ul {
  list-style: none;
  display: flex;
  margin-left: auto;
  margin-right: 5.7%;
  font-size: 1em;
  background-color: rgb(238, 238, 238);    
}

nav ul li {
  position: relative; /* Ensure dropdown positioning */
  margin: 0 30px;
  background-color: rgb(238, 238, 238);    
  z-index: 1; /* Ensure main navigation items are behind submenu */
  padding: 45px 15px; /* Adjust padding for main navigation items */
  display: block;
  height: 120px;
}

nav ul li a {
  color: rgb(55, 55, 59);
  text-decoration: none;
  display: block; /* Make the entire area clickable */
  background-color: rgb(238, 238, 238);    
}

nav ul li a:hover {
  text-decoration: underline;
  color: rgb(2, 0, 143);
}


/* NAVIGATION -endddddddddddd*/


/* Submenu styles */
nav ul li .submenu {
  display: none;
  position: absolute;
  background-color: white;
  z-index: 2; /* Ensure submenu appears above main navigation items */
  width: 200px; /* Example width; adjust based on your content */
  margin-top: 50px; /* Adjust as needed for spacing */
  padding: 0; /* Reset padding for submenu */
  left: 0; /* Align submenu to the left */
}

nav ul li:hover .submenu {
  display: block;
}

nav ul li .submenu li {
  text-align: left; /* Ensure submenu items are aligned to the left */
  background-color: rgb(238, 238, 238);    
  margin: 0;
}

nav ul li .submenu a {
  text-decoration: none;
  margin: 0;
  background-color: rgb(238, 238, 238);    

}

nav ul li .submenu a:hover {
  text-decoration: underline;
  margin: 0;
}
















/* Toggle Button */
.toggle_btn {
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background-color: rgb(238, 238, 238);    
}

.toggle_btn:hover {
  background-color: #e0e0e0; /* Background color on hover */
}

@media (max-width: 768px) {
  .toggle_btn {
      display: flex; /* Show toggle button on smaller screens */
  }

  nav ul {
      display: none; /* Hide the menu initially */
      flex-direction: column; /* Stack the menu items vertically */
      width: 100%; /* Full width */
      background-color: rgb(238, 238, 238);    
      position: absolute;
      top: 60px; /* Position below the navbar */
      left: 0;
      padding: 0;
  }

  nav ul.show {
      display: flex; /* Show the menu when the toggle button is clicked */
  }

  nav ul li {
      width: 100%;
      text-align: center;
      margin: 0; /* Remove margin for list items */
      padding: 15px 0; /* Add padding for better spacing */
      position: relative; /* Ensure dropdown positioning */
  }

  nav ul li .submenu {
      display: none;
      position: absolute;
      background-color: white;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      z-index: 1;
      width: 100%; /* Adjust width as needed */
      top: 100%;
      left: 0;
  }

  nav ul li:hover .submenu {
      display: block;
  }

  nav ul li .submenu li {
      margin: 0;
  }

  nav ul li .submenu a {
      padding: 10px 20px;
      display: block;
      color: rgb(55, 55, 59);
      text-decoration: none;
  }

  nav ul li .submenu a:hover {
      background-color: #f2f2f2;
  }
}



/* HEADER -starttttttttttt*/
#policy-section h6 { /*PICTURE HEADER*/
  font-size: 4em;
  margin-top: 1.6%;
  margin-bottom: 20px;
  margin-left: -200px;
  color: black;
  text-align: left;
  background-image: url('/pictures/Polar\ Viking\ 3-used.jpg'); /* Update with the correct path to your image */
  width: 106.19vw; /* Adjusted width to cover the full width of the viewport */
  line-height: 100%; /* Adjusted line height */
  background-size: cover;
  background-position: left center;
  color: white; /* Ensures text is readable over the background */
  display: inline-block;
  padding: 150px; /* Added padding for better readability */
  box-sizing: border-box; /* Ensures padding is included in the width calculation */
  background-color: rgb(238, 238, 238);    
}
/* HEADER -endddddddddddd*/








.front p { /*quality management style*/
  font-size: 1.1em;
  text-align: center;
}





/*POLICYYYYYYYYYY-start*/
.uno.body{
  display: flex;
  align-items: center;
  min-height: 100vh;
  margin: 0;
  background-color: #f0f0f0;
}

.cont{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.uno{
max-width: 800px;
}
.uno .dos{
position: relative;
margin: 10px 20px;
}

.uno .dos .tres{
position: relative;
padding: 10px;
background: #3e4b4e;
color: #fff;
cursor: pointer;
}
.uno .dos .tres::before{
content: '+';
position: absolute;
top: 50%;
right: 20px;
transform: translateY(-50%);
font-size: 1em;
}

.uno .dos.active .tres::before{
content: '-';
}
.tres{
font-size: 20px;
text-align: left;
}
.uno .dos .kwatro{
position: relative;
background: #fff;
height: 0;
overflow: hidden;
transition: 0.5s;
overflow: auto;
}
.uno .dos.active .kwatro{
height: 320px;
padding: 25px;
}
.uno .dos .cinco{
position: relative;
background: #fff;
height: 0;
overflow: hidden;
transition: 0.5s;
overflow: auto;
}
.uno .dos.active .cinco{
height: 100px;
padding: 20px;
}
.uno .dos .nueve{
position: relative;
background: #fff;
height: 0;
overflow: hidden;
transition: 0.5s;
overflow: auto;
}
.uno .dos.active .nueve{
height: 380px;
padding: 20px;
}

.syete p{  /*accounting under*/
text-align: left;
font-size: 16px;
}
.sais p{ /*accounting top*/
text-align: center;
font-size: 17px;
}
.otso p{
  text-align: center;
  font-size: 17px;
  }

          /*POLICYYYYYYYYYY--enddddddddd*/