/* BRIEF DESCRIPTION OF STYLESHEET'S PURPOSE.

   developer:   YOURWRIUSERNAME
   requires:    /common/framework/css/framework.en.css
                /ANY/OTHER/RELATED/STYLESHEETS.en.css
   ========================================================================== */

/* ==========================================================================
   main
   ========================================================================== */
.main {
   font-family: 'Source Sans Pro', Arial, sans-serif;
}
.inner {
   margin: 0 auto;
   max-width: 960px;
   padding: 0 12px;
}
.hr {
   border: 0;
   border-top: 1px solid #b7b7b7;
}
.main a {
   color: #dd1600;
}
.main a:hover {
   color: #ff8500;
}
.grid > *:nth-of-type(1) {
   padding: 0 1rem 0 0;
}
.grid > *:nth-of-type(2) {
   padding: 0 0 0 1rem;
}
a.button { 
   background: #fff; 
   border: 1px solid #dd1100;
   border-radius: 2px;
   color: #dd1100; 
   padding: 0 .7rem;
}
a.button:hover {
   background: #fe0000;
   border: 1px solid #b00f00;
   color: #fff;
}
a.button:active {
   background: #b00f00;
   color: #fff;
}
.show-hide-button {
   background: transparent;
   border: 0;
   color: #dd1100;
   padding: 0 0 0 18px;
   position: relative;
}


/* header
   ========================================================================== */
.header {
   background: #ececec;
}
.header h1 {
   font-size: 2.75rem;
   padding: 3rem 0;
}

/* section
   ================================== */
.section h1 {
   color: #dd1600;
   font-size: 2.19rem;
   font-weight: 300;
   margin: 1rem 0;
}
.section h2 {
   color: #f57300;
   font-size: 1.25rem;
   margin: 1rem 0 0;
   text-transform: uppercase;
}
.section .inner {
   color: #656565;
   margin: 2.5rem auto 3rem;
}
.section p {
   line-height: 1.8;
   margin: 1rem 0;
}
.section p:last-of-type {
   margin: 0;
}
.section .hr {
   margin: 2.5rem 0 1.5rem;
}
.links {
   margin: 1rem 0 0;
}
.links li {
   line-height: 1.8;
}
.grid .list {
   margin: .8rem 0 0;
}
.list li {
   line-height: 1.8;
   padding: 5px 0 5px 10px;
   position: relative;
}
.list li:before {
   background: #dd1100;
   content: '';
   display: inline-block;
   height: 5px;
   left: 0;
   position: absolute;
   top: 1.1rem;
   width: 5px;
}

/* chart
   ================================== */
.chart {
   width: 100%;
   margin: 0 0 3rem;
}
.chart td {
   border: 1px solid #d6d6d6;
   font-size: .875rem;
   padding: 10px 15px;
   vertical-align: middle;
}
.chart th:nth-of-type(1) {
   color: #dd1100;
   font-size: 1.125rem;
   padding: 7px 15px;
   text-align: left;
}
.chart.first th:nth-of-type(2) {
   background: #ff8500;
   border: 1px solid #d6d6d6;
   color: #fff;
   padding: 7px;
}
.chart.first th:nth-of-type(3) {
   background: #fa5100;
   border: 1px solid #d6d6d6;
   color: #fff;
   padding: 7px;
}
.chart:not(.first) th:nth-of-type(2) {
   color: #ff8500;
}
.chart:not(.first) th:nth-of-type(3) {
   color: #fa5100;
}
.chart td:nth-of-type(2),
.chart td:nth-of-type(3) {
   padding: 10px 0;
   text-align: center;
   width: 9rem;
}
.chart td:nth-of-type(3) {
   background: #f0f0f0;
}
.checked:before {
   background: url('../img/check.png') no-repeat center top;
   content: '';
   display: block;
   height: 15px;
   margin: auto;
   width: 19px;
}
.chart .button {
   font-size: .8rem;
   padding: 0 .7rem 1px;
}

/* footer
   ================================== */
.footer {
   background: #f86401;
   color: #fff;
   padding: 3rem 12px;
}
.footer .inner {
   background: url('../img/contact-us.png') no-repeat left .2rem;
   color: #fff;
   font-weight: 300;
   padding: 0 12px 0 85px;
}
.footer .text {
   display: table-cell;
   max-width: 600px;
   vertical-align: top;
}
.footer .button-cell {
   display: table-cell;
   font-weight: 400;
   padding: 10px 0 0 0;
   text-align: right;
   width: 120px;
}
.footer .button {
   color: #ff8500;
   padding: 3px 15px;
}
.footer .button:hover {
   color: #fff;
}

/* ==========================================================================
   responsive breakpoint styles
   ========================================================================== */

/* styles for large screens (1200px)
   ========================================================================== */

@media all and (max-width: 1200px) {}

/* styles for medium screens (900px)
   ========================================================================== */

@media all and (max-width: 900px) {}

/* styles for small screens (600px)
   ========================================================================== */

@media all and (max-width: 600px) {
   .grid > *:nth-of-type(1) {
      margin: 0 0 1rem;
      padding: 0;
   }
   .grid > *:nth-of-type(2) {
      padding: 0;
   }
   .grid .list:first-of-type {
      margin: 1rem 0 0;
   }
   .grid .list {
      margin: 0;
   }
   .chart td:nth-of-type(2) {
      width: 4rem;
   }
   .chart td:nth-of-type(3) {
      width: 6.5rem;
   }
   .footer .text {
      display: inline-block;
   }
   .footer .button-cell {
      display: inline-block;
      text-align: left;
   }
}

/* styles for minimum supported screen width (320px)
   ========================================================================== */

@media all and (max-width: 320px) {}

/* printer styles
   ========================================================================== */

@media print {}