@import url('level.css');
@import url('/bootstrap/css/bootstrap.css');
@import url('/bootstrap/css/bootstrap-responsive.css');


h1 {
    font-size:25px;
    line-height:30px;
}

ol.numbered {
    list-style-type:decimal;
}

.policies {
    text-align:center;
}

.error {
  color: Red;
}

div#trustBox						{margin:25pt 0 0 0;line-height:10pt;clear:both;background-color:#fff;overflow:hidden;padding:3pt 0 3pt 0}

	div#trustBox div.policies		{font-size:8pt;float:left;margin:0 0 0 5pt}

		div#trustBox div#trustLogos ul		{list-style-type:none;}
		div#trustBox div#trustLogos li		{float:left;margin:0 2pt}

	div#trustBox #weAccept			{font-size:8pt;}
	div#trustBox #weAccept img		{vertical-align:middle;}


.form-horizontal input.textbox:required, .form-horizontal textarea:required {
    background: #fff url(../images/asterix.png) no-repeat 98% center;
}

::-webkit-validation-bubble-message {
    padding: 1em;
}

.form-horizontal input.textbox:focus:invalid, .form-horizontal textarea:focus:invalid { /* when a field is considered invalid by the browser */
    background: #fff url(../images/invalid.png) no-repeat 98% center;
    box-shadow: 0 0 5px #d45252;
    border-color: #b03535
}

.form-horizontal input.textbox:required:valid, .form-horizontal textarea:required:valid { /* when a field is considered valid by the browser */
    background: #fff url(../images/valid.png) no-repeat 98% center;
    box-shadow: 0 0 5px #5cd053;
    border-color: #28921f;
}


input[type=text]:focus, textarea:focus {
    width: 226px;
    -webkit-transition: width 0.25s;
     transition: width 0.25s;
}

.input-valid {
  background: #fff url(../images/valid.png) no-repeat 98% center !important;
  border-color: #468847 !important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(70, 136, 71, 0.6) !important;
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(70, 136, 71, 0.6) !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(70, 136, 71, 0.6) !important;
}

.input-invalid {
  background: #fff url(../images/asterix.png) no-repeat 98% center !important;
  border-color: #b94a48 !important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(185, 74, 72, 0.6) !important;
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(185, 74, 72, 0.6) !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(185, 74, 72, 0.6) !important;
}

.padd-left {
  padding-left:20px;
}

a:hover { cursor:pointer; }

/* ================================================== */
/* ePostcode+ styles                                  */
/* ================================================== */

.epcp__results {
  position: absolute;
  color: #858585;
  border: 1px solid #cccccc;
  max-height: 245px;
  overflow-y: auto;
  overflow-x: hidden;
  white-space: nowrap;
  background-color: white;
}

.epcp__results__item {
  padding: 10px 20px;
  color: black;
  cursor: pointer;
}

.epcp__results__item--selected {
  background-color: #e61e5f;
  color: white;
}

/*.row-fluid div.stripePanel,
.row-fluid div.paypalPanel {
    min-height:200px;
    padding:10pt 10pt 10pt 10pt;
    background-color:#fff;
}

.row-fluid div.stripePanel
{
  width:60%;
}
.row-fluid div.paypalPanel {
  width:30%;
}*/

div.box1, div.box2 {
  background-color: rgba(0,0,0,0.075);
}

    div.box1 .inner, div.box2 .inner {
        padding:3pt;
        min-height:275px;
        text-align:center;
    }


#orderSummary .row-fluid {
    margin-bottom:10pt;
}
#orderSummary .row-fluid:nth-child(2n+1)
{
    background-color:rgba(0,0,0,0.07);
    padding:5pt 0;
}


#yourDetailsRight .fauxLabel span {
    font-weight:bold;
    padding-right:10pt;
    float:right;
}

@media (max-width:767px) {
    #yourDetails .span4,
    #otherPaymentMethods .span4 {
        margin-top:20pt;
    }

    div.box2 {
        margin-top:20pt;
    }
}

@media (min-width:768px) and (max-width:979px) {

    .form-horizontal .control-label {
        float:none;width:100%;
        text-align:left;
    }
    .form-horizontal .controls {
        margin-left:0;
    }

}

@media (max-width: 480px) {
    .box2 .form-horizontal .control-label {
        float: none;
        width: 220px;
        padding-top: 0;
        text-align: left;
        margin: auto;
        display:block;
    }
}

fieldset.seeMe {
    background-color:rgba(0,0,0,0.04);
    padding:0.25em;
    margin-bottom:1em;
}

fieldset.seeMe legend {
    background-color:#fff;
    margin-left:0;
    margin-right:0;
}

.addressBlocks {
}

.addressBlocks .addressBlock {
    min-height:200px;
    border-top:4px solid rgba(0,0,0,0.3);
}


@media (min-width:768px)
{
    .addressBlock:nth-child(4n+1) {
        margin-left:0;
    }
}

@media (max-width:767px) and (min-width:620px)
{
    .row-fluid .addressBlock.span3 {
        width:31.914893617021278%;
        float:left;
        margin-left:2.127659574468085%;
    }
    .row-fluid .addressBlock.span3:nth-child(3n+1) {
        margin-left:0;
    }
}

    @media (max-width:619px) and (min-width:400px)
{
    .row-fluid .addressBlock.span3 {
        width:48.93617021276595%;
        float:left;
        margin-left:2.127659574468085%;
    }
    .row-fluid .addressBlock.span3:nth-child(2n+1) {
        margin-left:0;
    }
}

.orderedItem {
background-color:rgba(0,0,0,0.04);
padding:5pt;
margin-bottom:20pt;
}


.orderedItem h3 {
    font-size:1rem;
}

/* Renew Toggle Start */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

  .slider:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

  .slider.round:before {
    border-radius: 50%;
  }

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 17px;
}

  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }

/* Renew Toggle End */

@media (max-width:320px)
{
    .orderedItem h3 {
        font-size:11pt;
        line-height:15pt;
    }
}

@media (min-width:321px) and (max-width:425px)
{
    .orderedItem h3 {
        font-size:15pt;
        line-height:18pt;
    }
}

@media (min-width:426px) and (max-width:768px)
{
    .orderedItem h3 {
        font-size:18pt;
        line-height:22pt;
    }
}