
/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/opensans/open-sans-v17-latin-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../fonts/opensans/open-sans-v17-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/opensans/open-sans-v17-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/opensans/open-sans-v17-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/opensans/open-sans-v17-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('../fonts/opensans/open-sans-v17-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/opensans/open-sans-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/opensans/open-sans-v17-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-800 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/opensans/open-sans-v17-latin-800.eot'); /* IE9 Compat Modes */
  src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
       url('../fonts/opensans/open-sans-v17-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/opensans/open-sans-v17-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-800.woff') format('woff'), /* Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/opensans/open-sans-v17-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}


/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/opensans/open-sans-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/opensans/open-sans-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/opensans/open-sans-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/opensans/open-sans-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/opensans/open-sans-v17-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}




html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

body {
	background: linear-gradient(90deg, #C7C5F4, #776BCC);		
  height: 100%;
}


.screen {		
	background: linear-gradient(90deg, #5D54A4, #7C78B8);		
	position: relative;	
	height:500px;
	width: 360px;	
	box-shadow: 0px 0px 24px #5C5696;
  margin: 0 auto;
  overflow: hidden;
}

.screen__content {
	z-index: 1;
	position: relative;	
	height: 100%;
}

.screen__background {		
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 0;
	-webkit-clip-path: inset(0 0 0 0);
	clip-path: inset(0 0 0 0);	
}

.screen__background__shape {
	transform: rotate(45deg);
	position: absolute;
}

.screen__background__shape1 {
	height: 520px;
	width: 520px;
	background: #FFF;	
	top: -50px;
	right: 120px;	
	border-radius: 0 72px 0 0;
}

.screen__background__shape2 {
	height: 220px;
	width: 220px;
	background: #6C63AC;	
	top: -172px;
	right: 0;	
	border-radius: 32px;
}

.screen__background__shape3 {
	height: 540px;
	width: 190px;
	background: linear-gradient(270deg, #5D54A4, #6A679E);
	top: -24px;
	right: 0;	
	border-radius: 32px;
}

.screen__background__shape4 {
	height: 400px;
	width: 200px;
	background: #7E7BB9;	
	top: 420px;
	right: 50px;	
	border-radius: 60px;
}

.login {
	width: 320px;
	padding: 30px;
	padding-top: 156px;
}

.login__field {
	padding: 20px 0px;	
	position: relative;	
}

.login__icon {
	position: absolute;
	top: 30px;
	color: #7875B5;
}

.login__input {
	border: none;
	border-bottom: 2px solid #D1D1D4;
	background: none;
	padding: 10px;
	padding-left: 24px;
	font-weight: 700;
	width: 75%;
	transition: .2s;
}

.login__input:active,
.login__input:focus,
.login__input:hover {
	outline: none;
	border-bottom-color: #6A679E;
}

.login__submit {
	background: #fff;
	font-size: 14px;
	margin-top: 30px;
	padding: 16px 20px;
	border-radius: 26px;
	border: 1px solid #D4D3E8;
	text-transform: uppercase;
	font-weight: 700;
	display: flex;
	align-items: center;
	width: 100%;
	color: #4C489D;
	box-shadow: 0px 2px 2px #5C5696;
	cursor: pointer;
	transition: .2s;
}

.login__submit:active,
.login__submit:focus,
.login__submit:hover {
	border-color: #6A679E;
	outline: none;
}

.button__icon {
	font-size: 24px;
	margin-left: auto;
	color: #7875B5;
}

.social-login {	
	position: absolute;
	height: 140px;
	width: 160px;
	text-align: center;
	bottom: 0px;
	right: 0px;
	color: #fff;
}

.social-icons {
	display: flex;
	align-items: center;
	justify-content: center;
}

.social-login__icon {
	padding: 20px 10px;
	color: #fff;
	text-decoration: none;	
	text-shadow: 0px 0px 8px #7875B5;
}

.social-login__icon:hover {
	transform: scale(1.5);	
}

#loading{
  display: none;
  width: 40px;
  height: 40px;
  margin-top: 30px;
  border-radius: 50%;
  border:6px solid #dddd;
  border-top:5px solid #fff;
  animation: loading 1s linear infinite;
  margin: 0 auto;
  
}

.qr-card {
  background-color: #fff;
  background-image: linear-gradient(134.43deg,#e4d4c7,#d2e5fc);
  -webkit-transition: .2s ease-in;
  transition: .2s ease-in;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
border:1px solid #ddd;
  position: relative;
}


#qrImg{display: none;}
#qrAlert{display: none;}
#qrImg{padding: 15px 0px;}
#qrDownload{display: none; width: 250px; margin:10px auto;}

@keyframes loading{
    from{
      transform: rotate(0deg);
    }
    to{
      transform: rotate(360deg);
    }
}

#qrImg{margin: 0 auto;}

.card-header:first-child {
  border-radius: calc(0.35rem - 1px) calc(0.35rem - 1px) 0 0;
}

.card-header {
  padding: 0.75rem 1.25rem;
  margin-bottom: 0;
  background-color: #f8f9fc;
  border-bottom: 1px solid #e3e6f0;
}

.table-custome tr th{font-size: 14px; color:#333}
.table-custome tr td{font-size: 14px; color:#222}
.btn-sm, .btn-group-sm > .btn {padding: 0.12rem 0.3rem;
    font-size: 0.860rem;
    line-height: 1.5;
    border-radius: 0.2rem;}
.iframeTheme{border:0px}

.ck-editor__editable[role="textbox"] {
	/* editing area */
	min-height: 300px;
}
.ck-content .image {
	/* block images */
	max-width: 80%;
	margin: 20px auto;
}


