*{
  padding: 0px;
  margin: 0px;
  box-sizing: border-box;
}

body{
font-family: 'Poppins', sans-serif;
overflow-x: hidden;
    font-size: 14px;
    color: #000000;
}

nav{
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: #00539f;
}

 .logo{
  width: 20vw;
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo img{
  width: 150px;
  margin-top: 5px;
}
 .links{
  width: 60vw;
  display: flex;
  justify-content: center;
  align-items: center;

}
 .social{
  width: 20vw;

}
 .social ul{
  display: flex;
  justify-content: center;
  align-items: center;
}



.links ul{
  display: flex;
  justify-content: center;
  align-items: center;
}

.links ul li{
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;

}

 .links ul li a{
  color: white;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding: 20px;
}

 .social ul li{
  list-style: none;
}


.social ul li img{
  width: 20px;
  margin-left: 20px;
}




#burger{
  display: none;
}

#close{
  display: none;
}


#myCarousel{
  width: 100vw;
}







.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}




.footerPart{
  height: 50vh;
  width: 100vw;
  background-color:#00539f;
  display: flex;
  justify-content: center;
  align-items: center;
}




.footerPart .footerfram{
  align-items: baseline;
  display: flex;
  justify-content: space-between;

  width: 100%;
}



.footerPart .footerfram .footer1{
  padding: 10px;
  margin: 0px 2%;

}

.footerPart .footerfram .footer1 h2{
   color: #f6b21e;
   font-size: 20px;
   text-transform: uppercase;

}

.footerPart .footerfram .footer1 li{
   list-style: none;
}

.footerPart .footerfram .footer1 li a{
   color: white;
   text-decoration: none;
   padding: 10px;
}


.ads{
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: black;
  margin: 0;
}

.adinfor h2{
  font-size: 50px;
}

.adinfor p{
  margin-top: 20px;
  text-align: justify;
}
.adinfor button{
  width: 120px;
  height: 40px;
  background-color: #00539f;
  color: white;
  border-radius: 50px;
  border-style: solid;
  border-color: #00539f;
  margin-top: 20px;
}
.adinfor{
  width: 50%;
  padding: 50px 100px;
}

.banner{
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.banner img{
  width: 80%;
}

.info{
    background-color: #F8F9FA;
  padding: 100px;
  text-align: center;
}

.info h2{
  font-size: 50px;
}

.apply{
  background-color: white;
  text-align: center;
  padding: 100px;
}

.apply h2{
  font-size: 50px;
}

.apply .application{
  display: flex;
  justify-content:center;
  align-items: center;
  margin-top: 20px;
}
.apply .application .home{
  background-color: #F8F9FA;
  border-radius: 10px;
  width: 25vw;
  height: 30vh;
  padding: 30px;
  margin-right: 10px;
}

.apply .application .home button{
  width: 100px;
  height: 30px;
  border-radius: 50px;
  background-color:  #00539f;
  color: white;
  margin-top: 10px;
  border-style: solid;
  border-color: #00539f;
}
.apply .application .home img{
    width: 70px;
}


.apply .application .business{
  background-color: #F8F9FA;
  width: 25vw;
  height: 30vh;
  padding: 30px;
  margin-left: 10px;
}

.apply .application .business button{
  width: 100px;
  height: 30px;
  border-radius: 50px;
  background-color:  #00539f;
  color: white;
  margin-top: 10px;
  border-style: solid;
  border-color: #00539f;
}
.apply .application .business img{
    width: 70px;
}







.servies{
    background-color: #F8F9FA;
  text-align: center;
  padding: 100px;
}

.servies h2{
    font-size: 50px;
}



.telecenter{
    background-color: white;
  text-align: center;
  padding: 100px;
}

.telecenter h2{
    font-size: 50px;
}


.telecenter .centers{
  align-items: center;
}

.telecenter .centers input{
  width: 30vw;
  height: 40px;
  border-radius: 20px;
  border-style: solid;
  padding-left: 20px;
  margin-top: 30px;
  margin-right: 10px;
}

.telecenter .centers button{
 background-color: #00539f;
 border-radius: 100px;
 width: 40px;
 height: 40px;
}

.telecenter .centers button img{
  width: 17px;
}

.teleinfo{
  justify-content: center;
  display: flex;
  align-items: center;
  margin-top: 20px;
}

.teleinfo table{
  border-collapse: collapse;
  width: 80vw;
}

.teleinfo table tr th{
  border-collapse: collapse;
  background-color: #00539f;
  color: white;
  border-style: solid;
  border-width: 1px;
}

.teleinfo table tr td{
  padding: 5px 20px;
  text-align: left;
}


.teleinfo table tr:nth-child(even){
  background-color: #F8F9FA;
}

.social a button{
  background-color: #f6b21e;
  color: black;
  width: 130px;
  padding: 7px;
  outline: none;
  border-color: #f6b21e;
  border-style: solid;
  border-radius: 20px;
}

#home img{
  width: 50px;
}

