/*---------------- TAGS -------------------------*/
b, strong {font-weight:700;}
i, em {font-style:italic;}
img {border:none;}
a {text-decoration:none;}

/*---------------- DISPLAY ----------------------*/
.hide {display:none;}
.inline {display:inline-block;}
.block {display:block;}
.overflow-auto {overflow:auto;}

/*---------------- BOXES ------------------------*/
.box {padding:10px;-moz-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;}
.flat-top {-moz-border-radius-topleft: 0px;-moz-border-radius-topright: 0px;border-top-left-radius: 0px;border-top-right-radius: 0px;}
.yellow-back {background:#ffe666;}
.tan-back {background:#fff1aa;}
.blue-back {background:#82b8b8;}
.green-back {background:#aee601;}
.grey-back {background:#ebebeb;}
.blue-button {
	background:#82b8b8;
	border-radius:25px;
	-moz-border-radius:25px;
	color:#fff;
	border:0;
	padding:5px 10px 5px 10px;
	position:absolute;
	top:5px;
	right:5px;
}

/*---------------- POSITIONING ------------------*/
.clear {clear:both;}
.right {float:right;}
.left {float:left;}
.no-float {float:none;}
.align-top {vertical-align:top;}
.align-middle {vertical-align:middle;}
.align-left {text-align:left;}
.align-right {text-align:right;}
.align-center {text-align:center;}
.centered {display:block;margin:0 auto;}
.relative {position:relative;}
.absolute {position:absolute;}

/*---------------- WIDTH -------------------*/
.span5 {display:inline-block;width:50px;}
.span6 {display:inline-block;width:60px;}
.span7 {display:inline-block;width:70px;}
.span8 {display:inline-block;width:80px;}
.span9 {display:inline-block;width:90px;}
.span10 {display:inline-block;width:100px;}
.span11 {display:inline-block;width:110px;}
.span12 {display:inline-block;width:120px;}
.span13 {display:inline-block;width:130px;}
.span15 {display:inline-block;width:150px;}
.span16 {display:inline-block;width:160px;}
.span18 {display:inline-block;width:180px;}
.span20 {display:inline-block;width:200px;}
.span25 {display:inline-block;width:250px;}
.span26 {display:inline-block;width:260px;}
.span32 {display:inline-block;width:320px;}
.span38 {display:inline-block;width:380px;}
.span41 {display:inline-block;width:410px;}
.span43 {display:inline-block;width:430px;}
.span44 {display:inline-block;width:440px;}
.span48 {display:inline-block;width:480px;}
.span51 {display:inline-block;width:510px;}
.span53 {display:inline-block;width:530px;}
.span54 {display:inline-block;width:540px;}
.span55 {display:inline-block;width:550px;}
.span56 {display:inline-block;width:560px;}
.span57 {display:inline-block;width:570px;}
.span58 {display:inline-block;width:580px;}
.span59 {display:inline-block;width:590px;}
.span61 {display:inline-block;width:610px;}
.span62 {display:inline-block;width:620px;}
.span93 {display:inline-block;width:930px;}
.span94 {display:inline-block;width:940px;}
.max-span5 {display:inline-block;max-width:50px;}
.max-span6 {display:inline-block;max-width:60px;}
.max-span7 {display:inline-block;max-width:70px;}
.max-span8 {display:inline-block;max-width:80px;}
.max-span20 {display:inline-block;max-width:200px;}

/*---------------- HEIGHT -------------------*/
.long5 {height:50px;}
.long7 {height:70px;}
.long10 {height:100px;}
.long25 {height:250px;}
.max-long5 {max-height:50px;}
.max-long7 {max-height:70px;}
.max-long8 {max-height:80px;}

/*---------------- MARGINS ------------------*/
.margin-auto {margin:auto;}
.no-margin {margin-right:0 !important; margin-left:0 !important; margin-top:0 !important;margin-bottom:0 !important;}
.push1 {margin-left:10px;}
.push2 {margin-left:20px;}
.push3 {margin-left:30px;}
.push4 {margin-left:40px;}
.push5 {margin-left:50px;}
.push8 {margin-left:80px;}
.push9 {margin-left:90px;}
.push24 {margin-left:240px;}
.push-right1 {margin-right:10px;}
.push-right2 {margin-right:20px;}
.push-right4 {margin-right:40px;}
.push-right8 {margin-right:80px;}
.pull1 {margin-left:-10px;}
.pull2 {margin-left:-20px;}
.pull5 {margin-left:-50px;}
.pull6 {margin-left:-60px;}
.pull7 {margin-left:-70px;}
.pull16 {margin-left:-160px;}
.lift3 {margin-top:-30px;}
.drop1 {margin-top:10px;}
.drop2 {margin-top:20px;}
.drop4 {margin-top:40px;}

/*---------------- PADDING ------------------*/
.pad0 {padding:0;}
.pad1 {padding:10px;}
.pad2 {padding:20px;}
.pad-left0 {padding-left:0;}
.pad-left2 {padding-left:20px;}
.pad-left3 {padding-left:30px;}
.pad-right0 {padding-right:0;}
.pad-right1 {padding-right:10px;}
.pad-right2 {padding-right:20px;}
.pad-top1 {padding-top:10px;}
.pad-top2 {padding-top:20px;}
.pad-bottom2 {padding-bottom:20px;}

/*---------------- SPACERS ----------------------*/
.v1 {height:10px;}
.v2 {height:20px;}
.v25 {height:25px;}
.v4 {height:40px;}
.h1 {display:inline-block;width:10px;}
.h2 {display:inline-block;width:20px;}

/*---------------- TEXT TRANSFORM --------------*/
.uppercase {text-transform:uppercase;}

/*--------------- MISC -------------------------*/
.spoiler {background:#000;color:#000;}
.spoiler:hover {color:#fff;}
.pointer {cursor:pointer;cursor:hand;}
.line-fix {line-height:18px;}
.round-inputs input[type='text'] {-moz-border-radius:25px;border-radius:25px;padding:5px 10px 5px 10px;width:50px;}
.label-clear label {clear:both;}
.big-inputs input[type='text'], .big-inputs textarea {width:530px;padding:10px;}
.show-list-styles ol, .show-list-styles ul {margin-left:10px;}
.show-list-styles ul {list-style-type:disc;}
.show-list-styles ol {list-style-type:decimal;}
.on-top {z-index:2;}
.colorpicker {z-index:3;}
.rounded {-moz-border-radius:25px;border-radius:25px;}

form.stretch-inputs input[type='text'], form.stretch-inputs textarea {width:550px;padding:10px;}

/*---------------- FORM ERRORS ------------------*/
input.error, textarea.error {border:solid 2px #f77;}
label.error {color:#f77;padding:5px;margin:0;float:none;display:block;clear:both;}

/* Unread messages notification pop-up */
#notificationBox {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 99;

  display: none;
  flex-direction: column;
  justify-content: space-between;

  width: 300px;
  height: 300px;
  margin-top: -150px;
  margin-left: -150px;
  padding: 10px;

  background: #aee601;
  border-radius: 10px;
}
#notificationBox div {
  font: 26px 'Yanone Kaffeesatz', Helvetica, serif;
  color: #39c;
  text-align: center;
}
#notificationBox a {
  color: inherit;
}
#notificationBox .nb-title {
  font-size: 24px;
  padding-left: 5px;
  text-align: left;
}
#notificationBox .nb-content {
  margin-bottom: 30px;
}
#notificationBox .nb-alert {
  margin-bottom: 7px;
  font-size: 28px;
  font-weight: bold;
  color: #b13200;
}
#notificationBox .nb-inbox {
  /*font-weight: bold;*/
}
#notificationBox .nb-settings {
  float: right;
  font-size: 18px;
}
#notificationBox .nb-x {
  float: right;
  margin-top: -7px;
  margin-right: -5px;
  padding: 7px;
  font-size: 18px;
}
