/* Fonts */

/* Helvetica */
/* @import url("//hello.myfonts.net/count/3511b6"); */

@font-face {font-family: 'HelveticaNeueLTStd-Lt';
  src: url('3511B6_0_0.eot');
  src: url('3511B6_0_0.eot?#iefix') format('embedded-opentype'),
  url('3511B6_0_0.woff2') format('woff2'),
  url('3511B6_0_0.woff') format('woff'),
  url('3511B6_0_0.ttf') format('truetype'),
  url('3511B6_0_0.svg#wf') format('svg');}
 
  
@font-face {font-family: 'HelveticaNeueLTStd-Bd';
  src: url('3511B6_1_0.eot');
  src: url('3511B6_1_0.eot?#iefix') format('embedded-opentype'),
  url('3511B6_1_0.woff2') format('woff2'),
  url('3511B6_1_0.woff') format('woff'),
  url('3511B6_1_0.ttf') format('truetype'),
  url('3511B6_1_0.svg#wf') format('svg');}
 
  
@font-face {font-family: 'HelveticaNeueLTStd-Md';
  src: url('3511B6_2_0.eot');
  src: url('3511B6_2_0.eot?#iefix') format('embedded-opentype'),
  url('3511B6_2_0.woff2') format('woff2'),
  url('3511B6_2_0.woff') format('woff'),
  url('3511B6_2_0.ttf') format('truetype'),
  url('3511B6_2_0.svg#wf') format('svg');}

  /* Futura */
  /* @import url("https://fast.fonts.net/lt/1.css?apiType=css&c=551450d8-a7f9-41cf-a4e9-6567ac41c843&fontids=1475834,1475840"); */
  @font-face{
      font-family:"Futura LT W01 Extra Bold";
      src:url("19530450-4023-4f4b-a843-f691aaa9a120.eot?#iefix");
      src:url("19530450-4023-4f4b-a843-f691aaa9a120.eot?#iefix") format("eot"),
      url("23effe05-f9b3-417b-8186-358fa1a487ba.woff2") format("woff2"),
      url("4889f3e2-62f3-4272-9187-ec5c7e08b16b.woff") format("woff"),
      url("3268e049-ecc8-4b01-b169-43faa731c62c.ttf") format("truetype");
  }
  @font-face{
      font-family:"Futura LT W01 Extra Bold Obl";
      src:url("20cbe9db-2741-465e-bcdf-fc7775b6a18c.eot?#iefix");
      src:url("20cbe9db-2741-465e-bcdf-fc7775b6a18c.eot?#iefix") format("eot"),
      url("e26823d0-8dd8-4bff-88e2-2369f794cbac.woff2") format("woff2"),
      url("99afbe1e-25ce-4bdd-827a-6b522dd7ec3f.woff") format("woff"),
      url("8893136d-e4c2-4ef2-8b54-e36d40802c93.ttf") format("truetype");
  }

 
html, body.app-body
{
  height: 100%;
  width:100%;
}

@media screen and (min-width: 900px)
{
  html, body.app-body
  {
    overflow: hidden;
  }
}



.m-tooltip p
{
    margin: 0;
    padding: 0;
}


@media screen and (min-width: 900px)
{
  .m-tooltip.notes-tooltip .row
  {
    margin-top: 7px;
  }
}

.m-tooltip.notes-tooltip .col-sm-6:nth-child(2)
{
  padding-left: 10px;
}

.m-tooltip.notes-tooltip .inner-content
{
  padding-left: 14px;
  display:flex;
  margin-bottom: 0px;
  line-height: 20px;
  padding-bottom: 9px;
  padding-top: 9px;
  border-bottom: 1px solid #D0D0D0;
  align-items: center;
}

.m-tooltip.notes-tooltip .inner-content p
{
  margin-left: 9px;
}

@media screen and (max-width: 899px)
{
  .m-tooltip.notes-tooltip
  {
    transform: translateX(100%) !important;
    top: initial !important;
    bottom: -65px; 
  }

  .m-tooltip.notes-tooltip:after
  {
    top: initial !important;
    bottom: 83px;
  }

  
  .m-tooltip.notes-tooltip .inner-content p,
  .m-tooltip.notes-tooltip .inner-content h6
  {
    font-size: 12px;
  }
  .m-tooltip.notes-tooltip span > h6
  {
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 14px;
  }

  .m-tooltip.notes-tooltip .inner-content
  {
    padding-bottom: 4px;
    padding-top: 4px;
  }

}