#home {
  display: none;
}



#homed {
  display: flex;
}



.social{
  display: flex;
  justify-content: center;
  align-items: center;
}
.social a{
  text-decoration: none;
}
#burg{
  height: 100%;
  border-style: none;
  background-color:transparent;
  display: none;
}


#close{
  height: 100%;
  border-style: none;
  background-color:transparent;
  display: none;
}

nav li img{
  width: 70%;
  display: none;
}

#links li a{
  justify-content: center;
  text-align: center;
  align-items:center;

}
#links li a button{
  display: none;
}


td a button{
  background-color: #f6b21e;
  color: black;
  border-style: none;
  padding: 5px 10px;
  width: 80px;
}

.dropbtn {
  background-color: transparent;
  color: white;
  border: none;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  color: black;
  z-index: 1;
  width: 160px;
  text-align: left;
  padding: 0px;
  height: 100px;
}



.dropdown-content a {

  text-decoration: none;
  text-align: justify;
  display: block;
  background-color:#00539f;
  height: 33px;
  text-align: left;
  align-items: center;
  display: flex;
  color: white;


}

.dropdown-content a:hover {background-color: red;
color: black;}

.dropdown:hover .dropdown-content {display: block;}



#self{
  text-align: left;

}



.container{
  height: 90vh;
}

.container .item{
  height: 90vh;
}


.container .left{
  background-color: transparent;
  opacity: 1;
}




.sr-only{
  background-color: red;
}

.report form{

  padding: 50px;
}
.report form .personal-details{
  padding: 20px;
}
.given button{
  width: 150px;
  height: 30px;
}
.personal section{
  display: flex;
  text-align: left;
}

.personal section p{
  width: 150px;
}

.personal .personal-details button{
  float: right;
  width: 100px;
  height: 25px;
}

.personal .personal-details input{
  float: right;
  width: 300px;
}

.report form .personal-details{
  padding: 20px;
}



.report form .repo{
  padding: 20px;
}
.personal .repo button{
  float: right;
  width: 100px;
  height: 25px;
}
.personal .repo select{
  float: right;
  width: 300px;
}


.report form .repo-type{
  padding: 20px;
}
.personal .repo-type button{
  float: right;
  width: 100px;
  height: 25px;
}

.personal .repo-type input{
  width: 300px;
}
.personal .repo-type textarea{

  width: 300px;
}



.informaton{
  padding: 50px 200px;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.informaton p{
  text-align: justify;
}

.informaton h2{
  font-size: 50px;
}

.informaton .controls{
  justify-content:center;
  display: flex;
}
.informaton .controls button{
  width: 250px;
  padding: 10px 20px;
  border-style: solid;
}




#dropdown-list{
  position:absolute;
  display: none;
  top: 55px;
  color: white;
  list-style: none;
  background-color: black;
  z-index: 5;
}

#dropdown-list li{
  text-decoration: none;
  list-style: none;
  margin-left: 0px;
}

#dropdown-list li a{
 color: black;
 margin-left: 0px;
 text-decoration: none;
 display: flex;
 justify-content: center;
 align-items: center;
 margin-top: 0px;
 background-color: #F1F3F4;
 width: 100%;
 padding: 10px 20px;
}

.menu-item{
  background-color: black;
}
.homes{
  height: 100%;
}

#dropdown-list li a {
  position: relative;
}

#dropdown-list li a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    border-radius: 4px;
    background-color: #18272F;
    bottom: 0;
    left: 0;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .3s ease-in-out;
  }

