@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,800;1,100;1,200;1,300;1,400&display=swap');
*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
   
}

@font-face {
    font-family: 'ARDESTINE';
    src: url(fonts/ARDESTINE.ttf);
}
html{
    
    scrollbar-width: none;
}
::-webkit-scrollbar{
    display: none;
    width: 0;
    height: 0;
}

body
{
    background-color: rgb(0, 0, 0);
    color: rgb(145, 141, 141);
    -ms-overflow-style: none;  
}

#topBtn{
    position: fixed;
    bottom: 15px;
    right: 15px;
    font-size: 22px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #b60e0eec;
    color:white;
    border: none;
    cursor: pointer;
    display: none;
    z-index: 2;
  }
 
.menubar
{
    height: 100%;
    width: 100%;
    background:black;
    z-index: 1000;
    position: absolute;
    position: fixed;
    top:0;
    display: none;
    justify-content: center;
    align-items: center;
    cursor: none;    
}

.menubar li a
{
    color: white;
    font-size: 105px;
    font-weight:900;
    cursor:none;
    z-index: 100;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px rgb(136, 18, 18);
    text-decoration: none;
    
}
.menubar li
{
    text-align: center;
    list-style: none;
    z-index: 1000;
}
.cross 
{
    color:rgba(97, 7, 7, 0.986);
    font-size: 70px;
    cursor:none;
}
.cursor-menubar
{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 2px solid #0202026c;
    background:rgb(255, 255, 255);
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    transition: 0.1s;
    mix-blend-mode:soft-light;
    pointer-events: none;
}


