.form-group{
    color: #000000;
    font-size: 16px;
}
.invalid-feedback{
    color: white!important;
    background-color: #F97178;
    border-radius: 0 0 3px 3px;
    line-height:2rem;
    padding-left:10px;
}
.form-control.is-invalid{
    border-color: #F97178;
}
.form-control.is-invalid:focus{
    border-color: #F97178;
}
.kt-portlet__body{
    color: none;
}

.external{
    padding-top: 30px;
    padding-bottom: 60px;
    font-size: 16px;
    background-color:#547380!important;
    /*background-color: #849c94;*/
    /*background-color:#f2f3f8!important;*/
}

input {
    box-shadow:none!important;
}

textarea {
    box-shadow:none!important;
}

label {
    color:white;
}


.submit-btn{
    color: #fff;
    background-color: #0f9b49;
    border-color: #0d843e;
}
#query_map{
    width: 100%;
    min-height: 410px;
}
.map-details{
    background-color: grey;
    color: white;
    text-align: center;
    font-weight: bold;
    width: 100%;
    height: 29px;
    padding-top: 5px;
}
.title{
    font-size: 30px;
    font-weight: bold;
    color: white;
    letter-spacing: -1px;
}


.custom-paragraph{
    color: white;
    font-size: 16px;
}
input[name="travel_date"], input[name="return_date"], input[name='deliver_date'] {
}

.external .form-control {
    max-width: 100%;
    padding: 10px 12px;
    font-size: 16px;
    height: 50px;
    border-width: 0px;
    color: black;
    background-color: white;
    box-shadow: -2px 1px 9px 2px #e6e6e6;
}
.form-control:focus {
    max-width: 100%;
    border-width: 1px;
    color: black;
    background-color: white;
}


input[type="text"] {
    max-width:60px;
}

.bootstrap-select > .dropdown-toggle.btn-light, .bootstrap-select > .dropdown-toggle.btn-secondary {
    border: none;
}
.form-group label {
    font-weight: 400;
    font-size: 16px;
}
#message{
    height: auto!important;
}
.filter-option-inner-inner{
    color: #000000;
    font-size: 16px;
}

<!---->

.standard-container {
    width:1200px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
}

.slideshow-container {
    display:flex;
    flex-direction:column;
    min-width:100%;
    padding:0px 30px 100px 30px;
}

.form-body {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    width:100%;
    align-items: flex-start;
}

.form-wrapper {
    display:block;
    width:100%;
}

.flex-row-start {
    display:flex;
    flex-direction:row;
    justify-content: flex-start;
    flex-wrap:wrap;
    flex-grow:4 4 1;
}

.flex-row-between {
    display:flex;
    flex-direction:row;
    justify-content:space-between;
}


.secondrow {
    flex-direction:row-reverse;
    justify-content: flex-end;
}

.varyorder {
    order:1;
}

.left-column {
    display:flex;
    min-width:100%;
    flex-direction:column;
    flex-grow:2;
    padding-top:2px;
}

.extra-line {
    padding-top:0;
}

.right-column {
    display:none;
    width:50%;
    flex-direction:column;
    padding: 0 20px 0 20px;
}

.more-link {
    color:lightskyblue!important;
    text-decoration: underline;
    cursor:pointer;
}

.sticky-nav-wrapper {
    position:fixed;
    display:block;
    width:100%;
    bottom:0;
    left:0;
    background-color:#2e3642;
    box-shadow:0 0 8px 0 grey;
}

.sticky-nav {
    width:100%;
    bottom:0;
    left:0;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    padding:25px;
    align-items: center;
}

/* Make circles that indicate the steps of the form: */
.step {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbbbbb;
  border: none;  
  border-radius: 50%;
  display: inline-block;
  opacity: 0.5;
}

.step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
.step.finish {
  background-color: #4CAF50;
}

.slide {
    display:none;
}

.nav-btn {
    padding:10px;
    min-width:110px;
    border-radius:5px;
    font-weight:bold;
    border:none;
}

.primary {
    background-color:#a4d100;
    color:white;
}

.secondary {
    background-color:transparent;
    color:#a4d100;
    border: solid 1px;
    border: solid 1px;
    border-color:#a4d100;
}

.fillspace {
    opacity:0;
}

.kt-switch {
    display:block;
    max-height:33px;
}
.kt-switch label {
    margin-bottom:0;
}

.kt-switch span {
    margin-bottom:320;
}

.form-group {
    margin-bottom:0.8rem!important;;
}

