/*REMOVALS CALCULATOR*/

/* The Modal (background) */
.furniture-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

div#removals-calculator {
    width: 100%;
}

div#removals-calculator-header {
    color: #fff;
    width: 98%;
    background-color: #024a94;
    text-align: center;
}

.progress-indicator {
    margin: 0 auto;
    max-width: 480px;
    margin-top: 24px;
}

.progress-wrapper {
    width: 50%;
    margin: 0 auto;
}

.progress-wrapper img {
    max-width: 100%;
}

span#removals-calculator-title {
    text-transform: uppercase;
    width: inherit;
    font-size: 1.9em;
    margin: auto;
    clear: both;
    float: left;
}

span#removals-calculator-subtitle {
    width: inherit;
    font-size: 1.2em;
    margin: auto;
    clear: both;
    float: left;
}

.calculator-error-message {
    color: red;
    clear: both;
    float: right;
}

.prev, .prevUnit {
    float: left;
    min-height: inherit;
    height: 60px;
    padding: 2px;
    background-color: #024a94;
    border-top: none;
    border-bottom: none;
    border-left: none;
    border-right: 1px solid #3371b1;
    color: white;
/*    background: #008fd0;
    background: -moz-linear-gradient(top, #008fd0 0%, #2989d8 33%, #024a94 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008fd0), color-stop(33%,#2989d8), color-stop(100%,#024a94));
    background: -webkit-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: -o-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: -ms-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: linear-gradient(to bottom, #008fd0 0%,#2989d8 33%,#024a94 100%);*/
    }

.next, .nextUnit, .typetablinks {
    float: left;
    min-height: inherit;
    height: 60px;
    padding: 2px;
    background-color: #024a94;
    border: none;
    color: white;
/*    background: #008fd0;
    background: -moz-linear-gradient(top, #008fd0 0%, #2989d8 33%, #024a94 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008fd0), color-stop(33%,#2989d8), color-stop(100%,#024a94));
    background: -webkit-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: -o-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: -ms-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
    background: linear-gradient(to bottom, #008fd0 0%,#2989d8 33%,#024a94 100%);
*/    }

.next, .nextUnit, .prev, .prevUnit {
    width: 5%;
}

.typetablinks {
    width: 30%;
    border-right: 1px solid #3371b1;
    text-transform: uppercase;
}