#dropdown-list li a:hover::before {
  transform-origin: left;
  transform: scaleX(1);
}


#dropdown-list2{
  position:absolute;
  display: none;
  top: 80px;
  color: white;
  list-style: none;
  background-color: black;
  z-index: 5;
}

#dropdown-list2 li{
  text-decoration: none;
  list-style: none;
  margin-left: 0px;
}

#dropdown-list2 li a{
 color: black;
 margin-left: 0px;
 text-decoration: none;
 display: flex;
 justify-content: center;
 align-items: center;
 margin-top: 0px;
 background-color: #F1F3F4;
 width: 100%;
 padding: 10px 20px;
}





#dropdown-list2 li a {
  position: relative;
}

#dropdown-list2 li a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    border-radius: 4px;
    background-color: #18272F;
    bottom: 0;
    left: 0;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .3s ease-in-out;
  }

#dropdown-list2 li a:hover::before {
  transform-origin: left;
  transform: scaleX(1);
}




.ppackages{
  display: flex;
  justify-content: center;
  align-items: center;

}

.phoneimage{
  display: flex;
  align-items: center;
  justify-content: center;
}

.phoneimage .phonep{
  position:absolute;
  margin-left: -100px;
  background-color: #f6b21e;
  color: white;
  bottom: 0px;
  padding: 20px;
  border-radius: 20px 20px 0px 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}




.phoneimage .brand{
  position:absolute;
  color: white;
  top: 0px;
  display: flex;
  justify-content:left;
  align-items: center;
  height: auto;
}

.phoneimage #brand img{
  width: 50%;
}


.phoneimage .phonep h1{
   font-size: 80px;
   
}
.ppackages a{
  text-decoration: none;
  color: black;
}

.ppackages a .p1{
  background-color: white;
  margin: 10px;
  width: 250px;
  transition: all 0.5s ease;
  border-radius: 20px;
  border-style: solid;
  border-color: white;
  -webkit-box-shadow: 9px 11px 15px -8px rgba(0, 0, 0, 0.3); 
box-shadow: 9px 11px 15px -8px rgba(0, 0, 0, 0.3);
}


.ppackages a .p1 h3{
  font-size: 18px;
}
.ppackages a .p1 li{
  list-style: none;
  text-align: center;
  padding: 2px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ppackages a .p1 li p{
  font-size: 12px;
}

.ppackages a .p1 ul{
  padding: 20px;
}

.ppackages a .p1 button{
  background-color: #f6b21e;
  width: 100px;
  height: 30px;
  border-color: black;
  border-style: solid;
  display: none;
}

#telephony h2{
  padding: 30px 0px;
}
.p1price{
  display: flex;
  justify-content: center;
  align-items: center;

}

.p1price .price{
  font-size: 30px;
  text-align: center;
  background-image: url('../img/content/ezgif.com-gif-maker.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  padding: 20px;
  border-radius: 20px;
  border-style: none;
  border-color: white;
  -webkit-box-shadow: -1px 11px 15px -8px rgba(0, 0, 0, 0.3); 
box-shadow: -1px 11px 15px -8px rgba(0, 0, 0, 0.3);
}
.p1price .price .amount{
  font-size: 60px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;

}

.p1price .unite{
  font-size: 20px;
}

.am{
  padding: 30px;
  font-weight: bolder;
  color: #f6b21e;
}
#month{
  font-size: 15px;
  text-align: center;
  color: black;
}


#toll{
  padding-top: 50px;
}


.ppackages a .p1:hover {
  transform: scale(1.1);
  transition: all 0.5s ease-in-out;
}


#adsl, #leased, #isdn, #pabx11, #myspot{
  display: none;
}


#adsl h1{
  padding: 30px 0px;
  font-size: 50px;
}


.handphone{
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: white;
  filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.3));
  border-radius: 20px;
  border-color: white;
  border-style: solid;
}
.handphone .phoneimage{
  background-image: url('../img/content/ezgif.com-gif-maker.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 600px;
  height: 700px;
}
.handphone .phoneimage img{
  width: 500px;
  padding: 50px;
}

.handphone #phonespec{
  height: 100%;
}


