#magic-container{
	border:1px solid #ccc;
	padding:10px;
	border-radius:10px;
	margin-top:20px;
	display:none;
}

.magic-work-container{
	color:#fff !important;
	padding:30px !important;
	background: linear-gradient(180deg, rgba(58,58,165,1) 0%, rgba(43,43,128,1) 65%, rgba(41,41,112,1) 100%);
}
.magic-work-container label{color:#bbf;margin-bottom:8px;}


.box-magic{
	display:inline-block;
	transition:0.6s;
	padding:5px 10px 7px 10px;
	text-align:center;
	font-size:1rem;
	line-height:1.4rem;
	height:40px;
	border:1px solid #474;
	border-radius:5px;
	color:#fff;
	cursor:pointer;
	background: rgb(58,165,58);
	background: linear-gradient(180deg, rgba(58,58,165,1) 0%, rgba(43,43,128,1) 65%, rgba(41,41,112,1) 100%);
}
.box-magic.alt{
	background: linear-gradient(180deg, rgba(100,100,100,1) 0%, rgba(43,43,43,1) 65%, rgba(41,41,41,1) 100%);
}

.box-magic .fas{font-size:1.4rem;color:#fff;}

.box-magic-hover:hover{
	color:#FFF;
	text-shadow:3px 3px 4px #850;
	background: rgb(255,160,0);
	background: linear-gradient(180deg, rgba(250,150,0,1) 0%, rgba(220,120,0,1) 65%, rgba(190,90,0,1) 100%);
}

.m-inp{
	border-color:rgba(88,88,195,1);
	border-radius:5px;
	height:35px;
	padding-left:10px;
	background:rgba(58,58,165,1);
	color:#fff;
	margin-bottom:3px;
	font-size:1rem;
}
.m-inp:focus{background:#fff;color:#777;}

.m-inp-box{
	margin:10px 0 0 0;	
}

.magic-icon{
	font-size:2rem;
	color:#fff;
	margin:0 20px 20px 0;
}

.magic-round{
	width:55px;
	height:55px;
	display:inline-block;
	font-size:2rem;
	border:1px solid #ddd;
	border-radius:30px;
	text-align: center;
	cursor: pointer;
}
.magic-round:hover{
	border:1px solid #fff;
	background:#55D;
}
.magic-round .fas{font-size:2rem;color:#ddd;padding-top:7px;}
.magic-check{
	height:0px;
	overflow:hidden;
	font-size:1rem;
	color:#fff;
}
.m-info{
	display:inline-block;
	text-overflow: ellipsis;
}
.m-error{
background: rgb(255,255,255);
background: linear-gradient(57deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 27%, rgba(255,146,146,1) 89%, rgba(215,69,69,1) 100%) !important;
}

.magic-know{
	font-size:0.8rem;
	display:inline-block;
	vertical-align: top;
	margin-right:1%;
	line-height: 0.95rem;
	color:#acf;
}
.magic-know h1{font-size:1rem;}
.magic-know h2{font-size:0.8rem;margin:0px;color:#68c}
.magic-know em{color:#68c}
.magic-know hr{border-top: 1px solid #55c; margin-bottom:2px;}