.typetablinks:hover {
    float: left;
    min-height: inherit;
    height: 60px;
    padding: 2px;
    background-color: #008fd0;
    border: none;
    color: white;
    background: #024a94;
    background: -moz-linear-gradient(top, #024a94 0%, #2989d8 66%, #008fd0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#024a94), color-stop(66%,#2989d8), color-stop(100%,#008fd0));
    background: -webkit-linear-gradient(top, #024a94 0%,#2989d8 66%,#008fd0 100%);
    background: -o-linear-gradient(top, #024a94 0%,#2989d8 66%,#008fd0 100%);
    background: -ms-linear-gradient(top, #024a94 0%,#2989d8 66%,#008fd0 100%);
    background: linear-gradient(to bottom, #024a94 0%,#2989d8 66%,#008fd0 100%);
    }

.removaltypetabcontent {
    display: none;
    text-align: center;
}

button.calculate {
    background: #009c47;
/*    background: -moz-linear-gradient(top, #02926e 0%, #029202 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#02926e), color-stop(100%,#029202));
    background: -webkit-linear-gradient(top, #02926e 0%,#029202 100%);
    background: -o-linear-gradient(top, #02926e 0%,#029202 100%);
    background: -ms-linear-gradient(top, #02926e 0%,#029202 100%);
    background: linear-gradient(to bottom, #02926e 0%,#029202 100%);
*/    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02926e', endColorstr='#029202',GradientType=0 );
    color: #fff;
    text-transform: uppercase;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: none;
    font-size: 1em;
    padding: 10px;
    color: #fff !important;
    min-width: 20%;
    width: auto;
    float: right;
    margin: 15px 0 15px 0;
    }

button.calculate:hover {
    color: #fff;
    background: #72bbfa;
/*    background: -moz-linear-gradient(top, #029202 0%, #02926e 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#02926e), color-stop(100%,#029202));
    background: -webkit-linear-gradient(top, #029202 0%, #02926e 100%);
    background: -o-linear-gradient(top, #029202 0%, #02926e 100%);
    background: -ms-linear-gradient(top, #029202 0%, #02926e 100%);
    background: linear-gradient(to bottom, #029202 0%, #02926e 100%);
*/    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#029202', endColorstr='#02926e',GradientType=0 );
    text-decoration: none;
    }

button.active {
    background: #ff952f;
    background: -moz-linear-gradient(top, #ff952f 0%, #ff6d07 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff952f), color-stop(100%,#ff6d07));
    background: -webkit-linear-gradient(top, #ff952f 0%,#ff6d07 100%);
    background: -o-linear-gradient(top, #ff952f 0%,#ff6d07 100%);
    background: -ms-linear-gradient(top, #ff952f 0%,#ff6d07 100%);
    background: linear-gradient(to bottom, #ff952f 0%,#ff6d07 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff952f', endColorstr='#ff6d07',GradientType=0 );
    }

button.blue-button {
    background: #008fd0;
    background: -moz-linear-gradient(top, #008fd0 0%, #024a94 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008fd0), color-stop(100%,#024a94));
    background: -webkit-linear-gradient(top, #008fd0 0%, #024a94 100%);
    background: -o-linear-gradient(top, #008fd0 0%, #024a94 100%);
    background: -ms-linear-gradient(top, #008fd0 0%, #024a94 100%);
    background: linear-gradient(to bottom, #008fd0 0%, #024a94 100%);
    color: #fff;
    text-transform: uppercase;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: none;
    font-size: 1em;
    padding: 5px;
    color: #fff !important;
    width: 20%;
    float: left;
    margin-top: 15px;
}

button.blue-button:hover {
    background: #024a94;
    background: -moz-linear-gradient(top, #024a94 0%, #008fd0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#024a94), color-stop(100%,#008fd0));
    background: -webkit-linear-gradient(top, #024a94 0%, #008fd0 100%);
    background: -o-linear-gradient(top, #024a94 0%, #008fd0 100%);
    background: -ms-linear-gradient(top, #024a94 0%, #008fd0 100%);
    background: linear-gradient(to bottom, #024a94 0%, #008fd0 100%);
}

#removals-calculator  #furniture-selection-modal button.flat-blue {
    box-sizing: inherit;
    border-radius: 0;
    border: #3371b1 solid 1px;
    margin: 10px 0 10px 0;
    padding: 0;
    background: #024a94;
    color: #fff !important;
    width: 100%;
    font-size: initial;
    text-transform: uppercase;
}

#removals-calculator .sidebar-tile button.blue-button, button.flat-blue {
    box-sizing: inherit;
    border-radius: 0;
    border: #3371b1 solid 1px;
    margin: 5px;
    padding: 10%;
    background: #024a94;
    color: #fff !important;
    width: 100%;
    text-transform: uppercase;
}

#removals-calculator .sidebar-tile button.blue-button:hover, button.flat-blue:hover {
    background: #fff;
    color: #024a94 !important;
}

#removals-calculator  #furniture-selection-modal button.flat-blue:hover {
    background: #fff;
    color: #024a94 !important;
}

#removals-calculator input, #removals-calculator select, #removals-calculator textarea {
    border: #3093e1 1px solid;
    width: 100%;
    min-height: 60px;
    color: #024a94;
    padding: 1%;
}

#removals-calculator input[type="radio"] {
    min-height: 20px;
    height: 20px;
}

#removals-calculator #furniture-selection-modal input.qty {
    min-height: 30px;
    width: 25%;
    margin: 1px;
    padding: 1px;
    text-align: center;
}

#removals-calculator #furniture-selection-modal input.qtyplus, #removals-calculator #furniture-selection-modal input.qtyminus {
    min-height: 30px;
    width: 15%;
    margin: 1px;
    padding: 1px;
    text-align: center;
    background-color: #024a94;
    color: #fff;
    border: none;
}

#removals-calculator div#kitchen-contents, #removals-calculator div#lounge-contents, #removals-calculator div#bedroom-contents {
    width: 31%;
    margin: 1%;
    overflow: hidden;
}

#removals-calculator div#home-office-contents, #removals-calculator div#antique-contents, #removals-calculator div#outside-contents, #removals-calculator div#garage-contents {
    width: 23%;
    margin: 1%;
    overflow: hidden;
}

div.room-furniture-header {
    width: 100%;
    color: #024a94;
    font-size: 1.2em;
    text-align: center;
}

#removals-calculator .calculator-form-tag {
    margin: 15px 0 15px 0;
    padding: 5px;
    clear: left;
    float: left;
    width: 100%;
}

#furniture-selection-modal .calculator-form-tag, #furniture-selection-modal .increment-buttons {
    width: 50%;
    min-height: 40px;
    max-width: 60%;
    display: inline-block;
    padding: 4px 0 4px 0;
    font-size: 1em;
    box-sizing: content-box;
    vertical-align: middle;
    margin: auto;
}

#furniture-selection-modal .increment-buttons {
    text-align: right;
}

div#selection-buttons {
    overflow: hidden;
}

div#customer-details-input, div#moving-date-input {
    width: 100%;
    float: left;
    padding: 1%;
}

div#origin-details-input, div#destination-details-input {
    width: 48%;
    float: left;
    padding: 1%;
}

div#home-contents-input, div#property-size-input {
    overflow: hidden;
    padding: 1%;
}

div#home-contents-input button.blue-button {
    width: 100%;
    margin: 0;
}

div#home-contents-input .home-contents-fifty-width {
    width: 50%;
    max-width: 50%;
    padding: 5px;
    float: left;
}

div#home-contents-input .home-contents-fifty-width .calculator-form-tag {
    margin: 0;
}