.accept-styled-button
{
  border: none;
  background-color: #4a4a4a;
  background-image: none;
  font-weight: 200;
  color: white;
  padding: 9px 35px;
  letter-spacing: 0.8px;
  border-radius: 3px;
}

.accept-styled-button.disabled
{
  cursor: not-allowed;
  box-shadow: none;
  opacity: .65;
}

.app h1, .app h2,.app h3,.app h4,.app h5,.app h6,.app h7
{
  /* all spacing seems custom, so lets just remove the default vertical margin / padding */
  margin-top: 0; 
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0; 
}

/* Typography */
.app h1,.app .h1{
  /* font-family: "Futura LT W01 Extra Bold", Arial, sans-serif !important; */
  font-family:"Futura LT W01 Extra Bold Obl", Arial, sans-serif;
}

.app h2,.app .h2{
  font-family: 'HelveticaNeueLTStd-Bd', Arial, sans-serif;
}

.app h3,.app .h3
{
  font-family:"Futura LT W01 Extra Bold Obl", Arial, sans-serif;
}

.app h4, .app .h4
{
  font-size: 19px;
  line-height: 25px;  
  color: #09257E;
  font-weight: bold;
  font-family: 'HelveticaNeueLTStd-Bd', Arial, sans-serif;
}

.app h5, .app .h5
{
  font-family: 'HelveticaNeueLTStd-Md', Arial, sans-serif;
}

.app h6, .app .h6
{
  font-size: 15px;
  color: #333333;
  font-weight: bold;
  font-family: 'HelveticaNeueLTStd-Bd', Arial, sans-serif;
}

.app h7, .app .h7
{
  font-family: 'HelveticaNeueLTStd-Bd', Arial, sans-serif;
}


.app .oblique, .app .btn{
  font-family:"Futura LT W01 Extra Bold Obl", Arial, sans-serif;
}

.app small
{
  font-size: 12px;
  font-weight: bold;
  font-family: 'HelveticaNeueLTStd-Bd', Arial, sans-serif;

}

body{
  font-family: "HelveticaNeueLTStd-Md", Helvetica, Arial, sans-serif !important;
}

/* Input styles */

.app input.form-control, 
.app select.form-control, 
.app select.form-control,
.app textarea.form-control
{
  font-family: "HelveticaNeueLTStd-Md", Helvetica, Arial, sans-serif;
  /*font-weight: bold;*/
  /* background-color: #E6E9F0; */
  border: 1px solid #002A7B;
  border-radius: 0;
  box-shadow: none;
  letter-spacing: -.1px;
  color: #0b2577;
  font-size: 12px;
}


@media screen and (min-width: 900px)
{
  .app input.form-control, 
  .app select.form-control, 
  .app select.form-control,
  .app textarea.form-control
  {
    font-weight: bold;
    border: 2px solid #002A7B;
    font-size: 17px;
  }
}

.app .clear-form-btn
{
  background-color: transparent;
  border: 2px solid transparent;
}





.app select.form-control
{
  -webkit-appearance: none;
}

.app .select-wrapper
{
  position: relative;
}

