/* open toggle menu */


 .videoBg {
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
 }

 @media (min-aspect-ratio: 16/9) {
     .videoBg {

         width: 100%;
         height: auto;
     }
 }

 @media (max-aspect-ratio: 16/9) {
     .videoBg {

         width: 100%;

         padding: 0
     }
 }

 video {
     object-fit: fill
 }


 /* hamburger */
 :root {
     --primary-color: #2c3e50;
     --secondary-color: #3498db;
     --background-color: #ecf0f1;
     --text-color: #333;
     --hover-color: #2980b9;
 }


 .overlay {
     height: 100%;
     width: 0;
     position: fixed;
     z-index: 1;
     top: 0;
     left: 0;
     opacity: 0.9;
     overflow-x: hidden;
     transition: 0.5s;
     font-size: 1.5rem;
     font-weight: 800;
     color: white;
     background: linear-gradient(135deg, var(--primary-color) 0%, #273849 100%);
     transition: right 0.4s cubic-bezier(0.77, 0.2, 0.05, 1);
     box-shadow: -4px 0 15px #00000033;

 }

 .overlay-content {
     position: relative;
     top: 12%;
     width: 100%;
     text-align: center;
     margin-top: 10px;
     font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
         Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;

     height: 80px;
     background: #ffffff0d;
     backdrop-filter: blur(10px);

 }

 .overlay-content ul {
     list-style-type: none;
 }

 .overlay-content ul li {
     margin: 0 15px;
     border-bottom: 1px solid #ffff;
 }


 .overlay ul li a {

     text-decoration: none;

     color: #c6e8f1;
     display: block;
     transition: 0.3s;
     text-decoration: none;
     display: block;
     padding: 8px;
     font-weight: 500;
     position: relative;


 }

 .overlay ul li a:hover,
 .overlay ul li a:focus {
     color: white;
     border-bottom: 4px solid white;
 }

 .overlay .closebtn {
     position: absolute;
     top: 20px;
     right: 45px;
     font-size: 40px;
 }

 @media screen and (max-height: 450px) {
     .overlay a {
         font-size: 15px
     }

     .overlay .closebtn {
         font-size: 40px;
         top: 15px;
         right: 35px;
     }
 }

.containerback {
     position: relative;
     margin: 0 auto;
 }

 .containerback .content {
     position: absolute;
     top: 0;
     color: whitesmoke;
     width: 100%;
     padding: 5px;
 }

 div.example12 {
     padding: 15px;
 }

 @media screen and (min-width: 601px) {
     div.example12 {
         font-size: 45px;
     }
 }

 @media screen and (max-width: 600px) {
     div.example12 {
         font-size: 15px;
         padding: 5px;
         margin-top: 10px;
     }
 }

 .rotate {
     animation: rotation 5s;
 }

 .linear {
     animation-timing-function: linear;
 }

 .infinite {
     animation-iteration-count: infinite;
 }

 @keyframes rotation {
     from {
         transform: rotate(0deg);
     }

     to {
         transform: rotate(359deg);
     }
 }
.myDIV:hover+.hide {
     display: block;

 }

 .down-arrow:hover+.hide {
     display: block;

 }

 li.open>a>span {
     border-top: 0px !important;
     border-bottom: 7px dashed !important;
     height: 2px;
 }

 .circular_image {
     width: 200px;
     height: 270px;
     border-radius: 50%;
     overflow: hidden;
     background-color: blue;
     /* commented for demo
  float: left;
  margin-left: 125px;
  margin-top: 20px;
  */

     /*for demo*/
     display: inline-block;
     vertical-align: middle;
 }

 .circular_image img {
     width: 100%;
 }

 .containerbg {
     margin: 0px;
     padding: 0px;
     position: relative;
     width: 100%;
     margin-right: 20px;
     margin-left: 0%;
 }

 .containerbg img {
     width: 100%;
     margin-right: 0%;
     margin-left: 0%;
     padding: 0px;
 }

 .containerbg .content {
     position: absolute;
     bottom: 0;
    margin-right: 50%;
        margin-top: 0%;
        margin-bottom: 0%;
        margin-left: 0%;
        background-color: #ffffff;
        opacity: 0.8;
 }

.container_img_txt {
    position: relative;
    font-family: Arial;
}

.text_block_img_txt {
    position: absolute;
    text-align: center;
    top: 15%;
    bottom: 7%;
    right: 50%;
    left: 2%;
    background-color: white;
    opacity: 0.9;
    color: black;
    padding-left: 10%;
    padding-right: 10%;
    vertical-align: middle;
    top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
}

 .circle {
     width: 120px;
     height: 120px;
     -webkit-border-radius: 60px;
     -moz-border-radius: 60px;
     border-radius: 60px;
     
    
 }

 .full-img {
     width: 100%;
     height: 100vh;
     background: rgba(0, 0, 0, 0.9);
     position: fixed;
     top: 0;
     left: 0;
     display: none;
     align-items: center;
     justify-content: center;
     z-index: 100;
 }

 
 .full-img img {
     width: 85%;
     max-width: 500px;
 }

 .full-img span {
     position: absolute;
     top: 5%;
     right: 5%;
     font-size: 30px;

     cursor: pointer;
 }

 .articalpara{
    margin-block: 12px;
 }
 .quotpara{
    margin-block: 15;
 }

 
.text-block_home {
    position: absolute;
    bottom: 150px;
    left: 15px;
    color: black;
    padding-left: 20px;
    padding-right: 20px;
}


.desk {
    width: 400px;
    height: 200px;
    background: red;
}

.only-mobile {
    width: 400px;
    height: 200px;
    background: orange;
}

@media screen and (max-width : 1920px) {
    .only-mobile {
        visibility: hidden;
    }
}

@media screen and (max-width : 906px) {
    .desk {
        visibility: hidden;
    }

    .only-mobile {
        visibility: visible;
    }
}