.handphone #phonespec li{
  list-style:none;
  text-align: left;
}

.location{
  text-align: right;
  float: right;
}
.location button{
  background-color: #f6b21e;
  padding: 20px 20px;
  height: 30px;
  border-color: black;
  align-items: center;
  display: flex;
  border-style: solid;
  margin-right: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
}


.pp{
  text-align: left;
  padding: 0px 50px;
}

.pp ul{
  padding-left: 20px;
}

.pp .sservice{
  padding: 20px 50px;
  background-color: white;
  filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.3));
  border-radius: 20px;
  border-color: white;
  border-style: solid;
} 


.pp h3{
  font-size: 50px;
  text-align: center;
  padding: 30px 0px;
}

.pp h4{
  margin-top: 20px;
  font-weight: bold;
  width: 50%;
  text-transform: uppercase;
  font-size: 1.17em;
}



.parts{
  display: flex;
  justify-content: center;
  align-items: baseline;
  color: white;
}

.parts h6{
  font-size: 20px;
}

.parts .part1{
  width: 30%;
  padding: 50px;
}


.parts .part2{
  width: 20%;
  padding: 50px;
}

.parts .part2 li{
  list-style: none;
}
.parts .part2 li a{
  color: white;
  text-decoration: none;
}

.parts .part3{
  width: 20%;
  padding: 50px;
}

.parts .part3 a{
  color: #f6b21e;
  text-decoration: none;
}


.parts .part4{
  width: 20%;
  padding: 50px;
}


.parts .part4 li{
  list-style: none;
}
.parts .part4 li a{
  color: white;
  text-decoration: none;
}

.pricephone{
  display: flex;
  justify-content: space-between;
  width: 600px;
}

#business{
  cursor: pointer;
}





.mobilenav{
  position: fixed;
  background-color:white;
  min-height: 100vh;
  right: 0px;
  display: none;

}
.mobilenav a{
  color: black;
  text-decoration: none;

}

.mobilenav .fulllogo{
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  padding: 20px;
}

.mobilenav .buttonspace{
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  padding: 10px 50px;
}


.mobilenav .buttonspace button{
  padding: 5px 30px;
  background-color: #f6b21e;
  color: black;
  border-radius: 50px;
  outline: none;
  border-style: solid;
  border-color: #f6b21e;

} 

.mobilenav .fulllogo img{
  width: 100px;
}


.mobilenav .linkspace ul li{
  width: 100%;
}



.mobilenav .linkspace ul li section ul li a{
  padding: 0px 4rem;

}
.mobilenav ul li{
  list-style: none;

}
.mainnavlist{
  padding: 15px 20px;
}
#bu li{
  background-color: #f5f5f5;
  padding: 10px;
}

#pu li{
  background-color: #f5f5f5;
  padding: 10px;
}