/*
  Note: Cant put a before / after on a select box, so we need a wrapper to do it
*/
.app .select-wrapper:after
{
  content: "";
  position: absolute;
  right: 10px;
  height: 10px;
  width: 10px;
  background-image: url('chevron.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.app select option
{
  font-weight: bold;
}

.app .form-control
{
  height: 25px;
}

@media screen and (max-width: 899px)
{
  .app .form-control
  {
    height: 29px;
  }

  .app select.form-control
  {
    height: 28px;
  }
}


@media screen and (min-width: 900px)
{
  .app .form-control
  {
    height: 42px;
  }
}

.app input.form-control::placeholder
{
  color: #C1C2C4;
}

.app select.form-control
{
  color: #002A7B;
}

.app select
{
  
/* #263E81 */
}

.app .btn
{
  background-color: white;
  border: 2px solid #E52D1D;
  color: #DC1517;
  font-size: 10px;
  text-align: center;
  border-radius: 0;
  padding: 3px 15px;
  transition: all 0.3s;
}

.app .clear-form-btn:focus,
.log-trip-container button:focus,
.app .btn:focus
{
  color: white;
  background-color: #E52D1D;
  outline: 0;
}

.app input.form-control:focus, 
.app select.form-control:focus, 
.app select.form-control:focus,
.app textarea.form-control:focus,
.app .clear-form-btn:focus,
.log-trip-container button:focus,
.app .btn:focus
{
  border-color: #f1be67;
  box-shadow: 0 0 18px #c3c3c3;
}

.app input.touched:not(.valid):not(.disabled)
{
  border-bottom-color: #E52D1D;
}

@media screen and (min-width: 900px)
{
  .app .btn
  {
    font-size: 16px;
    border-width: 5px;
    padding: 5px 23px;
  }
}


.app .btn.btn--secondary
{
  border-width: 2px;
}

.app .btn.extra-padding
{
  padding: 11px 34px;
}


.app .btn:hover
{
  background-color: #E52D1D;
  color: white;
}



.app .btn.btn-large
{
  width: 100%;
  padding-top: 8px;
  padding-bottom: 8px;
}


@media screen and (min-width: 900px)
{
  .app .btn.btn-large
  {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}

.custom-checkbox
{
  position: relative;
  cursor: pointer;
  padding-left: 31px;
  
}

.custom-checkbox:before
{
  position: absolute;
  left: 0;
  height: 20px;
  width: 20px;
  border: 1px solid #09257E;
  border-radius: 2px;
  content: '';
  color: white;
  padding-left: 2px;
  top: 0;
}

.custom-checkbox.active:before
{
  background-color: #09257E;
  content: '\2713';
}

.custom-checkbox.disabled
{
  cursor: not-allowed;
  pointer-events: none;
  color: #8E8E93;
}

.custom-checkbox.disabled::before {
  border: 1px solid #8E8E93;
}


input.required, textarea.required, select.required
{
  text-indent: 12px;
  background-image: url('asterisk.svg');
  background-repeat: no-repeat;
  background-position: 8px 47%;
  background-size: 9px 9px;
}

input.required.touched:not(.valid):not(.disabled), 
textarea.required.touched:not(.valid):not(.disabled), 
select.required.touched:not(.valid):not(.disabled)
{
  background-image: url('asterisk-red.svg');
}




.app input.required::-webkit-input-placeholder,
.app textarea.required::-webkit-input-placeholder, 
.app select.required::-webkit-input-placeholder { 
  color: #B2B2B2;
  font-family: 'HelveticaNeueLTStd-Md';
}

.coastguard-arrow-secondary
{
  position: relative;
  right: 18px;
}

body
{
  -webkit-font-smoothing: antialiased;
}

/* 
  Remove the blue line outline
*/
.btn:focus,
.logged-in-button-wrapper a:focus
{
  outline: 0;
}

/* google maps */
.gm-style{
  font-family: 'HelveticaNeueLTStd-Md', Arial, sans-serif !important;
}
/* removing close icon */
.gm-style-iw + div {display: none;}

/* ios swtich style */
.custom-switch {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  cursor: pointer;
  font-weight: normal;
  font-size: 17px;
  -webkit-tap-highlight-color: transparent;
}

.custom-switch i {
  position: relative;
  display: inline-block;
  margin-right: .5rem;
  width: 46px;
  height: 26px;
  background-color: #BCBCC0;
  border-radius: 23px;
  vertical-align: middle;
  transition: all 0.3s linear;
  margin-left: 12px;
}

@media screen and (max-width: 899px) {
  .custom-switch i {
    width: 46px;
  }
}

.custom-switch i::before {
  content: "";
  position: absolute;
  left: 0;
  width: 42px;
  height: 22px;
  background-color: #BCBCC0;
  border-radius: 11px;
  transform: translate3d(2px, 2px, 0) scale3d(1, 1, 1);
  transition: all 0.25s linear;
}
.custom-switch i::after {
  content: "";
  position: absolute;
  left: 0;
  width: 22px;
  height: 22px;
  background-color: #fff;
  border-radius: 11px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.24);
  transform: translate3d(2px, 2px, 0);
  transition: all 0.2s ease-in-out;
}
.custom-switch:active i::after {
  width: 28px;
  transform: translate3d(2px, 2px, 0);
}

.custom-switch.disabled
{
  cursor: not-allowed;
  pointer-events: none;
}



.custom-switch.active i::after { transform: translate3d(16px, 2px, 0); }
.custom-switch input { display: none; }
.custom-switch.active i { background-color: #8DA5F7; }
.custom-switch.active.red i {background-color: #E52D1D;}
.custom-switch.active i::before { transform: translate3d(18px, 2px, 0) scale3d(0, 0, 0); }
.custom-switch.active i::after { transform: translate3d(22px, 2px, 0); }
.custom-switch.disabled{
  opacity: 0.6;
}
.custom-switch.disabled i::after{
  transition: none !important;
}
.custom-switch.active.disabled i { background-color: #aeafb14a; }
.custom-switch.active.disabled { opacity: 1; }