/*---------------

COLOR : #74c209;

--------------*/


.swal2-container {
  z-index: 10000 !important;
}

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

*:focus {
	outline: 0 !important;
}


@font-face {
	font-family: circularstd-medium;
	src: url(../fonts/CircularStd-Medium.ttf);
}





html, 
body {
	font-family: 'circularstd-medium', serif;
	scroll-behavior: smooth;
	margin: 0!important;
	padding: 0!important;
  width: 100%;
	font-smoothing:antialiased;
}

body{
	overflow-x: hidden;
}

a{
	text-decoration: none !important;
	cursor: pointer;
}


#Python{
	display: flex;
}


.navbar{
	display: none;
}



.Sidebar{
	width: 28%;
	border-right: 2px solid #e8edf2;
	min-height: 100vh;
	padding-top: 1.5vw;
	padding-left: 17vw;
	padding-right: 1vw;
}

.Sidebar .logo{
 width: 10vw;
 margin-bottom: 1.5vw;
}

.Sidebar ul{
	list-style-type: none;
}

.Sidebar ul .active{
	 background-color: #0099FF;
}

.Sidebar ul .active a{
	 color: #FFFFFF;
}


.Sidebar ul li{
  border-radius: 0.2vw;
  padding: 0.5vw 1vw;
  margin-bottom: 0.2vw;
}

.Sidebar ul li:hover{
 background-color: #0099FF;
 transition: 0.5s;
}

.Sidebar ul li:hover a{
	color: #ffffff;
	transition: 0.5s;
}

.Sidebar ul li a{
  color: #000000;
  font-size: 0.8vw;
}

.Sidebar ul li a img{
 width: 0.8vw;
 margin-right: 0.8vw;
}


.Sidebar .other-p{
	font-size: 0.8vw;
	position: relative;
	margin-top: 2vw;
}

.Sidebar .other-p img{
	width: 6vw;
	margin-left: 0.5vw;
}

.Sidebar .logout-btn{
	margin-top: 7vw;
	font-size: 0.8vw;
	margin-left: 1vw;
	background-color: transparent;
	border: none;
}

.Sidebar .logout-btn img{
	width: 0.8vw;
	margin-right: 0.5vw;
}


.Sidebar hr{
	border-top: 2px solid #e8edf2;
}


.Sidebar h4{
	font-size: 0.6vw;
	font-weight: bolder;
	margin-top: 2vw;
	margin-left: 0.5vw;
}

.Sidebar h5{
 font-size: 0.6vw;
 margin-left: 0.5vw;
}



.Middle{
	width: 39%;
	border-right: 2px solid #e8edf2;
	min-height: 100vh;
	padding-top: 1.5vw;
	padding-left: 1.5vw;
	padding-right: 1.5vw;
}


.Middle h1{
	position: relative;
 font-weight: bolder;
 font-size: 1.4vw;
 	padding-left: 5vw;
}


.Middle h1 img{
	position: absolute;
  left: 0vw;
  width: 4vw;
  height: 4vw;
  border-radius: 50%;
}

.Middle h1 span{
	color: #0099FF;
}


.Middle  .main-p{
	padding-left: 5vw;
	margin-top: -0.2vw;
	color: #778BA1;
	font-size: 0.7vw;
}

.Middle  .main-p a{
color: #0099FF;
text-decoration: underline;
}



.Middle .current-div{
	background-color: #f3f5f9;	
	padding: 0.5vw 1vw;
	border-radius: 0.4vw;
}

.Middle .current-div p{
  font-size: 0.6vw;
  color: #778BA1;
}

.Middle .current-div h2{
	color: #0099FF;
	font-size: 0.8vw;
	font-weight: bolder;
	margin-top: -0.8vw;
}


.Middle .current-div button{
	float: right;
	background-color: #0099FF;
	width: 2vw;
	height: 2vw;
	border: none;
	margin-top: -2.1vw;
	border-radius: 0.5vw;
}

.Middle .current-div button img{
	width: 1vw;

}


.Middle .green-div{
	background-color: #e8f8f2;
	margin-top: 2vw;
	border-radius: 0.4vw;
	padding: 1vw 1.5vw;
}

.Middle .green-div p{
font-size: 0.6vw;
color: #778BA1;
}

.Middle .green-div h2{
	font-weight: bolder;
	font-size: 1vw;
	margin-top: -0.8vw;
}

.Middle .green-div img{
	width: 100%;
	margin-top: 1.5vw;
}


.Middle .white-div{
	border-radius: 0.4vw;
	border: 2px solid #f3f5f9;
	margin-top: 2vw;
	padding: 1.5vw 1.5vw;
}

