/* UTILITIES */
* {
 margin: 0;
 padding: 0;
 box-sizing: border-box;

}
 #myVideo {
 width: 100vw;
  height: 100vh;
  object-fit: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}
@media screen and (max-width: 500px) {
 #myVideo{
   width: 100%;
     height:100%;
     object-fit: cover;
  position: fixed;
 }}
body {
    font-family: Slack-Larsseit, "Helvetica Neue", Helvetica, "Segoe UI", Tahoma, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-family: "Baskerville Old Face";
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    overflow-x: hidden;
}
a {
 text-decoration: none;
}
li {
 list-style: none;
 font-weight: 800;
font-size: 16px;
    font-family: "Baskerville Old Face";
}
/* NAVBAR STYLING STARTS */
.navbar {
display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 20px;
 color: black;
}
.nav-links a {
 color: black;
}
/* LOGO */
.logo {
  width: 50%;
  height: 50%;
  float: left;
    margin-top: -10px;
}
/* NAVBAR MENU */
.menu {
 display: flex;
 gap: 1em;
 font-size: 13px;
 font-weight: bolder;

    margin-bottom: 1rem;
}

li.more {
  display: inline-block;
}
.border{
    position:relative;
    -webkit-text-size-adjust: 14px;

}
.border:hover::after{
    content:'';
    position:absolute;
    width: 100%;
    height: 0;
    left:0;
    bottom:0px; /*Change this to increase/decrease distance*/
    border-bottom: 1px solid black;
}
.menu li {
 padding: 5px 14px;
}
/* DROPDOWN MENU */
.services {
 position: relative;
}
.dropdown {
 background-color: rgba(241,186,185,0.5);
 padding: 1em 0;
 position: absolute; /*WITH RESPECT TO PARENT*/
 display: none;
 border-radius: 8px;
 top: 35px;
    z-index: 10;
}
.dropdown li + li {
 margin-top: 10px;
}
.dropdown li {
 padding: 0.5em 1em;
 width: 12em;
 text-align: left;
}
.dropdown li:hover {
 background-color: rgba(241,186,185,0.5);
}
.services:hover .dropdown {
 display: block;
}
/*RESPONSIVE NAVBAR MENU STARTS*/
/* CHECKBOX HACK */
input[type=checkbox]{
 display: none;
}
/*HAMBURGER MENU*/
.hamburger {
 display: none;
 font-size: 24px;
 user-select: none;
}
/* APPLYING MEDIA QUERIES */
@media (max-width: 768px) {
.menu {
 display:none;
    margin-top: 15px;
 position: absolute;
 background-color: rgb(241,186,185);
 right: 0;
 left: 0;
 text-align: left;
 padding: 16px 0;
}
.menu li:hover {
 display: inline-block;

 transition: 0.3s ease;
}
.menu li + li {
 margin-top: 12px;
}
input[type=checkbox]:checked ~ .menu{
 display: block;
}
.hamburger {
 display: block;
}
.dropdown {
 left: 69%;
 top: 30px;
 transform: translateX(35%);
     background-color: rgb(241,186,185);
}
.dropdown li:hover {
 background-color:rgb(241,186,185);
}

}
button{
    background-color: transparent;
     font-family: "Baskerville Old Face";
    font-size: 15px;
    font-weight: bold;
    padding: 0.55rem 0.7rem;
    box-shadow: inset 0 0 0 1px #611f69;
border-radius: 5px;
    cursor: pointer;
}
button:hover{
    background-color: #611f69;
    color:white;
}
button:hover a{
    color:white;
}
.o-hero__header__headline--jumbo {
    font-family: Slack-Larsseit,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-family: "Baskerville Old Face";
    font-weight: 700;
    line-height: 1.0625;
    letter-spacing: -1.5px;
    font-size: 2.95rem;
    margin-bottom: 1rem;
     max-width: 13em;
    margin-top: 0;
    margin-left: 28px;
    color: midnightblue;
}
 h6{
align-content: center;
     text-align: center;
font-family: Slack-Larsseit,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-family: "Baskerville Old Face";
    font-weight: 700;
    line-height: 1.0625;
     justify-content: center;
    letter-spacing: -1.5px;
    font-size: 2.15rem;
    margin-bottom: 1rem;
    margin-top: 0;
     margin-right: 3%;
     margin-left: 3%;
     color:rgb(86,80,222);
}
 .jumboo--header h5{
   align-content: center;
     text-align: center;
     margin-right: 10%;
     margin-left: 10%;
font-family: Slack-Larsseit,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-family: "Baskerville Old Face";
    font-weight: 600;
    line-height: 1.0625;
     justify-content: center;
    letter-spacing: -1px;
    font-size:25px;
    margin-bottom: 1rem;
    margin-top: 0;
color:rgb(86,80,222);
 }