.introwallpaper{
  height: 70vh;
  width: 100vw;
  background-image: url('../img/content/top-view-wi-fi-router-with-wireless-controlled-devices.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}

.introwallpaper h1{
  color: black;
  font-size: 100px;
}

.devicename{
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
.devicename h3{
  font-size: 30px;
  padding: 0px;
  text-align: left;
}
.devicename p{
  font-size: 12px;
  padding: 0px;
}
.ranks{
  text-align: left;
  padding: 0px 20px;
}
.ranks img{
  width: 30px;
}

.description{
  text-align: left;
  padding: 40px 20px;
}

.pricespecification{
  text-align: left;
  padding: 0px 20px;
}

.pricespecification li{
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.colors{
  text-align: left;
  padding: 30px 20px;
  
}

.colors .avaicolors{
  display: flex;
}
.colors .avaicolors .black{
  background-color: black;
  width: 30px;
  height: 30px;
  border-radius: 20px;
  border-style: solid;
  border-color: black;
}
.colors .avaicolors .white{
  background-color: white;
  width: 30px;
  height: 30px;
  border-radius: 20px;
  border-style: solid;
  border-color: black;
  margin: 0px 30px;
}
.colors .avaicolors .gray{
  background-color: gray;
  width: 30px;
  height: 30px;
  border-radius: 20px;
  border-style: solid;
  border-color: black;
}

.productbuttons{
  display: flex;
  padding: 0px 20px;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 50px;
}

.productbuttons button{
  padding: 10px 50px;
  border-radius: 5px;
  border-style: solid;
  background-color: #f6b21e;
  border-color: #f6b21e;
  color: white;
  
}

.productbuttons #anyTelecenter{
  width: 20vw;
}
#telephony table{
  width: 100%;
}


.bill {
  width: 100vw;
  min-height: 700px;
  height: 100vh;
  position: fixed;
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
  top: 0%;
}
.bill .close img{
  width: 24px;
}
.bill .close button{
  border-style: none;
  background-color: transparent;
  float: right;
}

.data{
  width: 100vw;
  min-height: 700px;
  height: 100vh;
  position: fixed;
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
  top: 0%;
}

.data .close img{
  width: 24px;
}
.data .close button{
  border-style: none;
  background-color: transparent;
  float: right;
}

.status{
  width: 100vw;
  min-height: 700px;
  height: 100vh;
  position: fixed;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
  top: 0%;
}

.status .close img{
  width: 24px;
}
.status .close button{
  border-style: none;
  background-color: transparent;
  float: right;
}

.status .testfeedback{
  display: flex;
  justify-content:space-between;
  align-items: center;
}


.cont_space{
  background-color: white;
  border-style: solid;
  border-color: #f6b21e;
  padding: 20px;
}


.cartin{
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0%;
  /* From https://css.glass */
  background: rgba(255, 255, 255, 0.07);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(13.5px);
  -webkit-backdrop-filter: blur(13.5px);
  z-index: 2;
  display: none;
}



.group{
  position: absolute;
  right: 5%;
  top: 12vh;
  margin-top: 10vh;
  z-index: 3;
  }
  .group img{
    width: 24px;
  }
  
  .group .morelinks .link{
    padding: 2%;
    width: 48px;
    height: 48px;
    background-color: white;
    text-align: center;
    border-radius: 100%;
    color: black;
    margin: 5px 0px;
    border-style: solid;
    border-color: #f6b21e;
    border-width: 2px;
    position: relative;
    z-index: 4;
  }
  .group .morelinks .link img{
    margin-top: 10px;
  }
  
  .group .morelinks .link a:hover{
    text-decoration: none;
  }
  
  .group button{
    width: 48px;
    height: 48px;
    background-color: #f6b21e;
    text-align: center;
    border-radius: 100%;
    color: white;
    border-style: solid;
    border-color: #f6b21e;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .group button img{
    filter: invert(100%);
  }
  .group .morelinks p{
   font-size: 12px;
   position: absolute;
   width: 200px;
   right: 40px;
   margin-top: -27px;
   text-align: right;
   color: black;
   justify-content:end;
   display: flex;
   align-items:center;
   padding: 5px 20px;
   z-index: -4;
  }
  .mobilenav .linkspace img{
    width: 24px;
    margin-right: 5px;
  }
  
  #morelinkholder{
    height: 55vh;
  }
  
  #hideButton{
    display: none;
  }
  
  #morelinks{
    display: none;
  }
  
  



  .cont_space{
    min-height: 500px;
    min-width: 300px;
    background-color: #F1F3F4;
    padding: 20px;
  }
  
    a:hover{
      text-decoration: none;
    }
    .status .info h2{
      font-size: 20px;
      font-family: 'Montserrat', sans-serif;
    }
    
    
    
    
    .status .infor{
      padding:0%;
      font-family: 'Arial', sans-serif;
    }
    .status .infor input{
      width: 100%;
      padding: 5px 10px;
      border-radius: 50px;
      border-style: solid;
      outline: none;
      border-width: 1px;
    }
  
  
    .status .infor progress{
      width: 100%;
    }
    
    .status .infor .search{
      margin: 20px 0px;
      display: flex;
      justify-content: space-between;
  
    }
    .status .infor .progressbar .count{
        display: flex;
        justify-content: space-between;
    }
    
    .status .infor .search button{
        background-color: #f6b21e;
        color: white;
        padding: 10px;
        width: 150px;
        border-style: none;
        border-radius: 20px;
    }
    
    .status .infor .returnSearch{
      min-height: 30vh;
      padding: 10px 0px;
      overflow-y: auto;
    }
    .status .infor .returnSearch table{
        width: 100%;
    }
  
    .status .infor .returnSearch table tr th{
        background-color: #1d4c93;
        color: white;
        padding: 5px;
        color: 12px;
    }
    
    .status .infor .returnSearch span{
      color: lightgray;
      font-style: italic;
    }
  
  
    .status .telephoneholder{
        display: flex;
        align-items:center;
        margin-top: 50px;
    }
  
    .status .telephoneholder p{
        font-weight: bold;
    }
  
  
    
    .data .infor .returnSearch{
      min-height: 30vh;
      display: flex;
      justify-content:center;
      align-items: center;
      padding: 10px 0px;
      overflow-y: auto;
    }
    
    .data .infor .returnSearch span{
      color: lightgray;
      font-style: italic;
    }
    
    .data .infor{
      padding:0%;
    }
    .data .infor input{
      width: 100%;
      padding: 5px 10px;
      border-radius: 10px;
      border-style: solid;
      outline: none;
      border-width: 1px;
    }
    .bill .infor input{
      width: 100%;
      padding: 5px 10px;
      border-radius: 10px;
      border-style: solid;
      outline: none;
      border-width: 1px;
    }
    
    .bill .modal-body {
      position: relative;
      padding: 15px;
      height: auto;
      height: 50vh;
    }
    .bill{
      color: black;
    }
    .bill .modal-content {
      position: relative; 
      background-color: transparent; 
      background-clip: padding-box; 
      border: none; 
      border-radius: 0px; 
      -webkit-box-shadow: 0 3px 9px rgb(0 0 0 / 0%); 
      box-shadow: 0 3px 9pxrgba(0,0,0,0);
      outline: 0; 
    }
    .bill .login_content {
      margin: 0 auto;
      padding: 5px 0 0;
      position: relative;
      text-align: center;
      text-shadow: unset;
      min-width: auto;
    }
    
    .bill .login_content form {
      margin: 0px 0;
      position: relative;
    }
    
    #cellphone{
      width: 100%;
      padding: 5px 10px;
      border-radius: 10px;
      border-style: solid;
      outline: none;
      border-width: 1px;
      box-shadow: 0 1px 0 #fff, 0 -2px 5px rgb(0 0 0 / 0%) inset;
    }
    #telephone{
      width: 100%;
      padding: 5px 10px;
      border-radius: 10px;
      border-style: solid;
      outline: none;
      border-width: 1px;
      box-shadow: 0 1px 0 #fff, 0 -2px 5px rgb(0 0 0 / 0%) inset;
    }
    #next{
      background-color: #f6b21e;
      color: white;
      border-radius: 10px;
    }
    #confirm{
      background-color: #f6b21e;
      color: white;
      margin-right: 5px;
      border-radius: 10px;
    }
    #hol_name{
      margin-top: 10px;
    }
    
    #backbtn{
      background-color: rgb(202, 202, 202);
      color: black;
      margin-left: 5px;
      border-radius: 10px;
      
    }
    
    .bill .login_content form div a {
      font-size: 12px;
      margin: 0px;
      width: 100%;
    }
    .bill .login_content .twobuttons{
      display: flex;
      justify-content: space-between;
      margin-top: 10px;
    }
    .bill .login_content .feebackcontent p{
      margin-top: 10px;
    }
    .bill .login_content .feebackcontent{
      background-color: #F1F2F4;
      padding: 10px 5px;
      margin-bottom: 20px;
      border-radius: 10px;
    }
    
    .linespacer{
      width: 100%;
      height: 1px;
      background-color: #DADCE0;
    }
  
  
    .phonebook{
      width: 100vw;
      min-height: 700px;
      height: 100vh;
      position: fixed;
      z-index: 5;
      display: none;
      justify-content: center;
      align-items: center;
      font-family: 'arial', sans-serif;
      top: 0%;
    }
  
    .phonebook .search{
      margin: 20px 0px;
    }
    
    .phonebook .close img{
      width: 24px;
    }
    .phonebook .close button{
      border-style: none;
      background-color: transparent;
      float: right;
    }
  
  .phonebook .infor .returnSearch{
      min-height: 30vh;
      display: flex;
      justify-content:center;
      align-items: center;
      padding: 10px 0px;
      overflow-y: auto;
    }
    
    .phonebook .infor .returnSearch span{
      color: lightgray;
      font-style: italic;
    }
    
    .phonebook .infor{
      padding:0%;
    }
    .phonebook .infor input{
      width: 100%;
      padding: 5px 10px;
      border-radius: 10px;
      border-style: solid;
      outline: none;
      border-width: 1px;
    }
  
    #surname{
      margin-left: 10px;
    }
  
  
    .returnBook{
      height: 400px;
      overflow-y: auto;
    }
    
    .returnBook table{
      width: 100%;
      font-size: 12px;
    }
    .returnBook table thead{
      background-color: #1d4c93;
      color: white;
    }
  
 





