body{
  font-family: Quicksand, sans-serif;
}

h1,h2,h3,h4,h5,h6{
  font-family:Cabin, sans-serif;
}

h1{
    font-size: 54px;
    line-height: 1.1em;
}

h3{
    font-size: 15px;
    line-height: 55px;
}

h6{
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 1.4;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #626262;
}

nav{
  font-family: Cabin, sans-serif;
}

body a, body a:hover{
  color:inherit;
  text-decoration:none;
}

.card-header{
  padding:4px;
  padding-bottom:0px;
}

fieldset{
  padding:4px;
  border-radius:3px;
  background:#f7f7f7;
  border:solid 1px rgb(238 237 238);
}
fieldset legend{
  width:auto;
  float:inherit;
  margin-left:8px;
}

.btn-purple{
  color:white;
  background:#271642;
}

.firewall .card{
    -webkit-box-shadow: 0px 3px 10px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 3px 10px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 10px 3px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
}

.load-card-details{
    text-decoration: none;
    color: inherit;
    border-radius: 0px;
    box-shadow: rgb(218, 226, 234) 0px 2px 4px 0px;
    background: rgb(255, 255, 255);
    margin-bottom:10px;
    color: #484848;
}
.card-name-price,.card-time,.card-info,.units-wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 0px 16px;
}
.card-name-price{
    font-size: 20px;
}
.load-card-price{
    color: rgb(0, 181, 41);
}
.card-time{
    font-size:12px;
    opacity: 0.5;
}
.card-info{
    padding: 20px 0px 8px 16px;
    border-bottom: 1px solid rgb(218, 226, 234);
}
.card-info .month,.card-info .day{
    font-size: 12px;
    opacity: 0.5;
}
.card-info .date{
    font-size: 24px;;
}
.city-with-mi{
    display: flex;
    align-items: center;
}
.mi{
    font-size: 12px;
    opacity: 0.5;
}
.rc{
    font-size: 9px;
    opacity: 0.5;
}
.card-city-unit-wrapper{
    display: flex;
    flex-direction: column;
    position: relative;
}
.card-city-unit-wrapper::before{
    content: '';
    position: absolute;
    height: 81%;
    top: 10%;
    left: 6px;
    border-left: 2px dotted gray;
    opacity: 0.5;
    z-index: 0;
}
.city-with-mi{
    display: flex;
    align-items: center;
    column-gap:8px;
}
.round-icon{
    display: block;
    height: 9px;
    width: 9px;
    border-radius: 10px;
    border: 2px solid gray;
    background-color: #ffffff;
    z-index: 1;
}
.square-icon{
    display: block;
    height: 9px;
    width: 9px;
    border: 2px solid rgb(255, 157, 31);
    background-color: #ffffff;
    z-index: 1;
}
.load-card-detail-month{
    font-size: 12px;
    margin-bottom: 16px;
    margin-left: 18px;
}
.posted-rate{
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 20px;
    font-size: 14px;
    color: #27313C;
    padding-bottom:8px;
}
.posted-rate-wrapper{
    padding: 20px 16px 12px 16px;
    border-bottom: 1px solid rgb(218, 226, 234);
}
.posted-price{
    font-size: 16px;
    font-weight: 600;
}
.city-nm{
    font-weight: 600;
}
.load-detail-sec-heading{
    opacity: 0.5;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 16px;
}
.ld-orange{
    color: rgb(255, 157, 31);
}
/* ldce css */

