@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');


*, *::before, *::after{
  box-sizing: border-box;
}

body{
  font-family: 'Lato', sans-serif;
 /*  background-color: #ded2ff; */
  color: #42225e;
  margin:0;
}

html{
  background:#D2E7EA;
}


.pointer{
  cursor:pointer;
}



/* Start FAQ */

h1{
  padding: 70px 0 30px;
  text-align: center;
  margin-top:0px;
  
}

.faq-container{
  max-width: 600px;
  margin: 0 auto;
  margin-bottom:180px;

}


.faq{
  background-color: transparent;
  border: 1px solid #A555EC;
  border-radius: 10px;
  padding: 30px;
  margin: 20px 0;
  position: relative;
  overflow: hidden;
  transition: all .4s ease;
  cursor:pointer;
}

.faq.active{
  background-color: #D2E7EA;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
}

.faq-title{
  margin: 0 35px 0 0;

}

.faq-text{
  display: none;
  margin: 30px 0 0;
}

.faq.active .faq-text{
  display: block;
}

.faq-toggle {
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  position: absolute;
  top: 30px;
  right: 30px;
  height: 30px;
  width: 30px;
}

.chevron, .close{
  width: 12px;
  height:12px;
}

.faq-toggle .close{
  display: none;
} 

.faq.active .faq-toggle .close{
  display: block;
}

.faq.active .faq-toggle .chevron{
  display: none;
}

.faq.active .faq-toggle{
  background-color: #A555EC;
  border-radius: 50%;
  color:#ffffd9;
}

/* End FAQ */

/* Start List */



    .scroll-container {
        max-height: 300px; 
        overflow-y: auto;
        border: 1px solid #ccc; 
    }
    

    .scroll-item {
        padding: 10px;
        border-bottom: 1px solid #eee; 
    }


/* End List */


/* Color Input */





/* End Color Input */



/* Start DropDown */

.color-picker{
  display:inline-block;
}

.pcr-button{
  
  width:30px !important;
  height:15px !important;
  vertical-align:middle;
  margin:0px 3px 1.4px 3px;
 
}
.pickr{
  border: 1px solid black !important;
   width:38px;
   align-items:center;
   margin:auto;
   border-radius:2px;
   display: inline-block;
    vertical-align:middle;
}

 .map-custom-control{
      pointer-events: auto !important;
}
#dropdownSearchButton{
  cursor: pointer;
  margin-left: 8px;
  margin-top:8px;
   border: none;
    outline:none;
}

.controlBtn{
  width:29px;
  height:29px;
  padding:0;
  border-radius: 6px;
  background:#ffffff;
}

.controlBtn:hover{
 background:rgb(242,242,242);
}

.controlSvg{
  width:10px;
  height:10px;

}



#dropDownWrap{
  width:180px;
   height:200px;
   background:white;
   margin-left:10px;
   margin-top:10px;
   border-radius: 6px;
   border:1px solid black;


@media (max-width: 700px) {
     width:140px;
  }  
}

.hide{
  display:none !important;
}

.topText{
  font-size:20px;
  margin-top:10px;
  margin-left:10px;
  margin-bottom:10px;

}

.colorContain{

  margin:0px 10px 10px 10px;

  padding: 5px 0px 5px 5px;

  border:1px solid black;
  border-radius:5px;
    vertical-align:middle;

  
  

}

.cText{
  vertical-align:middle;
  height:19px;
  display:inline-block;
  margin-right:6px;
}

.color{
  vertical-align:middle;
   height:25px;
}


.opasContain{

  margin:0px 10px 10px 10px;

  padding: 5px 5px 5px 5px;

  border:1px solid black;
  border-radius:5px;
  

}

.opasInput{
  width:100%;
    border-radius:3px;
    outline:none;
    border:1px solid gray;
    padding:5px;
}


.eqContain{

  margin:0px 10px 10px 10px;

  padding: 5px 0px 5px 5px;

  border:1px solid black;
  border-radius:5px;
  

}

.middle{
    vertical-align:middle;
}

/* End DropDown */