@media screen and (max-width:1080px){
  nav{
    height: 50px;
    position: fixed;
    z-index: 6;
    filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.3));
    
  }
  nav .logo a{
    color: black;
    text-decoration: none;
  }
  h2{
    font-size: 20px;
  }
  h3{
    font-size: 12px;
  }
  p{
    font-size: 12px;
  }
  #login{
    display: none;
  }
  #burg{
    display: flex;
  }
  #links{
    display: none;
  }
  #homed{
    display: none;
    
  }
  #home{
    display: flex;
    
  }
  #home h1{
    font-size: 1.5rem;
    color: white;
  }
.logo{
  width: 40vw;
  
}
  .links{
    width: 40vw;
  }

  .social img{
    filter: invert(100%);
    width: 24px;
  }
  

  
  .introwallpaper{
    height: 70vh;
    width: 100vw;
    background: url('../img/content/top-view-wi-fi-router-with-wireless-controlled-devices - Copy.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

  }
  .introwallpaper h1{
    display: none;
  }

  #part1{
    margin-left: -50px;
  }




  .footerPart{
    display: block;
    height: auto;
  }
  .footerPart .parts{
    display:none;
    height: auto;
  }
  .footerPart .parts .part1{
    display: flex;
    width: auto;
  }
  
  


  .mobilenav .linkspace ul li details summary {
    display: unset;
    counter-increment: list-item 0;
    list-style: inside disclosure-closed;
    list-style-position: inside;
    list-style-image: initial;
    list-style-type: disclosure-closed;
  
}