h1 {
    margin: 0.67em 0;
    font-family: Slack-Larsseit,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -.8px;
    font-size: 1.25rem;
    margin-bottom: 1rem;
}
h1 {
    font-size: 1.25em;
    margin-block-start: 1.83em;
    margin-block-end: 0.83em;
}
h1 {
    display: inline-flex;
    font-size: 1.25em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.c-billboard__header__copy {
    max-width: 44rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
}
.c-billboard__header__copy {
    font-weight: 800;
    line-height: 1.333;
    letter-spacing: -.2px;
    margin-top: 0;
    font-size: 2.425rem;
        font-family: "Baskerville Old Face";

}
.c-billboard__header__copy {
    max-width: 32rem;
    margin-left: 30px;
    margin-right: auto;
    margin-bottom: 2rem;
}
.c-billboard__header__copy {
    font-weight: 400;
    line-height: 1.333;
    letter-spacing: -.2px;
    margin-top: 0;
    font-size: 1.125rem;
}
p {
    margin: 0;
    margin-bottom: 1rem;
     font-size: 1.125rem;
    font-weight: bold;
}

.column {
  float: left;
    margin-left: 20px;
      margin-top: 20px;
  width: 16.66%;

}

.column img{
    width:auto;
    height:60px
}
/* Clearfix (clear floats) */
.row::after {
padding:10px;
    padding-top: 30px;

  display: table;
}
.row1{
  padding:15px;
    padding-top: 30px;
max-width: 500px;
  display: table;
}
@media screen and (max-width: 500px) {
#associations{
    margin-top: 15px;
}}
.o__next__header{
    padding: 10px;
    padding-top: 30px;
     margin-top: 30px;
}
.o__video__container {
  display: flex;
  align-items: center;
    float: left;
    margin-left: 10px;
    margin-top: 30px;
    padding: 20px;
  justify-content: center
}

.o__video__text {
    max-width: 30em;
  font-size: 20px;
    text-align: left;
    padding-left: 40px;
    font-family: "Baskerville Old Face";
}
img {
  image-rendering: high-quality;
image-resolution: from-image;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 500px) {
  .column {
    width: 33.33%;
  }
}
.info-container{
   display: inline-block;
   vertical-align: top;

   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;

}

.info-containers{
  display: inline-block;
   vertical-align:top;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;

}
@media screen and (max-width: 500px) {
  .flex-items {
    display: block;
  }
}
 @media screen and (max-width: 768px){
     .flex-items{
         display: initial;
     }
 }
@media screen and (min-width: 768px) {
    .flex-items {
        display: flex;
    }
}
 @media screen and (min-width: 768px){
     .flex-items img{
      width: 100%;
         height: 100%;
     }
 }

 @media screen and (min-width: 768px){
     .info-containers{
     margin-left: 10%;
         width: 460px;
    height: 359px;
     }
 }

 @media screen and (min-width: 768px){
     iframe {
         width: 410px;
    height: 260px;
     }
 }
