/* The basic stuff to make it work */
      /* version:0.11 */
      
      .contenedor {
          width: 100vw;
          height: 100vh;
          background: white;
          position: relative;
          display: flex;
          align-items: center;
      }
      
      .contenedor form {
          box-sizing: border-box;
          text-align: center;
          padding: 22px;
          display: inline-flex;
          flex-direction: column;
          position: fixed;
          height: 100vh;
          justify-content: center;
      }
      
      .contenedor form input {
          margin: 12px 0;
          z-index: 1;
      }
      
      .contenedor form input:checked {
          outline: 0;
          border: 0;
      }
      
      .contenedor form input:checked:before {
          background-color: white;
      }
      
      .contenedor form input:checked:after {
          opacity: 1;
          left: 20px;
      }
      
      .contenedor form input:hover:after:not(label) {
          opacity: 1;
      }
      
      .contenedor form input:nth-of-type(1):checked~.labels label {
          transform: translateY(-0%);
      }
      
      .contenedor form input:nth-of-type(2):checked~.labels label {
          transform: translateY(-0%);
      }
      
      .contenedor form input:nth-of-type(3):checked~.labels label {
          transform: translateY(-100%);
      }
      
      .contenedor form input:nth-of-type(4):checked~.labels label {
          transform: translateY(-200%);
      }
      
      .contenedor form input:nth-of-type(5):checked~.labels label {
          transform: translateY(-300%);
      }
      
      .contenedor form input:nth-of-type(6):checked~.labels label {
          transform: translateY(-400%);
      }
      
      .contenedor form input:nth-of-type(7):checked~.labels label {
          transform: translateY(-500%);
      }
      
      .contenedor form input:nth-of-type(8):checked~.labels label {
          transform: translateY(-600%);
      }
      
      .contenedor form input:nth-of-type(9):checked~.labels label {
          transform: translateY(-604.25%);
      }
      
      .contenedor form .labels {
          position: absolute;
          top: 0;
          left: 0;
          width: 100vw;
          height: 100vh;
          display: flex;
          flex-direction: column;
      }
      
      .contenedor form .labels label {
          min-width: 100vw;
          min-height: 100vh;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          z-index: 0;
          transition: all 0.75s cubic-bezier(0.75, 0.25, 0, 1.05);
      }
      /* Fancy style */
      
      body {
          font-family: "Open sans", sans-serif;
          font-size: 16px;
          font-weight: 100;
          color: white;
      }
      
      .content {
          width: 100%;
          box-sizing: border-box;
          padding: 0 110px;
      }
      
      .content .block {
          width: inherit;
          font-size: 11px;
          font-weight: 400;
          line-height: 1.5;
          margin: 42px 0;
          display: flex;
          justify-content: center;
      }
      
      .content .block span,
      .content .block span i {
          margin: 0 42px;
      }
      
      .content .block span i {
          margin-bottom: 22px;
      }
      
      .content .block span i:before {
          font-size: 30px;
      }
      
      .Slide:nth-child(even) .content .block {
          color: #717171;
      }
      
      .icon {
          position: absolute;
          bottom: 30px;
          left: 0;
          right: 0;
          font-size: 11px;
          text-align: center;
          line-height: 1.5;
          display: flex;
          flex-direction: column;
      }
      
      #Slide5 .content .block {
          flex-direction: column;
      }
      
      #Slide5 .content .block i {
          margin: 0 12px;
          vertical-align: middle;
      }
      
      strong {
          font-weight: 400;
      }
      
      h1 {
          text-transform: uppercase;
      }
      
      ol {
          text-align: left;
          list-style-type: decimal;
      }
      
      a {
          text-decoration: none;
          color: inherit;
      }
      
      label {
          margin-bottom: 0;
      }
      
      .slidefirst {
          background-image: url('../img/tree-header.jpg');
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
      }
      
      .slidesecound {
          background-color: #275E58;
      }
      
      .menulogo {
          direction: rtl;
          position: fixed;
          z-index: 1000;
          top: 4%!important;
          position: fixed;
          left: 50%;
          transform: translate(-50%, 0);
      }
      
      .container {
          float: right;
          direction: rtl;
      }
      
      .text-end {
          text-align: right;
      }
      
      .cush2 {
          margin: 20px 0;
          font-size: 1.3rem;
      }
      
      .Slide3 {
          background-color: white;
          direction: rtl;
      }
      
      .Slide3 h2 {
          color: black;
      }
      
      .slide4 {}
      
      .mostatil {
          width: 100%;
          height: 25vh;
          position: relative!important;
          left: 0!important;
          top: 0!important;
          margin-top: 15px;
          object-fit: cover;
      }
      
      .moraba {
          width: 100%;
          height: 30vh;
          position: relative!important;
          margin-top: 15px;
          object-fit: cover;
      }
      
      .health {
          background-color: #C01E2E;
      }
      
      .academy {
          background-color: #FF9A00;
      }
      
      .slide5 {
          background-color: white;
      }
      
      .slide5 h2 {
          color: black;
      }
      
      .Slide3 .col-xs-4 {
          padding: 10px;
      }
      
      .ertebat {
          background-color: white;
      }
      
      .footer {
          background-color: #275E58;
          flex-direction: column;
          justify-content: flex-start!important;
          align-items: center;
      }
      
      .radio {
          display: none;
      }
      
      input[type=radio] {
          opacity: 0;
          appearance: none;
          margin: 0px;
          height: 10px;
          width: 10px;
          border-radius: 50%;
          background: black;
          border: 2px solid green;
          z-index: 1000!important;
      }
      
      input:checked {
          height: 10px;
          width: 10px;
          background: yellow;
      }
      
      .checkmark {
          position: absolute;
          top: 0;
          left: 0;
          height: 25px;
          width: 25px;
          background-color: #eee;
          border-radius: 50%;
      }
      
      .logo-client {
          object-fit: contain;
          height: 82px;
          filter: none;
          -webkit-filter: grayscale(0%);
          margin-bottom: 40px;
          width: 84px;
      }
      
      .logo-client:active {
          pointer-events: none;
      }
      
      .logo-client:hover {
          filter: none;
          -webkit-filter: grayscale(0%);
      }
      
      .button-arrow {
          border: 1px solid white;
          border-radius: 180px;
          width: 100%;
          position: relative;
          margin-top: 20px;
      }
      
      .button-arrow:hover {
          border-color: #00a874;
      }
      
      .button-arrow:hover hr {
          width: 80%;
          border-color: #00a874;
      }
      
      .button-arrow hr {
          height: 10px;
          position: relative;
          border: 0;
          border-bottom: 2px solid white;
          margin: 0;
          width: 33%;
          transition: width 2s;
          margin: auto;
          border-top: 0!important;
          bottom: 1px;
      }
      
      .arroww {
          box-sizing: border-box;
          height: 8px;
          width: 8px;
          border-style: solid;
          border-color: white;
          right: 53%;
          position: relative;
          border-width: 0px 2px 2px 0px;
          transform: rotate(135deg);
          transition: right 2s;
          bottom: 6px;
      }
      
      .button-arrow:hover .arroww {
          right: 78%;
          border-color: #00a874;
      }
      
      .slidesecound img {
          width: 30%;
      }
      
      .slidesecound h3 {
          font-size: 1.1em;
      }
      
      .slidesecound p {
          font-size: 0.85em;
      }
      
      .padding-slidesecound {
          padding: 0 60px;
      }
      
      .morabaa .back-title {
          z-index: 0;
          background-color: rgb(54, 89, 88, 0.8);
          position: absolute;
          /*title is positioned at the top of container div*/
          bottom: 0;
          color: white;
          width: 100%;
          font-size: 25px;
          text-align: center;
          /*title div is at the back of container and hence not visible*/
          opacity: 0;
          transition: 0.5s all ease;
          height: 30vh;
      }
      
      .mostatill .back-title {
          background-color: rgb(54, 89, 88, 0.8);
          position: absolute;
          /*title is positioned at the top of container div*/
          bottom: 0;
          color: white;
          width: 100%;
          font-size: 25px;
          text-align: center;
          /*title div is at the back of container and hence not visible*/
          opacity: 0;
          transition: 0.5s all ease;
          height: 25vh;
      }
      
      a:hover .back-title {
          /*becomes visible on hover as title comes on top of container*/
          opacity: 1;
          z-index: 220;
      }
      
      .title {
          opacity: 0;
          position: absolute;
          bottom: 40%;
          right: -50%;
          width: auto;
          width: 100%;
          transition: 2s all ease;
          font-size: 20px;
          font-variation-settings: "wght" 500;
      }
      
      .after-title {
          position: absolute;
          bottom: 25%;
          left: -50%;
          width: 100%;
          transition: 2s all ease;
          font-size: 15px;
          font-variation-settings: "wght" 300;
      }
      
      a:hover .title {
          opacity: 1;
          /*becomes visible on hover as title comes on top of container*/
          right: 0%;
      }
      
      a:hover .after-title {
          /*becomes visible on hover as title comes on top of container*/
          left: 0%;
      }
      
      .myVideo {
          object-fit: cover;
          width: 100vw;
          height: 100vh;
          position: fixed;
          top: 0;
          left: 0;
      }
      
      .contac {
          border: 1px solid black;
          border-radius: 180px;
          padding: 8px 20px 6px 20px;
          font-variation-settings: "wght" 600;
          font-size: 1.8rem;
          margin: 0 10px;
      }
      
      .contac:hover {
          color: white;
          background-color: #275E58;
          border: 1px solid #275E58;
      }
      
      .cont-us {
          font-variation-settings: "wght" 600;
          font-size: 1.8rem;
      }
      
      .vh3 {
          margin: 11px;
      }
      
      #h1home {
          opacity: 0;
          transition: all 1s;
          color: #42848b;
          position: absolute;
          top: 42px;
      }
      
      a:hover {
          text-decoration: none;
          outline: none;
      }
      
      .arrowwhr {
          box-sizing: border-box;
          height: 6px;
          width: 10%;
          border-style: solid;
          border-color: white;
          position: absolute;
          border-width: 0px 0px 2px 0px;
          /* transform: rotate(135deg); */
      }
      
      label {
          pointer-events: none;
      }
      
      .cont-us,
      .spinner-spin2,
      .vh3,
      .button-arrow,
      .back-title,
      .logo-client {
          pointer-events: fill;
      }
      
      .control-moblie {
          position: fixed;
          z-index: 10;
          top: 40%;
          right: 5%;
      }
      
      .radio-mobile {
          height: 10px;
          width: 10px;
          border-radius: 180px;
          margin-top: 10px;
          cursor: pointer;
          background-color: gray;
          opacity: 0.5;
      }
      
      .active-radio {
          height: 10px;
          width: 10px;
          border: 1px solid white;
          border-radius: 180px;
          margin-top: 10px;
          cursor: pointer;
          background-color: white;
          opacity: 1;
      }
      
      .radio-into {
          height: 4px;
          width: 5px;
          background-color: blue;
          border-radius: 180px;
          margin: auto;
          margin-top: 2px;
          display: none;
      }
      
      .display-none-mobile {
          display: none;
      }
      
      .display-none-mobilee {
          display: block;
      }
      
      .control-moblieee {
          display: none;
      }
      
      .padding-right-desktop {
          padding-right: 15px!important;
      }
      
      .padding-left-desktop {
          padding-left: 15px!important;
      }
      
      .MyClass123 {
          width: 35%!important;
      }
      .a-more {
        color: #275E58!important;
        pointer-events: fill;
        text-align: left;
        margin: auto;
        margin-left: 15px;
        border: #275E58 1px solid;
        border-radius: 50px;
        background-color: white;
        font-size: 15px;
        width: 122px;
        text-align: center;
        height: 31px;
        align-items: center;
        padding-top: 5px;
        font-variation-settings: "wght" 500;
        margin-top: 6px;
    }
    
            
            .a-more:hover {
                color: white!important;
                background-color: #275E58;
                border: #275E58 1px solid;

               
            }
      @media (max-width: 768px) {
          .logo-client {
              pointer-events: none;
          }
          .MyClass123 {
              width: 67%!important;
          }
          .back-title {
              /*display: none; */
          }
          .logo-client {
                object-fit: contain;
                height: 69px;
                filter: none;
                -webkit-filter: grayscale(0%);
                margin-bottom: 0.7vh;
                width: 8vh;
                text-align: center;
                margin: auto;
                margin-bottom: 1vh;
          }
          .vh3 {
              margin-top: 2vh;
          }
          .contac {
              background-color: #275E58;
              color: white;
              border: 0;
          }
          .display-none-mobilee {
              display: none;
          }
          #h1home {
              opacity: 1;
              margin-top: 25vh!important;
          }
          .control-moblieee {
              display: block;
              width: 9%;
          }
          .h2-mobile {
              margin-top: 15vh!important;
              margin-bottom: 2vh!important;
          }
          .display-none-mobile {
              display: block;
          }
          .display-mobilee {
              display: none;
          }
          .class132mobile {
              margin: auto;
          }
          .slidesecound img {
              width: 4vh;
              margin-top: 2vh;
          }
          .cush2 {
              margin: 10px 0 5px 0;
              font-size: 1.3rem;
          }
          .slidesecound h3 {
              font-size: 1.1em;
              font-variation-settings: "wght" 400;
          }
          .padding-proje-right {
              margin-right: 5vh;
          }
          .padding-proje-left {
              margin-right: -4vh;
          }
          .moraba {
              width: 100%;
              height: 11vh;
              position: relative!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .mostatil {
              width: 100%;
              height: 23vh;
              position: relative!important;
              left: 0!important;
              top: 0!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .display-block-mobile {
              display: none;
          }
          .img-health {
                width: 100px;
                margin-top: 13vh;
            }
      }
      
      @media (max-width: 576px) {
          .padding-right-desktop {
              padding-right: 0px;
          }
          .padding-left-desktop {
              padding-left: 0px;
          }
          .display-none-mobilee {
              display: none;
          }
          #h1home {
              opacity: 1;
              margin-top: 25vh!important;
          }
          .control-moblie {
              display: block;
          }
          .h2-mobile {
              margin-top: 15vh!important;
              margin-bottom: 2vh!important;
          }
          .display-none-mobile {
              display: block;
          }
          .display-mobilee {
              display: none;
          }
          .class132mobile {
              margin: auto;
          }
          .slidesecound img {
              width: 4vh;
              margin-top: 2vh;
          }
          .cush2 {
              margin: 10px 0 5px 0;
              font-size: 1.3rem;
          }
          .slidesecound h3 {
              font-size: 1.1em;
              font-variation-settings: "wght" 400;
          }
          .padding-proje-right {
              margin-right: 45px;
          }
          .padding-proje-left {
              margin-left: -35px;
          }
          .moraba {
              width: 100%;
              height: 11vh;
              position: relative!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .mostatil {
              width: 100%;
              height: 23vh;
              position: relative!important;
              left: 0!important;
              top: 0!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .display-block-mobile {
              display: none;
          }
          .control-moblieee {
              display: block;
              width: 9%;
          }
          .contac {
              background-color: #275E58;
              color: white;
              border: 0;
          }
          .vh3 {
              margin-top: 2vh;
          }
      }
      .sub-icons{
        width: 50px;
        height: 50px;
        background-color: #275E58;
    
    border-radius: 180px;
    align-items: center;
    display: flex;
       }
       .sub-icons:hover{
        background-color: #00A771;
       }
        
        cc {
            display: none;
        }
      @media screen and (max-height: 920px) and (max-width: 576px) {
        .padding-right-desktop {
            padding-right: 10px!important;
        }
        .fasele{
            margin-bottom: 3vh!important;
        }
          .MyClass123 {
              width: 67%!important;
          }
          .back-title {
              /*display: none; */
          }
          .vh3 {
              margin-top: 1vh;
          }
          .contac {
              background-color: #275E58;
              color: white;
              border: 0;
          }
          .display-none-mobilee {
              display: none;
          }
          #h1home {
              opacity: 1;
              margin-top: 25vh!important;
          }
          .control-moblieee {
              display: block;
              width: 9%;
          }
          .h2-mobile {
              margin-top: 15vh!important;
              margin-bottom: 2vh!important;
          }
          .display-none-mobile {
              display: block;
          }
          .display-mobilee {
              display: none;
          }
          .class132mobile {
              margin: auto;
          }
          .slidesecound img {
              width: 4vh;
              margin-top: 2vh;
          }
          .cush2 {
              margin: 10px 0 5px 0;
              font-size: 1.3rem;
          }
          .slidesecound h3 {
              font-size: 1.1em;
              font-variation-settings: "wght" 400;
          }
          .padding-proje-right {
              margin-right: 5vh;
          }
          .padding-proje-left {
              margin-right: -4vh;
          }
          .moraba {
              width: 100%;
              height: 10.3vh;
              position: relative!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .mostatil {
              width: 100%;
              height: 21vh;
              position: relative!important;
              left: 0!important;
              top: 0!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .display-block-mobile {
              display: none;
          }
          .a-more{
            color: #275E58!important;
            pointer-events: fill;
            text-align: left;
            margin: auto;
            margin-left: 15px;
            border: #275E58 1px solid;
            border-radius: 50px;
            background-color: white;
            font-size: 12px;
            width: 97px;
            text-align: center;
            height: 29px;
            align-items: center;
            padding-top: 5px;
            font-variation-settings: "wght" 500;
            margin-top: 2px;
            margin-left: 42px!important;
          }
          .cont-us{
            LINE-HEIGHT: 1.8;

          }
          .sub-icons {
            width: 40px;
            height: 40px;
            background-color: #00A771;
        }
          .vh3{
            width: 35px;
            margin: 8px;
          }
          .link-mobile{
            width: 40px;
          }
          #logo {
            margin-top: 24px;
            width: 65% !important;
        }
      }
      
      @media screen and (max-height: 700px) and (max-width: 576px) {
        #logo {
            margin-top: 11px;
            width: 80%!important;
        }
          .logo-client {
              pointer-events: none!important;
          }
          .MyClass123 {
              width: 67%!important;
          }
          .back-title {
              /*display: none; */
          }
          .logo-client {
              object-fit: contain;
              height: 50px;
              filter: none;
              -webkit-filter: grayscale(0%)!important;
              margin-bottom: 0.7vh;
              width: 4vh;
          }
          .display-none-mobilee {
              display: none;
          }
          #h1home {
              opacity: 1;
              margin-top: 25vh!important;
          }
          .control-moblie {
              display: block;
          }
          .h2-mobile {
              margin-top: 13vh!important;
              margin-bottom: 0vh!important;
          }
          .display-none-mobile {
              display: block;
          }
          .display-mobilee {
              display: none;
          }
          .class132mobile {
              margin: auto;
          }
          .slidesecound img {
              width: 4vh;
              margin-top: 2vh;
          }
          .cush2 {
              margin: 10px 0 5px 0;
              font-size: 1.3rem;
          }
          .slidesecound h3 {
              font-size: 1.1em;
              font-variation-settings: "wght" 400;
          }
          .padding-proje-right {
              margin-right: 5vh;
          }
          .padding-proje-left {
              margin-left: -4vh;
          }
          .moraba {
              width: 100%;
              height: 10.3vh;
              position: relative!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .mostatil {
              width: 100%;
              height: 21vh;
              position: relative!important;
              left: 0!important;
              top: 0!important;
              margin-top: 1vh;
              object-fit: cover;
          }
          .display-block-mobile {
              display: none;
          }
          .control-moblieee {
              display: block;
              width: 9%;
          }
          .contac {
              background-color: #275E58;
              color: white;
              border: 0;
          }
          .vh3 {
              margin-top: 1vh;
          }
          #radio-mobile4,
          #radio-mobile7 {
              display: none;
          }
      }
      
      .overlay {
          height: 0%;
          width: 100%;
          position: fixed;
          z-index: 11;
          top: 0;
          left: 0;
          background-color: #275E58;
          overflow-y: hidden;
          transition: 0.5s;
      }
      @media (max-width: 1367px) {
   
        .spinner-master .spinner2
    {
            position: absolute;
            height: 0.11rem;
            width: 100%;
            background-color: #275E58;
        }
        .spinner-master .horizontal {
            position: relative;
            float: left;
            margin-top: calc(5px * 1.7);
        }
    }
  
        
   
        .footer_mobile{
            display: none;
        }
        @media (max-width: 576px) {
            #radio-mobile4,
            .myVideo {
                display: none!important;
            }
            cc {
                display: block;
            }
            .footer_mobile{
                display: block;
                position: absolute;
                bottom: 0;
                background: #275E58;
                width: 100%;
                padding: 5px;
            }
        }
        
        @media (min-width: 992px) {
            .col-lg-17 {
                -ms-flex: 0 0 14.28%;
                flex: 0 0 14.28%;
                max-width: 14.28%;
            }
        }
        .overlay{
            z-index: 11!important;
        }
        
        
@media only screen and (max-width: 600px) {     
    .title {
        opacity: 0;
        position: absolute;
        bottom: 54%;
        right: -50%;
        width: auto;
        width: 100%;
        transition: 2s all ease;
        font-size: 15px;
        font-variation-settings: "wght" 500;
    }
    .mos-mob .back-title {
        z-index: 0;
        background-color: rgb(54, 89, 88, 0.8);
        position: absolute;
        bottom: 0;
        color: white;
        width: 100%;
        text-align: center;
        opacity: 0;
        transition: 0.5s all ease;
        height: 10.25vh;
    }
    .mos1mob .back-title {
        background-color: rgb(54, 89, 88, 0.8);
        position: absolute;
        bottom: 0;
        color: white;
        width: 100%;
        font-size: 25px;
        text-align: center;
        opacity: 0;
        transition: 0.5s all ease;
        height: 21vh;
    }
    .morabaa .back-title {
        height: 10.5vh;
      }
    .morabaa .back-title .title{
        font-size: 11px;
        bottom: 57%;
    }
    .morabaa .back-title .after-title{
        font-size: 12px;
        bottom: 19%;
    }
    .mostatill .back-title {
        height: 21vh;
    }
}