/*
//==========================================================================================================================
// Alert box styling.
//
// Last modified: 29.10.16
// Author: Romet Saarna (aka TheKuru) http://wizil.eu
//==========================================================================================================================

/* alert box container */
.alert-box {
 color: #555;
 border-radius: 10px;
 font-family: Tahoma, Geneva, Arial, sans-serif;
 font-size: 11px;
 padding: 10px 10px 10px 50px;
 box-sizing: border-box;
}

/* error */
.alert-box-error {
 background: #ffecec url('error_32x32.png') no-repeat 10px 50%;
 border: 1px solid #f5aca6;
}

/* success */
.alert-box-success {
 background: #e9ffd9 url('success_32x32.png') no-repeat 10px 50%;
 border: 1px solid #a6ca8a;
}

/* warning */
.alert-box-warning {
 background: #fff8c4 url('warning_32x32.png') no-repeat 10px 50%;
 border: 1px solid #f2c779;
}

/* notify */
.alert-box-notify {
 background: #e3f7fc url('notice_32x32.png') no-repeat 10px 50%;
 border: 1px solid #8ed9f6;
}




/* Mobile Styles */
@media only screen and (max-width: 400px) {
 .alert-box {
  width: 100%;
  margin: 0;
 }
}


/* Tablet Styles */
@media only screen and (min-width: 401px) and (max-width: 960px) {
 .alert-box {
  width: 55%;
  margin: 10px;
  margin-left: 10px;
 }
}


/* Desktop Styles */
@media only screen and (min-width: 961px) {
 .alert-box {
  width: 30%;
  margin: 10px;
  margin-left: 20px;
 }
}