/*@import url('https://fonts.googleapis.com/css?family=Montserrat:200,400,700,900&display=swap');*/
@font-face{
  font-family:CircularStd;
  src:url(../fonts/CircularStd-Medium.eot) format("eot"),
      url(../fonts/CircularStd-Medium.eot) format("embedded-opentype"),
      url(../fonts/CircularStd-Medium.woff) format("woff"),
      url(../fonts/CircularStd-medium.otf) format("opentype");
      font-style:normal;
      font-weight:400;
}

body {
  font-family: 'CircularStd';
}


/*
1.  Logo 444px x 123px - overwrite existing assets/img
2.  Fav icon -> https://realfavicongenerator.net/
3.  Index.php – search for existing company and replace with new links etc
4.  Get primary and secondary colours
5.  Open assets/custom.css
6.  Change colours accordingly
7.  Change the clock colour in index.php – imageColor - Circa line 1370

#74b831 #98e64b
#0065a3
*/

button {
  background-color: #74b831;
  font-family: 'CircularStd';
}

button:hover {
  background-color: #98e64b;
}

#healthwarningmodal #healthwarning-modal-content a {
  color: #0065a3;
}

.health-warning-content a{
  color: #0065a3;
}

.answer-radio-labels {
    background-color: #0065a3;
}

.answer-radio-labels:hover {
    background-color: #035588;
}

input[type=text] {
    background-color: #0065a3;
    font-family: 'CircularStd';
}

.pound {
    background-color: #0065a3;
    font-family: 'CircularStd';
}

.answer-container input:active +.answer-radio-labels { opacity: 1; }
.answer-container input:checked +.answer-radio-labels {
    background-color: #0065a3;
}

.autocomplete-items {
  background-color: #0065a3;
}

.autocomplete-active {
  background: #093875;
  color: #fff;
}

.autocomplete-items div:hover {
  background: #093875;
  color: #fff;
}

.p4container {
  font-family: 'Montserrat', sans-serif;
}

.p4 .initial-monthly-cost, .p4 .initial-term-cost, .p4 .initial-rate, .p4 .aprc, .p4 .fees, .p4 .continue, .p4 .more-info {
  background-color: #0065a3;
  border-color: #093875;
  color: #fff;
}

.p4 .continue a, .p4 .more-info a {
  background-color: #74b831;
}

.p4 .continue a:hover, .p4 .more-info a:hover {
  background-color: #093875;
  border-color: #fff;
  color: #fff;
}

#modal-inputs input[type=text] {
    background-color: #0065a3;
    border-bottom: #0065a3 solid 3px;
    font-family: 'CircularStd';
}

.fa-stack .fa-times-circle {
  color: #0065a3;
} 

.off-canvas.active .off-canvas-inner {
  background-color: #0065a3;
}

.off-canvas-inner:after {
  background-color: #0065a3;
}

.quit-off-canvas .fa-times-circle {
  color: #0065a3;
}

.info-container {
  color: #fff;
}

.info-container div span {
  font-family: 'CircularStd';
}

#menu {
  background: #0065a3;
}

#menu a {
  color: #fff;
}

#menu a:hover {
  color: #093875;
}

.styled-checkbox:hover + label:before {
  background: #0065a3;
}
.styled-checkbox:checked + label:before {
  background: #0065a3;
}

.checkbox-container label a{
  color: #000;
}

/*###################################*/
/*####Sweet alert general styling####*/
/*###################################*/

.swal2-styled.swal2-confirm, .swal2-styled.swal2-cancel {
  border-radius: 0px !important;
  background-color: #0065a3 !important;
}

.swal2-popup {
  border-radius: 0px !important;
}

.swal2-styled.swal2-confirm {
  background-color: #0065a3 !important;
}