/* collapsible ldce css */
/* Style the button that is used to open and close the collapsible content */
.ldce-collapsible .posted-rate{
    display: grid;
    grid-template-columns: 40% 60%;
    column-gap: 8px;
    padding-bottom: 15px;
}
.ldce-collapsible{
    background-color: #ffffff;
    cursor:pointer;
    border-bottom: 1px solid rgb(218, 226, 234);
}
.ldce-collapsible .collapsible {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    font-size: 16px;
}
.ldce-collapsible .collapsible.active .collapse-icon{
    display:block;
    transition: 0.2s ease-in-out;
    transform: rotate(181deg);
}
/* Style the collapsible content. Note: hidden by default */
.ldce-collapsible .content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.2s ease-out;
    background: aliceblue;
}
.ldce-collapsible .collapsible.active ~ .content {
    padding: 16px;
}
.collapsible-left{
    display: flex;
    align-items: flex-start;
    column-gap: 10px;
}
.ld-qus{
    padding: 16px;
    border: 1px solid rgb(218, 226, 234);
}
.collapsible-heading-name{
    font-size: 16px;
    font-weight: 600;
}
.collapsible-tagline{
    font-size: 14px;
    color: rgb(145, 145, 145);
    font-weight: 400;
}
.add-note-section{
    padding: 16px;
}
.add-note-section textarea{
    width: 100%;
    padding: 10px;
}
.save-note-btn{
    background-color: #F7F9FB;
    padding: 12 16px;
    outline: none;
    border: none;
    cursor: pointer;
    margin-top: 20px;
}
@media (min-width: 992px){
    .load-card-details{
        display: grid;
        /* grid-row-gap:4px; */
        grid-template-columns: repeat(2,1fr);
    }
    .load-card-details > div:nth-child(1){
        border-right: 1px solid rgb(218, 226, 234);
    }
    /* faq css */
    .ld-ce-wrapper{
        padding:0px 0px 50px 0px;
    }
}




.load-card{
display: grid;
/* grid-row-gap:4px; */
text-decoration: none;
color: inherit;
padding: 8px 16px;
border-radius: 3px;
border: solid 1px rgb(218, 226, 234);
background: rgb(255, 255, 255);
margin-bottom:10px;
color: #484848;
transition: .2s ease-in-out;
}
.load-card:hover{
box-shadow: rgb(218, 226, 234) 0px 2px 4px 0px;
background: rgb(255, 249, 241);
border-bottom: 2px solid rgb(255, 157, 31);
transition: .2s ease-in-out;
}
.card-name-price,.card-time,.card-info,.units-wrapper{
display: flex;
align-items: center;
justify-content: space-between;
}
.card-name-price{
font-size: 20px;
}
.load-card-price{
color: rgb(0, 181, 41);
}
.card-time{
font-size:12px;
opacity: 0.5;
}
.card-info{
margin: 8px 0px 8px 19px;
text-align: center;
}
.card-info .month,.card-info .day{
font-size: 12px;
opacity: 0.5;
}
.card-info .date{
font-size: 24px;;
}
.city-with-mi{
display: flex;
align-items: center;
}
.mi{
font-size: 12px;
opacity: 0.5;
}
.rc{
font-size: 9px;
opacity: 0.5;
}
.card-city-unit-wrapper{
display: flex;
flex-direction: column;
row-gap: 30px;
position: relative;
}
.card-city-unit-wrapper::before{
content: '';
position: absolute;
height: 81%;
top: 10%;
left: 6px;
border-left: 2px dotted gray;
opacity: 0.5;
z-index: 0;
}
.city-with-mi{
display: flex;
align-items: center;
column-gap:8px;
}
.round-icon{
display: block;
height: 9px;
width: 9px;
border-radius: 10px;
border: 2px solid gray;
background-color: #ffffff;
z-index: 1;
position:relative;
left:3px;
}
.square-icon{
display: block;
height: 9px;
width: 9px;
border: 2px solid rgb(255, 157, 31);
background-color: #ffffff;
z-index: 1;
position:relative;
left:3px;
}
.rate-check-box .rate{
font-size: 12px;
height: 15px;
line-height: 16px;
margin: 4px;
opacity: 1;
transition: opacity 2s ease 0s;
}
.rate-check-box{
border: 1px dashed rgb(145, 145, 145);
border-radius: 2px;
padding: 4px;
}
.pills-wrapper{
display: flex;
align-items: center;
column-gap: 4px;
color: rgb(72, 72, 72);
font-size: 12px;
}
.unit-pill{
background-color: rgb(228, 247, 232);
border-radius: 10px;
padding: 4px 12px;
}