#pageLoader{
	left: 0px;
	bottom:0px;
    width:100%;
    height:100%;
    position:fixed;
    z-index:99999;
    background:rgba(0,0,0,0.7);
}
#pageLoader .loading{
	position: absolute;
	width: 100px;
	height: 100px;
	left: 50%;
	top: 50%;
	margin-top: -50px;
	margin-left: -50px;
}

.imageRotateHorizontal{
    -moz-animation: spinHorizontal .8s infinite linear;
    -o-animation: spinHorizontal .8s infinite linear;    
    -webkit-animation: spinHorizontal .8s infinite linear;
    animation: spinHorizontal .8s infinite linear;
}
.loadingAjax{left: 0px;
	bottom:0px;
    width:100%;
    height:100%;
    position:fixed;
    z-index:99999;
    background:url("./../images/favicon.png") no-repeat center rgba(0,0,0,0.25);}

@keyframes spinHorizontal {
    0% { transform: rotateY(0deg); }
    100% { transform: rotateY(360deg); }
}

@keyframes shake {
	10%, 90% {
	  transform: translate3d(-1px, 0, 0);
	}
	
	20%, 80% {
	  transform: translate3d(2px, 0, 0);
	}
  
	30%, 50%, 70% {
	  transform: translate3d(-4px, 0, 0);
	}
  
	40%, 60% {
	  transform: translate3d(4px, 0, 0);
	}
  }

  .shapes-7 {
	width: 40px;
	height: 40px;
	color:#f03356df;
	position: relative;
	background:
	  conic-gradient(from 134deg at top   ,currentColor 92deg,#0000 0) top,
	  conic-gradient(from -46deg at bottom,currentColor 92deg,#0000 0) bottom;
	background-size:100% 50%;
	background-repeat: no-repeat;
  }
  .shapes-7:before {
	content:'';
	position: absolute;
	inset:0;
	background:
	  conic-gradient(from  -135deg at top 0    left   22px ,#0000 ,currentColor 1deg 90deg,#0000 0),
	  conic-gradient(from  -45deg  at right 0  top    22px ,#0000 ,currentColor 1deg 90deg,#0000 0),
	  conic-gradient(from   45deg  at bottom 0 right  22px ,#0000 ,currentColor 1deg 90deg,#0000 0),
	  conic-gradient(from  135deg  at left  0  bottom 20px ,#0000 ,currentColor 1deg 90deg,#0000 0);
	 animation: sh7 1.5s infinite cubic-bezier(0.3,1,0,1);
  }
  @keyframes sh7 {
	 33%  {inset:-10px;transform: rotate(0deg)}
	 66%  {inset:-10px;transform: rotate(90deg)}
	 100% {inset:0    ;transform: rotate(90deg)}
  }

  .spinner-5 {
	width: 50px;
	--b: 8px; /* the border thickness */
	aspect-ratio: 1;
	border-radius: 50%;
	background: #ccd8d2;
	-webkit-mask:
	  repeating-conic-gradient(#0000 0deg,#000 1deg 70deg,#0000 71deg 90deg),
	  radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),#000 calc(100% - var(--b)));
	-webkit-mask-composite: destination-in;
	mask-composite: intersect;
	animation: s5 1s infinite;
  }
  @keyframes s5 {to{transform: rotate(.5turn)}}
  
  .spinner-6 {
	width: 50px;
	aspect-ratio: 1;
	border-radius: 50%;
	padding: 3px;
	background: 
	  radial-gradient(farthest-side,#ffa516 95%,#0000) 50% 0/12px 12px no-repeat,
	  radial-gradient(farthest-side,#0000 calc(100% - 5px),#ffa516 calc(100% - 4px)) content-box;
	animation: s6 2s infinite ;
  }

  .font-14{font-size: 14px;}
  .qr-code{padding: 20px;}
  .qr-code img{margin: 0 auto;}

.profile_image_area {position: relative;width: 250px;margin: 0 auto;  }
.profile_image_area img{border:1px solid #ddd}
.previewProfile {overflow: hidden;width: 160px;height: 160px;margin: 10px;border: 1px solid red; }
.profile_image_overlay {position: static;background-color: rgba(255, 255, 255, 0.5);overflow: hidden;transition: .5s ease;
	width: 250px;border:1px solid #ddd;padding: 10px 5px; }
.profile_image_area:hover .profile_image_overlay {cursor: pointer; }
.profile_image_overlay .text {color: #333;font-size:18px;text-align: center; }

img.cropmodalimage {display: block;	max-width: 100%;}
#AadharcardFrontIframe body img{width: 400px; margin:0 auto;}
.stickyAlert{position: fixed; z-index: 999; right: 10px; bottom:10px;}
.alert-dismissible .close{top:-3px}
.event-card img{max-width: 100%; width: 100%;}

div.dt-buttons{float: right; margin-bottom: 5px;}
.dataTables_length{ float: right;margin: 1px 15px 0px 5px;}
div.dataTables_wrapper div.dataTables_filter {float: left;}
.dataTables_info{float: left;}
div.dataTables_wrapper div.dataTables_paginate{float:right}
.buttons-html5, .buttons-collection{font-size: 12px; background: #4e73df; border:1px solid #1846cd; }
.buttons-html5:hover, .buttons-collection:hover{color: #fff; background-color: #2e59d9;  border-color: #2653d4;}
.form-select-sm{height: calc(1.5em + 0.5rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;}

.align-middle{vertical-align: middle;}
.calenderIcon{position: relative;}
.calenderIcon::after{font-family: 'Font Awesome 5 Pro'; display: block; content: "\f073"; font-size: 20px; position: absolute; right: 15px; top:4px}

.scroll-pane{height: 300px; overflow: auto;}

@media (max-width:600px) {

div.dt-buttons{float: none; margin-bottom: 5px;}
.dataTables_length{ float: none; margin: 5px 15px 5px 5px;}
div.dataTables_wrapper div.dataTables_filter {float: none;}
.dataTables_info{float: none;}
div.dataTables_wrapper div.dataTables_paginate{float:none}
.pagination { display: inline-block; width: 260px; }
.pagination li{width:33%; float: left;}
div.dataTables_wrapper div.dataTables_paginate ul.pagination{margin-top: 10px;}
table.dataTable>tbody>tr.child ul.dtr-details{width: 100%;}
.dtr-title:after{content: ":";}
}