html{font-size: 16px;}
body{background: #f8fafb;}
.clearfix::after{content: ''; display: table; clear: both;}
img{max-width: 100%;}
[class*="container-"]{max-width: 1170px; margin: 0 auto; padding: 0 1rem;}
.container-md{max-width: 980px;}
.container-sm{max-width: 780px;}
.container-xs{max-width: 560px;}
.container-xl{max-width: 1300px;}
header{background: rgb(132, 48, 95);background: linear-gradient(90deg,rgb(132, 48, 95) 6%, rgb(63, 94, 251) 100%); min-height: 80px; padding: 1em 0;}
.demo-controls{background: #576073; padding: 2em 0; box-shadow: 0 -5px 5px -5px #000 inset, 0 5px 5px -5px #000 inset;}
.demo-controls > h1{border: none; color: #fff; text-transform: none; font-size:3rem; text-align: left; width: auto; margin-bottom: 1rem; line-height: 1;}
.demo-controls > h1 > small{font-size: 1rem; font-weight: normal; opacity: .7; font-style: italic;}
.btn{display:inline-block;font-weight:400;text-align:center;vertical-align:middle;cursor:pointer;padding:.5rem;margin:.1em; font-size:1rem;line-height:1.5;border-radius:.25rem;background: #77839b;color: #fff !important; border: 1px solid rgba(255,255,255,.15); text-transform: capitalize; text-decoration: none !important; position: relative;}
.btn.active,.btn:hover,.btn:focus{background: #00bc2a;}
.btn > span:not(:empty){display: block; padding:.5em; font-weight: 600; line-height: 1;}
.btn > img+span:not(:empty){padding-top: 1em;}
.btn > img+span:not(:empty)::before,.demo-iframe::before{position: absolute; left: 50%; top: 50%; width: 2em; height: 2em; margin: -1em 0 0 -1em; display: block; content: ''; border: .3em solid rgba(0,0,0,.2); border-top-color: #f90; border-radius: 50%; z-index: -1; -webkit-animation: best-spin 2s linear infinite; animation: best-spin 2s linear infinite;}
.demo-controls .btn:empty{display:block;height:0;background:none;border:0;padding:0;margin:.8em 0;border-bottom:1px solid;opacity:.2 !important;width: 100% !important; pointer-events: none;}
h1{font-size:2em;font-weight:700;text-align:center;margin:0 auto .6em;border-bottom:4px double #888;display:block;width:50%;text-transform: uppercase; clear: both; padding: 1.5em 0 0;}
.demo-content{position: relative; padding: 3em 1em 9em; display:block;}
.demo-content::after,.demo-content::before, .footer::after,.footer::before{position: absolute; left:50%; top:-1rem; width:8rem; content:'DEMO'; background: #576073; font-size: 1rem; padding: 0 1.5rem 1.2em; font-weight: bold; border-radius: .3em; color: #859abb; margin-left: -4rem; text-align: center;}
.demo-content::after, .footer::after{content: ''; top:.5em; width: 0; height: 0; padding: 0; margin-left: -.8em; background: none; border:.8em solid; border-color: #859abb transparent transparent;}
.module{padding:3em 0;}
.media{display: table;}
.media > *{display: table-cell;padding: 15px;vertical-align:top;}
.media-left{width: 350px;}
.media-body > h4{padding: 0 0 15px; margin: 0; font-size: 1.5rem;}
#logo{float: left; text-decoration: none;min-height: 70px; margin-top: -.3em; max-width:15em;}
#logo > b{display:block;color:#fff;text-transform:uppercase;font-size:.8em;opacity:.8;line-height:0}
a.nav-toggle, .nav-buynow{font-size:1rem;text-decoration:none !important;color:#fff !important;background:rgba(0,0,0,0.2);padding:1em 2em 1em 1.5em;border-radius:.3em;width:15em;display:block;height:auto;text-transform:uppercase;font-weight:700;border:1px solid rgba(255,255,255,.5);position: absolute;top: 1.25em; left: 50%; margin-left: -6em;}
a.nav-toggle::before, a.nav-toggle::after{position: absolute; right: 1.5em; top: 50%; width: 0; height: 0; border:.5em solid; border-color: #fff transparent transparent; content: '';}
a.nav-toggle::before{border-color: transparent transparent #fff; margin-top: -1.2em;}
.nav-buynow, .nav-buynow:focus{width: auto; float: right;position:static; background: #18b86e; margin-top: .25em; padding: 1em 1.5em; text-decoration: none !important;}
.nav-buynow:hover{opacity: .9;}
.nav-buynow span{background: rgba(0,0,0,.2); margin-left: 5px; padding: 2px 5px; border-radius: .2em;}
.menu-active{overflow: hidden;}
#menu{position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99998; background:#fff; overflow: hidden; display: none;}
.menu-active #menu{display: block;}
#menu > ul{position: absolute; left: 50%; top:0; -wekit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); list-style: none; padding: 0; transition: all 2s;}
.menu-active #menu > ul{top: 50%;}
#menu > i{position: absolute; top:30px;right: 30px;font-size: 4rem;width: 60px;height: 60px;text-align: center;line-height: 60px; cursor: pointer; color: #333;}
#menu > i:hover{color: #f00;}
#menu a{font-size: 1.2rem; text-decoration: none; padding:.5em 0; display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.2); width: 300px; margin: 0 2em; font-weight: bold;text-transform: capitalize;}
footer{background: #fff; box-shadow: 0 5px 5px -5px #ddd inset; border-top: 1px solid #ddd; position: relative; display: table; width: 100%;}
.footer::before{background: #f8fafb;box-shadow: 0 2px 2px #ddd;content: 'HELP'; color: #bbb; border-radius: 0 0 .3em .3em;}
.footer::after{border-top-color: #bbb;}
.footer-page{display: table;padding-top: 5em; padding-bottom: 5em;}
.footer-block{width: 50%; display:table-cell; padding: 2em;}
.footer-block .docs{background: rgb(0, 98, 255); cursor: pointer; padding: .8em 1.5em; font-size: 1.2em; font-weight: 600;}
.footer-block .contact{background: #f90; cursor: pointer; padding: .8em 1.5em; font-size: 1.2em; font-weight: 600;}
.footer-block .docs:hover, .footer-block .docs:focus,
.footer-block .contact:hover, .footer-block .contact:focus{opacity: .9;}
footer h1{display: block; width: 100%; border: none; text-align: left; margin-top: 2em;}
footer h2, footer h3{margin-bottom: .8em;padding: .8em 0 .5em; border-bottom: 1px solid #ddd;}
footer h1.first, footer h3.first{padding-top: 0; margin-top: 0;}
.ba-table{ width: 100%; border-radius: .3em; margin-bottom: 1em;}
.ba-table tbody > tr:nth-child(odd){background: #f1f3f4;}
.ba-table td, .ba-table th{padding:1em;}
.text-muted{color: #999;}
.copyright{background: #2b3544; color: #4d5f7a; text-align: center; padding: 2em 0;}
.copyright a{color: #00bc2a; text-decoration: none; outline: none;}
.badge{display:inline-block;padding:.5em 1em;font-size:80%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.3rem;background:#e2e3e5;}
.btn-loadmore-wrap{display: table; width: 100%; padding-top: 1em;}
.loadmore .nav-controls > a, .btn-loadmore{display: none;}
.loadmore .nav-controls > a.show{display: block; width: 30%; float: left; margin:1em 1.5%;-webkit-animation:fade-in-fwd .6s cubic-bezier(.39,.575,.565,1) both;animation:fade-in-fwd .6s cubic-bezier(.39,.575,.565,1) both}
.loadmore .demo-content::before, .loadmore .demo-content::after, .loadmore .footer::before, .loadmore .footer::after{display: none;}
.loadmore .demo-controls{padding-bottom: 4em;}
.loadmore .btn-loadmore, .loadmore .btn-loadmore:focus{display: table; padding:.8em 2em;margin: 0 auto;background: rgba(0,0,0,.5);color: #fff;font-weight: 600;border-radius: 3em; cursor: pointer; opacity: .5;}
.loadmore .btn-loadmore:hover{opacity:1;}
.demo-popup{position: fixed; left:0; top:0; width:100%; height:100%; display: block; content: ''; background: rgba(0,0,0,.8); z-index: 998;}
.demo-popup > *{display: block;position:absolute; left: 50%; top: 50%; max-width: 95%; max-height: 95%; transform: translate(-50%,-50%); background: #f9f9f9; border-radius: .5em; box-shadow: 0 0 1em #000; width:1200px; height:100%; z-index: 999; padding: 1em;}
.demo-popup .demo-close{width: 36px; height: 36px; display: block; position: absolute; top: -18px; right: -18px; background: #f30; color: #fff; text-align: center;font-weight: bold;  line-height: 30px; border-radius: 50%; font-size: 18px; cursor: pointer;}
.demo-popup .demo-close:hover{background: #f60;}
.demo-popup .demo-iframe{width: 100%; height: 100%; position: relative; display: block;}
.demo-popup iframe{width: 100%; height: 100%; border: 1px solid #ccc; border-radius: .2em;}
.lightbox-content{padding: 3em 0;}
.lightbox-content .module, .lightbox-content .module > h1{padding: 0;}
.lightbox-content .module + .module{padding-top: 2em;}

@media (max-width: 991px) {
    a.nav-toggle, .nav-buynow > i{display: none;}
    .nav-buynow{padding:.8em;}
    .footer-block{width: 100%; display: block;}
}
 @-webkit-keyframes fade-in-fwd{0%{-webkit-transform:translateZ(-80px);transform:translateZ(-80px);opacity:0}100%{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes fade-in-fwd{0%{-webkit-transform:translateZ(-80px);transform:translateZ(-80px);opacity:0}100%{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}
 @-webkit-keyframes best-spin {0% {-webkit-transform: rotate(0deg);}100% {-webkit-transform:rotate(360deg);}}
@keyframes best-spin {0% {transform: rotate(0deg);}100%{transform: rotate(360deg);}}