div#customer-details-input {
    clear: both;
}

#removals-calculator select {
    height: 40px;
}

div#origin-results, div#destination-results {
    display: inline-block;
    min-height: 200px;
    margin: 5px;
    float: left;
    width: 48%;
}

div#map-container {
    width: 98%;
    margin: 5px;
}

#property-size-input .bedrooms-selection {
    /*width: 14.6667%;*/
    width: 10.5%;
    margin: 1%;
    float: left;
    text-align: center;
    font-size: 1rem;
    word-break: normal;
    hyphens: auto;
    overflow: hidden;
}

#removals-calculator .bedrooms-selection input[type="radio"] {
    margin-right: 40%;
    margin-left: 40%;
    width: 20%;
}

#property-size-input img {
    max-width: 100%;
    max-height: 80px;
}

#home-contents-input a#furniture-button img {
    float: left;
    clear: both;
    max-width: 100%;
    max-height: 100px;
}

a#furniture-button {
    box-sizing: content-box;
    float: left;
    text-align: center;
    padding: 10px;
    margin: 5px;
    background-size: 80px 140px;
    background-repeat: no-repeat;
}

.calculator-tile, .sidebar-tile {
    margin: 1%;
    padding: 5px;
    float: left;
}

.calculator-tile {
    width: 64%;
}

.sidebar-tile {
    width: 31%;
}

.calculator-tile h3 {
    padding: 10px;
    margin-top: 0;
    background-color: #024a94;
    color: #fff;
    text-transform: uppercase;
}

.sidebar-tile .feefo-link {
    width: 100%;
    text-align: center;
    float: left;
    margin: 15px 0 15px 0;
}

div#estimate-header, div#contact-us-header {
    width: 98%;
    padding: 20px;
    text-align: center;
    font-size: xx-large;
    color: #024a94;
}

#map-container input, #origin-results input, #destination-results input {
    margin: 1%;
    padding: 5px;
    max-width: 98%;
    float: left;
}

#map-container div.calculator-form-tag {
    width: 49%;
}

#map-container div.results-fields {
    float: right;
    width: 50%;
}

