@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap");
html, body {
	background: #fff;
	font-family: "Roboto", sans-serif;
}


.main-content {
	padding-top: 1px;
	padding-bottom: 100px;
}

.flex-center {
	align-items: center;
}
.accordion-button{
	margin-bottom: 10px;
}
.accordion-body {
	margin-top: 15px;
	padding: 25px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 2px 25px -3px rgba(0, 0, 0, 0.1);
	margin-bottom: 10px;
}

.circle-icon {
	height: 50px;
	width: 50px;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #2b4eff;
    border: 5px solid #b2bfff;
	color: #fff;
	margin-left: -20px;
	margin-right: 10px;
	transform: scale(1.2);
}
.accordion-item{
	border: 0px!important;
}
.accordion-button:not(.collapsed){
	border: 0px!important;
	color: #0c63e4;
    background-color: #ffffff;
    box-shadow: inset 0 0px 0 rgb(0 0 0 / 13%);
}
/* dark mode  */

.wrapper {
   position: relative;
   top: 0;
   left: 0;
   width: 10vw;
   height: 15vh;
   display: flex;
   justify-content: center;
   align-items: center;
}
 
.circle {
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
}
 
.btn {
 width: 60px;
 height: 60px;  
 top: 50px;
 background-color: #9d87f5; 
 color: #170514;  
 border: none;
 padding: 8px 16px;
 border-radius: 50%; 
 font-size: 18px;
 cursor: pointer; 
}
 
.dark-mode {
 filter: invert(100%)
}
 