@media screen and (min-width: 768px){
     .frame6 {
        margin-left: 9%
     }
 }
@media screen and (max-width: 500px){
     .frame6 {
        margin-top: 5%;
         margin-left: 2%;

     }
 }

@media screen and (min-width: 768px){
     .frame1 {
        margin-left: 15%
     }
 }
@media screen and (max-width: 500px){
     .frame1 {
        margin-top: 5%;
         margin-left: 2%;

     }
 }
@media screen and (min-width: 768px){
     .frame3 {
        margin-left: 45%
     }
 }
@media screen and (max-width: 500px){
     .frame3 {
        margin-top: 5%;
         margin-left: 40%;


     }
 }
@media screen and (min-width: 768px){
     .frame4 {
        margin-left: 28%
     }
 }
@media screen and (max-width: 500px){
     .frame4 {
        margin-top: 5%;
         margin-left: 40%;


     }
 }
@media screen and (min-width: 768px){
     .frame10 {
        margin-left: 28%
     }
 }
@media screen and (max-width: 500px){
     .frame10 {
        margin-top: 5%;
         margin-left: 2%;


     }
 }
@media screen and (min-width: 768px){
     .frame2 {
        margin-left: 13%;
     }
 }
@media screen and (max-width: 500px){
     .frame2 {
        margin-top: 5%;

     }
 }
@media screen and (min-width: 768px){
     .frame7 {
        margin-left: 18%;
     }
 }
@media screen and (max-width: 500px){
     .frame7 {
        margin-top: 5%;

     }
 }
@media screen and (min-width: 768px){
     .frame11 {
        margin-left: 23%;
     }
 }
@media screen and (max-width: 500px){
     .frame11 {
        margin-top: 5%;
         margin-left: 6%;

     }
 }
