@charset "utf-8";

.tent-size-calculator { position: relative; width: 100%; padding: 0px; margin: 0px auto; text-align: left; background: #F6F6F6; border: 1px solid #DDD; line-height: 1; }
.tent-size-calculator h3 { font-size: 22px; padding-left: 0px; color: #1d5b80; }
.tent-size-calculator input { border: 1px solid #CCC; background: #FFF; height: 30px; padding: 0px 7px; }
.tent-size-calculator select { border: 1px solid #CCC; background: #FFF; height: 30px; padding: 0px 7px; }
.calc-section { position: relative; padding: 20px 5% 35px; border-bottom: 1px solid #DDD; }
.calc-section:nth-of-type(even) { background: #F9F9F9; }
.calc-section.last { border-bottom: 0px none; }
.calc-buttons ul { text-align: left; }
.calc-buttons ul li { position: relative; display: inline-block; text-align: center; margin: 0px 15px 0px 0px; }
.calc-buttons ul li:last-child { margin: 0px; }
.calc-output input { }
.calc-btn { display: block; min-width: 120px; padding: 15px 10px; border: 1px solid #CCC; background: #FFF; text-transform: uppercase; font-size: 16px; }
.calc-btn:hover { cursor: pointer; }

.half-width { width: 50%; }

@media screen and (max-width : 700px) {
  .calc-output input { display: block; width: 60%; margin: 0px auto 10px; }
  .calc-output input:last-of-type { margin-bottom: 0px; }
}
@media screen and (max-width : 500px) {
  .calc-output input { width: 80%; }
  .calc-buttons ul li { display: block; width: 80%; margin: 0px auto 10px; }
  .calc-buttons ul li:last-child { margin-bottom: 0px; }
}