@media all and (max-width: 740px) {
  body {
    margin: 30px 20px 30px 20px;
  }
  #genie-logo {
    width: 310px;
  }
}

@media all and (min-width: 739px) {
  body {
    margin: 25px 100px 75px 100px;
  }
  #genie-logo {
    width: 500px;
  }
}

pre {
  overflow-x: scroll;
  white-space: pre;
  word-wrap: normal;
}

h3 {
  color: #999
}

#genie-logo {
  cursor: pointer;
}

#fork-me {
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
}

.follow-social {
  margin-top: 12px;
}

#styles-control .radio {
  margin: 0 10px 0 0;
  display: inline-block;
}

.genie-lamp-container {
  opacity: 0;
}

.fast .genie-lamp-container {
  transition: all .2s ease-in-out;
}

.slow .genie-lamp-container {
  transition: all 1s ease-in-out;
}

.genie-lamp-container.visible {
  opacity: 1;
  z-index: 1050;
}

/* ng-genie default styles */
.genie-lamp-container {
  position: fixed;
  top: 10%;
  left: 50%;
  z-index: -1;
  -mos-border-radius: 8px;
  border-radius: 8px;
}

.lamp-input {
  -mos-border-radius: 8px;
  border-radius: 8px;
  margin: 0px;
  width: 100%;
}

.genie-lamp-container div {
  width: 100%;
  cursor: pointer;
  overflow-y: auto;
  margin-top: 10px;
}

.lamp-wish {
}

.wish-img-icon, .wish-i-icon {
  vertical-align: middle;
}

.lamp-wish.focused {
  -mos-border-radius: 8px;
  border-radius: 8px;
}

/* ng-genie light styles */
.light .genie-lamp-container {
  color: #333;
  background-color: #F7F7F7;
  box-shadow: 0px 0px 26px 6px #888888;
}

.light .lamp-wish.focused {
  background-color: #DDD;
}

/* ng-genie light styles */
.dark .genie-lamp-container {
  color: rgb(238, 238, 238);
  background-color: #474747;
  box-shadow: 0px 0px 26px 6px #CCCCCC;
}

.dark .lamp-input {
  background-color: #272727;
  border-color: #2E2E2E;
  color: white;
}

.dark .lamp-wish.focused {
  background-color: #2E2E2E;
}


/* ng-genie large styles */
.large .genie-lamp-container {
  width: 600px;
  margin-left: -300px;
  padding: 16px;
}

.large .lamp-input {
  line-height: 60px;
  padding: 0px 12px 0px 12px;
  font-size: 40px;
  height: 60px;
}

.large .lamp-wishes-container {
  max-height: 300px;
  font-size: 30px;
}

.large .lamp-wish {
  padding: 0px 12px 0px 12px;
  line-height: 50px;
}

.large .wish-img-icon, .large .wish-i-icon {
  height: 35px;
  margin-right: 10px;
}

/* ng-genie small styles */
.small .genie-lamp-container {
  width: 300px;
  margin-left: -150px;
  padding: 12px;
}

.small .lamp-input {
  line-height: 50px;
  padding: 0px 12px 0px 12px;
  font-size: 34px;
  height: 54px;
}

.small .lamp-wishes-container {
  max-height: 216px;
  font-size: 18px;
}

.small .lamp-wish {
  padding: 0px 12px 0px 12px;
  line-height: 36px;
}

.small .wish-img-icon, .small .wish-i-icon {
  height: 20px;
  margin-right: 5px;
}