.decoration1{
  display: none;
}
.decoration{
  display: none;
}


.informaton{
  padding: 55px 20px;

}


#control1{
  font-size: 20px;
}
#control2{
  font-size: 20px;
}
#control6{
  font-size: 20px;
}


.package .ppackages .handphone {
  display: block;
  width: 100%;
}


.package .ppackages .handphone p{
  font-size: 1rem;
}
.package .ppackages .handphone h3{
  font-size: 15px;
}
.package .ppackages .handphone li{
  font-size: 1rem;
}

.package .ppackages .handphone .location{
  width: 100%;
  background-color: #F1F3F4;
}
.package .ppackages .handphone .location button{
  font-size: 1rem;
  margin: 20px;
}

.package #adslp{
  display: block;
}
.package #adslp a{
  display: flex;
  align-content: center;
  justify-content: center;
}

.package #adslp a .p1 {
  margin: 10px;
  width: 400px;
  height: 600px;
}
.package #adslp a .p1 p{
  font-size: 20px;
}

.p1price .price {
  height: 400px;
}

.package #hh{
  font-size: 40px;
}

.package #adslp a .p1 .p1price .price .amount{
  height: 75%;
}

.package #adslp a .p1 .p1price .price h3{
  font-size: 25px;
}

.package #adslp a .p1 .p1price .price .calltoaction button{
  width: 300px;
  height: auto;
  padding: 10px;
  font-size: 20px;

}
.package #adslp a .p1 .p1price .price .amount .am p{
  font-size: 70px;
}
.package #adslp a .p1 .p1price .price .amount .am #month{
  font-size: 20px;
}

.space{
  height: 100px;
  width: 100%;
}
.informaton .packages .package .pp h4{
  font-size: 20px;
  width: 100%;
}
.informaton .packages .package .pp p{
 font-size: 7px;
}


.phoneimage .phonep{
  margin-top: -350px;
  margin-left: 100px;
}