.Middle .white-div p{
font-size: 0.6vw;
color: #778BA1;
}

.Middle .white-div h2{
	font-weight: bolder;
	font-size: 1vw;
	margin-top: -0.8vw;
}


.Middle .white-div img{
	width: 100%;
	margin-top: 1.5vw;
}


.Middle .white-div hr{
	border-top: 2px solid #e8edf2;
}


.Middle .grey-div{
	background-color: #F1F7FC;
	padding: 1.5vw 1.5vw;
	margin-top: 0.3vw;
	border-radius: 0.4vw;
}


.Middle .grey-div p{
font-size: 0.6vw;
color: #778BA1;
}

.Middle .grey-div h2{
	font-weight: bolder;
	font-size: 1vw;
	margin-top: -0.8vw;
}


.Middle .grey-div img{
	width: 100%;
}

.Middle .transp-div{
	padding: 1.5vw 1.5vw;
	margin-top: 0.5vw;
	border-radius: 0.4vw;
	border: 2px solid #e8edf2;
}

.Middle .transp-div p{
font-size: 0.6vw;
color: #778BA1;
}

.Middle .transp-div h2{
	font-weight: bolder;
	font-size: 1vw;
	margin-top: -0.8vw;
}

.Middle .transp-div img{
	width: 100%;
	margin-top: 0.5vw;
}

.Middle .bottom-hr{
	border-top: 2px solid #e8edf2;
	margin-top: 2vw;
	margin-bottom: 1.5vw;
}

.Middle .table-div h2{
	font-size: 1.2vw;
	font-weight: bolder;
}


.Middle #pills-tab .nav-item{
}

.Middle #pills-tab .nav-item a{
	font-size: 0.8vw;
	padding: 0vw;
	border-bottom: 2px solid #e8edf2;
	border-radius: 0vw;
	padding-left: 0.5vw;
	padding-right: 0.5vw;
	color: #778BA1;
}

.Middle #pills-tab .nav-item .active{
	background-color: transparent;
	border-bottom: 2px solid #0099FF;
	color: #0099FF;
}


.Middle .table thead{
	background-color: #f4f7f9;
	border: none;
}

.Middle .table thead th{
	border: none;
	font-size: 0.8vw;
	color: #778BA1;
}

.Middle .table tbody td{
	font-size: 0.8vw;
	border: none;
	padding: 0.2vw;

}




.Right{
	padding: 1.5vw 16vw 1.5vw 1.5vw;
	width: 33%;
	min-height: 100vh;
}

.Right .icon-btn{
 width: 2.5vw;
 height: 2.5vw;
 border: none;
 border-radius: 50%;
 background-color: #F3F5F9;
 margin-right: 0.3vw;
}

.Right .icon-btn img{
	width: 1vw;
}


.Right .profile-btn{
	background-color: #FFFFFF;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	border: none;
	height: 2.5vw;
	font-size: 0.8vw;
	font-weight: bolder;
	padding: 0.5vw 2vw 0.5vw 0.5vw;
	border-radius: 1.5vw;
}


.Right .profile-btn .profile-img{
	width: 2vw;
	height: 2vw;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 0.5vw;
	margin-top: -0.2vw;
}


.Right .top-p{
	font-size: 0.7vw;
	margin-top: 3vw;
}


.Right .grey-div{
	padding: 0.5vw 1vw;
	background-color: #F3F5F9;
	border-radius: 0.4vw;
	margin-bottom: 1vw;
}

.Right .grey-div h2{
	font-size: 0.9vw;
	font-weight: bolder;
	width: 10ch;
}


.Right .grey-div h3{
	font-size: 1vw;
	font-weight: bolder;
	color: #0099FF;
	float: right;
	margin-top: -2vw;
}


.Right .tree-1{
 width: 95%;
}

.Right hr{
	border-top: 2px solid #e8edf2;
	margin-top: 2vw;
	margin-bottom: 2vw;
}

.Right h4{
	font-size: 1.1vw;
	font-weight: bolder;
}

.Right .tree-2{
 width: 95%;
 margin-top: 1vw;
}

.Right .announcement-div{
	padding: 1vw;
	background-color: #0099FF;
	margin-top: 2vw;
	border-radius: 0.4vw 0.4vw 0.4vw 0.4vw;
}

.Right .announcement-div h2{
	color: #ffffff;
	font-size: 1vw;
}

.Right .announcement-div p{
	font-size: 0.6vw;
	color: #ffffff;
}

.Right .announcement-div p span{
	font-weight: bolder;
}

.Right .announcement-div .gift{
	width: 100%;
	margin-top: 1vw;
}