.time-picker-icon{
            padding-right: 50px;
            background-image: url(https://image.ibb.co/btgA9k/imgpsh_fullsize.png);
            background-repeat: no-repeat;
            background-position: 97% 4px;
            background-size: 28px 30px;
}
.fullscreen-btn {
    position:absolute;
    right:10px;
    top:10;
    background-color: #2e3642;
    border-radius:8px;
    margin-right:25px;
    display:block;
    height:36px;
}

.kt-radio label {
}

@media only screen and (max-width: 744px) {
    .right-column {
        display:none;
    }

    .varyorder {
        order:2;
    }
}

@media only screen and (max-width:576px) {
    .sticky-nav {
        padding:10px;
        width:100%;
    }
    .step {
        height:10px;
        width:10px;
    }
    .fullscreen-btn {
    margin-right:0px;
    }
    .slideshow-container {
        padding-left:10px;
        padding-right:10px;
    }
    .title {
        font-size:22px;
    }
}

a {
    color:lightskyblue!important;
}


/* Southgate and Finchley overrides */

body.external {
	background: #fff !important;	
	color: #222 !important;
}
body.external .title {
	color: #123a5f !important;
	font-weight: 600;
}
.external .custom-paragraph {
	color: #222 !important;
	font-weight: 400;
}
/* next (aka submit) and back buttons */
.external .sticky-nav-wrapper  {
	background-color: #123a5f;
}
.external .nav-btn.primary {
	background-color: #fbda45;
    color: #123a5f;
}
.external .nav-btn.secondary {
	background-color: transparent;
    color: #fbda45;
    border: 1px solid #fbda45;
}
/* hide stuff */
#addcomment {
	display: none;	
}
label[for="customer_phone"] + br {
    display: none;
}
.external .fullscreen-btn {
	display: none;
}
/* color labels */
.form-group label {
	color: #222;	
}
/* text under email address */
.form-group p.mt-2 {
	color: #222 !important;
	font-weight: 400;
}
/* text by "I have read and accept the ... */
.external .form-check label {
	color: #222 !important;
	font-weight: 400;
}
.external  a {
	color: #a00 !important;
}
/* radio button labels */
.form-group .kt-radio-inline .kt-radio,
.form-group .kt-radio-inline .kt-radio label {
	color: #222;
	display: inline-block;
	font-size: 15px;
}
/* form fields */
.external .form-body input[type="text"],
.external .form-body input[type="number"],
.external .form-body textarea {
	max-width: 100%;
    padding: 5px 12px;
    font-size: 16px;
    height: 50px;
    color: black;
    background-color: white;
	border: 1px solid #555;
}
.external .form-body .iti {
	border: 1px solid #555;
	border-radius: 4px;
}

/* radio buttons */
.external .kt-radio.kt-radio--solid>span {
    background: #eee;
    border: 1px solid #999!important
}
.external .kt-radio.kt-radio--solid>span:after {
    border: solid #000;
    background: #000
}
.external .kt-radio.kt-radio--solid>input:checked~span {
    background: #eee;
	border: 1px solid #000!important
}
.external .kt-radio.kt-radio--solid>input:focus~span {
    border: 1px solid #000!important;
}

/* for the success page */
.external #message-body .container-fluid {
	padding-top: 0 !important;
	text-align: left !important;
	padding-left: 30px;
}



@media(max-width: 600px) {
	body.external {
		padding-top: 10px;	
		padding-bottom: 20px;
		border-top: 10px solid #fbda45;
	}
	.external .slideshow-container  {
		padding-bottom: 60px;	
	}
	/* hide labels - placeholders are fine instead */
	.form-group label {
		/* display: none; */
	
	}
	/* change text at top by hiding what's there */
	.title-wrapper {
		visibility: hidden;
		position: relative;
		text-align: center;
		padding-bottom: 8px;
	}
	.title-wrapper .title,
	.title-wrapper .custom-paragraph {
		display: none;
	}
	/* and inserting our own text */
	.title-wrapper::before {
		content: "Instant Quote";
		visibility: visible;
		font: inherit;
		font-size: 27px;
		font-weight: bold;
		color: #123a5f;
		
	}
	/* form fields */
	.external .form-body input[type="text"],
	.external .form-body input[type="number"],
	.external .form-body textarea {
		padding: 5px 8px;
		font-size: 15px;
		height: 32px;
	}
	.external .form-body textarea {
		max-height: 80px;	
	}
	/* text under email address and by final checkbox */
	.form-group p.mt-2,
	.external .form-check label {
		font-size: 14px;
	}
	
	.external .kt-radio-inline .kt-radio {
		margin-bottom: 0;	
	}
	/* center radio buttons */
	.external .kt-radio-inline {
		display: flex;
		justify-content: center;
	}
	
	
	/* next (aka submit) and back buttons */
	.external .sticky-nav-wrapper  {
		background-color: #fff;
	}
	.external .nav-btn.primary {
		background-color: #fbda45;
		color: #123a5f;
	}
	.external .nav-btn.secondary {
		background-color: transparent;
		color: #fbda45;
		border: 1px solid #fbda45;
	}
	
	/* for the success page */
	.external #message-body .container-fluid {
		padding-top: 0 !important;
		text-align: center !important;
		padding-left: 30px;
		padding-right:30px;
	}
	.external #message-body .container-fluid .title {
		font: inherit;
		font-size: 27px;
		font-weight: bold;
		color: #123a5f;
		line-height: 1.2;
		padding-top: 5px;
		display: inline-block;
		padding-bottom: 5px;
	}

}