$primary:#2ea44f;
$secondary:#0366d6;

$breadcrumb-bg:#fff;
//$blue:#6482e6;
//$blue:#3897f0;
//$red:#f9cdde;
//$gray-100:#fafafa;
$gray-800:#555;
//$gray-300:#eee;
$pagination-border-color: #eee;
$pagination-active-color: #fff;
$pagination-color: $secondary;
$pagination-active-bg: $secondary;
$pagination-active-border: #ddd;
$table-bg-hover: #fafafa;
$table-bg-accent: rgba(#000,.01);
$card-cap-bg: transparent;
$input-group-addon-bg: transparent;

$custom-select-indicator-color : #ccc;
//$custom-select-indicator: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 2'%3E%3Cpath fill='%23aaa' d='M 2,2 0,0 h 4 z'/%3E%3C/svg%3E");
$custom-select-indicator: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%555' d='M509.121,125.966c-3.838-3.838-10.055-3.838-13.893,0L256.005,365.194L16.771,125.966c-3.838-3.838-10.055-3.838-13.893,0	c-3.838,3.838-3.838,10.055,0,13.893l246.18,246.175c1.842,1.842,4.337,2.878,6.947,2.878c2.61,0,5.104-1.036,6.946-2.878 l246.17-246.175C512.959,136.021,512.959,129.804,509.121,125.966z'/%3E%3C/svg%3E");
$custom-control-indicator-active-bg: $secondary;
$custom-control-indicator-checked-bg: $secondary;

$font-size-base: 1rem;//14px
$dropdown-link-active-bg: #eee;

//$nav-tabs-link-active-border-color:#fff;
//$nav-tabs-link-active-color:$blue;
//$nav-tabs-link-active-bg:#fff;
/*
$input-btn-padding-y:         .575rem;
$input-btn-padding-x:         .75rem;
*/
$builder-canvas-margin:	50px;

//$enable-shadows : true;
//$enable-gradients : true;

$blue: #3e7bee;
$table-hover-bg:#fafafa;



@import url('//fonts.googleapis.com/css?family=Open+Sans:400,600|Arimo:400,600,700|Nunito:300,400,600');

$font-family-sans-serif: Nunito, Open Sans, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

//
// Color system
//

$white:    #fff !default;
/*
$white:    #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #ddd !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black:    #000 !default;

$blue:    #4582EC !default;
$indigo:  #6610f2 !default;
$purple:  #6f42c1 !default;
$pink:    #e83e8c !default;
$red:     #d9534f !default;
$orange:  #fd7e14 !default;
$yellow:  #f0ad4e !default;
$green:   #02B875 !default;
$teal:    #20c997 !default;
$cyan:    #17a2b8 !default;

$primary:       $blue !default;
$secondary:     $gray-200 !default;
$success:       $green !default;
$info:          $cyan !default;
$warning:       $yellow !default;
$danger:        $red !default;
$light:         $gray-100 !default;
$dark:          $gray-800 !default;

*/
// Body

$body-color:                $gray-800 !default;

// Fonts

//$font-size-base:              1.063rem !default;

$headings-font-weight:        700 !default;

// Tables

$table-border-color:          rgba(0,0,0,0.1) !default;

// Buttons

$input-btn-padding-y:         0.5rem !default;
$input-btn-padding-x:         1.1rem !default;

// Forms

//$input-border-color:                    rgba(0,0,0,.1) !default;

$input-group-addon-bg:                  $gray-200 !default !default;

// Navbar

$navbar-dark-color:                 rgba($white,.6) !default;
$navbar-dark-hover-color:           $white !default;

$navbar-light-hover-color:          $body-color !default;
$navbar-light-active-color:         $body-color !default;

// Badges

$badge-font-size:					90%;
/* 
$badge-font-weight:                 normal !default;
$badge-padding-y:                   0.6em !default;
$badge-padding-x:                   1.2em !default;
*/




@import "bootstrap";
@import "medialibrary";
@import "builder";
@import "ionicons/ionicons";
@import "line-awesome";
@import "fonts";


a {
	color:#0366d6;
}

a:hover {
	color:darken(#0366d6, 20%);
}

.navbar {
  font-size: 0.875em;
}

.bg-dark {
  background-color: $success !important;
}

.bg-light {
  background-color: #fff !important;
  border: 1px solid rgba(0, 0, 0, 0.1);

  &.navbar-fixed-top {
    border-width: 0 0 1px 0;
  }

  &.navbar-fixed-bottom {
    border-width: 1px 0 0 0;
  }
}



html, body
{
	height:100%;
	background:#fff;
	text-rendering::optimizelegibility;
}

body > div#container, .small-nav, #content, .main
{
	min-height:100%;
}


#content, .main
{
	display: flex;
	flex-flow: column;
}
/*
.content
{
	padding:0rem 1rem;
	margin:0rem 1rem;
}
*/

.btn
{
	/*box-shadow: 0px 1px 2px #eee;*/
	cursor:pointer;
	/*padding:0.5rem 2rem;*/
}

.custom-select {
    -webkit-appearance: none;
    -moz-appearance: none;
}

/*
.btn-primary
{
	box-shadow:0px 5px 10px #d6dee4;
}*/


/*.collapsing, .collapse {  transition: height 0.01s; }*/

.border-gray
{
	border-color:#eee !important;
}


.btn-gray
{
	background: #f5f5f5;
	border: 1px solid #ddd;
	color: #333;
	/*box-shadow: 0px 2px 3px #eee;*/
}

.btn-icon-single
{
	padding:0rem;
	margin:0rem;
	
	i:first-child
	{
		display: inline-block;
		padding: 0.7rem 1rem;
		font-size: 16px;
		line-height: 0;
		
	}

	&.btn-sm
	{
		i:first-child
		{
			padding: 0.4rem 0.6rem;
		}
	}
	
}

.btn-icon
{
/*	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:3rem;*/
	font-weight:600;
	//font-size:13px;
	text-transform:capitalize;
	margin-bottom:0px;
	padding:0.5rem 2rem;
	
	
	i:first-child
	{
		//padding: 0.7rem 1rem;
		display: inline-block;
		//background: rgba(0,0,0, 0.07);
		margin-right:0.3rem;
		font-size: 16px;
		//line-height: 0;
		//margin-right:1rem;
		opacity:0.7;
	}
	
	&.btn-outline-primary
	{
		border-width:0px;
		box-shadow:0px 0px 1px 0px #3478f2;
		background-color:#fff;

		&:hover
		{
			color:$primary;
			background:$gray-100;
		}
		
		i {
			//border-right:1px solid rgba(0,0,0, 0.1);
			background:transparent;
		}
	}
	
	&.btn-outline-secondary
	{
/*		color:#555;
		border-color:#ccc;*/
	}
	
	&.btn-gray
	{
		i
		{
			/*background: rgba(0,0,0, 0.01);
			background: transparent;
			border-right:1px solid #ddd;*/
		}
	}
	
	&.btn-secondary
	{
		box-shadow:-1px 1px 2px 1px rgba(0,0,0,0.07),-1px 1px 2px 0px rgba(255,255,255,0.15) inset;

		i
		{
			background: transparent;
			/*background: rgba(0,0,0, 0.02);*/
			//border-right:1px solid #eee;
		}
	}

	&.btn-primary
	{
		box-shadow:-1px 1px 2px 1px rgba(0,0,0,0.07),-1px 1px 2px 0px rgba(255,255,255,0.15) inset;

		i
		{
			/*background: rgba(255,255,255, 0.1);*/
		}
	}
	
	&.btn-sm
	{
		i
		{
			padding: 0.5rem 0.5rem;
		}
	}
}


.btn.btn-outline-dark
{
	border-color:#ccc;
}

.btn-outline-secondary
{
	color:#777;
	border-color:#ccc;
	//box-shadow:-1px 1px 2px 1px rgba(0, 0, 0, 0.07), -1px 1px 2px 0px rgba(255, 255, 255, 0.2) inset;
}


/*
.btn-light {

    color: #111;
    background-color: #f9f9f9;
    border-color: #eee;

}
*/
/*
.badge.badge-outline
{
	border:1px solid #aaa;
	color:#333;
}
.badge.badge-gray
{
	border: 1px solid #ccc;
	color: #333;
	background: #f5f5f5f5;
}
*/
.custom-control-input {
  
	~ .custom-control-indicator
	{
		border: 2px solid $custom-control-indicator-bg;
		background-color: #fff;	
	}


  &:checked ~ .custom-control-indicator {
	border:none;
  }

  &:focus ~ .custom-control-indicator {
	border:none;
  }

  &:active ~ .custom-control-indicator {
	border:none;
  }

  &:disabled {
    ~ .custom-control-indicator {
	border:none;
    }
  }
}


.custom-control-label::before {
    background-color: #fff;
    box-shadow: none;
    border: 1px solid #ccc;
}    


.input-group-addon i {
    font-size: 18px;
    line-height: 1;
}

img[src=""]
{
	width:100px;
	height:100px;
	position:relative;
	display:block;
}

img[src=""]::after
{
	content: "\f3f5";
	font-family: "Ionicons";
	width:98px;
	height:98px;
	position:absolute;
	background:#fff;
	top:0px;
	left:0px;
	font-size: 5rem;
	text-align: center;
	vertical-align: middle;
	line-height: 7rem;
}

.main {
    margin-left: 250px;
    position: relative;
    
	#main-content, #content .content {
		padding:0rem 3rem;
	}

    #content,
    #main-content
    {
		background:#fff;
		//box-shadow:1px 1px 3px 1px #f5f5f5;
		//font-size:14px;
		
		form 
		{
			padding:0rem;
		}
		label {
			font-weight:600;
		}
    }
}

.columns
{
	display:flex;
	

	.left-column
	{
		width:auto;
		flex:1;
		margin-top:2rem;
	}
	
	.right-column
	{
		width:300px;
		padding:0rem;
		margin:0rem 0rem 0rem 2rem;
		
		border-left:1px solid rgba(0, 0, 0, 0.1);
		
				
		label.header
		{
			font-size:14px;
			font-weight: 600;
			color:#333;
			padding:0.5rem 2rem;
			
			
		}		
		
		.section
		{
			
			padding:1rem 2rem;
			
		}
	}
}

.actions
{
	text-align:right;
	margin:0rem 2rem;
	padding:1rem;
	border-bottom:1px solid rgba(0, 0, 0, 0.07);
	position:relative;
	margin-bottom:0;
	
	.btn
	{
//		padding:0.7rem 1.3rem;
	}
	
	h4
	{
		font-size:21px;
		font-weight:normal;
	}
	
	> .nav-tabs
	{
		bottom: -1px;
		position: absolute;
	}
}

.flat
{
		.card
		{
			border:none;
			padding-bottom: 0rem;
			
			.card-header
			{
				background:transparent;
				border-bottom:none;
				/*border-top:1px solid rgba(0, 0, 0, 0.125);*/
				font-weight:600;
				padding-left: 0rem;
				//font-size:12px;
			}
		}
		
		.card:first-child .card-header {
			border-top: none;
		}
		

}
/*
.accordion
{
	.card
	{
		border:none;
		.card-header
		{
			background:#fafbfc;
			border-bottom:1px solid rgba(0, 0, 0, 0.05);
			
			> span > a
			{
				color:#333;
				display:block;
			}
			
			.ion-plus
			{
				display:none;
			}
		}
	}
}		
*/
.top-header {
    
    padding:0.3rem;
    margin-bottom:1rem;
	border-bottom:1px solid rgba(0, 0, 0, 0.05);
    
    .btn-group .btn 
    {
		padding-top:0px;
		padding-bottom:0px;
		
		i {
			vertical-align: inherit;
			font-size: 1.2rem;
			display: inline-block;
			margin-bottom: 3px;			
		}
		
		span 
		{
			font-size:14px;
		}
	}
}    

.sidebar 
{ 

	position: fixed;
	top: 0px;
	bottom: 0;
	left: 0;
	width: 250px;
	z-index: 1000;
	display: block;
	//overflow-x: hidden;
	//overflow-y: auto;
	background-color: #fafafa;
	background-color: #fbfcfb;
	background-color: #fff;
	background-color: #fafbfc;
	background-color: #fcfcfc;
	background-color: #f7f7f7;
/*
	background:-moz-linear-gradient(left, #fff 75%, #fafbfc 100%);
	background:-webkit-linear-gradient(left, #fff 75%, #fafbfc 100%);
	background:linear-gradient(left, #fff 75%, #fafbfc 100%);
*/ 
	padding: 1rem 0rem 0rem 0rem;
	/*box-shadow: -1px -3px 2px #eee inset;*/
	/*box-shadow: -1px -2px 1px #f3f3f3 inset;*/
	/*box-shadow: 2px 0px 7px rgba(0,0,0,0.07);*/
	/*box-shadow:2px 0px 7px 2px rgba(0,0,0,0.02) inset;*/
	border-right:1px solid #eee;
	

	.logo {
		float: none;
		margin-bottom: 0rem;
		margin: 4rem 0rem 0 2rem;
		margin: 3rem 0rem 0rem 2rem;
		
		.img
		{
			background-image:url('../img/logo.png');
			background-repeat:no-repeat;
			width:130px;
			height:50px;
			display:inline-block;
			background-position-y: 7px;
		}

		a.menu-toggle 
		{
  		    font-size: 1.5rem; 
			margin-right: 1.5rem;
			margin-left: 0.5rem;
			margin-top: 0.4rem;
			outline:none;
			display: inline-block;
			vertical-align: top;
			float:right;
			
			i 
			{
			  font-size:16px;
			  color:#888;
			  vertical-align: middle;
			  vertical-align:middle;
			}
		}
	}

 .navbar 
  {
	  text-align: left;
	  margin: 3rem auto 0; 
      position:static;
      padding:0px;
      width:99%;
      
      .nav-item
      {
		padding-left:2rem;
		margin:0rem;
		
				
		&.heading
		{
			font-size:10px;
			margin-top:1rem;
			margin-bottom:0.5rem;
			
			a {
				font-size:11px;
				font-weight:normal;
			}
			
			i
			{
				display:none;
			}
			
			span
			{
				text-transform:uppercase;
				font-weight:bold;
				color:#aaa;
			}
		}
	  }
      
	  .nav-link
	  {
		color: #656565;
		color: #555;
		font-size: 13px;
		font-family: Arimo, "Helvetica Neue", Helvetica, Arial, sans-serif; 
		//font-family: Open Sans, "Helvetica Neue", Helvetica, Arial, sans-serif; 
		padding-top:0rem;
		padding-bottom:0rem;
		margin:0.4rem 0rem;

		i 
		{
		  margin-right: 1.3rem;
		  color: #555;
		  vertical-align: middle;
		  font-size: 1.4rem; 
		  
		  &.la-lg {
			font-size:1.6rem;
		  }
		}
	  }
	  
	  .nav-link[data-toggle="collapse"]
	  {
		   position:relative;
		   
		  :after 
		  {
				border-top-color: #aaa;
				display: inline-block;
				width: 0;
				height: 0;
				margin-left: 0.3em;
				vertical-align: middle;
				content: "";
				border-top: 0.3em solid;
				border-right: 0.3em solid transparent;
				border-left: 0.3em solid transparent;


				background: $custom-select-indicator no-repeat right center;
				width: 8px !important;
				height: 8px !important;
				border:none !important;
				vertical-align:0em !important;
				margin-right:1rem;
				position:absolute;
				right:0.5rem;
				top:1rem;
				opacity:0.5;
				
				transform:rotate(270deg);
				
			}
		}
	  
	  
	   .dropdown-toggle:after 
	  {
		border-top-color: #aaa; 
	  }
	  
	  .logo 
	  {
	     display:none
	  }
  }
  
  ul
  {
	list-style:none;
	width:100%;
  }

   .sub-menu {
	  
	  min-width: 200px;
	  //background-color: transparent;
	  border: none;
	  font-size: inherit;
	  float: none;
	  padding-left: 1rem;
	  padding-bottom: 0rem; 
	  position:relative;
	  padding-top:0rem;
	  padding-bottom:0px;
	  margin-left:0rem;
	  top:0px;
	  border-left:1px solid $gray-100;
	  padding-left: 1.7rem;
	  border-radius:0 3px 3px 0px;
	  
	  /* disable bootstrap stupid popper.js css */
	  transform: none !important;
	  left: auto !important;
	  position: relative !important;
	  /* disable bootstrap stupid popper.js css */
	  
	  .small-nav &
	  {		
		background: #fff;
		border: 1px solid #eee;
		border-left: none;
		top: -30px;		
		left:25px !important;

	  }

	  .nav-item 
	  {
		padding: 0; 
		margin:0;
		
		a 
		{
		  color: #555; 
		  font-size:13px;
		  padding:0.7rem 1.1rem 0.6rem;
		  margin:0;
		  
		  &:hover
		  {
			background:$gray-100;
			color:$primary;
		  }
		}
	  }
	}	
	
	#user-info	
	{
		position:absolute;
		bottom:0px;
		width:100%;
		margin-bottom:2rem;
		
		i {
			width: 50px;
			display: inline-block;
			text-align: center;
			height: 50px;
			vertical-align: middle;
			font-size:32px;
			background:$gray-100;
			border-radius:50px;
		}
		
		span
		{
			color:#999;
			font-size:11px;
		}
	}
	
	&.blue
	{
		background:#f4f6f8;
		
		
		.navbar 
		  {
			  
			  .nav-link
			  {
				//color: #fff;

				i 
				{
//				  color: #eee;
				}
				
				.active
				{
				
				}
				
				&.heading
				{
					i
					{
					}
					
					span
					{
						//color:#aaa;
					}
				}
			  
			  }
			  
			  .nav-link[data-toggle="collapse"]
			  {
				   
				  :after 
				  {
						border-top-color: #aaa;
					}
				}
			  
			  
			   .dropdown-toggle:after 
			  {
				border-top-color: #aaa; 
			  }
		}
	}
	
	
	&.black
	{
		background:#333;
		
		
		.navbar 
		  {
			  
			  .nav-link
			  {
				color: #fff;

				i 
				{
				  color: #eee;
				}
				
				&.heading
				{
					i
					{
					}
					
					span
					{
						color:#aaa;
					}
				}
			  
			  }
			  
			  .nav-link[data-toggle="collapse"]
			  {
				   
				  :after 
				  {
						border-top-color: #aaa;
					}
				}
			  
			  
			   .dropdown-toggle:after 
			  {
				border-top-color: #aaa; 
			  }
		  }
	}
}


.small-nav
{

	transition:all 1s;
	
	.sidebar
	{
		padding:0rem;
		width:50px;
		overflow-x:inherit;
		overflow-y:inherit;
		background:#f5f5f5;
		
		.navbar, .logo
		{
			margin:2rem 0rem 0rem 0.3rem;
			padding:0rem;
		}
		
		.logo
		{
			.img
			{
				background-image:url('../img/logo-small.png');
				margin-left:2px;
			}
			
			a
			{
				margin-left:0.5rem;
				margin-top:1rem;
				float:none;
				display:block;
				
				i
				{
					font-size:22px;
				}
			}
			
		}
		
		.navbar
		{
			.nav-link i, a i
			{
				color:#333;
				margin-right:0;
			}
			
			.nav-link[data-toggle="collapse"] ::after
			{
				background:none;
			}
		
		
			.nav-item
			{
				padding-left:0;
				
				.dropdown .dropdown-menu 
				{
					position:absolute;
					border: 1px solid #eee;
					border-left: none;
					box-shadow: 1px 2px 2px #eee;				
					left: 22px;
					background:#fff;
				}
				
				.nav-item.dropdown:hover .dropdown-menu 
				{
					display: block;
				}	
				
				> ul
				{
					left:46px !important;	
				}
			}
			

		
			.dropdown-toggle::after
			{
				display:none;
			}
		}
		
		.title
		{
			display:none;
		}
		
		
	}

	.main
	{
		margin-left:50px;
	}
	
	#user-info	
	{
		i {
			margin:0rem 0rem 0rem 0rem;
			background:transparent;
		}
		
		span {
			display:none;
		}
	}

}

@include media-breakpoint-up(sm) {

 .navbar 
  {

	.nav-item
      {
		margin:0.5rem 0rem;
		position:relative;
		
		

			> ul {
				display: none;
				/* right: 0px; */
				opacity: 1;
				position: absolute !important;
				/* top: 0px; */
				left: 248px !important;
				background: #fff;
				box-shadow: 0px 0px 2px 1px rgba(0,0, 0, 0.05);
				box-shadow: 2px 1px 3px 1px rgba(0, 0, 0, 0.1);
				
				border-right:1px solid rgba(0,0, 0, 0.1);
				border-top:none;
				border-left:none;
				border-bottom:1px solid rgba(0,0, 0, 0.1);
				padding:0px;
				
				background-color: #fafbfc;
				background:-moz-linear-gradient(left, #fff 85%, #fafbfc 100%);
				background:-webkit-linear-gradient(left, #fff 85%, #fafbfc 100%);
				background:linear-gradient(left, #fff 85%, #fafbfc 100%);
				background:rgba(255,255,255, 0.95);
			
				li {
					margin:0px;
					padding:0;
				}
				
			}
			
			&:hover {
				background:#007bff;
				background:$gray-100;
				&.heading
				{
					background:transparent;
				}
				
				> a 
				{
					//color:#007bff;	
					i 
					{
						color:#007bff;
					}
					
					span:after 
					{
						color:#007bff;
					}
				}
				
				 >  ul
				{
					display:block;
				}
			}
			
      }
	 
  }


}

//mobile
@media (max-width: map-get($grid-breakpoints, 'sm')) {

	.sidebar 
	{
		position:static;
		width:100%;
		box-shadow:none;
		border-bottom:1px solid $gray-100;
		padding: 1rem 0rem 0rem 2rem;
		.navbar
		{
			margin:0rem;
			padding:0rem;
			
			.navbar-collapse
			{
				margin:1rem 0rem 0rem;
			}

			.logo
			{
				display:block;
			}
			
			.navbar-toggler
			{
				font-size:2rem;
			}
		}
	
		.logo 
		{
			margin:0rem;
			display:none;
		}

	}	
	.main
	{
		margin:0px;
	}

	.filters {

		div.btns
		{
			.form-group
			{
				margin-left:0rem;
			}
		}
	}
	
	.columns
	{
		display:block;
		.left-column
		{
			width:auto;
		}
		.right-column
		{
			width:auto;
			padding:0rem;
			margin:0rem;
			border:none;
		}
	}
	
	.actions
	{
		text-align:left;
	}
}

//large screens
/*
@media (min-width: 1600px) {
	
	.sidebar 
	{
		width:300px;
		
		.logo {
			float: none;
			margin: 5rem 0rem 0 3.7rem;
		}

		.navbar 
		{
		  margin: 3rem auto 0 2rem; 
		}
	 }
	 
	.main
	{
		margin-left:300px;
	}


}
*/


.filters {
  color: #999; 
  margin:2rem 1rem 2rem 2rem;	

	 .btn-link, a {
	  color: #333; 
	}

	.btns
	{
		text-align:right;
		
		.form-group
		{
			margin-left:1rem;
		}
	}
	
	label
	{
		margin-bottom: 0rem;
		vertical-align: middle;
		padding-top: .3rem;	
	}
	.custom-select
	{
	/*
		margin: 0px;
		padding-left: 0px;
		padding-top: 0px;
		color: #555;
		margin-top: 0.7rem;
		height: auto;*/
		border:none;
		margin-right: 1rem;
	}
}

#filters
{
	.card
	{
		border:none;
		background:#fafafa;
		margin-bottom: 2rem;
		box-shadow:1px 1px 5px 2px #eee;
	}
}

.pagination {
	.page-item 	{
		
		.page-link {
			//margin-right: 10px;
		}
		
		
		&.active .page-link
		{
			//	background:#eee;
		}
	  }
}




body.login
{
	background:-moz-linear-gradient(top left,#fff 1%, #f5f5f5 100%);
	background:-webkit-linear-gradient(top left,#fff 1%, #f5f5f5 100%);
	background:-linear-gradient(top left,#fff 1%, #f5f5f5 100%);
	background:#f5f5f5;
}

.login-form {
  background: #fff;
  box-shadow:0px 3px 3px 0px rgba(0,0,0,0.05);
  border-top:1px solid #eee;
  border-radius:4px;
  
  .login-form-content {
	padding: 3rem 3.5rem;
  }
  
  .logo-content {
	padding: 3rem 0 0rem;  
	text-align:center;
  }
}

@media (min-width: 768px) {
  .login-container {
    margin: 30% 3rem 0rem; 
   } 
}

.form-control
{
	font-size:inherit;
}

.login-form .form-group { 
	
	 .form-control, .input-group-append button {
	  border: 1px solid #ddd;
	  height: 50px;
	  padding: 1.2rem; 
	}

	 .form-control {
	  box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.05) inset;
	}
}

.login-form .form-group .form-control:focus {
  border-color: rgba(66, 133, 244, 0.5); 
}

.login-form .form-group .form-control.input-dark:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.login-form .form-group .form-control.input-dark::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.login-form .form-group .form-control.input-dark::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.login-form .form-group .form-control.input-dark:-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.login-form .form-group .form-control.input-dark::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
 }

.login-form .form-group .form-control.input-dark:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}



/*
select[name=visibility] option[value="public"]   {  }
*/



.grid-stack-item-content .card
{
    /*display: block;*/
    height: 100%;
    border:1px solid rgba(0, 0, 0, 0.08);
    
	.table {
		font-size:90%;
	}
	
    .close
    {
		color:#777;
    }
    
    .card-title
    {
		font-weight:normal;
		color:#000;
		margin-bottom:1rem;
		cursor: grabbing;
    }
    
    .card-header {
		cursor: grabbing;
    }
}



/*grape js*/
.editor
{
	overflow:hidden;

}


.content
{
	.nav-tabs, .nav-pills {

		.nav-link {
			padding: 0.5rem 1.5rem;
			text-transform:capitalize;
		}

	  .nav-link.active,
	  .nav-item.show .nav-link {
		box-shadow:-1px 1px 2px 1px rgba(0, 0, 0, 0.1), -1px 1px 2px 0px rgba(255, 255, 255, 0.2) inset;
		//backgrond-color:#fff;
		//border-top-color:$blue;
	  }
	  
	  margin-bottom:0rem;
	}
}


/*.tab-content > .tab-pane
{
	padding-top:2rem;
}
*/

/*
.nav-tabs.flat .nav-item.active .nav-link, 
.nav-tabs.flat .nav-link.active, 
.nav-tabs.flat .nav-item.show .nav-link
{
	border:none;
	border-bottom:2px solid #1e88e5;
	color:#1e88e5;
}
*/
.nav-tabs .nav-item {
	/*margin-bottom: 0px;*/
}


.table
{
	 thead
	 {
			th
			{
				color:#333;
				vertical-align:middle;
				border-bottom-width:1px;
				border-top: none;
				border-bottom: none;
				vertical-align:middle;
				font-weight:normal;

				&.col-cb
				{
					width:50px;
				}
			}
	 }

	 tbody
	 {
		 td
		 {
			vertical-align:middle;
			border-top-color:#eee;
			
			&.img
			{
				text-align:center;
				width:100px;
			}
			
			&.col-cb
			{
				width:50px;
			}
		 }
	 }
	 
}

/* 404 error animation */

.screen
{
	display: flex;
	flex-flow: column;
	align-content: center;
	align-self: center;
}

.screen img
{
/*	box-shadow:0 3px 5px -3px #000000;
	box-shadow:0 20px 20px -10px rgba(0, 0, 0, 0.7);*/
	//top:-100px;
	max-width:90%;

/*
	animation: 100s ease-out 0s 1 rotateearth;
	animation-duration: 418s; 
	animation-timing-function: ease-out;
	animation-delay: 0s;
	animation-iteration-count: 100;
	animation-name: rotateearth;
*/
}



@keyframes rotateearth {
  0% {
	 -webkit-transform: rotate(0deg);
	 -moz-transform: rotate(0deg);
	 -o-transform: rotate(0deg);
	  transform: rotate(0deg);  }
  100% {
	 -webkit-transform: rotate(360deg);
	 -moz-transform: rotate(360deg);
	 -o-transform: rotate(360deg);
	  transform: rotate(360deg);
    }
}



.dropdown-toggle::after
{
	background: $custom-select-indicator no-repeat right center;
	width: 8px !important;
	height: 8px !important;
	border:none !important;
	vertical-align:0em !important;
}

.dropdown-toggle.chevron-big::after
{
	width: 12px !important;
	height: 12px !important;
}


.invalid-feedback
{
	font-size:1rem;
}


td.img img
{
	max-height:50px;
	max-width:50px;
}

.theme td.img img,
.plugin td.img img
{
	max-height:300px;
	max-width:300px;
}

.checkbox_outer
{
	.custom-control
	{
		min-height:auto;
	}
}

//dashboard
.grid-stack-item-content
{
	i.icon
	{
		font-size:3.5rem;
		padding:0 1rem;
	}
	
	.number
	{
		font-size:3.2rem;
		font-weight:300;
		padding:0 2rem;
	}
}


.grid-stack > div.grid-stack-item > div.grid-stack-item-content
{
	overflow-y:hidden;
	//box-shadow:0px 1px 7px 0px rgba(0, 0, 0, 0.07);
	
	.card
	{
		//border-color: rgba(0, 0, 0, 0.07);
	}
}
.grid-stack > div.grid-stack-item > div.grid-stack-item-content:hover
{
	overflow-y:auto;
}

/*
.table th, .table td
{
	border-top:none;
	border-bottom:1px solid #dee2e6;
}
*/



.card-header
{
	font-weight: 600;
	background: #fafafa;
	color:#000;
	border-bottom: none;
}


.custom-control.large
{
	padding-left:0px;
}

.custom-checkbox.large .custom-control-label::before,
.custom-checkbox.large .custom-control-label::after
{
	top:-4px;
	left:-3px;
	width:30px;
	height:30px;
	border-color:#ddd;
}

.modal-backdrop
{
	background:rgba(255,255,255,0.8);
}

.modal-backdrop.show
{
	opacity:1;
}

.modal .modal-content
{
	//transform: translateY(-60px) scale(1.1);
	box-shadow: 10px 10px 60px -25px;
	border: 1px solid rgba(0,0,0,0.14);
}

.modal.show .modal-content
{
	//transform: translateY(0) scale(1);
}

.modal-full .modal-dialog.modal-xl {
	max-width:90%;
}

@media (min-width: 1400px) {
  .modal-xl {
    max-width: none; 
   } 
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {

    border-color: #ccc;
    background-color: transparent;

}



input.autocomplete-list {
	border-radius: 5px 5px 0px 0px;
}

div.autocomplete-list {

    box-shadow: -1px 1px 2px 1px rgba(0, 0, 0, 0.07) inset;
    background: #fafafa;
    border-radius: 0px 0px 5px 5px;
    overflow:auto;
    min-height:150px;
    height:150px;

}
.autocomplete-list > div:nth-child(2n) {
    background: #f5f5f5;
}
.autocomplete-list > div {
    padding: 0.2rem 0.5rem;
}


.badge {
    padding: 0.25em 0.4em;
    font-weight: 600;
}	


.btn {

	.loading {
		display:none;
		
	}

	&.loading {
		position:relative;
		
		.loading {
			display:block;
		}
	
		.button-text {
			display:none;
		}
		
		.progress-text {
			display: block;
			font-size: 70%;
			position: absolute;
			color: #333;
			margin-bottom: 0.3rem;
			bottom: -30px;		
		}

	}
}

.themes {
	background:hsl(0, 0%, 98%);
	.list-card {
		
		&.active {
			 .card-img-top {
				border-bottom:none;
			}
			
			.card {
				background:rgba(62, 123, 238, 0.05);
				//background:rgba(62, 123, 238, 0.1);
				//background:darken($primary, 30%);
				//color:#fff;
				
				a {
					//color:#fff;
				}
				
				.text-muted {
					//color:rgba(255,255,255,0.5) !important;
				}
			}
		}
	}
}

	
.list-card .card{
  padding: 0;
  font-size: 12px;
  border-radius: 4px;
  box-shadow: hsl(0, 0%, 80%) 0 0 16px;
  box-shadow: rgba(255,255,255,0.1) 0 0 6px inset, rgba(0,0,0,0.2) 1px 1px 32px -6px;
  border:none;
  overflow: hidden;
  background-color: hsl(0, 0%, 100%);
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  
  -ms-flex-direction: column;
        flex-direction: column;
		
	.btn-preview {
		display:none;
	}
	
}	

.list-card .card .info {
	float:left;
}

.list-card .card .buttons {
	float: right;
}	

.list-card .card .card-img-top{
	border-bottom:1px solid rgba(0, 0, 0, 0.125);
}

.list-card .card .card-footer {
	opacity:0;
	border-top: none;
	position: absolute;
	background: rgba(255,255,255,0.9);
	width: 100%;
	transition:opacity 0.3s;
	text-align:center;
	height: 70px;
	bottom: 100px;	
}

.list-card .card:hover {
	.card-footer {
		opacity:1;
	} 
	
	.btn-preview {
		display:inline-block;
	}
}



.list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
  list-style:none;
}

@supports (display: grid) {
  .list {
    display: -ms-grid;
    display: grid;
    //-ms-grid-columns: (minmax(320px, 1fr))[auto-fill];
     grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  }
  
  
	@media only screen and (min-width: 1600px) {
	  .list {
		//-ms-grid-columns: (minmax(30%, 1fr))[auto-fill];
		 grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
		}
	}
	
	@media only screen and (min-width: 2100px) {
	  .list {
		//-ms-grid-columns: (minmax(25%, 1fr))[auto-fill];
		 grid-template-columns: repeat(auto-fill, minmax(25%, 1fr));
  	}
	}
}


/* card area */
.list-card {
  -ms-flex: 1 0 30%;
      flex: 1 0 30%;
  min-width: 0;
  margin: 16px;  
}


@media (min-width: 640px) {
	.list-card  {
		min-width: 320px;
	}
}


#import-iframe {
	min-height: 500px;
	width:100%;
	height:100%;
	border: none;
	display: none;
}