/* Generated by less 2.5.1 */
/*
This sets the dimensions of the boxes
*/
.wrap {
  width: 400px;
  height: 275px;
}
/*
This sets the background for the boxes
and other css you might want to use in them 
*/
.box1 {
  background: #EBDCE1;
}
.box2 {
  background: #E84C40;
}
/*
This sets the rounded corners on the boxes
adapt it or delete it
*/
.trimmings {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}
body,
html {
  width: 100%;
  height: 100%;
  padding: 0;
  font-family: sans-serif;
  background: #FDF9E0;
}
h1 {
  margin-bottom: 50px;
  font-family: 'Carter One', sans-serif;
  color: #485C82;
}
h2 {
  line-height: 120%;
  font-family: 'Satisfy', cursive;
}
.outer {
  margin: 50px;
  float: left;
  width: 400px;
}
.panels {
  background: #B0D1A2;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  display: block;
  float: left;
  margin: 20px 0 0;
  padding: 20px;
  width: 400px;
}
#slices {
  width: 30px;
  font-size: 16px;
  padding: 5px;
  text-align: center;
  border: 0 none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 3px 3px 3px #888 inset;
  -moz-box-shadow: 3px 3px 3px #888 inset;
  box-shadow: 3px 3px 3px #888 inset;
  font-weight: bold;
}
#dash {
  background: #018B7C;
  left: 30px;
  padding: 8px 10px 10px;
  color: #fff;
  cursor: pointer;
  z-index: 9999;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: inline-block;
  padding: 5px 10px;
  font-weight: bold;
  font-size: 1.3em;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
}
#dash:hover {
  background: #002622;
}
img[align="left"] {
  margin-right: 10px;
}
img[align="right"] {
  margin-left: 10px;
}
label {
  cursor: pointer;
}
.w100 {
  padding: 10px 0;
  text-align: center;
  width: 100%;
}
.btn-success {
  background: #018B7C;
  border: 0;
  -webkit-transition: 0.3s all;
  -o-transition: 0.3s all;
  transition: 0.3s all;
}
.btn-success:hover {
  background: #01ae9c;
}
#explain {
  float: left;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  color: #fff;
  background: url(http://rayhyde.nl/playground/img/playground.png) no-repeat scroll center 100% #607aad;
  padding: 20px 20px 200px;
  position: relative;
  width: 100%;
}
#explain a {
  color: #fff;
  text-decoration: underline;
}
#explain a:hover {
  text-decoration: none;
}