.cursor-spot-menubar
{
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: rgb(114, 105, 105);
    position: fixed;
    top: 0;
    left: 0;
    z-index: -10;
    transform: translate(-50%, -50%);
    transition: 0.15s;
}
section .landing
{
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
   
section .img
{
    position: absolute;
    height: 600px;
    padding-left: 300px;
    padding-top: 100px;
    
}


.hero
{
    height: 100vh;
    width: 100vw;
    background:linear-gradient(
        to right,
        rgb(0, 0, 0) 0%,
        rgb(0, 0, 0) 50%,
        rgba(255, 0, 0, 0.658) 50%,
        rgba(255, 0, 0, 0.712) 100%
    );
}

nav
{
    
    padding: 16px;
    border-radius: 80px;
    margin-left: 8px;
    margin-right: 8px;
   
}
nav li
{
    display: inline;
    text-align: center;
    list-style-type: none;
 

}
nav img
{
    width: 50px;
    height: 35px;
}

nav h1
{
    font-family: 'ARDESTINE';
    letter-spacing: 6px;
    font-size: 25px;
    color: rgb(170, 15, 15);
    position: relative;
    margin-top: -45px;
    
}

nav h1 span
{
    font-family: 'ARDESTINE';   
    color: black;
}
nav .menu i
{
    position:relative;
    float: right;
    color: black;
    top: -35px;
    font-size: 35px;
    padding: 6px;
    transition: all .6s;
    z-index: 100;
}
nav .menu i:hover
{
    background-color: rgba(175, 160, 160, 0.788);
    border-radius: 50%;
}
.container
{
    justify-content: center;
    align-items: center;   
}

.container h2
{
    letter-spacing: 5px;
    font-weight: 900;
    font-size: 90px;  
    margin-top: 210px;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 3px rgba(199, 21, 21, 0.863);
    text-align: center;
    z-index: 10;
     
   
}
.container h2 span
{
    -webkit-text-fill-color:#dbd0d0;
    -webkit-text-stroke: 0px;

  
}

.container_para p{
   
    margin-left: 60vw;
    padding-left: 6px;
    color: #cabbbb;
    padding-bottom: 154px;
    font-weight: 600;
    font-size: 14px;
}
.container_para h2{
    margin-left: 60vw;
    margin-top: 85px;
    padding-left: 6px;
    color: #e7dddd;
    font-size: 30px;

}

.ourstory
{
    height: 100vh; 
    width: 100%;   
    display: flex;
    margin-top: 2%;
    padding-left: 7%;
    
}

.ourtitle h1
{
    font-size: 90px;
    font-size: 600;
    margin-left:0;
    color: white;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
}
.ourtitle h1 span
{
    color: rgb(199, 21, 21);
}
.ourtitle .x,
.ourtitleB .x,
.ourtitleC .x
{
    font-size: 90px;
}

.ourtitle h3
{
    
    font-size: 50px;
    line-height: 80px;
    font-weight: 700;
    color: #fff;
}
 .ourtitle h3 span
 {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
    font-size: 70px;
    color: rgb(199, 21, 21);
 }
 .ourtitle p
 {
     font-size: 15px;
 }
 .ourtitle img
 {
     border-radius: 10px;
     height: 300px;
     margin-top: 240px;
     margin-left:200px;
 }


 .ourstoryB
{
    height: 100vh;
    width: 100vw;
    margin-top: 2%;
    padding-left: 10px;
    display: flex;
    text-align: left;
    
}
.ourtitleB img
{
    margin-top: 60px;
    margin-left: 70px;
    padding: 10px;
    border-radius: 188% 188% 0 0;
}
 .ourtitleB h1
{
    font-size: 90px;
    text-align:left;
    padding-left: 200px;
    font-size: 600;
    color: white;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
}
.ourtitleB h1 span
{
    color: rgb(199, 21, 21);
}

.ourtitleB h3
{
    
    font-size: 50px;
    text-align:left;
    line-height: 80px;
    font-weight: 700;
    padding-left: 200px;
    color: #fff;
}
 .ourtitleB h3 span
 {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
    font-size: 70px;
    color: rgb(199, 21, 21);
 }
 .ourtitleB p
 {  
     margin-left: 200px;
     font-size: 15px;
     text-align: left;
 }

.ourstoryC
{
    height: 100vh;
    width: 100vw;    
    display: flex;
    margin-top: 2%;
    padding-left: 7%;
    
}

.ourtitleC h1
{
    font-size: 90px;
    font-size: 600;
    margin-left:0;
    color: white;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
}
.ourtitleC h1 span
{
    color: rgb(199, 21, 21);
}
.ourtitleC .x
{
    font-size: 90px;
}

.ourtitleC h3
{
    
    font-size: 50px;
    line-height: 80px;
    font-weight: 700;
    color: #fff;
}
 .ourtitleC h3 span
 {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px;
    font-size: 70px;
    color: rgb(199, 21, 21);
 }
 .ourtitleC p
 {
     font-size: 15px;
 }
 .ourtitleC img
 {
     border-radius: 10px;
     height: 550px;
     margin-top: 120px;
     margin-left:240px;
 }

 .services
 {
     height: 100vh;
     width: 100vw;    
 }
.servicehead h2
{
    text-align: center;
    font-size: 22px;
    margin-top: 30px;
    line-height: 40px;
    color: rgb(145, 141, 141);
}
.services h2 span
{
    -webkit-text-fill-color:transparent;
    -webkit-text-stroke:2px rgb(199, 21, 21);
    font-size: 80px;
    
}
.servicehead img
{
  
    height: 400px;
    opacity: 0.5;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    transition: all 0.9s;
    cursor: pointer;
}

.servicehead img:hover
{
    opacity: 0.8;
    transform: scale(1.1);

}
.servicepara 
{
    text-align: center;
    padding-top: 20px;
}

.servicecontent
{
    height: 100vh;
    width: 100vw;
}

.mobile h2
{
    margin-top: 40px;
    font-size: 60px;
    font-weight: 300;
    line-height: 60px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    padding-left: 100px;
    
}
.mobile p
{ 
    padding-left: 100px;   
}
.mobiledevs
{
    display: flex;
    justify-content: center;
    margin-top: -90px;
}
.mobileicon
{
    display: flex;
    justify-content: center;    
    margin-top: 200px;
    margin-right: 90px;

}
.mobileicon img
{
    height: 90px;
    margin-inline: 20px;
    opacity: .7;
    margin-top:40px;
    transition: all .6s;
    cursor: pointer;
}
.mobileicon img:hover
{
    opacity: 1;
    transform: scale(1.4);
}
.mobileicon .icon2,
.mobileicon .icon4
{
    margin-top: 170px;
}
.mob 
{
    margin-left: 100px;
    border-radius: 37px;
    box-shadow: rgba(128, 25, 21, 0.575) 0.5em 0.1em 2em -0.4em;
}

.webdevelopment
{
    height:100vh;
}
.frontend h2
{
    margin-top: 40px;
    font-size: 60px;
    font-weight: 300;
    line-height: 60px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    padding-left: 100px;
    
}
.frontend p
{ 
    padding-left: 100px;   
}

.frontendicons
{
    display: flex;
    margin-top: 200px;
    margin-left: 60px;
    margin-top: 30px;
}

.frontendicons img
{
    height: 90px;
    margin-inline: 10px;
    opacity: .7;
    margin-top:50px;
    transition: all .6s;
    cursor: pointer;   
}
.frontendicons .icon7,
.frontendicons .icon9 
{
    margin-top: 150px;
}
.icon11 
{
   height: 75px;
    margin-left:280px;
    margin-top: 30px;
    opacity: .7;
    cursor: pointer;
    transition: all 0.5s;
}
.frontendicons img:hover
{
    opacity: 1;
    transform: scale(1.4);
}
.icon11:hover
{
    opacity: 1;
    transform: scale(1.4);  
}
.lap{
    display:flex;
    justify-content: right;
}
.lap img
{
    height: 400px;
    margin-top: -400px;
    margin-right:00px;
}
.layer1
{
    height: 100vh;
}

.layer2,
.layer3
{
    margin-top: 25px;
}
.backenddevelopment
{
    display: flex;
}
.backicons
{
    display: flex;

    margin-left: 230px;
    margin-top: 88px;
}
.backend h2
{
    margin-top: 40px;
    font-size: 50px;
    font-weight: 300;
    line-height: 60px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    padding-left: 100px;
    
}
.backend p
{ 
    font-size: 14px;
    padding-left: 100px;   
}

.backicons img
{
    height: 60px;
    margin-inline:25px;
    opacity: .7;
    transition: all .6s;
    cursor: pointer;   
}

.backicons img:hover
{
    opacity: 1;
    transform: scale(1.4);
}



.database
{
    display: flex;
}
.databaseicons
{
    display: flex;
    margin-left: 240px;
    margin-top: 50px;
}
.storage h2
{
    margin-top: 40px;
    font-size: 50px;
    font-weight: 300;
    line-height: 60px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    padding-left: 100px;
    
}
.storage p
{ 
    padding-left: 100px;   
    font-size: 14px;
}

.databaseicons img
{
    height: 60px;
    margin-inline:25px;
    opacity: .7;
    transition: all .6s;
    cursor: pointer;   
}

.databaseicons img:hover
{
    opacity: 1;
    transform: scale(1.4);
}

.clouddevops
{
    display: flex;
}
.cloudicons
{
    display: flex;
    margin-left: 130px;
    margin-top: 80px;
}
.cloud h2
{
    margin-top: 40px;
    font-size: 50px;
    font-weight: 300;
    line-height: 60px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    padding-left: 100px;
    
}

.cloud p
{ 
    padding-left: 100px; 
    font-size: 14px;
}

.cloudicons img
{
    height: 60px;
    margin-inline:25px;
    opacity: .7;
    transition: all .6s;
    cursor: pointer;   
}

.cloudicons img:hover
{
    opacity: 1;
    transform: scale(1.4);
}
.portfolio
{
   width: 100vw;
}
.team
{
    font-size: 50px;
    -webkit-text-stroke: 2px rgb(199, 21, 21);
    -webkit-text-fill-color: transparent;
    text-align: center;
    margin-top:10px;
}

.containers
{
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   
}
.containers .cardteam
{
   width: 300px;
   height: 400px;
   padding: 60px 30px;
   margin: 20px;
   background: rgba(145, 141, 141, 0.034);
   margin-inline: 35px;
   box-shadow:20px 20px 50px rgb(0 0 0 / 15%),
               0.6em 0.6em 1.2em #340404eb;
   border-radius: 20px;
   border-top: .2px solid rgba(94, 1, 1, 0.295);
   border-left: .2px solid rgba(94, 1, 1, 0.295);

}


.containers .cardteam .contents
{
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
}
.containers .cardteam .contents .imgBx
{
   width: 130px;
   height: 130px;
   border-radius: 50%;
   position: relative;
   margin-bottom: 20px;
   overflow: hidden;
}
.containers .cardteam .contents .imgBx img
{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
}
.containers .cardteam .contents .contentBx h4
{
   color:rgb(247, 247, 247);
   font-size: 18px;
   text-align: center;
   letter-spacing: 1px;
   margin-top: 20px;
}
.containers .cardteam .contents .contentBx h5
{
    color:rgb(173, 167, 167);
    font-size: 13px;
    text-align: center;
}
.containers .cardteam .contents a
{
    text-decoration: none;
    color: #920c0c;
    font-size: 45px;
    margin-inline: 10px;
    transition: color 0.6s;
}
.containers .cardteam .contents a:hover
{
   color:rgb(224, 218, 218);
}
.containers .cardteam .contents .sci
{
   margin-top: 4px;
}
.containers .cardteam .contents .sci a
{
   text-decoration: none;
   color: #817b7b;
   font-size: 22px;
   margin-inline: 10px;
   transition: color 0.5s;
}
.containers .cardteam .contents .sci a:hover
{
    color: #920c0c;
}
.footer
{
    margin-top: 5rem;
    background: rgb(255 0 0 / 2%);
    height: 45vh;
    box-shadow:20px 20px 50px rgb(0 0 0 / 15%),
     -0.4em 0.9em 3.2em #f80808eb;
     display: flex;
}

.footerlogo img
{
    height: 60px;
    width: 80px;
    margin: 40px;
}
.address 
{
    margin-left: 40px;
    font-size: 15px;
}
.address .mail
{
    text-decoration: none;
    color: rgb(72, 79, 90);
    font-size: 18px;
}
.itemlinks
{
    margin-left: 170px;
    margin-top: 50px;
}
.itemlinks ul 
{
    margin-top: 20px;
}
.itemlinks ul li
{
    margin-top:5px;
    list-style-type: circle;
    cursor: pointer;
    transition: ease-in-out .5s;
}
.itemlinks ul li:hover
{
    color: #ff0404;
    opacity: .6;
}
.social ul
{
    display: flex;
}
.social ul li
{
    list-style-type:none;    
    font-size: 35px;
    margin-inline:8px;
    transition: ease-in-out .6s;
}
.social ul li:hover
{
    color: #ff0000;
}



/*tablets*/

@media (max-width: 768px)
{
       
    section .img
    {
        height: 450px;
        padding-left: 120px;
        margin-top: 120px;
        
    }
    .hero
    {
        height: 70vh;
        width: 100vw;
    }
    .container h2
    {
        letter-spacing: 5px;
        font-weight: 900;
        font-size: 60px;  
        margin-top: 300px;
        -webkit-text-fill-color: transparent;
        -webkit-text-stroke: 3px rgba(199, 21, 21, 0.863);
        text-align: center;
        z-index: 10;
         
       
    }
    
    .container_para p{
       
        margin-left: 60vw;
        padding-left: 6px;
        color: #cabbbb;
        padding-bottom: 154px;
        font-weight: 600;
        font-size: 8px;
    }
    
    
    .ourstory
    {
        height: 100vh; 
        width: 100%;   
        display: grid;
        margin-top: 6%;
        padding-left: 7%;
        
    }
    .ourtitle img
    {
        border-radius: 10px;
        height: 300px;
        margin-top: 0px;
        margin-left:80px;
    }
   
   
    .ourstoryB
   {
       height: 100vh;
       width: 100vw;
       margin-top: 2%;
       padding-left: 10px;
       display: grid;
       text-align: left;
       
   }
   .ourtitleB img
   {
       margin-top: 60px;
       margin-left: 70px;
       padding: 10px;
       border-radius: 188% 188% 0 0;
   }
    
}




/*mobile*/
@media (max-width:450px){

.menubar li a
{
    color: white;
    font-size: 40px;
    font-weight:900;
    cursor:none;
    z-index: 100;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px rgb(136, 18, 18);
    text-decoration: none;
    
}

.cross 
{
    color:rgba(97, 7, 7, 0.986);
    font-size: 45px;
    cursor:none;
}





    .hero
    {
        height: 100vh;
        width: 100%;
    }

    nav
    {
        padding-top: 14px;
        padding-left:6px;
        border-radius: 10px;
        margin-left: 0px;
        margin-right: 0px;
       
    }
    nav li
    {
        display: inline;
        text-align: center;
        list-style-type: none;
     
    
    }
    nav img
    {
        width:40px;
        height: 30px;
    }
    nav h1
    {
        font-family: 'ARDESTINE';
        letter-spacing: 0px;
        font-size: 20px;
        padding-top: 6px;
    }
    nav .menu i
    {
        position:relative;
        font-size: 35px;
        padding: 6px;
        transition: all .6s;
    }


    .container
    {
        justify-content: center;
        align-items: center;   
    }
    
    .container h2
    {
        letter-spacing: 5px;
        font-weight: 900;
        font-size: 45px;  
        margin-top: 400px;
        -webkit-text-fill-color: transparnt;
        -webkit-text-stroke: 2px rgba(255, 255, 255, 0.863);
        text-align: center;
        z-index: 10;
         
       
    }
    .container h2 span
    {
        -webkit-text-fill-color:#dbd0d0;
    }
    
    .container_para p{
       
        margin-left:4vw;
        padding-left: 6px;
        color: #cabbbb;
        padding-bottom: 0px;
        font-weight: 600;
        font-size: 10px;
    }
    .container_para h2{
        margin-left: 4vw;
        margin-top: 50px;
        padding-left: 6px;
        color: #e7dddd;
        font-size: 18px;
    
    }
    section .img
    {
        height: 350px;
        padding-left: 0px;
        margin-top:70px;
    }

    .ourstory
    {
        height: 100%; 
        width: 100%;   
        display: block;
        margin-top: 20%;
        padding-left: 7%;
        
    }
    
    .ourtitle h1
    {
        font-size: 35px;
        font-size: 600;
        margin-left:0;
        color: white;
        -webkit-text-fill-color: transparent;
        -webkit-text-stroke: 1px;
    }
    .ourtitle h1 span
    {
        color: rgb(199, 21, 21);
    }
    .ourtitleB .x
    {
        font-size: 70px;
    }
    .ourtitle .x,
    .ourtitleC .x
    {
        font-size: 90px;
    }
    
    .ourtitle h3
    {
        
        font-size: 25px;
        line-height: 60px;
        font-weight: 700;
        color: #fff;
    }
     .ourtitle h3 span
     {
        -webkit-text-fill-color: transparent;
        -webkit-text-stroke: 2px;
        font-size: 70px;
        color: rgb(199, 21, 21);
     }
     .ourtitle p
     {
         font-size: 12px;
     }
     .ourtitle img
     {
         border-radius: 10px;
         height: 200px;
         margin-top: 30px;
         margin-left:0px;
     }
     

     .ourstoryB
     {
         height: 100%;
         width: 100%;
         margin-top: 20%;
         padding-left: 0px;
         display: block;
         text-align: left;
         
     }
     .ourtitleB img
     {
         margin-top: 60px;
         margin-left: -10px;
         height: 400px;
         padding: 10px;
         border-radius: 188% 188% 0 0;
     }
      .ourtitleB h1
     {
         font-size: 35px;
         text-align:left;
         padding-left:20px;
         font-size: 600;
         color: white;
         -webkit-text-fill-color: transparent;
         -webkit-text-stroke: 1px;
     }
     .ourtitleB h1 span
     {
         color: rgb(199, 21, 21);
     }
     
     .ourtitleB h3
     {
         
         font-size: 25px;
         text-align:left;
         line-height: 60px;
         font-weight: 700;
         padding-left: 20px;
         color: #fff;
     }
      .ourtitleB h3 span
      {
         -webkit-text-fill-color: transparent;
         -webkit-text-stroke: 2px;
         font-size: 50px;
         color: rgb(199, 21, 21);
      }
      .ourtitleB p
      {  
          margin-left: 20px;
          font-size: 12px;
          text-align: left;
      }

      .ourstoryC
      {
          height: 100%;
          width: 100%;    
          display: block;
          margin-top: 20%;
          padding-left: 4%;
          
      }
      
      .ourtitleC h1
      {
          font-size: 35px;
          font-size: 600;
          margin-left:0;
          color: white;
          -webkit-text-fill-color: transparent;
          -webkit-text-stroke: 1px;
      }
      .ourtitleC h1 span
      {
          color: rgb(199, 21, 21);
      }
      .ourtitleC .x
      {
          font-size: 70px;
      }
      
      .ourtitleC h3
      {
          
          font-size: 25px;
          line-height: 60px;
          font-weight: 700;
          color: #fff;
      }
       .ourtitleC h3 span
       {
          -webkit-text-fill-color: transparent;
          -webkit-text-stroke: 2px;
          font-size: 50px;
          color: rgb(199, 21, 21);
       }
       .ourtitleC p
       {
           font-size: 12px;
       }
       .ourtitleC img
       {
           border-radius: 10px;
           height: 400px;
           margin-top: 10px;
           margin-left:-20px;
       }
        

       .services
       {
           height: 100%;
           width: 100%;    
       }
      .servicehead h2
      {
          text-align: center;
          font-size: 12px;
          margin-top: 20%;
          line-height: 26px;
          color: rgb(145, 141, 141);
      }
      .services h2 span
      {
          -webkit-text-fill-color:transparent;
          -webkit-text-stroke:2px rgb(199, 21, 21);
          font-size: 50px;
          
      }
      .servicehead img
      {
        
          height: 150px;
          opacity: 0.5;
          display: block;
          margin-left: auto;
          margin-right: auto;
          margin-top: 30px;
      }
      
      .servicepara 
      {
          text-align: center;
          padding-top: 20px;
          font-size: 10px;
          margin-left:-15px;
      }
      
      .servicecontent
      {
          height: 100%;
          width: 100%;
      }
        
      .mobile h2
      {
          margin-top: 20%;
          text-align: center;
          font-size: 45px;
          font-weight: 300;
          line-height: 60px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          padding-left: 0px;
          
      }
      .mobile p
      { 
          padding-left: 0px;  
          text-align: center; 
      }
      .mobiledevs
      {
          display: block;
          justify-content: center;
          margin-top: -90px;
      }
      .mobileicon
      {
          display: flex;
          justify-content: center;    
          margin-top: 120px;
          margin-right: 0px;
      
      }
      .mobileicon img
      {
          height: 60px;
          margin-inline: 10px;
          opacity: .7;
          margin-top:40px;
          transition: all .6s;
          cursor: pointer;
      }
      .mobileicon img:hover
      {
          opacity: 1;
          transform: scale(1.4);
      }
      .mobileicon .icon2,
      .mobileicon .icon4
      {
          margin-top: 140px;
      }
      .mob 
      {
          margin-left:20%;
          border-radius: 37px;
          margin-top: 20%;
          box-shadow: rgba(128, 25, 21, 0.575) 0.5em 0.1em 2em -0.4em;
      }

       
      .webdevelopment
      {
          height:100%;
          margin-top: 30%;
      }
      .frontend h2
      {
          margin-top: 40px;
          font-size: 45px;
          font-weight: 300;
          line-height: 60px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          padding-left: 0px;
          text-align: center;
          
      }
      .frontend p
      { 
          padding-left: 0px;   
          text-align: center;
      }
      
      .frontendicons
      {
          display: flex;
          margin-top: 200px;
          margin-left: 0px;
          margin-top: 30px;
      }
      
      .frontendicons img
      {
          height: 60px;
          margin-inline: 10px;
          opacity: .7;
          margin-top:40px;
          transition: all .6s;
          cursor: pointer;   
      }
      .frontendicons .icon7,
      .frontendicons .icon9 
      {
          margin-top: 120px;
      }
      .icon11 
      {
         height: 45px;
          margin-left:165px;
          margin-top: 30px;
          opacity: .7;
          cursor: pointer;
          transition: all 0.5s;
      }
      .lap{
          display:block;
          justify-content: center;
      }
      .lap img
      {
          height: 200px;
          margin-top: 100px;
         margin-left: 15px;
      }
      .layer1
      {
          height: 100%;
      }
      
      .layer2,
      .layer3
      {
          margin-top: 25px;
      }
       
      .backenddevelopment
      {
          display: block;
      }
      .backicons
      {
          display: block;
          margin-left: 80px;
          margin-top: 60px;
      }
      .backend h2
      {
          margin-top: 40px;
          font-size: 45px;
          font-weight: 300;
          line-height: 60px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          padding-left: 0px;
          text-align: center; 
          
      }
      .backend p
      { 
          font-size: 15px;
          padding-left: 0px;
          text-align: center;   
      }
      
      .backicons img
      {
          height: 60px;
          margin-inline:100px;
          margin-top: 20px;
          opacity: .7;
          transition: all .6s;
          cursor: pointer;   
      }
      
      
      .database
      {
          display: block;
      }
      .databaseicons
      {
          display: block;
          margin-left: 80px;
          margin-top: 60px;
      }
      .storage h2
      {
          margin-top: 40px;
          font-size: 45px;
          font-weight: 300;
          line-height: 60px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          padding-left: 0px;
          text-align: center; 
          
      }
      .storage p
      { 
        padding-left: 0px;
        text-align: center;  
          font-size: 14px;
      }
      
      .databaseicons img
      {
          height: 60px;
          margin-inline:100px;
          margin-top: 20px;
          opacity: .7;
          transition: all .6s;
          cursor: pointer;   
      }
      
      .databaseicons img:hover
      {
          opacity: 1;
          transform: scale(1.4);
      }
      
      .clouddevops
      {
          display: block;
      }
      .cloudicons
      {
          display: block;
          margin-left: 80px;
          margin-top: 60px;
      }
      .cloud h2
      {
          margin-top: 40px;
          font-size: 40px;
          font-weight: 300;
          line-height: 60px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          padding-left: 0px;
          text-align: center; ;
          
      }
      
      .cloud p
      { 
        padding-left: 0px;
        text-align: center; 
          font-size: 14px;
      }
      
      .cloudicons img
      {
          height: 60px;
          margin-inline:100px;
          margin-top: 25px;
          opacity: .7;
          transition: all .6s;
          cursor: pointer;   
      }

      .team
      {
          font-size: 40px;
          -webkit-text-stroke: 1px rgb(199, 21, 21);
          -webkit-text-fill-color: transparent;
          margin-top:25%;
      }

       
      .footer
      {
          margin-top: 5rem;
          background: rgb(255 0 0 / 2%);
          height: 100%;
          box-shadow:20px 20px 50px rgb(0 0 0 / 15%),
           -0.4em 0.9em 3.2em #f80808eb;
           display: block;
      }
      
      
      .itemlinks
      {
          margin-left: 50px;
          margin-top: 50px;
      }
      .itemlinks ul 
      {
          margin-top: 20px;
      }
      .itemlinks ul li:hover
      {
          color: #ff0404;
          opacity: .6;
      }
      .social ul
      {
          display: flex;
      }   

          .social ul li
      {
          list-style-type:none;    
          font-size: 35px;
          margin-inline:8px;
          transition: ease-in-out .6s;
      }
      .social ul li:hover
      {
          color: #ff0000;
      }


       
     

    
}