/*
    	Colors
    	------------
    	#7838AB purple, darkest...
    	#E3D7FB purple, lightest
    	#B79AF5 purple, light
    	#8E6AD8 purple, dark
    	#6233C3 purple, darker
    	#EDEDED, light gray
  	*/
  	* {
    	-webkit-tap-highlight-color: rgba(0,0,0,0); /* prevent selected highlight colors */
    	-webkit-touch-callout: none !important; /* prevent longpress on images and other elements */
  	} 
  
	.noselect {
	  -webkit-touch-callout: none; /* iOS Safari */
	    -webkit-user-select: none; /* Safari */
	     -khtml-user-select: none; /* Konqueror HTML */
	       -moz-user-select: none; /* Old versions of Firefox */
	        -ms-user-select: none; /* Internet Explorer/Edge */
	            user-select: none; /* Non-prefixed version, currently
	                                  supported by Chrome, Edge, Opera and Firefox */
	}		
  

  html, body {
    position:absolute;
    height: 100%;
    width: 100%;
    height: 100dvh;
    width: 100dvw;
    margin:0px;
    padding:0px;
    background-color:#7838AB;
    overflow: hidden;
    overscroll-behavior: none;
    font-family: 'Poppins', sans-serif;
  }
  #appWrapper{
    position:absolute;
    height: 100%;
    width: 100%;
    height: 100dvh;
    width: 100dvw;
    margin:0px;
    padding:0px;
    background-color:transparent;
  }

  /* content */
  #content{
    position:absolute;
    z-index:99;
    top:0px;
    bottom:0px;
    background-color:#7838AB;
    width:100%;
    padding:0px;
    overflow-x:hidden;
    overflow-y:hidden;
  }
  #content .screen{
      display:block;
      margin-top:50px;
      background-color: #7838AB;
      width:100%;
      min-height:600px;
      overflow-y:scroll;
      overflow-x:hidden;
  }
  
  .swiper-pagination-bullet-active {
    background-color: #6233C3 !important;
  }
  .swiper-pagination-bullet {
    background-color: #B79AF5 !important;
  }


 /* top navigation bar */
  #topBar {
  	display:none;
    width:100%;
    height:50px;
    top: 0px;
    position:absolute;
    z-index:100;
    background-color:#7838AB;
    border-bottom:1px solid #FFFFFF;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  #topBar table{
    width:100%;
    border-collapse: collapse;
  }
  #topBar table tr td{
    padding:0px;
    vertical-align:middle;
    line-height:50px;
    padding-left:10px;
    padding-right:10px;
  }
  #topBar table tr td:nth-child(1){
    width:50px;
  }
  #topBar table tr td:nth-child(3){
    width:50px;
  }
  #topBar #topBarTitle{
    height:50px;
    line-height:55px;
    text-align:center;
    font-size:23px;
    color:#FFFFFF;
    white-space:nowrap;
  }
  #topBar #topBarLeft{
    width:80px;
    height:50px;
    line-height:50px;
    text-align:left;
    color: #FFFFFF;
  }
  #topBar #imgLeft{
    height:50px;
    width:50px;
    cursor:pointer;
  }
  #topBar #imgLeft img{
    height:50px;
    width:50px;
  }
  #topBar #topBarLeft ion-icon{
    height:38px;
    width:38px;
    margin-top:6px;
    color:#FFFFFF;
  }

  #topBar #topBarRight{
    width:80px;
    height:50px;
    line-height:50px;
    text-align:right;
    display:pointer;
    color: #FFFFFF;
  }
  #topBar #topBarRight i{
  	display:inline-block;
    height:38px;
    width:38px;
    line-height:38px;
    margin-top:6px;
    font-size:32px;
    color:#FFFFFF;
    cursor:pointer;
  }
  #topBar #topBarRight img{
    height:35px;
    width:35px;
    margin-top:0px;
    color:#FFFFFF;
    cursor:pointer;
  }

  #topBar #topBarRight .menu{
    position:absolute;
    display:none;
    top:50px;
    right:0px;
    width:200px;
    text-align:left;
    line-height:30px;
    background-color:#EDEDED;
    padding:10px;
    padding-left:0px;
    padding-right:0px;
    border-bottom-left-radius: 5px;
    border-left:1px solid #B79AF5;
    border-top:1px solid #B79AF5;
    border-bottom:1px solid #B79AF5;
  }
  #topBar #topBarRight .menu div.item{
    position:relative;
    display:block;
    margin-left:20px;
    margin-right:20px;
    height:35px;
    line-height:35px;
    border-bottom:1px solid #BDBDBD;
  }
  #topBar #topBarRight .menu .tiny{
    font-size:85%;
  }
  #topBar #topBarRight div.menu div.item:last-child{
    border-bottom:1px solid #EDEDED;
  }
  #topBar #topBarRight a:link, #topBar #topBarRight a:visited, #topBar #topBarRight a:active{
    color:#8E6AD8;
    text-decoration:none;
  }
  #topBar #topBarRight a:hover{
    color:#B79AF5;
    text-decoration:none;
  }
  #bottomBar{
  	display:none;
  }


  /* anchors */
  a{
    color: #8E6AD8;
    text-decoration:none;
  }
  a:link{
    color: #8E6AD8;
    text-decoration:none;
  }
  a:active{
    color: #8E6AD8;
    text-decoration:none;
  }
  a:hover{
    color:#B79AF5;
    text-decoration:none;
  }
  

  /* forms */
  form{
    margin:0px;
  }
  form div .form-group{
    margin:0px;
    margin-bottom:10px;
  }
  form div .form-control{
    height:42px;
  }

  input{
    margin:0px;
  }
  .form-group !important, .form-control !important{
    margin:0px;
    padding:0px;
  }
  .textColor{
    color:#8E6AD8;
  }
  .grayColor{
    color:#979797;
  }
  .borderColor{
    border:1px solid #8E6AD8;
  }
  .btn.btn-primary{
    color: #000000; 
    background-color: #B79AF5; 
    border-color: #B79AF5;
  }      
  .btn.btn-primary:hover{
    color: #000000; 
    background-color: #8E6AD8; 
    border-color: #8E6AD8;
  }
  .btn.btn-primary.active, .btn.btn-primary.active.focus, .btn.btn-primary:not(:disabled):not(.disabled):active{
    box-shadow: none;
    color: #000000; 
    background-color: #8E6AD8; 
    border-color: #8E6AD8;
  }
  .btn.btn-danger{
    color: #000000; 
  }      
  .btn.btn-danger:hover{
    color: #000000; 
  }
  .btn.btn-danger.active, .btn.btn-danger.active.focus, .btn.btn-danger:not(:disabled):not(.disabled):active{
    box-shadow: none;
    color: #000000; 
  }
  .btn:focus,.btn:active{
     outline: none !important;
     box-shadow: none;
  }
  textarea:focus,
  input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus,
  input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus,
  input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus,
  input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus,
  input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {   
    outline: 0 none;
    border-color: #8E6AD8;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  textarea{
    outline: 0 none;
    border: 1px solid #CED4DA;
    border-radius:5px;
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
  }
  .btn-group-xs > .btn, .btn-xs {
    padding: 5px;
    padding-top:4px;
    height:30px;
    font-size: .875rem;
    border-radius: .2rem;
  }

  /* info div */
  .infoDiv{
    line-height:20px;
    border:1px solid #8E6AD8;
    border-radius:5px;
    padding:10px;
  }

  /* sweet alert OLD */
  .sweetAlertOk{
    background-color:#B79AF5;
    color:#000000;
    border: none;
  }
  .swal-button.sweetAlertOk:hover{
    background-color:#8E6AD8;
    color:#000000;
    border: none;
  }      
  .swal-title{
    font-size:17px;
  }
  .swal-footer{
    text-align:center;
  }
  .swal-button{
    font-weight:normal;
    width:200px;
  }
  