.phoneimage .phonep {
  margin-top: 92%;
  bottom: unset;
  right: 20px;

}

.floatback{
  transform: scale(1.5);
  margin-right: 5vw;
  display: none;
}







  .controls img{
    display: flex;
  }
  .controls p{
    display: none;
  }

  .informaton .controls button {
    border-style: solid;
    border-width: 1px;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
}

.controls button img{
  width: 24px;
}

#control1{
  background-color: #00539f;
  border-color: #00539f;
  color: white;
  border-right-style: solid;
  border-left-style: solid;
}
#control2{
  background-color: #F1F3F4;
  border-color: #00539f;
  border-left-style: solid;
  border-right-style: solid;
  border-top-style: solid;
  border-bottom-style: solid;
   
}
#control3{
  background-color: #F1F3F4;
  border-color: #00539f;
  border-left-style: solid;
  border-right-style: solid;
}
#control4{
  background-color: #F1F3F4;
  border-color: #00539f;
  border-left-style: solid;
  border-right-style: solid;
}
#control5{
  background-color: #F1F3F4;
  border-color: #00539f;
  border-right-style: solid;
  border-left-style: solid;
}
#control6{
  background-color: #F1F3F4;
  border-color: #00539f;
  border-left-style: solid;
}
.handphone .phoneimage img {
  width: 100%;
  padding: 20px;
}

.handphone .phoneimage {
  min-height: unset;
  height: unset; 
  border-radius: 20px 20px 0px 0px;
}

.description {
  text-align: left;
  padding: 20px;
}
.colors {
  text-align: left;
  padding:20px;
}
.productbuttons #anyTelecenter {
  width: 100%;
  font-size: 1.3rem;
}

.informaton h2 {
  font-size: 25px;
  padding-top: 30px;
}
.controls {
  padding-top: 10px;
  background-color: #F1F3F4;
  height: 60px;
  border-radius: 50px;
}
.am {
  padding:0px 30px;
  font-weight: bolder;
}
.am p{
  font-size: 50px;
}
.ppackages a .p1 h3 {
  font-size: 25px;
  color: black;
}

.packages #leased .ppackages a .p1{
  height: auto;
  width: 25vw;
  height: auto;
  border-radius: 20px;
    border-style: solid;
    border-color: white;
    -webkit-box-shadow: none;
    box-shadow:  rgb(0 0 0 / 0%);;
}

#toll {
  padding-top: unset;
}

#phonespec .description, .productbuttons, .colors, .pricespecification{
  display: none;
}

#phonespec{
  padding-bottom: 40px;
}

#telephony h2{
  padding-top: 30px;
  padding-bottom: unset;
}

#telephony h4{
  font-size: 12px;
  padding-bottom: 30px;
}

#adsl h4{
  font-size: 12px;
  padding-bottom: 30px;
}
#telephony .phoneimage .phonep h1 {
  font-size: 30px;
}

#telephony .phoneimage .phonep {
  position: absolute;
  background-color: #F1F3F4;
  color: black;
  padding: 0px 25px;
  border-radius: 00px 00px 20px 20px;

}

.handphone {
  background-color: white;
  filter:unset;
  border-color: #F1F3F4;
}

#pabx11 #listitems {
  display: block;
  justify-content: space-around;
  align-items: center;
  font-size: 12px;
}

.spacer {
  margin-top: 30px;
}




.sidefloat{
  display: none;
}
.group{
  margin-top: unset;

  }

  .phonebook .infor table thead tr th {
    padding: 5px;
  }
  
  .cont_space {
    min-height: 500px;
    min-width: 90vw;
    background-color: white;
    padding: 20px;
  }


.back-to-top{
  display: none;
}

#phonep1{
  margin-top: 88%;
}

#phonep2{
  margin-top: 102%;
}

#phonep3{
  margin-top: 102%;
}

.mobilenav{
  width: 65vw;
  font-size: 30px;
  z-index: 5;
  filter: drop-shadow(10px 10px 250px rgba(0,0,0,0.7));
}

.mobilenav .fulllogo img{
  width: 100%;
  padding-top: 7vh;
}

.mobilenav .buttonspace button{
  font-size: 12px;
}
.mobilenav .linkspace{
  font-size: 12px;
}



}