/* the norm */
#gritter-notice-wrapper {
  position: fixed;
  top: 50px;
  right: 10px;
  width: 301px;
  z-index: 999; }
  #gritter-notice-wrapper.top-left {
    left: 20px;
    right: auto; }
  #gritter-notice-wrapper.bottom-right {
    top: auto;
    left: auto;
    bottom: 20px;
    right: 20px; }
  #gritter-notice-wrapper.bottom-left {
    top: auto;
    right: auto;
    bottom: 20px;
    left: 20px; }

.gritter-item-wrapper {
  position: relative;
  margin: 0 0 10px 0; }

.gritter-top, .gritter-bottom {
  height: 0; }

.gritter-item {
  display: block;
  padding: 7px 10px 10px;
  font-size: 14px;
  font-family: verdana;
  color: #000;
  background-color: #FFFFCC;
  background: #ffc none repeat scroll 0 0;
  box-shadow: 5px 5px 7px rgba(33, 33, 33, 0.7);
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px; }

.gritter-item p {
  padding: 0;
  margin: 0;
  word-wrap: break-word;
  font-size: 14px;
  line-height: 14px; }

.gritter-close {
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
  width: 16px;
  height: 16px;
  font-size: 16px;
  color: black;
  background: transparent; }

.gritter-title {
  font-size: 16px;
  font-weight: bold;
  padding: 0 0 7px 0;
  display: block; }

.gritter-image {
  width: 32px;
  height: 32px;
  float: left;
  margin: 5px; }

.gritter-with-image, .gritter-without-image {
  padding: 0; }

.gritter-with-image {
  width: 220px;
  float: right; }

/* for the light (white) version of the gritter notice */
.gritter-light .gritter-item {
  display: block;
  padding: 7px 10px 10px;
  font-size: 14px;
  font-family: verdana;
  color: #000;
  background-color: #EBF6DF;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px; }
.gritter-light .gritter-bottom, .gritter-light .gritter-top, .gritter-light .gritter-close .gritter-light .gritter-title {
  text-shadow: none; }