img {
    pointer-events: none;
}
.flex-items img{
    padding: 0;
    margin: 0 0 10px;
    width: 480px;
    height: 359px;
}
section{
    margin-top:5% ;
    justify-content: center;
}
.flex-item{
    margin-left: 2%;
    margin-right: 2%;
    margin-top: 50px;
    justify-content: center;
}
.info-container h2 {
    padding: 0;
    margin: 0 0 10px;
    max-width: 30em;
font-weight: 800;
    align-content: center;
    text-align: left;

    font-family: "Baskerville Old Face";
  justify-content: center;
    line-height: 1.12;
    letter-spacing: -1.1px;
    font-size: 1.75rem;
    margin-bottom: 1rem;
     display: block;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
.info-container h3 {
     padding: 0;
    margin: 0 0 10px;
    max-width: 30em;
font-weight: 600;
    color: #1a0000;
      align-content: center;
    text-align: left;


    font-family: "Baskerville Old Face";

}

.o__next__footer {
    clip-path: ellipse(105% 100% at center top);
    padding-bottom: 4rem !important;
background-image:  radial-gradient(rgb(192,247,253),rgb(182,222,232),rgb(192,247,253));
    border: none;
    margin-top: 100px;
    clip-path: ellipse(75% 75% at center top);
    height: auto;
    min-height: 310px;
}

.c-type-headline-primary {
    font-family: Slack-Larsseit,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-weight: 700;
    line-height: 1.1875;
    letter-spacing: -.8px;
    margin-top: 100px;
    font-size: 2rem;
    margin-bottom: 1rem;
    text-align: center;
    font-family: "Baskerville Old Face";
}
.u-text--reverse {
    color: #fff!important;
}
@media screen and (max-width: 500px) {
  .o__next__footer {
   margin-top: 70%;
  }
}
.info-container h5 {
    padding: 0;
    margin: 0 0 10px;
    max-width: 30em;
font-weight: bold;
      align-content:left;
    text-align: left;
    padding-left: 40px;
font-size: 17px;
    font-family: "Baskerville Old Face";

}
.o--sky--footer--headline p{
 padding: 0;
    margin: 0 0 10px;
    max-width: 30em;
font-weight: 800;
      align-content: left;
    text-align: left;
    padding-left: 40px;
font-size: 15px;
    font-family: "Baskerville Old Face";
}
.fa {
padding: 15px;
  font-size: 15px;
  width: 50px;
    text-align: center;
  text-decoration: none;

    color:black;
}

.fa-flickr:hover {
  background: #f40083;
  color: white;
}

.fa-facebook:hover {
  background: #3B5998;
  color: white;
}

.fa-twitter:hover {
  background: #55ACEE;
  color: white;
}

.fa-google:hover {
  background: #dd4b39;
  color: white;
}

.fa-linkedin:hover {
  background: #007bb5;
  color: white;
}

.fa-youtube:hover {
  background: #bb0000;
  color: white;
}

.fa-instagram:hover {
  background: #125688;
  color: white;
}

.fa-pinterest:hover {
  background: #cb2027;
  color: white;
}
/* For Drone html */
.info-container button{
    background-color: #4a154b;
    color: #fff;
    fill: #fff;
    outline: 0;
    border: none;
    border-radius: 5px;
    margin-left: 20%;
}
.square {
  height: 350px;
  width: 280px;
    border-radius: 5px;
  background-color:rgb(255,152,151);
    background-image: radial-gradient(rgb(255,152,151),rgb(255,152,151),rgb(241,186,185));
    margin:2px;
}

.arrow {
  border: solid midnightblue;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}

.right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

@media screen and (max-width: 500px) {
 .square{
  display:none;

  }
    .squareph{
        text-align: center;
    }
}



.c-form__label, .c-form__legend, c-form__inline-error {
    display: inline-block;
    margin: 0.5rem 0;
    font-family: Slack-Circular-Pro,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-family: "Baskerville Old Face";
    font-weight: 700;
    line-height: 1.28571429;
    letter-spacing: .2px;
    font-size: 1rem;
}
.c-form__input, .c-form__select, .c-input {
    background-color: #fff;
    color: #454245;
    text-decoration: none;
    font-family: Slack-Circular-Pro,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: normal;
    font-size: 1rem;
    border: 1px solid #696969;
    border-radius: 4px;
    box-shadow: none;
    padding: 1.15rem 1rem;
    display: inline-block;
}
@media screen and (min-width: 0) and (max-width: 1023px){
.c-form__input, .c-form__input.v--larger {
    max-width: 80%;
}}
.c-form__input {
    width: 100%;
}
.c-form__input, .c-form__select, .c-input,c-form__inline-error {
    background-color: #fff;
    color: #454245;
    text-decoration: none;
    font-family: Slack-Circular-Pro,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif;
    font-family: "Baskerville Old Face";
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: normal;
    font-size: 1rem;
    border: 1px solid #696969;
    border-radius: 4px;
    box-shadow: none;
    padding: 1.15rem 1rem;
    display: inline-block;
}
@media screen and (min-width: 0) and (max-width: 1023px){
.c-form__input, .c-form__input.v--larger {
    max-width: 100%;
}}
.c-form__input {
    width: 100%;
}
input, select {
    vertical-align: top;
}
input {
    line-height: normal;
}
button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
input, select {
    vertical-align: top;
}
input {
    line-height: normal;
}
button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
*, ::after, ::before {
    box-sizing: inherit;
}
*, ::after, ::before {
    box-sizing: inherit;
}

input[type="text" i] {
    padding: 10px 5px;
}
input[type="number" i] {
    padding: 10px 5px;
}
input[type="email" i] {
    padding: 10px 5px;
}
input {
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: -internal-light-dark(black, white);
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: auto;
    -webkit-rtl-ordering: logical;
    cursor: text;
    background-color: -internal-light-dark(rgb(255, 255, 255), rgb(59, 59, 59));
    margin: 0em;
    padding: 1px 2px;
    border-width: 2px;
    border-style: inset;
    border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133));
    border-image: initial;
}

