@keyframes swing {
0%{transform:rotate(0deg)}
10%{transform:rotate(10deg)}
30%{transform:rotate(0deg)}
40%{transform:rotate(-10deg)}
50%{transform:rotate(0deg)}
60%{transform:rotate(5deg)}
70%{transform:rotate(0deg)}
80%{transform:rotate(-5deg)}
100%{transform:rotate(0deg)}
}
@keyframes sonar {
0%{transform:scale(0.9);opacity:1}
100%{transform:scale(2);opacity:0}
}
body{font-size:1rem}
.page-wrapper .sidebar-wrapper,.sidebar-wrapper .sidebar-brand > a,.sidebar-wrapper .sidebar-dropdown > a:after,.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before,.sidebar-wrapper ul li a i,.page-wrapper .page-content,.sidebar-wrapper .sidebar-search input.search-menu,.sidebar-wrapper .sidebar-search .input-group-text,.sidebar-wrapper .sidebar-menu ul li a,#show-sidebar,#close-sidebar{-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
.h2, h2 {
    font-size: 3rem;
    margin-top: 6rem;
    margin-bottom: 2rem;
}
.h4, h4 {font-size: 1.5rem;margin-top: 3rem;}
/*----------------page-wrapper----------------*/

.page-wrapper{height:100vh}
.page-wrapper .theme{width:40px;height:40px;display:inline-block;border-radius:4px;margin:2px}
.page-wrapper .theme.chiller-theme{background:#1e2229}

/*----------------toggeled sidebar----------------*/

.page-wrapper.toggled .sidebar-wrapper{left:0}
@media screen and (min-width: 768px) {
.page-wrapper.toggled .page-content{padding-left:330px}
}

/*----------------show sidebar button----------------*/

#show-sidebar{position:fixed;left:0;top:10px;border-radius:0 4px 4px 0;width:35px;transition-delay:.3s}
.page-wrapper.toggled #show-sidebar{left:-40px}
.sidebar-wrapper{width:330px;height:100%;max-height:100%;position:fixed;top:0;left:-330px;z-index:999}
.sidebar-wrapper ul{list-style-type:none;padding:0;margin:0}
.sidebar-wrapper a{text-decoration:none}

/*----------------sidebar-content----------------*/

.sidebar-content{max-height:calc(100% - 30px);height:calc(100% - 30px);overflow-y:auto;position:relative}
.sidebar-content.desktop{overflow-y:hidden}

/*--------------------sidebar-brand----------------------*/

/*.sidebar-wrapper .sidebar-brand{padding:12px 20px 8px;display:flex;align-items:center}*/
.sidebar-wrapper .sidebar-brand {padding: 12px 20px 8px;display: flex;align-items: flex-start;}
.sidebar-wrapper .sidebar-brand > a{/*text-transform:uppercase;font-weight:bold;*/flex-grow:1}
.sidebar-wrapper .sidebar-brand #close-sidebar{cursor:pointer;font-size:20px}
.sidebar-wrapper .sidebar-brand img {height:40px;opacity:0.85; padding-right:80px;}


/*--------------------sidebar-header----------------------*/

.sidebar-wrapper .sidebar-header{padding:20px;overflow:hidden}
.sidebar-wrapper .sidebar-header .user-pic{float:left;width:60px;padding:2px;border-radius:12px;margin-right:15px;overflow:hidden}
.sidebar-wrapper .sidebar-header .user-pic img{object-fit:cover;height:100%;width:100%}
.sidebar-wrapper .sidebar-header .user-info{float:left}
.sidebar-wrapper .sidebar-header .user-info > span{display:block}
.sidebar-wrapper .sidebar-header .user-info .user-role{font-size:12px}
.sidebar-wrapper .sidebar-header .user-info .user-status{font-size:11px;margin-top:4px}
.sidebar-wrapper .sidebar-header .user-info .user-status i{font-size:8px;margin-right:4px;color:#5cb85c}

/*-----------------------sidebar-search------------------------*/

.sidebar-wrapper .sidebar-search > div{padding:10px 20px}

/*----------------------sidebar-menu-------------------------*/

.sidebar-wrapper .sidebar-menu{padding-bottom:10px}
.sidebar-wrapper .sidebar-menu .header-menu span{font-weight:bold;font-size:14px;padding:15px 20px 5px;display:inline-block}
.sidebar-wrapper .sidebar-menu ul li a{display:inline-block;width:100%;text-decoration:none;position:relative;padding:8px 30px 8px 20px}
.sidebar-wrapper .sidebar-menu ul li a i{margin-right:10px;font-size:18px;width:30px;height:30px;line-height:30px;text-align:center;border-radius:4px}
.sidebar-wrapper .sidebar-menu ul li a:hover > i::before{display:inline-block;animation:swing ease-in-out .5s 1 alternate}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown > a:after{font-family:"Font Awesome 5 Free";font-weight:900;content:"\f105";font-style:normal;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;background:0 0;position:absolute;right:15px;top:14px}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul{padding:5px 0}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li{padding-left:25px;font-size:13px}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before{content:"\f111";font-family:"Font Awesome 5 Free";font-weight:400;font-style:normal;display:inline-block;text-align:center;text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-right:10px;font-size:8px}
.sidebar-wrapper .sidebar-menu ul li a span.label,.sidebar-wrapper .sidebar-menu ul li a span.badge{float:right;margin-top:8px;margin-left:5px}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .badge,.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .label{float:right;margin-top:0}
.sidebar-wrapper .sidebar-menu .sidebar-submenu{display:none}
.sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a:after{transform:rotate(180deg);right:17px}

/*--------------------------side-footer------------------------------*/

.sidebar-footer{position:absolute;width:100%;bottom:0;display:flex}
.sidebar-footer > a{flex-grow:1;text-align:center;height:30px;line-height:30px;position:relative}
.sidebar-footer > a .notification{position:absolute;top:0}
.badge-sonar{display:inline-block;background:#980303;border-radius:50%;height:8px;width:8px;position:absolute;top:0}
.badge-sonar:after{content:"";position:absolute;top:0;left:0;border:2px solid #980303;opacity:0;border-radius:50%;width:100%;height:100%;animation:sonar 1.5s infinite}

/*--------------------------page-content-----------------------------*/
p.version {line-height: 1.11rem;}
.page-wrapper .page-content{display:inline-block;width:100%;padding-left:0;padding-top:20px}
.page-wrapper .page-content > div{padding:20px 40px}
.page-wrapper .page-content{overflow-x:hidden}

/*------scroll bar---------------------*/

::-webkit-scrollbar{width:5px;height:7px}
::-webkit-scrollbar-button{width:0;height:0}
::-webkit-scrollbar-thumb{background:#525965;border:0 none #ffffff;border-radius:0}
::-webkit-scrollbar-thumb:hover{background:#525965}
::-webkit-scrollbar-thumb:active{background:#525965}
::-webkit-scrollbar-track{background:transparent;border:0 none #ffffff;border-radius:50px}
::-webkit-scrollbar-track:hover{background:transparent}
::-webkit-scrollbar-track:active{background:transparent}
::-webkit-scrollbar-corner{background:transparent}

/*-----------------------------chiller-theme-------------------------------------------------*/

.chiller-theme .sidebar-wrapper{background:#31353D}
.chiller-theme .sidebar-wrapper .sidebar-header,.chiller-theme .sidebar-wrapper .sidebar-search,.chiller-theme .sidebar-wrapper .sidebar-menu{border-top:1px solid #3a3f48}
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text{border-color:transparent;box-shadow:none}
.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-role,.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-status,.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text,.chiller-theme .sidebar-wrapper .sidebar-brand>a,.chiller-theme .sidebar-wrapper .sidebar-menu ul li a,.chiller-theme .sidebar-footer>a{color:#818896}
.chiller-theme .sidebar-wrapper .sidebar-menu ul li:hover>a,.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active>a,.chiller-theme .sidebar-wrapper .sidebar-header .user-info,.chiller-theme .sidebar-wrapper .sidebar-brand>a:hover,.chiller-theme .sidebar-footer>a:hover i{color:#b8bfce}
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a.active {color: #b8bfce;}

.page-wrapper.chiller-theme.toggled #close-sidebar{color:#ddd}
.page-wrapper.chiller-theme.toggled #close-sidebar:hover{color:#ffffff}
.chiller-theme .sidebar-wrapper ul li:hover a i,.chiller-theme .sidebar-wrapper .sidebar-dropdown .sidebar-submenu li a:hover:before,.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu:focus+span,.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active a i{color:mediumorchid;text-shadow:0 0 10px rgba(22,199,255,0.5)}
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a i,.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div,.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text{background:#340340}
.chiller-theme .sidebar-wrapper .sidebar-menu .header-menu span{color:#6c7b88}
.chiller-theme .sidebar-footer{background:#3a3f48;box-shadow:0 -1px 5px #282c33;border-top:1px solid #464a52}
.chiller-theme .sidebar-footer>a:first-child{border-left:none}
.chiller-theme .sidebar-footer>a:last-child{border-right:none}

.page-content img.scrnshot {width:100%; min-width:500px;max-width:1140px;}

.page-content .card {     
    max-width: 1140px;
    background-color: #fafafa;
    padding: 0px;
    margin: 40px;
}
p, li {font-size:1.0rem;}
.sidebar-menu a.active {
    color: #16c7ff;
    font-weight: normal;
    border-left: 3px solid #16c7ff;
    border-right: 3px solid #16c7ff;
}
.sidebar-content hr {
    margin-top: 0.4rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(110,110,110,.8);
}

div#close-sidebar {
    float: right;
    margin-right: 0px;
    margin-top: -50px;
    border: 6px solid #456;
    background: #456;
    border-radius: 5px 0px 5px 20px;
    color: black;
}

hr {
    height: 8px;
    background-image: linear-gradient(90deg, lightgrey, transparent);
    border: 0px;
    height: 1px;
    padding:1px;
    margin-top: 3rem;
    margin-bottom: 2rem;
}
hr::after {
    content: url(/docs/ICON-HR.svg);
    float: right;
    margin-top: -15px;
    opacity: 0.35;
}
h2 i::before {
    opacity: 0.8;
    margin-right: 20px;
}
.h2, h2 {
    font-size: 3rem;
    margin-top: 4rem;
    margin-bottom: 3rem;
}
.lead {
    font-size: 1.3rem;
    font-weight: 400;
}
.rem-2 {font-size:1.92rem;font-weight:300;}

/* Purple */

.chiller-theme .sidebar-wrapper {
    background: #47395f;
    background-image: linear-gradient(to left bottom, #382d4b, #3a2e4e, #3c3052, #3f3155, #413259);
}
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a i{
    background: none;
}

.chiller-theme .sidebar-wrapper .sidebar-menu ul li a {    
    color: #ccc;
}
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a:hover {    
    color: #eee;
}
.chiller-theme .sidebar-wrapper .sidebar-menu .header-menu span {
    color: #999;
}
div#close-sidebar {
    float: right;
    margin-right: 0px;
    margin-top: -50px;
    border: 6px solid #340340;
    background: #300340;
    border-radius: 5px 0px 5px 20px;
    color: black;
}
.btn-dark {
    color: #fff;
    background-color: #340340;
    border-color: #340340;
}
.tip {
    background: #fbffd7;
    padding: 20px 20px 5px;
    border: 1px solid #ddd;
    border-radius: 6px;
}
.tip p {font-size:0.95rem;}
.sidefooter .copyright {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1030;
    margin:0;
    width:330px;
    background:#300340;
    text-align:center;
}
.sidefooter div {
    padding:8px 15px;font-size:0.8rem; 
    color:#eee;opacity:0.7;}
    
section {
    width: 100%;
}
.whymd { border-left:1px solid #ccc;;padding-left:20px;}
.mkdown h5 {
    font-weight: 200;
}
.mkdown h3 {
    font-size: 2rem;
    margin-top: -10px;
}
.whymd {
    border-left: 1px solid #bbb;
    padding: 0 20px 10px 20px;
}
.rem13 {font-size:1.3rem;}

.form-ls{
		background: #efefef;
    	
		border-top-left-radius: 0.5rem;
		border-bottom-left-radius: 0.5rem;
	}
	.docsform {margin: 30px 0 0 50px;}
	.contact-info{
		
	}
	.contact-info img{margin-top:20px;}
	

	.form-rs{
		background: #fafafa;
		padding: 3%;
		border-top-right-radius: 0.5rem;
		border-bottom-right-radius: 0.5rem;
	}
	.contact-form label{
		font-weight:600;
	}
	.contact-form button{
		background: #47395f;
    background-image: linear-gradient(to left bottom, #382d4b, #3a2e4e, #3c3052, #3f3155, #413259);
		color: #fff;
		font-weight: 600;
		width: 25%;
	}
	.contact-form button:focus{
		box-shadow:none;
	}