/**
 * ------------------------------------------------------------------------
 *
 *  @name      Bitlogix PHP Simple Framework
 *  @author    Samuel Artino <artino.samuel@outlook.it>
 *
 *  @copyright 2016 BitLogix, All Rights Reserved
 *
 * ------------------------------------------------------------------------
 */

.blur
{
	filter: url(../images/blur.svg);
	-webkit-filter: blur(1px);
	filter: blur(1px);
}

.backdrop
{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.2);
  /* box-shadow: inset 0 0 32px rgb(26, 35, 41); */
  z-index: 2000;
  overflow: auto;
  /*display: none;*/

	display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  cursor: not-allowed;
}

.backdrop > .dialog
{
  /*position: fixed;
  left: 50%;
  top: 30%;
  transform: translate(-50%, -40%);
  opacity: 1.0;
  width: 420px;
  background-color: #fff;
  overflow: hidden;
  z-index: 1003;
  border-radius: 4px;
  box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.8);*/

	margin-top: -128px;
	position: relative;
	width: 420px;
  background-color: #f9f9f9;
	border-radius: 4px;
  box-shadow: 0 0 40px rgba(0, 0, 0, .2), 0 4px 8px rgba(0, 0, 0, .1);
}

.backdrop > .dialog.error
{
	/*background-color: #F44336;

	color: #ecf0f1 !important;
    text-shadow: 0px 2px 0px rgba(0,0,0,0.14);*/
}

.backdrop > .old.dialog-progress
{
	position: fixed;

  transform: translate(-50%, -40%);
  left: 50%;
  top: 40%;

  /*zoom: 0.1;
  opacity: 0.2;*/

	width: 100px;
	height: 100px;

	background-color: #fff;
	box-shadow: 0 9px 4px -6px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2);

	overflow: hidden;

	z-index: 1003;

	/*padding: 24px;*/
	border-radius: 50%;

  background-image: url(https://www.drupal.org/files/issues/throbber_13.gif);/*url(../images/loaders/loader_4.gif);*/
  background-size: 80px;
  background-repeat: no-repeat;
  background-position: center;

  cursor: wait;
}

.backdrop > .dialog-progress
{
  position: fixed;
  transform: translate(-50%, -40%);
  left: 50%;
  top: 40%;
  width: 100px;
  height: 100px;
  /* background-color: #fff; */
  /* box-shadow: 0 9px 4px -6px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2); */
  overflow: hidden;
  z-index: 1003;
  /* padding: 24px; */
  border-radius: 50%;

  /*background-image: url(https://s-media-cache-ak0.pinimg.com/originals/58/4b/60/584b607f5c2ff075429dc0e7b8d142ef.gif);
  */
  background-image: url(/jumboo/cdn/images/loaders/loader_cloud.gif);
  background-size: 160px;
  background-repeat: no-repeat;
  background-position: center;
  cursor: wait;
}

.backdrop > .dialog-progress > .text
{
  font-size: 24px;
  font-weight: 100;
  color: #ecf0f1 !important;
  text-shadow: 0px 2px 0px rgba(0,0,0,0.14);
}

.backdrop > .dialog > .title
{
	display: block;
	font-size: 16px;
	font-weight: bold;
	padding: 20px;
}

.backdrop > .dialog > .message
{
	display: block;
  max-height: 220px;
  font-size: 13px;
  font-weight: 100;
  overflow: auto;
  padding: 0 20px 20px 20px;
}

.backdrop > .dialog > .tools
{
	display: flex;
	justify-content: flex-end;
  padding: 8px 16px;
}

.backdrop > .dialog > .tools > .btn
{
	padding: 8px 18px;
	margin-right: 4px;
	font-size: 13px;
	font-weight: 100;
	color: inherit;
	background-color: rgba(0,0,0,0.1);
	/* border: 1px solid #ccc; */
	border: none;
	outline: none;
	border-radius: 8px;

	cursor: pointer;

	-webkit-transition: all .3s;
	   -moz-transition: all .3s;
	    -ms-transition: all .3s;
	     -o-transition: all .3s;
			 	  transition: all .3s;
}

.backdrop > .dialog > .tools > .btn:hover
{
	box-shadow: 0 8px 4px -6px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2);
}

.backdrop > .dialog > .tools > .btn.positive
{
	background-color: #396;
	color: #fff;
}

.backdrop > .dialog > .tools > .btn.orange
{
	background-color: #f39c12;
	color: #ecf0f1;
    text-shadow: 0px 2px 0px rgba(0,0,0,0.14);
}*/

@media (max-width: 600px)
{
	.backdrop > .dialog
	{
		/*left: 0;*/

		/*transform: translate(-50%, -40%);*/
		width: 100%;
		border-radius: 0;
	}
}

/* TOAST */
.copy
{
	cursor: copy !important;
}

.copy:hover
{
	background-color: #ecf0f1;
}

.toast
{
	position: fixed;

  left: 50%;
  transform: translateX(-50%);
  top: 50px;

  font-size: 13px;
	font-weight: 500;
  text-align: center;

  z-index: 1002;

  border-radius: 6px;

	display: flex;
	align-items: center;
	overflow: hidden;

	background-color: #fff;
	box-shadow: 0px 1px 2px 0px rgba(60,64,67,0.3), 0px 1px 3px 1px rgba(60,64,67,0.15);
}

.toast .material-icons
{
	font-size: 27px;
	padding: 18px 11px;
	line-height: 15px;
	font-weight: 700;
	color: #F44336;
}

.toast > .text
{
	font-size: 13px;
	flex: 1;
	margin-right: 16px;
}