@media screen and (min-width: 768px) {
    .skyrim--product--user{
        background-color: rgba(255,255,255,0.5);
        margin-top: -48%;
        margin-bottom: 23%;
    }
}

a{
    color: black;
}


/* Three image containers (use 25% for four, and 50% for two, etc) */
.column1 {
  float: left;
  width: 13.33%;
  padding: 5px;

}

/* Clear floats after image containers */
.row2::after {
  content: "";
  clear: both;
  display: table;


}
.row2 {
  display: flex;
    margin-left: 2%;
}

.column1 {
  flex: 13.33%;
  padding: 5px;
}
@media screen and (max-width: 500px) {
  .column1 {
    width: 50%;
  }

}
@media screen and (max-width: 500px) {
  .row2 {
    display: block;
      margin-left: 40%;
  }
}
@media screen and (max-width: 500px) {
  .row1 {
    display: block;

  }
}


.hide {
  display: none;
    margin-left: 4%;
    margin-top: 1%;
}

.myDIV:hover + .hide {
  display: block;
  color: red;
}


      .whatsapp-icon {
        font-size: 25px;text-align: center;margin-right: 40px


      }

.gallery1 {
  margin: 5px;
  border: 1px solid #ccc;
  width: 180px;

}

.gallery1:hover {
  border: 1px solid #777;
    cursor: pointer;
}

.gallery1 img {
  width: 100%;
  height: auto;
}

.desc1 {
  padding: 15px;
  text-align: center;
}

@media screen and (max-width: 500px){
    #images--front img{
        width: 100%;
        height: auto;
        margin-top: 3%;
        margin-left: 2%;
        margin-right: 2%;
    }

#flex--row{
    display: none;
}
.flexi {
  display: none;

}
#images--front iframe{
      width: 100%;
     height:240px;
     margin-right: 5%;

 }
.marginhead{
    width: 100%;
    margin-right: 2%;
}
.marginhead h1,p,h2{
    margin-right: 2%;
    max-width: 24em;
}
.marginhead p{
    max-width: 22em;
    margin-right: 2%;
}

.marginheadg{
  max-width: 23em;
}

.flexi.toggle {
    display: block;
  }
.margin{
    margin-right: 10%;
}
.marginx{
    margin-right: 40%;
}
}
@media screen and (min-width: 1100px) {
       #flexrow{
display: none;
    }
     #images--front img{
        width: 100%;
        height: 340px;
        margin-right: 5%;
    }
}
@media screen and (max-width: 1100px) and (min-width: 600px){
    #images--front img {
        width: 100%;
        height: auto;
        margin-top: 3%;
        margin-left: 2%;
        margin-right: 2%;
    }
     #images--front iframe{
      width: 100%;
     height:320px;
     margin-right: 1%;
     margin-left: 2%;
 }
#flex--row{
    display: none;
}

 #flexi {
  display: none;

}
#head:hover + #flexi {
  display: block;

}
.margin{
    margin-right: 10%;
}
}
.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
 box-shadow: 0 0 12px rgb(192,247,253), inset 0 0 12px rgb(192,247,253);
  -webkit-animation: pulse 2s linear 1s infinite;
  font-size:30px;
  z-index:100;
}

@-webkit-keyframes pulse {
  0% { box-shadow:0 0 10px #25d366, inset 0 0 10px #25d366; }
  50% { box-shadow:0 0 30px rgb(192,247,253), inset 0 0 30px rgb(192,247,253); }
  100% { box-shadow:0 0 10px #25d366, inset 0 0 10px #25d366; }
}
.my-float{
    margin-left: -10px;
    text-align: center;

}
.w3-animate-fading{
    animation:fading 5s infinite
}
@keyframes fading{ 0%{opacity:0.2}80%{opacity:1}100%{opacity:0}}
.w3-animate-fadings{
    animation:fading 40s infinite
}