/*#genericunits, #periodselection, .datetablinks {
	padding: 20px;
	}

.tab {
    float: left;
    width: 100%;
    min-height: 60px;
    margin: 5px;
    }

.typetablinks {
    width: 30%;
    min-height: inherit;
    }

.removaltypetabcontent, .unitselection, .unittabcontent, .datetablinks {
    display: none;
    margin: 5px;
    text-align: center;
    }

.removaltypetabcontent {
    min-height: 300px;
    }

.unittabcontent {
	min-height: 285px;
	}

.datetabcontent {
    min-height: 180px;
    text-align: center;
    }

#leedsunits button.unittablinks {
	width: 9%;
	min-height: inherit;
	}

#harrogateunits button.unittablinks {
    width: 4.73%;
    min-height: inherit;
    }

#wakefieldunits button.unittablinks {
	width: 6.43%;
	min-height: inherit;
	}

.unittablinks, .typetablinks, .unitselection {
	color: #ffffff;
	text-transform: uppercase;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
	border: none;
	float: left;
	}

#genericunits, .datetablinks {
    background-color: #024a94;
    color: #ffffff;
    text-transform: uppercase;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align: center;
    border: none;
    float: left;
    }

button.unittablinks, button.typetablinks {
	background-color: #024a94;
	color: #ffffff;
	text-transform: uppercase;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	border-right: 1px solid #3371b1;
	float: left;
	height: 60px;
	background: #008fd0;
	background: -moz-linear-gradient(top, #008fd0 0%, #2989d8 33%, #024a94 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008fd0), color-stop(33%,#2989d8), color-stop(100%,#024a94));
	background: -webkit-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: -o-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: -ms-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: linear-gradient(to bottom, #008fd0 0%,#2989d8 33%,#024a94 100%);
	}

#datepickers {
	width: 100%;
	}

#datepickers .datepicker {
	width: 100%;
	padding: 10px;
	text-align: center;
	background-color: #024a94;
	text-transform: uppercase;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	border-right: 1px solid #3371b1;
	float: left;
	height: 60px;
	background: #008fd0;
	background: -moz-linear-gradient(top, #008fd0 0%, #2989d8 33%, #024a94 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008fd0), color-stop(33%,#2989d8), color-stop(100%,#024a94));
	background: -webkit-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: -o-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: -ms-linear-gradient(top, #008fd0 0%,#2989d8 33%,#024a94 100%);
	background: linear-gradient(to bottom, #008fd0 0%,#2989d8 33%,#024a94 100%);
	}

.datepicker-tag {
	color: #fff;
	display: inline;
	}

#storeresult, #unitresult {
	text-transform: capitalize;
	font-weight: 700;
	}

.removaltypetabcontent iframe {
	float: right;
	}

#unitplaceholder {
	clear: both;
	}

#storage-calculator h3 {
	clear:both;
	padding-top: 20px;
	padding-bottom: 10px;
	}

.calculator-unit-description, .calculator-unit-minidescription {
	max-width: 45%;
	clear: left;
	float: left;
	text-align: left;
	}

.calculator-unit-description {
	font-weight: 600;
	}

.calculator-unit-minidescription {
	font-weight: 500;
	}

.unittabcontent img {
	width: 400px;
	}

.calculator-address, .calculator-telephone, .calculator-email, .calculator-openinghours {
	margin: 10px;
	text-align: left;
    }

div#removal-origin, div#removal-destination {
    width: 48%;
    float: left;
}

div#origin-results, div#destination-results {
    float: left;
    width: 45%;
    margin: 1%;
}*/

@media (max-width: 1000px) {
    #removals-calculator .calculator-tile, #removals-calculator .sidebar-tile {
        text-align: left;
        padding: 2px;
        margin: 2px;
        display: inline-block;
        width: 100%;
    }

    div#origin-results, div#destination-results, div#origin-details-input, div#destination-details-input, div#customer-details-input {
        width: 100%;
    }

    #removals-calculator div#kitchen-contents, #removals-calculator div#home-office-contents, #removals-calculator div#lounge-contents, #removals-calculator div#antique-contents, #removals-calculator div#bedroom-contents, #removals-calculator div#outside-contents, #removals-calculator div#garage-contents {
        width: 100%;
    }

    div#moving-date-input {
        width: 100%;
    }

    #origin-details-input .bedrooms-selection {
        font-size: 0.8rem;
        width: 18%;
        margin: 0 1% 0 1%;
    }

    .bedrooms-selection img {
        margin: 1%;
    }

    #furniture-selection-modal .calculator-form-tag, #furniture-selection-modal .increment-buttons {
        text-align: center;
        margin: auto;
    }

    #map-container div.results-fields {
        float: none;
        width: auto;
    }

    div#estimate-header, div#contact-us-header {
    font-size: 1.7em;
    }

    #map-container div.calculator-form-tag {
        width: auto;
    }

    #removals-calculator .sidebar-tile button.blue-button, button.flat-blue {
        margin: 4px 0 4px 0;
        padding: 15px;
    }

    #removals-calculator .bedrooms-selection input[type="radio"] {
    margin-right: 20%;
    margin-left: 20%;
    width: 60%;
    }

    div#home-contents-input .home-contents-fifty-width {
    width: 100%;
    max-width: 100%;
    float: none;
    }

    div#home-contents-input button.blue-button {
        margin-bottom: 10px;
    }

    span.bedroom-tag {
        display:none;
    }