.swal-icon.swal-icon--info {
  	border-color: #B79CED !important;
} 
.swal-icon--info:after, .swal-icon--info:before{
 	color: #B79CED !important;
 	background-color: #B79CED !important;
}


/* Sweet Alert (new) */
..swal2-container.in {
	/*
	background-color:transparent !important;
	background:transparent !important;
	*/
	background-color:red;
}
.swal2-actions button{
	font-weight:normal;
    min-width:100px;
}    
.swal2-styled, .swal2-cancel, .swal2-confirm{
	color: #FFFFFF !important;
  	background-color: #B79CED !important;
  	border-color: #B79CED !important;
}


.swal2-info{
 	color: #B79CED !important;
  	border-color: #B79CED !important;
}
  

  /* form-control */
  .form-control{
    height:45px;
  }

  /* no select */
  .noselect{
    -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
         -khtml-user-select: none; /* Konqueror HTML */
           -moz-user-select: none; /* Old versions of Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none; /* Non-prefixed version, currently */
  }

  .spinny{
      -webkit-animation: spin 1.15s infinite linear;
  }
  @-webkit-keyframes spin {
      0%  {-webkit-transform: rotate(0deg);}
      100% {-webkit-transform: rotate(360deg);}   
  }
  
  /* tiles */
  .tile{
  	border-radius:5px;
  }
  .tileLight{
  	background-color:#E2D7F7;
  }