@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');

/********** common **********/
/* lightMode start */
.lightMode .MainPg-container .header {
    background: #F3F5F9 !important;border-bottom: 1px solid #6A6A6A;
}
.lightMode .notificationdata svg{
    fill:#6A6A6A;
}
.lightMode .TopOPtion select{color:#7E7D7D;background-image: url(../../assets/images/drop_arrow_black.svg) !important;}
.lightMode .TopOPtion .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #7E7D7D !important;
}
.lightMode .TopOPtion .select2-container--default .select2-selection__arrow b{background-image: url(../../assets/images/drop_arrow_black.svg) !important;background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100%;
    width: 13px !important;
}
.lightMode .topRightActionBtn svg {
    fill: #6A6A6A;
}
.lightMode .mobileSearch .input-box .search{background-color: transparent;}
.lightMode .mobileSearch .input-box input {
    box-shadow: rgba(0, 0, 0, 0.25)0px 4px 4px;
}
.lightMode .mobileSearch.DivOpen div#livesearch{visibility: visible;}
.lightMode div#livesearch{visibility: hidden;}
.lightMode .MobileFooter ul{background: #F3F5F9;border-top-left-radius: 25px;border-top-right-radius:25px;box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);}
.lightMode .MobileFooter ul li,.lightMode .MobileFooter ul li.active{background: #F3F5F9;border-radius: 50px;}
.lightMode .MobileFooter ul li a svg{fill: #333;}
.lightMode .MobileFooter ul li.active a svg{fill:var(--secondary-color);}
.lightMode .MobileFooter ul li:hover {
    background:transparent;
}
.lightMode .TopOPtion span {
    color: #000;
}
@media(min-width:1020px){
    .lightMode .MainPg-container .header {
        background:transparent;border-bottom: none;
    }
    /*.lightMode .MobileFooter ul{background: #000;}
    .lightMode .MobileFooter ul li{background: #333;}
    .lightMode .MobileFooter ul li a svg{fill:#D9D9D9;}
    .lightMode .MobileFooter ul li.active a svg {
        fill: #C99136;
    }
    .lightMode .MobileFooter ul li:hover {
        background: #000;
    }*/
}

/* lightMode end */
.hamburgerDiv .hamburger_Menuimages svg, .hamburgerDiv .Hamburger_Close svg, .secondary_icons svg{
    fill: var(--secondary-color);
}
svg {
    fill: var(--primary-color);
}
.container{width:96%;}
@media(min-width:1100px){
    .container{max-width:1024px;}
}
.MainPg-container{
    width:100%; background-color: #fff;
}
@media(min-width:1024px){
    .MainPg-container{
        width:96%; background-color: #F3F5F9;
    }
}
@media(min-width:1100px){
    .MainPg-container{max-width: 1024px;}
}
.modal-xl {
    max-width: 100%;
}
.modal-dialog-scrollable .modal-body {
    overflow-y: auto;
    overflow-x: hidden;
}
.single_service_logs_Home td p {min-width: 90% !important;}
body{
    font-family:'Roboto', sans-serif;
    text-align: #000
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
b, strong {
    font-weight: 600;
}
h1,h2,h3,h4,h5,h6{font-family:'Roboto', sans-serif}
ul li{list-style: none;}
hr {border-top: 1px solid #979797;}
img.TopmainProLogo {
    text-align: center;
    margin: auto;
    display: flex; 
}
/* select */
select.AllBoatsSelect{position: relative;}
select.AllBoatsSelect option{ width:95px;max-width: 95px; overflow:hidden;position:absolute;}
.fade:not(.show) {
    opacity: 1;
}

.fa-eye:before,
.fa-eye-slash:before {
    content: "\f06e";
    color: #6a6a6a;
}
/* set a button */
.set-left{float: none;}
.set-right{ float:none;}
@media(min-width:768px){
    .set-left{float: left;}
    .set-right{ float:right;}
}
/*.page-bg {background-color: #E3E3E3;}*/



.bg-white{background: #fff}
.body-footer{ min-height:100vh; position: relative;}

.topHead{margin:50px 0 0;text-align: center;}
/*.topHead a{text-align: center; display: block;}*/
.topHead a,
.topHead {
    text-align: center;
    display: block;
    margin: 4rem auto 0;
    width: auto;
    height: auto;
    max-width: 280px;
}
.topHead a img,
.topHead img {
    width: 100%;
    height: auto;
}
.topHead h5{ font-size:26px; color: var(--primary-color); font-weight: 300;}
.topHead p, p{ font-size:16px; font-weight:400; color:#000; }
table td .AnchorLinks{color:var(--primary-color); }
.SelectTremateBox {
    text-align: center;
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.SelectTremateBox .Box{ background:#164BA0}

.Box{ background:var(--primary-color); color:#fff; border:1px solid #ccc; border-radius:25px; text-align:center; width:303px; height: auto; padding:10px 10px 5px 10px; margin:20px auto 20px; display: block;}
.Box p{color: #fff; padding: 0 10px; min-height:80px;}
.Box:hover h2{color: #fff;}
@media(min-width:576px){
    .Box{width: 303px;
    }
}

p.footerText{ font-size:16px; font-weight:500; color:#000; margin: 20px 0; text-align:center; }
p.footerText a, a{color: var(--primary-color); text-decoration: none;}

p.ThanksChoosing{ font-size:18px; font-weight:400; }
p.ThanksChoosing span{ display:block; }
@media(min-width:576px){
    p.ThanksChoosing{ font-size:20px;}
}
@media(min-width:1024px){
    p.ThanksChoosing span{ display:inline-block; }
}
.SelectProSteps{text-align: left; padding: 0;}
.SelectProSteps li{ margin:0 0 35px; }
.SelectProSteps li:last-child{ margin:0; }
.SelectProSteps h3{display: flex; font-size:18px; font-weight:400; color: #000;
    align-items: center;}
.SelectProSteps .icon{ display:flex;align-items: center;margin: 0 15px 0 0;}
.SelectProSteps h3 .icon svg{width:30px; height:30px; }
@media(min-width:576px){
    .SelectProSteps h3{font-size: 20px;}
    .SelectProSteps li{ margin:0 0 50px; }
}
@media(min-width:768px){
    .SelectProSteps li{ margin:0 0 70px;}
}
select{
    background-image: url("../images/drop_arrow_black.svg") !important; background-repeat: no-repeat !important; background-position: right 5px center !important;}
select option.SelectColor{color: #343a40;}    
label {
    display:block;
    margin-bottom: 0.5rem;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    line-height: normal; 
}
label span{color: #F00}
.has-error {
  border: 1px solid #FF0000;
}
/*.StartupCompanyForm input,
.StartupCompanyForm select{
    width:336px; 
}*/
input,select,textarea{height: 45px;}
.btn,
.btn:hover {
    display: inline-block;
    font-weight:500;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 18px;
    line-height: 1.5;
    border-radius: 25px !important;width: 225px;    
}
.input-group-btn .btn{ width:195px; }
.themebtn_colored,.themebtn_colored:hover,.themebtn_colored:active,.themebtn_colored:focus,.btnOnlyLink {
    display: block;
    margin: 1rem auto 0;
    background: var(--primary-color)!important;
    border: 1px solid var(--primary-color)!important;
    color: #fff!important;
    font-weight: 500;
    width: 225px;
    height: 50px;
    border-radius: 25px;
    font-size: 18px; line-height: normal;
}

.themebtn_colored.beforelogin, .themebtn_colored.beforelogin:hover, .themebtn_colored.beforelogin:active, .themebtn_colored.beforelogin:focus, .btnOnlyLink{
    background: var(--primary-color)!important;
    border: 1px solid var(--primary-color)!important;
}

a.themebtn_colored,
a.themebtn_colored:hover,
a.themebtn_colored:active,
a.themebtn_colored:focus,
a.btnOnlyLink,
a.btn.themebtn_gray{line-height: 35px;}

.btnOnlyLink{
    background: transparent!important;
    border: 1px solid transparent!important;color: var(--primary-color)!important;
}

.btnOnlyLink.beforelogin{
    color: var(--primary-color)!important;
}

.BtnNextLink{ margin:25px 0; font-size: 16px; font-weight: 500; color: var(--Hyperlink, var(--primary-color)); display: block;}

.btn.themebtn_gray {
    display: block;
    margin: 1rem auto 0;
    background-color: #fff;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    font-weight: 500;
    width: 227px;
    height: 50px;
    border-radius: 25px !important;
    font-size: 18px;font-family:'Roboto', sans-serif
}
.btn.themebtn_gray.beforelogin {
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
}
.btn.text-maroon {
    display: block;
    /* margin: 1rem auto 0; */
    background: #FFFFFF;
    border: 1px solid #EE0202;
    color: white;
    font-weight: 500;
    width: 225px;
    height: 50px;
    border-radius: 25px;
    font-size: 18px;
}
.text-maroon {
    color: #EE0202 !important;
}
.FormBtnDiv{margin: 15px auto; text-align: center;}
.FormBtnDiv .btn{margin: 0 auto 20px;}
.Loginfooter {
    text-align: center;
    position: relative; margin: 0; padding: 0;
}
.Loginfooter li {
    position: relative;
    display:block;
}
.LoginfooterCopyright {
    text-align: center;
    font-size: 14px;
    position: relative;
    bottom: 0;
    margin: auto;
    text-align: center;
    width: 100%;
}
.LoginfooterCopyright.loginfrontpg {
    position: relative;
}
.Loginfooter p{font-size: 14px; font-weight: 300; color: #000; text-align: center; top:30px;position: relative;}

.Loginfooter .btnSwipeMobileNone{display: none;}
.Loginfooter .btnSwipeMobile{display:block; top: 30px}
@media(min-width:1024px){
    .Loginfooter .btnSwipeMobileNone{display: inline-block;}
    .Loginfooter .btnSwipeMobile{display: none;}    
}
@media(min-width:768px){
    .Loginfooter li {
        display: inline-block; margin: 0 20px;
    }    
}
@media(min-width:1026px){
    /*.LoginfooterCopyright.loginfrontpg {
        position: absolute;
    }*/
    .LoginfooterCopyright.loginfrontpg {
        /*position: fixed;*/
        position: relative;
        bottom: 0;
        display: block;
        left: 0;
        right: 0;
    }
}

.TextLink{font-size: 16px;font-weight: 500; color: #000; text-align: center;}
.TextLink a{color: var(--primary-color);}

.StartupCompanyForm{position: relative; margin:40px 0;}
.StartupCompanyForm .form-group{margin: 0 0 18px;}
.StartupCompanyForm .form-check {
    padding-left: 0.9rem;
}
.copyrights{
    color: #000;
    font-size: 14px;
    font-weight: 300; text-align: center;
}
.pw_note {
    color: #4F4F4F;
    text-align: right;
    font-size: 14px;
    font-style: italic;
    font-weight:600;
    line-height: normal;
    float: right;
    margin: 3px 0 0;
    display: block;
    width: 100%;
}
.form-control:focus {
    box-shadow: none; border: 1px solid #979797;
}
.form-control.Filled{
    background: #EEEEEE; border: 1px solid #979797;
}
.form-control.notSelected{
    border: 1px solid #CCCCCC; color:#979797;    
}

/* custom checkbox css start */
/* The container */
.cust-check {
  position: relative;
  padding-left:32px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default checkbox */
.cust-check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top:3px;
  left:0;
  height: 16px;
  width: 16px;
  background-color: #fff;
  border-radius: 3px;
  border: 1px solid #ced4da;
}
/* On mouse-over, add a grey background color */
.cust-check:hover input ~ .checkmark {
  background-color: #fff;
}
/* When the checkbox is checked, add a blue background */
.cust-check input:checked ~ .checkmark {
  background-color: #4DB34D; border: 1px solid transparent;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the checkmark when checked */
.cust-check input:checked ~ .checkmark:after {
  display: block;
}
/* Style the checkmark/indicator */
.cust-check .checkmark:after {
    width: 5.5px;
    height: 10px;
    left:4px;
    top: 0px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(50deg);
}
#checklist-item-list .check-dlt svg {
    position: absolute;
    top: 2px;
    right: 15px;
}
/* ------custom checkbox css end ------ */
/* scrollbar css start */
      ::-webkit-scrollbar {
        width: 10px;
        border-radius: 40px;
      }

      ::-webkit-scrollbar-thumb{
        background: #888;
        /*background: #233968;*/
        border-radius: 10px;
      }
      /* Track */
      ::-webkit-scrollbar-track {
        background: #f1f1f1; 
        border-radius:10px;
      }       
/*scrollbar css end*/
.toggle-password {
    float: right;
    cursor: pointer;
    margin-right: 10px;
    margin-top: -32px; color: #999;
}
.toggle-cpassword {
    float: right;
    cursor: pointer;
    margin-right: 10px;
    margin-top: -32px; color: #999;
}
.paymentText h5,.paymentText p{
    color: #6A6A6A;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal; 
}
.paymentText h5 span{ position:relative; margin:5px 0; display:block; }
.topSec {position: relative; margin: 5px auto 0;}
.topSec .TopmainLogo{width: 83px; height: auto;}
.topSec .TopSelectBox {
    width: 110px;
    right: 0;
    position: relative;
    float: right;
    border: none; height: auto; padding: 0 .75rem; font-size: 14px;
}
.topSec .TopSelectBox option:first-child{color: #000}
.finalStep{position: relative; margin: 20px 0 0;}
.finalStep h5{
    color: var(--primary-color);
    text-align: center;
    font-family: Roboto;
    font-size: 28px;
    font-style: normal;
    font-weight: 300;
    line-height: normal; 
}
.finalStepMiddleImg{
    width: 100%;
    height: auto;
    flex-shrink: 0; margin:42px 0 0;
}
@media(min-width:576px){
    .finalStepMiddleImg{
        width: 347px;
        height: 192px;
    }
}

/* main dashboard */
.MainPg-container{position: relative; margin:auto; display: block; padding:0;}
/*.MainPg-container .header {
    width: 100%;
    position: relative;
    display: flex;
    padding:10px 0;
    align-items: center;
    justify-content: space-between; background: #000;
}*/
.MainPg-container .header {
    width: 100%;
    position: fixed;
    display: flex;
    padding: 10px 0;
    align-items: center;
    justify-content: space-between;
    background: #000;
    margin: 0 0 20px;
    z-index: 99;
}
@media(min-width:1022px){
    .MainPg-container .header {
        position: relative; margin: 0;
    }
}

/*.MainContent{display: flex;width: 100%;justify-content: space-between;}*/
.MainContent {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin: 40px 0 0;
}
@media(min-width:650px){
    .MainContent {
        margin: 55px 0 0;
    }
}
@media(min-width:1022px){
    .MainContent {
        margin:0;
    }
}
.MainContent .sidebar {
    display: none;
    justify-content: center;
    margin: 0;
    left: 0;
    position: relative;
    width: 24%;
}
.TopLogo .TopLogoImg{ width:auto; height:auto; max-width:270px; max-height: 65px;}
.TopLogoMobile .TopLogoImg{ width:auto; height:auto; max-width:130px; max-height: 25px;}
.logo_preview img{ width:auto; height:auto;max-width: 245px; max-height: 65px;}

.TopLogoMobile{display: inline-flex;}
.TopLogo{display: none;}

@media(min-width:1024px){
    .TopLogoMobile{display: none;}
    .TopLogo{display: inline-flex;}    
    .MainContent .sidebar {display: flex;}
    .MainPg-container .header { background: #F3F5F9;padding:20px 10px 20px 0; }
    /*.MainPg-container{padding:0 10px;}*/
}

.MainContent .sidebar ul{padding: 0;}
.MainContent .sidebar ul li{
    text-align: left;
    font-size: 16px;
    font-weight: 400; margin: 0 0 10px; width:175px;background:transparent;border-radius: 18px;padding: 10px 11.07px;
}
.MainContent .sidebar ul li a {
    color: #7E7D7D;
    display: flex;
    align-items: center;
    justify-content: start;
}
.MainContent .sidebar ul li svg {
    fill: #7E7D7D;
    position: relative;
    top: 0;
    margin: 0 10px 0 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.MainContent .sidebar ul li.active{
     filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25)); background: #fff;      
}
.MainContent .sidebar ul li.active a{color: var(--primary-color);}
.MainContent .sidebar ul li.active svg{fill:var(--primary-color)}

.MainContent .mainBox {
    border-radius: 15px;
    background: #FFF;
    width:100%;
    display: flex;
    justify-content: flex-start;
    min-height: 75vh;
    padding:0;margin:0;
}

@media(min-width:1024px){
    .MainContent .mainBox {width: 76%;padding: 10px;margin: 0 10px 0 0;}
}

.MainContent .sidebar ul li span.Totalcount {
    color: #FFF;
    text-align: center;
    font-size: 11px;
    font-weight: 500;
    line-height: normal;
    border-radius: 6px;
    background: #366EC9;
    width:20px;
    height: 13px;
    display: inline-flex;
    margin: 0 10px;
    align-items: center;
    justify-content: center;
    /* bottom: 100px; */
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.MainContent .sidebar ul li span.TotalPluscount {
    color: #FFF;
    text-align: center;
    font-size: 11px;
    font-weight: 500;
    line-height: normal;
    border-radius: 6px;
    background: #366EC9;
    width: 13px;
    height: 13px;
    display: inline-flex;
    margin: 0 10px;
    align-items: center;
    justify-content: center;
    /* bottom: 100px; */
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* TopSearch  */
.TopSearch{border-radius: 18px; background: #FFF;width: 316.885px;height: 36px;flex-shrink: 0; display: none;}
.TopSearch input{border: none;}
.input-grey-rounded {
  display: flex;
  font-size: 16px;
  line-height: 1.5;
  background: #fff;
  border: 1px solid transparent;
  background-image:url('../../assets/images/searchIcon.svg');
  background-repeat: no-repeat;
  background-position:12px 8px;
  background-size: 20px 20px;
  border-radius: 100px;
  width: 316.885px;
  padding: 0.5em 1em 0.5em 2.5em; height: 36px;
  box-shadow: rgba(0, 0, 0, 0.25)0px 4px 4px;
}
.input-grey-rounded::placeholder {
  color: #838d99;
}
.input-grey-rounded:focus {
  outline: none;
  background-color: #fff;
  border:none;
}

@media(min-width:660px){
    .TopSearch{display:inline-flex;}
}

.TopLogo{padding:0 35px 0; }
.TopOPtion span {
    text-overflow: ellipsis;
    width: 115px;
    color: #fff;
    white-space: nowrap;
    font-size: 14px;
    overflow: hidden;
}

@media(min-width:1024px){
    .TopOPtion span {
        color: #000;
    }
}

.topRightActionBtn {
    display: inline-flex;
    align-items: center;
    float: none;
    margin: 0;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}
.topRightActionBtn svg  {width: 20px; height: 20px; fill: #fff;}
.topRightActionBtn li{ display:inline-flex; margin:0 0 0 15px; position: relative;}
.notification{position: relative;}
.notification .Circle {
    background: #3BB702;
    width: 14px;
    height: 14px;
    border-radius: 18px;
    position: absolute;
    top: 1px;
    left: 8px;
}
.notification .Circle .num {
    color: #F8F8F8;
    font-size: 8px;
    font-weight: 400;
    position: absolute;
    text-align: center;
    margin: auto;
    display: block;
    margin: auto;
    line-height: 14px;
    width: 14px;
    font-style: normal;
}
.notificationdata{position: relative;}
.notificationdata .Circle {
    background: #3BB702;
    width: 14px;
    height: 14px;
    border-radius: 18px;
    position: absolute;
    top: 1px;
    left: 8px;
}
.notificationdata .Circle .num {
    color: #F8F8F8;
    font-size: 8px;
    font-weight: 400;
    position: absolute;
    text-align: center;
    margin: auto;
    display: block;
    margin: auto;
    line-height: 14px;
    width: 14px;
    font-style: normal;
}
.TopOPtion select {
    border: none;
    background: transparent;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width:115px;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #fff;height: auto; appearance: none;
}
.TopOPtion select {
    background-image: url(../../assets/images/drop_arrow_white.svg) !important;
    background-repeat: no-repeat !important;
    background-position: right 5px center !important; padding: 0 20px 0 0;
}
.TopOPtion span.boat-txt{
    width: 85px;text-overflow:ellipsis;white-space: nowrap; overflow: hidden;
}
.TopOPtion select:focus-visible{ outline: 0;}
.TopOPtion select option{color: #000}
.topRightActionBtn .logoutIcon{
    display: none;
}

@media(min-width:460px){
    .TopOPtion select {
        width:135px;
    }
}

@media(min-width:1024px){
    .TopOPtion select{color: #000}
    .topRightActionBtn .logoutIcon{display: inline-block;}
    .topRightActionBtn svg  {width: 23px; height: 23px;fill: #7E7D7D;}    
    .TopOPtion select{border: none; background: transparent;white-space: nowrap;
        width:150px;
        font-size: 16px; appearance: none;
    }
    .TopOPtion select {
    background-image: url(../../assets/images/drop_arrow_black.svg) !important;
    background-repeat: no-repeat !important;
    background-position: right 5px center !important;
}
    .TopOPtion span.boat-txt{
        width: 95px;
    }
}
.topRightActionBtn .mobileSearch{display: inline-block;}
.topRightActionBtn .mobileSearch.DivOpen {
    display: inline-block;
    position: fixed;
    left: 50%;
    width: 90%;
    margin: auto;
    text-align: center;
    padding: 5px 0;
    margin-left: -40%;
    top: 1px;
    z-index: 99;
}
@media(min-width:660px){
    .topRightActionBtn .mobileSearch{display: none;}
}
.mobileSearch .input-box {
    position: relative;
    width: 100%;
    max-width:35px;
    height: auto;
    margin: 0;
    background-color: transparent;
    border-radius: 6px;
    transition: all 0.5s ease-in-out;
}
.mobileSearch .input-box.open {
    max-width: 90%;
    left: 50%;
    margin-left: -50%; margin-top:-2px;
}
.mobileSearch .input-box input {
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: 400;
  color: #333;
  padding: 0 15px;
  border: none;
  border-radius: 100px;
  outline: none;
  transition: all 0.5s ease-in-out; visibility: hidden;
}
.mobileSearch .input-box.open input {
  padding:7px 15px 7px 53px; visibility: visible;
}
.mobileSearch .input-box .search {
    position: absolute;
    top: 0;
    left: 0;
    width: 52px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    border-radius:100px;
    cursor: pointer;
    text-indent: -1000px;
}
.mobileSearch .input-box.open .search {
  border-radius: 100px 0 0 100px; background-color: #fff;
}
.mobileSearch .input-box.open svg{fill: #7E7D7D;}

.mobileSearch .search .search-icon {
  font-size: 30px;
  color: #1c1c1c;
}
.mobileSearch .input-box .close-icon {
  position: absolute;
  top: 50%;
  right: 10px;
  font-size: 30px;
  color: #1c1c1c;
  padding: 5px;
  transform: translateY(-50%);
  transition: all 0.5s ease-in-out;
  cursor: pointer;
  pointer-events: none;
  opacity: 0;
}
.mobileSearch .input-box.open .close-icon {
  transform: translateY(-50%) rotate(180deg);
  pointer-events: auto;
  opacity: 1;
}

footer {
    color: #6A6A6A;
    font-size: 16px;
    font-weight: 300;
    width:100% !important;
    vertical-align: top;
    /*border-top: 1px solid #233968;*/
    padding: 10px 0px 0!important;
    margin: 0 auto;
    position: relative;
    top: 5px; display: none;
}
footer .FooterContent{padding:0 15px 15px;}
footer a{color: var(--primary-color);font-weight: 400; }
footer span{ margin:0 15px; }
footer pre {
    text-align: right;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: inline-flex;
    align-items: end;
    justify-content: flex-end;
    float: right;
}
footer .bordergrad {
    background-image: linear-gradient(150deg,var(--secondary-color) 10.1%,white 10.7%,#36354b 11%);
    height: 10px;
    margin: auto;
}

@media(min-width:1024px){
    footer {
        border-top: 1px solid #233968;
    }
}
.MainBG-PlusIcon {
    padding: 0px 0px 120px 0;
}
@media(min-width:1024px){
    .MainBG-PlusIcon {
        padding: 0;
    }
}

/* accordian */
.faq-drawer {
  margin-bottom:15px;
}
.faq-drawer__content-wrapper {
  font-size: 1.25em;
  line-height: 1.4em;
  max-height: 0px;
  overflow: hidden;
  transition: 0.25s ease-in-out;
}
.faq-drawer__content{margin: 15px 0 0;}
.faq-drawer__title {
    border-top: #A7A7A7 1px solid;
    cursor: pointer;
    display: block;
    color: #000;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding:15px 0 0 0;
    position: relative;
    margin-bottom: 0;
    transition: all 0.25s ease-out;
}
.faq-drawer__title b {
    width: 100%;
    display: inline-flex;
}
@media(min-width: 576px){
    .faq-drawer__title {
        font-size: 17px;
    }
}

.faq-drawer__title::before {
  border-style: solid;
  border-width: 1px 1px 0 0;
  content: " ";
  display: inline-block;
  float: left;
  height: 10px;
  left: 2px;
  position: relative;
  top: 6px;
  transform:rotate(45deg);
  transition: 0.35s ease-in-out;
  vertical-align: top;
  width: 10px; margin: 0 8px 0 0;
}
.arrowRemove .faq-drawer__title{cursor: default;}
.arrowRemove .faq-drawer__title::before{
    content: " "; display: none;
}
.faq-drawer:last-child {
    padding:0 0 130px;
}
.commonModal .faq-drawer:last-child {
    padding: 0 0 0;
}
/* OPTIONAL HOVER STATE */
.faq-drawer__title:hover { 
  color: #000;
}

.faq-drawer__trigger:checked
  + .faq-drawer__title
  + .faq-drawer__content-wrapper {
  max-height:100%;
}

.faq-drawer__trigger:checked + .faq-drawer__title::before {
  transform: rotate(135deg);
  transition: 0.25s ease-in-out;top: 2px;
}

input[type="checkbox"] {
  display: none;
}

/*@media only screen and (max-width: 600px) {
  .container {
    padding: 80px;
  }
}*/

.mainBox .container{ max-width:100% !important;width:100% !important; padding-right: 15px;
    padding-left: 15px; }

/* MobileFooter */
.MobileFooter{ background:#000;position: relative; display:inline-block; padding: 0 !important; margin: 40px 0;}
/*.MobileFooter ul{ position:relative; padding:0; margin:0; text-align: center;}*/
.MobileFooter ul {
    position: fixed;
    padding: 0;
    margin: 0;
    text-align: center;
    bottom: 0;
    width: 100%;
    background: #000;
    left: 0;
}
.MobileFooter ul li{ width:18.9%; background-color:#333333; transition: 0.5s all; text-align: center; padding:12px 0; display: inline-block;}
.MobileFooter ul li:hover,.MobileFooter ul li.active { background:#000; transition: 0.5s all;}
.MobileFooter ul li a svg{
    fill: #D9D9D9; width: 35px; height:28px;
}
.MobileFooter ul li.active a svg{
    fill: var(--secondary-color);
}
@media(min-width:359px){
    .MobileFooter ul li{ width:19.1%;}
}
@media(min-width:420px){
    .MobileFooter ul li{ width:19.20%;}
}
@media(min-width:480px){
    .MobileFooter ul li{ width:19.32%;}
}
@media(min-width:576px){
    .MobileFooter ul li{ width:19.40%;}
}
@media(min-width:670px){
    .MobileFooter ul li{ width:19.50%;}
}
@media(min-width:768px){
    .MobileFooter ul li a svg{
        /*width: 57px; height:50px;*/width:40px; height:30px;
    }
    .MobileFooter ul li{ width:19.58%;padding:14px 0;}
}
@media(min-width:1024px){
    .MobileFooter{display:none;}
    footer{display: inline-block;}
}

/* hamburger menu */
.hamburgerDiv {
    /*position: absolute;
    background: #000;
    top: 0;
    bottom: 0;
    color: #fff;
    height: 101%;
    width: 100%;
    padding: 00;*/

   background: rgba(0, 0, 0, 0.75);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    top: 0;
    left: 0;
}
.hamburgerDiv ul {
    position: absolute;
    bottom:80px;
    width: 100%;margin: 0; padding: 0;right: 0;
}
.hamburgerDiv ul li {
    text-align: right;
    display: flex;
    margin: 15px 0px 10px;
    padding: 0 10px;
    align-items: end;
    justify-content: end; 
}
.hamburgerDiv ul li a{
    padding: 10px 15px;
    line-height: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 23px;
    color: #000000 !important;
    position: relative;
    border-bottom: none;
    display: inline-block;
    text-align: left;
    margin: 0;
    background: #FFFFFF;
    border: 1px solid var(--secondary-color);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 22.5px;
    text-shadow: none;width: 250px;
}
.hamburgerDiv ul li .hamburger_Menuimages {
    display: initial;
    position: relative;
    top: -33px;
    right: -6px;
    width: 100%;
    display: block;
}
.hamburgerDiv ul li .hamburger_Menuimages svg {
    vertical-align: middle;
    border-style: none;
    display: inline-block;
    width: 28px;
    height: 28px;
    position: absolute;
    right:10px;
    top: 7px;
}
.hamburgerDiv .Hamburger_Close {
    position: relative;
    right: 0;
    bottom: 0;
}
.hamburgerDiv .Hamburger_Close a {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: auto !important;
    padding: 0 !important;
}

/* modal */
.modal-dialog {
    margin:0rem auto;
}
.modal-dialog .themebtn_colored,
.modal-dialog .themebtn_colored:hover,
.modal-dialog .themebtn_colored:active,
.modal-dialog .themebtn_colored:focus,
.modal-dialog .btnOnlyLink{
    margin: 0 auto;
}
.modal-dialog.modal-dialog-scrollable {
    max-height: calc(100% - 0rem);
}
.modal-dialog.modal-dialog-scrollable.modal-dialog-centered {
    max-height: calc(100% - 0rem);
    margin: 0rem auto;
    margin:7px auto;
}
.commonModal.show .modal-dialog,
.commonModal .modal-dialog {
    max-width: 375px;
    /*margin: 60px auto 0!important;*/
    min-height: calc(100% - 0rem) !important; background: #fff;
}
.commonModal.show .modal-dialog,
.commonModal .modal-dialog {
    max-width: 377px;
}
.commonModal.CustomReportModalShow .modal-dialog {
    max-width:768px;
}
.commonModal.TermsModal.show .modal-dialog {
    max-width: 375px;
}
.commonModal.WidthInc.show .modal-dialog {
    max-width:500px;
}
.modal.show .modal-dialog,
.modal .modal-dialog {
    -webkit-transform: none !important;
}
@media(min-width:992px){
    .commonModal.TermsModal.show .modal-dialog {
        max-width: 768px;
    }
    .modal-dialog.modal-dialog-scrollable.modal-dialog-centered {
        margin: 1.75rem auto;
    }
    .commonModal.WidthInc.show .modal-dialog {
        max-width:500px;
    }
}
.commonModal .modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 1rem);
}

.commonModal .modal-content{border-radius: 0;margin:0 auto 0}/* margin:0 auto 1.75rem; */
.commonModal .modal-header{ background-color:#333; color:#fff; border-radius:0; }
/*.commonModal .modal-title{color: #FFF; font-size: 20px; font-weight:400; text-transform: capitalize;}*/
.commonModal .modal-title {
    color: #FFF;
    font-size: 20px;
    font-weight: 400;
    text-transform: capitalize;
    width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.commonModal .btn-close {
    background: url(../../assets/images/closeWhite.svg);
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 1;
    width: 17px;
    height: 16px;
    border: none;
    padding: 1rem 1rem;
}
#image-preview .btn-close {
    background: url(../../assets/images/closeWhite.svg);
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 1;
    width: 17px;
    height: 16px;
    border: none;
    padding: 1rem 1rem; z-index: 99;
}
.commonModal .modalfooter .btn-close {width: 225px; height: 50px; padding: 0;}
.alert-warning {
    background: linear-gradient(0deg, rgba(255, 158, 0, 0.03), rgba(255, 158, 0, 0.03)), #FFFFFF;
    border: 1px solid #FF9D00;
    border-radius: 3px;
    font-weight: 600;
    color: #000;
    font-size: 16px;
}
.alert {
    width: auto;
    min-height: auto;
    align-items: center;
    text-align: left;
    margin: auto;
    padding: 10px 10px 10px 40px;
}
.alert-warning:before {
    content: '';
    background: #FF9D00;
    width: 9px;
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0px;
}
.alert span {
    margin: 0;
    display: block;
    text-align: left;
    color: #000;
    font-family: Roboto;
    font-size: 16px;
    font-weight: 400;
}
@media (min-width: 576px){
    .alert {
        width: 336px;
        padding: 10px 10px 10px 30px;
    }
}    

.commonModal .modal-body .content h4{
    color: #153468;
    text-align: center;
    font-size: 28px; line-height: 1.3rem;
    font-weight: 300;
}
.commonModal .modal-body .content p{
    color: #000;
    text-align: left;
    font-size: 16px;
    font-weight: 400;
}
.commonModal .modal-body .content p.text-lblue {
    font-weight: 300;
    font-size: 11px;
    line-height: 13px;
    text-align: center;
    color: #1B73E8;
}
.commonModal .modal-body .ModalContentBox{}
.commonModal .modal-body .ModalContentBox ul{margin: 0;padding:10px;}
.commonModal .modal-body .ModalContentBox ul li{
    border-radius: 25px;
    border: 1px solid #CCC;
    background: var(--primary-color); margin: 0 0 15px; padding:10px 15px;
}
.commonModal .modal-body .ModalContentBox ul li a h3{
    color: #FFF;
    text-align: center;
    font-size: 32px;
    font-weight: 700;
}
.commonModal .modal-body .ModalContentBox ul li a span{
    display: block;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 400; margin: 10px 0 0;
}
.accordianBoatSearchBtn {
    margin:10px 0 0;
    align-items: center;
    display: flex;
    justify-content: center;
}
.Boat_Hin-Search .accordianBoatSearchBtn {margin:4px 0 0;}
.Boat_Hin-Search .accordianBoatSearchBtn .btn.fw-400.themebtn_colored {
    font-size: 16px;
    width: 100%;
    padding:8px 15px; width: auto; height: auto; 
}

.accordianBoatSearchBtn button,.accordianBoatSearchBtn button:hover{
    padding: 0; width: 118px; height: 50px; margin: 0 !important;
}

@media(min-width:576px){
    .accordianBoatSearchBtn {
        margin: 0;
        align-items: end;
        display: flex;
        justify-content: flex-end;
    }
    .accordianBoatSearchBtn button,.accordianBoatSearchBtn button:hover{
        padding: 0; width: 118px; height: 50px; margin: 0 !important;
    }
}
/* process */
.process_card {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: none;
    position: relative;
    margin:-20px 0 20px;
}
.process_card .percent {
  position: relative;
}
.process_card svg {
  position: relative;
  width: 120px;
  height: 120px;
  transform: rotate(-90deg);
}
.process_card svg circle {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #979797;
  stroke-width:8;
  stroke-linecap: round;
}
.process_card svg circle:last-of-type {
  stroke-dasharray: 308px;
  stroke-dashoffset: calc(308px - (308px * var(--percent)) / 100);
  stroke: #3498db; 
}
.process_card svg.Mobile_Svg circle:last-of-type {
  stroke-dasharray: 171px;
  stroke-dashoffset: calc(171px - (171px * var(--percent)) / 100);
  stroke: #3498db; 
}
.process_card .number {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.process_card .number h3 {
    color: #153468;
    text-align: center;
    font-family: Roboto;
    font-size:25px;
    font-weight: 500; margin: 0;
}
.process_card .number h3 span {
  font-size: 2rem;
}
.process_card .title h2 {
    margin:0;
/*    color: #153468;*/
    color: var(--primary-color);
    text-align: center;
    font-size:12px;
    font-weight: 500;
    position: absolute;
    /* top: 0; */
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 0;
    right: 0;
}
.process_card svg circle.Critical:last-of-type{stroke: #c50202;}
.process_card svg circle.Medium:last-of-type{stroke: #ffc034;}
.process_card svg circle.Low:last-of-type{stroke: #3ab702;}
.process_card svg circle.Maintenance:last-of-type{stroke: #3e79da;}

/*.circle1, .circle2 {
    cx: 61;
    cy: 61;
    r: 28;
}*/
.Mobile_Svg{ display:inline-block; }
.Desktop_Svg{ display:none; }

.process .row {
        margin: 0;
    }
.process_card.Disable .number h3,
.process_card.Disable .title h2{color: #979797}

@media(min-width:576px){
    .process .row {
        margin-right: calc(-.5 * var(--bs-gutter-x));
        margin-left: calc(-.5 * var(--bs-gutter-x));
    }
    .Mobile_Svg{ display:none; }
    .Desktop_Svg{ display:inline-block; }

    /*.circle1, .circle2 {
        cx: 85;
        cy: 85; r:50;
    }*/
    .process_card svg circle {
      stroke-width: 15;
    }
    .process_card .number h3 {
        font-size: 40px;
    }
    .process_card .title h2 {
        font-size: 18px;
    }
    .process_card svg {
      position: relative;
      width: 170px;
      height: 170px;
      transform: rotate(-90deg);
    } 
}
@media(min-width:420px){
    .process_card .title h2 {
        margin: -5px 0;
        font-size:14px;
        font-weight: 500;
    }
}
@media(min-width:620px){
    .process_card .title h2 {
        font-size:18px;
    }
}
.form-error {
    color: #FF0000;
    font-size: 13px;
}
/* custom Scrollbar */
.commonModal.customScrollbar .modal-body{max-height:75vh; overflow-y: scroll;}
.customScrollbar.show  #style-3::-webkit-scrollbar-track{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}
.customScrollbar.show  #style-3::-webkit-scrollbar{
    width: 6px;
    background-color: #F5F5F5;
}
.customScrollbar.show #style-3::-webkit-scrollbar-thumb{
    background-color: #000000;
}

/* table */
a{text-decoration: none !important;}
.table td, .table th{padding: 0.55rem 5px;}
.table thead th{
    color: #6A6A6A;
    font-size: 14px;
    font-weight: 300;
    line-height: normal; border: none;
}
/*.table thead,
.table thead th,
.table tbody{display: block;}*/

.table tbody tr{--bs-table-accent-bg: transparent !important}
.table tbody tr td p{margin: 0}
.table tbody tr td:first-child p,
.table tbody tr td p{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; width:75px !important;min-width: 90% !important;
}
.table.TableContent_ellipsis tbody tr td p{width:80px !important;}


.table.MyboatsCompletHistory tbody tr td p{width:120px !important;}

@media(min-width:375px){ 
    .table tbody tr td p{
     width:103px !important;
    }
    .table.TableContent_ellipsis tbody tr td p{width:87px !important;}
}
@media(min-width:395px){ 
    .table tbody tr td p{
     width:125px !important;
    }
}
/*@media(min-width:420px){    
    .table.TableContent_ellipsis tbody tr td p{width:110px !important;}
}
@media(min-width:500px){    
    .table.TableContent_ellipsis tbody tr td p{width:148px !important;}
}
@media(min-width:576px){    
    .table.TableContent_ellipsis tbody tr td p{width:175px !important;}
}*/

/*@media(min-width:620px){
   .table tbody tr td:first-child p{
     width: 260px !important;
    } 
    .table.MyboatsCompletHistory tbody tr td p{width:260px !important;}
}*/
/*@media(min-width:920px){
   .table tbody tr td:first-child p{
     width: 310px !important;
    } 
    .table tbody tr td p{
        width:250px !important; 
    }
    .commonModal .table tbody tr td p{width:90px !important;}
}*/
table.table.dataTable.tblMoreLess{margin-bottom: 0;}
.table tbody{border-top: none !important;}
.table tbody td{
    color: #000;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    --bs-table-color-type: transparent !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg-type: transparent !important; border: none; vertical-align: middle;
}
.table tbody td p{ font-size: 14px;}
.table tbody td.vesselBoat{color: var(--primary-color);font-weight:500;}
.table tbody td ul.statusList {
    margin: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.table tbody td ul.statusList li{ display:inline-block; margin:0 2px;vertical-align: middle;}

.table tbody td:last-child ul.statusList li:last-child{text-align: right;}

@media(min-width:576px){
    .table tbody td ul.statusList li{margin:0 5px; }
    .table tbody td{
        font-size: 16px;
    }
    .table tbody td p{ font-size: 16px;}
}
/*.table tbody td ul.statusList li:last-child {
    text-align: right;
    float: right;
}*/
.tableSvgIcon{height:20px; width: 20px;}
.tableSvgIcon-admin{height:20px; width:16px;}

.icon-yellow{fill: #FFC034}
.icon-red{fill: #C50202}
.icon-blue{fill: #1B73E8}
.icon-green{fill: #00982D}
.icon-grey{fill: #6A6A6A}

.font-red{color: #EE0202}

.ClearBtn{
    color: var(--primary-color);
    text-align: right;
    font-size: 14px;
    font-weight: 400; float: right;
}
@media(min-width: 576px){
    .ClearBtn {
        font-size: 16px;
    }
}
.ClearBtn svg {
    fill: var(--primary-color);
    transition: 0.5s all;
    position: relative;
    top: -2px;
}
.ClearBtn:hover,
.ClearBtn:hover svg{color: var(--primary-color); fill:var(--primary-color);transition: 0.5s all;} 
.ClearBtn.disable{
    color: #979797;
}
.ClearBtn.disable svg{fill: #979797;}
#Show_MoreBtn,
#Show_MoreBtnTrip,
.Show_MoreBtnFinal,
#show_service_btn,
#single_service_btn{
    color: var(--primary-color);
    font-size: 16px;
    font-weight: 700; cursor: pointer;
}
@media(min-width:375px){
    .tableSvgIcon{/*height:16px; width: 16px;*/margin: 0 3px 0 0;}
}

@media(min-width:576px){
    .table tbody td{
        font-size: 16px;
    }    
    .tableSvgIcon-admin{height:20px; width:20px;}
}
@media(min-width:1024px){    
    .tableSvgIcon{height: 20px; width: 20px; margin: 0}
}

/* progress */
.progress-section {
  width:39px;
  /*max-width: 600px;*/
  border-radius: 40px;
  /*background: #333;
  padding: 1rem 2rem;*/
  margin: 0 auto;
}
.progress-section .progress {
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  border-radius: 10px;
  height: 10px;
}
.progress-section .progress::-webkit-progress-bar {
  background-color: #f0f0f0;
}
.progress-section .progress::-webkit-progress-bar,
.progress-section .progress::-webkit-progress-value {
  border-radius: 10px;
}
.progress-section .progress::-moz-progress-bar {
  border-radius: 10px;
}
.progress-section .red::-webkit-progress-value {
  background: #c50202;
}
.progress-section .yellow::-webkit-progress-value {
  background: #FFC034;
}
.progress-section .green::-webkit-progress-value {
  background: #3BB702;
}
@media(min-width:576px){
    .progress-section {
      width:72px;
    }
}

/* notification */
.notification-box{
  width:300px;
  border-radius: 10px;
  position: absolute;
  padding: 0px;
  right:0;
  top:25px;
  background-color: #F4F4F4;
  -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.1);
  box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.1);
  z-index: 9;  display: none;
}
.notification-box .content{
  padding: 20px;
  color: black;
  vertical-align: middle;
  text-align: left;
}
.notification-box .cont{
    position: relative;
    top: 0;
    background-color: #F4F4F4;max-height: 350px; overflow-y: scroll;
}
.notification-box .cont:empty{
  display: none;
}
.notification-box .stick{
  text-align: center;  
  display: block;
  font-size:14px;
}
.notification-box .stick:hover{
  color: black;
}
.notification-box .cent{
  text-align: center;
  display: block;
}
.notification-box .sec{
  padding:5px 10px;
  background-color: #F4F4F4;
  transition: 0.5s; border-bottom: 1px solid #A7A7A7;
}
.notification-box .sec:last-child{
    border-bottom: none;
}
.notification-box .profCont{
  padding-left: 15px;
}
.notification-box .profile{
  -webkit-clip-path: circle(50% at 50% 50%);
  clip-path: circle(50% at 50% 50%);
  width:45px;
  float: left;
}
.notification-box .txt{
  vertical-align: top;
  font-size:14px;
  padding:5px 10px 0px 75px;
}
.notification-box .sec:hover{
  background-color: #BFBFBF;
}
/* notification-box dark */
.notification-box.dark{
  width:300px;
  border-radius: 10px;
  position: absolute;
  padding: 0px;
  right:0;
  top:25px;
  background-color: #F4F4F4;
  -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.1);
  box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.1);
  z-index: 9;  display: none;
}
.notification-box.dark a{ color:#fff }
.notification-box.dark svg, .notification-box.dark img {
    fill: #fff;
    width: 20px;
    height: 20px;
}
.notification-box.dark  .bell-card-body  {
    border-top: 10px solid #153468; border-bottom: none; padding:5px 10px 8px 10px;
}
.notification-box.dark  .bell-card-body.blue {
    border-top: 10px solid #366EC9;
}
.notification-box.dark  .bell-card-body.red {
    border-top: 10px solid #C50202;
}
.notification-box.dark  .bell-card-body.green {
    border-top: 10px solid #3BB702;
}
.notification-box.dark  .bell-card-body.yellow {
    border-top: 10px solid #FFC034;
}
.notification-box.dark .content{
  padding: 20px;
  color: black;
  vertical-align: middle;
  text-align: left;
}
.notification-box.dark .cont{
    position: relative;
    top: 0;
    background-color: #000;max-height: 350px; overflow-y: scroll;
    border-radius: 5px;
}
.notification-box.dark .cont:empty{
  display: none;
}
.notification-box.dark .stick{
  text-align: center;  
  display: block;
  font-size:14px;
}
.notification-box.dark .stick:hover{
  color: black;
}
.notification-box.dark .cent{
  text-align: center;
  display: block;
}
.notification-box.dark .sec{
  padding:5px 10px;
  background-color: #F4F4F4;
  transition: 0.5s; border-bottom: 1px solid #A7A7A7;
}
.notification-box.dark .sec:last-child{
    border-bottom: none;
}
.notification-box.dark .profCont{
  padding-left: 15px;
}
.notification-box.dark .profile{
  -webkit-clip-path: circle(50% at 50% 50%);
  clip-path: circle(50% at 50% 50%);
  width:45px;
  float: left;
}
.notification-box.dark .txt{
  vertical-align: top;
  font-size:14px;
  padding:5px 10px 0px 75px;
}
.notification-box.dark .sec:hover{
  background-color: #BFBFBF;
}


/* loginPg */
.Login-form-wrapper .passwordField {
    position: relative;
}
.Login-form-wrapper a#forgotPasswordBtn {
    position: absolute;
    top: 0;
    right: 0;
}
.Login-form-wrapper .form-check {
    padding-left:0;
}
.Login-form-wrapper .text-desc {
    color: #6A6A6A;
}
.Login-form-wrapper .terms-p p{
    font-size: 13px;color: #6A6A6A;
}
.Login-form-wrapper .linkcursor {
    cursor: pointer;
}
.Login-form-wrapper .btn-fb,
.Login-form-wrapper .btn-fb:hover {
    display: block;
    margin: 1rem auto 0;
    background: #0165E1;
    border: 1px solid #0165E1;
    color: #fff;
    font-weight: 500;
    width: 250px;
    height: 50px;
    border-radius: 25px;
    font-size: 17px; text-align: left;
}
.Login-form-wrapper .social-btn span img {
    width: 25px;
    height: 25px;
    max-height: 25px;
    position: relative;
    bottom: 1px;
    margin: 0 5px 0 0;
}
.agreementModalBody{}
.agreementModalFooter.d-block{
    display: block!important;
    position: fixed;
    bottom: 0;
    background: #fff;
    padding: 0;
    width: 373px;
    margin: 0 1px;
}
.agreementModalFooter  button.btn.fw-400.themebtn_colored.btn-block {
    margin: 0 auto;
}

.set-left{float: none;}
.set-right{ float:none;}
button.btnOnlyLink.set-right.mobileContact{position: relative; top:20px;}
@media(min-width:768px){
    .set-left{float: left;}
    .set-right{ float:right;}
    button.btnOnlyLink.set-right.mobileContact{top:0px;}
}
/* toogle switch btn */
.SwitchToggleBtn{position: relative; margin:20px 0 20px 10px;}
.SwitchToggleBtn label{margin-bottom: 0;}
#app-cover {
  display: block;
  width: auto;
  margin: 0px auto;
  counter-reset: button-counter; position: relative;
}
.SwitchToggleBtn label b{
    color: #333;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal; 
}
.SwitchToggleBtn p{
    color: #333;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal; 
}

#app-cover input[type="checkbox"] {
    display: inline-block;
}
#app-cover .toggle-button-cover {
  display: block;
  position: relative;
  width: auto;
  height: auto;
  box-sizing: border-box;
}
#app-cover .button-cover {
  height: auto;
  margin: 0;
  background-color: #fff;
  box-shadow: 0 10px 20px -8px #c5d6d6;
  border-radius: 4px;
}
#app-cover .button-cover:before {
  counter-increment: button-counter;
  content: counter(button-counter);
  position: absolute;
  right: 0;
  bottom: 0;
  color: #d7e3e3;
  font-size: 12px;
  line-height: 1;
  padding: 5px; visibility: hidden;
}
#app-cover .button-cover,
#app-cover .knobs,
#app-cover .layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
#app-cover .button {
    position: relative;
    top: 50%;
    width:42px;
    height:22px;
    margin:0;
    overflow: hidden; position: absolute; right: 0;
}
#app-cover .button.r,
.button.r .layer {
  border-radius: 100px;
}
#app-cover .button.b2 {
  border-radius: 2px;
}
#app-cover .checkbox {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
#app-cover .knobs {
  z-index: 2;
}
#app-cover .layer {
  width: 100%;
  background-color: transparent;
  transition: 0.3s ease all;
  z-index: 1; border: 2px solid #767676;
}
/* Button 4 */
#app-cover #button-4 .knobs:before, #app-cover #button-4 .knobs:after {
    position: absolute;
    top:4.80px;
    left: 6px;
    width: 12px;
    height: 6px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    padding: 6px 4px;
    background-color: #fff;
    border-radius: 50%;
    transition: 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15) all;
}
#app-cover #button-4 .knobs:before {
  content: ""; background: #767676;
}
#app-cover #button-4 .knobs:after {
  content: "";
}
#app-cover #button-4 .knobs:after {
  top: -28px;
  right:7px;
  left: auto;
  background-color: #767676;
}
#app-cover #button-4 .checkbox:checked + .knobs:before {
  top: -28px;
}
#app-cover #button-4 .checkbox:checked + .knobs:after {
  top: 4px;background-color:#fff;
}
#app-cover #button-4 .checkbox:checked ~ .layer {
  background-color:#41AD49; border: 2px solid #41AD49;
}

.linkcursor{
    color: var(--primary-color);
    text-decoration: none;
    /*cursor: pointer;*/
}
/* AdditionalInfo_List */
ul.AdditionalInfo_List {
    display: flex;
    margin:35px 0 15px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
/*.AdditionalInfo_List li {
    border-radius: 10px;
    background: #333;
    min-width: 115px; width: 115px;
    text-align: center;
    padding: 10px;
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 10px;
}*/
.AdditionalInfo_List li {
    border-radius: 10px;
    background: #333;
    min-width: 96px;
    width: 102px;
    /* height: 99px; */
    text-align: center;
    padding: 0;
    display: inline-block;
    vertical-align: top;
    margin: 0 2px 10px;
}
.AdditionalInfo_List li svg{
    width:30px; height:30px; display: block; fill:#D9D9D9; margin:8px auto 0px;
}
.AdditionalInfo_List li span {
    color: #FFF;
    text-align: center;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    font-size:16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1px;
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
}
@media(min-width:380px){
    .AdditionalInfo_List li {
        width: 115px;
    }
}
@media(min-width:576px){
    ul.AdditionalInfo_List {
        display: flex;
    }
    .AdditionalInfo_List li {
        margin: 0 50px;
    }
}
@media(min-width:1024px){
    ul.AdditionalInfo_List {
        margin: 0;
        padding: 0;
        align-items: center;
        justify-content: center;
    }
    .AdditionalInfo_List li {
        margin: 0 50px;
    }
}
/* MainBoxTopSearch */
.MainBoxTopSearch{position: relative; text-align: center; margin: 20px 0;}
.MainBoxTopSearch .TopSearch{display: block; margin: auto; }
.MainBoxTopSearch h5.boat_name{
    color: #4A8522;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal; margin: 0 0 10px;
}
.MainBoxTopSearch .input-grey-rounded {
    display: flex;
    font-size: 16px;
    line-height: 1.5;
    background: #fff;
    border: 1px solid transparent;
    background-image: url(../../assets/images/searchIcon.svg);
    background-repeat: no-repeat;
    background-position: 12px 8px;
    background-size: 20px 20px;
    border-radius: 100px;
    width: 316.885px;
    padding: 0.5em 1em 0.5em 2.5em;
    height: 36px;border: 1px solid #979797;  box-shadow: none;
}
.MainBoxTopSearch div#livesearch {
    position: relative;
    top: 0;
}
.MainBoxTopSearch div#livesearch span.first{
    padding: 0 5px;
}
.MainBoxTopSearch .live_Search td object {
    height: auto;
    width: 70% !important;
}
div#livesearch td{
    font-weight: 400; font-size: 15px;
}
@media(min-width:576px){
    .MainBoxTopSearch div#livesearch span.first{
        padding: 0;
    }
    .MainBoxTopSearch .live_Search td object {
        height: auto;
        width:100% !important;
    }
    div#livesearch td{
        font-size: 16px;
    }
}

/* boat display */
.boatDisplay{ display:flex;padding:0; text-align: center;}
/*.boatDisplay li{ width:16.67%; display:inline-block; vertical-align:middle;margin:0 30px 0 0;}*/

.boatDisplay li .bg-home2 ,.boatDisplay li .bg-home3,.boatDisplay li .bg-home1{width: 100% !important;}

.boatDisplay li {
    width: 22%;
    display: inline-block;
    vertical-align: middle; margin: 0 auto 10px !important;
    /*margin:0 2px 8px !important;*/
}
.bdetails .equipment_card .boatDisplay li {
    width: 22%;
    display: inline-block;
    vertical-align: middle;
    margin:0 auto 10px !important;
}
@media(min-width:460px){
    .boatDisplay li{margin:0 12px 0 0;}
}
@media(min-width:520px){
    .boatDisplay li{margin:0 15px 0 0;}
}
@media(min-width:662px){
    .boatDisplay li{margin:0 20px 0 0;}
}
@media(min-width:768px){
    .boatDisplay li{margin:0 22px 0 0;}
}
@media(min-width:1024px){
    .boatDisplay li{margin:0 18px 18px 0;}
}
.boatDisplay li:last-child{margin:0 }
.boatDisplay li object {
    height: 78%;
    width: 100% !important; position: relative;
}
.boatDisplay .Icon .GaugeIcon{
    width: 100%;height:auto;
}
@media(min-width:576px){
    .boatDisplay .Icon .GaugeIcon{
        width: 80%;height:auto;
    }
}
.bg-home2 {
    background: rgba(228, 7, 7, 0.03);
    border: 0.5px solid #E40707;
    border-radius: 7px;
    width: 100%;
    height: auto;
    text-align: center;
    margin-left: auto;
    margin-right: auto; /*padding: 15px 0 10px;*/
}
.bg-home2 .home-fan{display: none; }
.home-card-header {
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #000;
    height: auto;
}
.bg-home2 p{ margin-bottom:5px;}

@media (min-width:576px){
    .bg-home2 {width:75px; height: auto; padding: 0;}
    .bg-home2 .home-fan{ display:block; }
    .bg-home2 p{ margin-bottom:0.5rem;}
}
@media (min-width: 768px){
    .home-card-header {
        height: auto;
    }
}
@media (min-width: 582px){
    .home-card-header {
        height: auto;
    }
}
.home-coard-desc {
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: var(--primary-color);
}
.boatAddedContainer .my-auto .home-fan {
    width: auto;
    height: 30px;
}
.home-fan {
    width: 32.1px !important;
    height: 28px !important;
    margin:13px auto 6px;
}
.boatAddedContainer p {
    margin-bottom: 0.5rem;
}
object {
    width:20%;
    pointer-events: none;
}

.Icon {
    position: relative;
    text-align: center;
    background: transparent;
}
.Icon object {
    z-index: 1;
    position: relative;
}
.fuel-txt {
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #000;
    margin-bottom: 0px;
    /* margin-top: 7px; */
}
.boaticon {
    position: absolute;
    background: transparent;
    top: 8%;
    right: 0;
    left: 0;
}
.Icon {
    position: relative;
    /* width: 50%; */
    text-align: center;
    background: transparent;
}
.Icon .boaticon object {
    background: transparent;
    position: relative;
    z-index: 0;
    width: 16px !important;
    height: 16px !important;
    top: 6px;
}
@media (min-width: 920px){
    .boatAddedContainer .Icon .boaticon object {
        width: auto !important;
        height: 24px !important;
    }
}
@media (min-width: 768px){
    .boatAddedContainer .Icon .boaticon object {
        width: auto !important;
        height: 18px !important;
    }
}    
@media (min-width: 1200px){
    .Icon .boaticon object {
        top: 8px;
    }
}

/* PlusIcon 
.MainBG-PlusIcon {
    position: absolute;
    right: 30px;
    bottom: 55px;
}
@media(min-width:768px){
    .MainBG-PlusIcon {
        position: fixed;
        bottom: 75px;
    }
}
*/
.commonModal table svg{
    width: 20px; height: 20px;
}
.mobile_none{display: none}

.table tbody td.mobile_none{font-size: 15px;}

@media(min-width:712px){
    .mobile_none{display: table-cell; text-align: center !important;}
}

/* SingleBoatModal */
.SingleBoatModal .mainBox{width: 100%; margin: 0; padding: 0;min-height: auto;}
.SingleBoatModal .modal-body{padding: 0}
.SingleBoatModal .table tbody tr td:first-child p {
    width:140px !important;
}
.SingleBoatModal .table tbody tr td p{width:120px !important;}

.commonModal.SingleBoatModal .table tbody tr td p{width:90px !important;min-width: 90% !important;}
.commonModal.SingleBoatModal .table tbody.maintenanceTable tr td p{width:150px !important;min-width: 90% !important;}
.commonModal.SingleBoatModal .table.ModalServiceLogTable tr td p{width:240px !important;min-width: 90% !important;}
.commonModal.SingleBoatModal tbody.service_log_tbl tr td p{width:240px !important;min-width: 90% !important;}

.table tbody.maintenanceTable tr td p,
.table.trip_log_tbl tbody tr td p,
.table.service_history_tbl tbody tr td p {
    min-width: 90% !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}
.check-list-tbl tr td p,
.boat-todo-list-tbl tr td p{min-width: 90% !important;}

.SingleBoatModal ul.AdditionalInfo_List{/*display: block;*/ text-align: center;}
/*.SingleBoatModal .AdditionalInfo_List li {
    margin: 0 auto 10px;
    width: 115px; display: block;
}*/
.SingleBoatModal .AdditionalInfo_List li {
    margin: 0 auto 10px;
    min-width: 103px;
    display: inline-block;
    width: 103px;
}
/*.SingleBoatModal .AdditionalInfo_List li {
    margin: 0 auto 10px;
    width: 109px;
    display: inline-block;
}*/

@media(min-width:374px){
    .SingleBoatModal .AdditionalInfo_List li {
        min-width: 108px;
        width: 108px;
    }
}
@media(min-width:576px){
    .SingleBoatModal .AdditionalInfo_List li {
        min-width: 109px;
        width: 109px;
    }
}


.SingleBoatModal .bg-home2 ,.SingleBoatModal .bg-home3,.SingleBoatModal .bg-home1{
    width: auto;
    height: auto;padding: 10px 0 10px;
}
.SingleBoatModal .boatDisplay li {
    width:23%;
    margin:0 0px 10px;
}
.SingleBoatModal .boatDisplay li p.fuel-txt{position: relative; top: 5px;}
.SingleBoatModal .boatDisplay li p.home-card-header,
.SingleBoatModal .boatDisplay li p.home-coard-desc{ margin:0;}
.SingleBoatModal .boatDisplay li .item-4{
    width: 100%;
}
.SingleBoatModal .boatDisplay li .item-4 .Icon .boaticon object {
    width: 14px !important;
    height: 14px !important;
    top: 2px;
}
@media(min-width:585px){
    .SingleBoatModal .boatDisplay li {
        width:23.5%;margin:0 1px 10px;
    }
}

/* hin */
.hinD{display: none;}
.hinM{ display:block; }

@media(min-width:768px){
    .hinD{display: block;}
    .hinM{ display:none; } 
}


/* OnboardSwitchDiv */
.OnboardSwitchDiv{position: relative;}
.OnboardSwitchDiv label{
    display: inline-block;
}
.OnboardSwitchDiv #app-cover {
    display: inline-block;
    position: relative;
    float: none;
    top: -16px;
    left: 45px;
}
.OnboardSwitchDiv #app-cover .button {
    width: 35px;
}
.OnboardSwitchDiv .AddBtn {
    position: relative;
    float: right;
    padding: 20px 0 20px 8px;
}

/* tooltipDiv */
.tooltipDiv{position: relative; text-align: center;}
.tooltipDiv .tooltipContent {}
.tooltipDiv .tooltipContent span{
    color: var(--primary-color);
    text-align: center;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal; 
}
.tooltipDiv .tooltipContent {
    display: flex;
    align-items: center;
    justify-content: center;
}
.tooltipDiv .tooltipContent a {
    position: relative;
    margin:0 0px 0 8px;
}

/* admin modal */
.SwitchToggleBtn span {
    position: absolute;
    left:30px;
    display: inline-flex;
}

#EditUser a.InfoIcon {
    position: relative;
    top: -1px;
    left: 3px;
}
.ModelAdminTripEditIcon {
    position: relative;
    margin: 0 3px;
    display: inline-flex;
    align-items: center;
}
.ModelAdminTripEditIcon svg{margin: 0 5px;position: relative;}
.onlyLinks{color: var(--primary-color);font-size: 16px;font-weight: 400;}
.customLocationBtn .cart-set{right: 0;}

#EditBoat .facet{ width:100%; }

.Create_Data{
    color: #000;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal; width: 100%;
}
.Create_Data label{
    color: #6A6A6A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal; 
}
div#image-preview {
    z-index: 999999;
}
#image-preview {
    background-color: #00000096;
}
#image-preview .modal-content {
    background-color: transparent;
}
#image-preview  .modal-header{
    background-color: transparent;
    border: none;
}
#image-preview .modal-title, #pdf-preview  .modal-body button{
    display: none;
}
/*#image-preview  .modal-header button{
    position: absolute;
    right: 20%;
    top: 1%;
}*/
/*#image-preview .modal-header button {
    position: absolute;
    right: 3.5%;
    top: 1.5%;
}
*/
#image-preview .modal-header button {
    position: absolute;
    right:10%;
    top: 1%;
}
#image-preview .modal-close {
    color: white;
    font-size: 40px;
    padding: 6px 24px 0 0 !important;
    opacity: 0.9;
}
.popup-img {
    width: 95%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}
/*.popup-img {
    width: 60%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}*/
.commonModal small.note {
    width: 100%;
    display: block;
    margin: 5px 0 0;
    color: #333;
    font-size: 16px;
    font-weight: 400;
}
.comment-faq-drawer .faq-drawer__title{border-top:none}

/* chat */
.msger {
  display: flex;
  flex-flow: column wrap;
  justify-content: space-between;
  width: 100%;
  max-width: 867px;
  margin:0;
  height: calc(100% - 50px);
  border: var(--border);
  border-radius: 5px;
  /*background: var(--msger-bg);*/
  box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.2);
}
.msger main{display: block;}
.msger .left-msg{float: left;}
.msger .left-msg .msg-bubble{border-radius: 15px;border: 1px solid #E3E3E3;background:#E3E3E3;width: auto !important; max-width: 85% !important;float: left; }

.msger .right-msg{ float: right;}
.msger .right-msg .msg-bubble{background: #366EC9;border-radius: 15px;border: 1px solid #366EC9;width: auto !important; max-width: 85% !important; float: right;}
.msger .msger-chat {
  flex: 1;
  overflow-y: auto;
  padding: 10px 0;
}
.msger .msg-text {
    color: #2E2E2E;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;
    word-wrap: break-word;
}
.msger .right-msg .msg-text{
    color: #fff; text-align: right;
}
.msger .msger-chat::-webkit-scrollbar {
  width: 6px;
}
.msger .msger-chat::-webkit-scrollbar-track {
  background: #ddd;
}
.msger .msger-chat::-webkit-scrollbar-thumb {
  background: #bdbdbd;
}
.msger .msg {
  display: block;
  /*align-items: flex-end;*/
  margin-bottom:0; clear: both;
}
.msger .msg:last-of-type {
  margin: 0;
}
.msger .msg-img {
  width: 50px;
  height: 50px;
  margin-right: 10px;
  background: #ddd;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 50%;
}
.msger .msg-bubble {
  padding:5px 10px;
  border-radius: 15px;
  background: var(--left-msg-bg);
}
.msger .msg-info {
  display: block;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  color: #979797;
    text-align: right;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px; clear: both;
}
.msg-info .right {
    width: 100%;
}
.msg-info .left {
    width: 100%; text-align: left;
}
.msger .msg-info-name {
  margin-right: 10px;
  font-weight: bold;
}
.msger .msg-info-time {
  font-size: 0.85em;
}
/*.msger .left-msg .msg-bubble {
  border-bottom-left-radius: 0;
}*/
.msger .right-msg {
  flex-direction: row-reverse;
}
/*.msger .right-msg .msg-bubble {
  background: var(--right-msg-bg);
  color: #fff;
  border-bottom-right-radius: 0;
}*/
.msger .right-msg .msg-img {
  margin: 0 0 0 10px;
}
.msger .msger-inputarea {
    display: flex;
    padding:0 5px;
    border-radius: 15px;
    border: 1px solid #CCC;
    background: #FFF; 
}
.msger .msger-inputarea * {
  padding:0;
  border: none;
  border-radius: 3px;
  font-size:16px; height: auto; color: #2E2E2E;
}
.msger .msger-input {
  flex: 1;
  background:transparent;
}
.msger .msger-send-btn {
  margin-left: 10px;
  background:transparent;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.23s;
}
.msger .msger-send-btn:hover {
  background:transparent;
}
/*.msger .msger-chat {
  background-color: #fcfcfe;
}*/
.msger input:focus-visible {
    outline-offset: 0px;outline: 0;
}
.OR_class {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: -10px;
}
#MItododeleteShown svg{width: 14px; height: 16px;}
/*td:last-child {
    text-align: right;
}*/
.cart-set.brochure {
    right: 0;
}
.link,
.link:hover{
    color: var(--primary-color); cursor: pointer;
}
.process_card.Disable svg circle:last-of-type{stroke: #979797;}

/* card */
/*.card {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #ffffff;
  margin: 0 20px;
  width: 280px;
  height: 350px;
  border-radius: 5px;
  box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.2);
}*/

.card .percent {
  position: relative;
}

.card svg {
  position: relative;
  width: 210px;
  height: 210px;
  transform: rotate(-90deg);
}

.card svg circle {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #f0f0f0;
  stroke-width: 10;
  stroke-linecap: round;
}

.card svg circle:last-of-type {
  stroke-dasharray: 625px;
  stroke-dashoffset: calc(625px - (625px * var(--percent)) / 100);
  stroke: #3498db; 
}

.card .number {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.card .number h3 {
  font-weight: 200;
  font-size: 3.5rem;
}

.card .number h3 span {
  font-size: 2rem;
}

.card .title h2 {
  margin: 25px 0 0;
}

.card:nth-child(1) svg circle:last-of-type {
  stroke: #f39c12;
}

.card:nth-child(2) svg circle:last-of-type {
  stroke: #2ecc71;
}
.SingleBoatModal_IconCss .table-icon {cursor: default;}
.SingleBoatModal_IconCss .boaticon {
    top:-4%;
}
.p1,.link{
    cursor: pointer;
}
.d-none {
    display: none!important;
}
/* service-caption */
.service-caption {
    font-weight: 300;
    font-size: 16px;
    line-height: 16px;
    color: #808080;
}
.service-caption .mb-0{
    margin-bottom: 0!important;
}
/* auditTrail_Table */
.auditTrail_Table tr td{
    color: #979797;
}
#ExpenseModal #expense_tbl td p{width: 93px !important}
.add_item{font-size: 16px;font-weight: 500;}
.clear {
    clear: both;
    display: block;
    height: 0;
}
 .hide-content {
    display: none;
}
 .thank-contact-us {
    display: none;  
}
label.my_account_modal{
    display: inline-block;
}
#error_div_1,
#error_div_2,
#error_div_3,
#mobile-body-2,
#mobile-body-3,
#mobile-body-4,
#email-body-2,
#email-body-3,
#email-body-4,
#success_div_1,
#error_email_div_1,
#error_email_div_2,
#error_email_div_3,
#change-password-2,
#change-password-3,
#error-change-password,
#error-change-password1 {
    display: none;
}
#savediscard1 {
    display: none;
}

/* step-by-step process */
.step-process h5.title{font-size:18px; color: #000;}
.step-process p{
    font-size: 16px; color: #6a6a6a;
}
.step-process label {
    font-size: 16px;color: #000;
}
.step-process label b{
    color: #000;
}
.step-process hr {
    border-top: 1px solid #E3E3E3;
    width: 100%; display: block;
}

.step-process .msform {
    text-align: center;
    position: relative;
    margin-top: 20px
}

.step-process .msform fieldset {
    background: #fff;
    border: 0 none;
    border-radius: 0.5rem;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding-bottom: 20px;
    position: relative
}
.step-process .form-card {
    text-align: left
}
.step-process .msform fieldset:not(:first-of-type) {
    display: none
}
.step-process .msform input,
.step-process .msform textarea,
.step-process .msform select {
    padding: 8px 15px 8px 15px;
    border: 1px solid #ccc;
    border-radius: 0px;
    margin-bottom: 25px;
    margin-top: 2px;
    width: 100%;
    box-sizing: border-box;
    /*color: #2C3E50;*/
    /*background-color: #ECEFF1;*/
    font-size: 16px;
    /*letter-spacing: 1px*/
}
.step-process .msform #equipment_readings input{padding: 5px; margin: 0;}
.step-process .msform #equipment_readings .trip-btn-label{font-size: 13px;}
.step-process .msform input[type="range"] {
    border-radius: 10px !important;
    padding:0;
    border:none;
    border-radius: 0px;
    margin-bottom: 0;
    margin-top: 0;
    width: 100%;
    box-sizing: border-box;
}
.step-process .msform select{
    appearance: none;
}
.step-process .card {
    z-index: 0;
    border: none;
    position: relative
}
.step-process .fs-title {
    font-size: 25px;
    color: var(--primary-color);
    margin-bottom:0;
    font-weight: normal;
    text-align: left
}
.step-process .purple-text {
    color: var(--primary-color);
    font-weight: normal
}
.step-process .steps {
    font-size: 25px;
    color: gray;
    margin-bottom: 10px;
    font-weight: normal;
    text-align: right
}
.step-process .fieldlabels {
    color: gray;
    text-align: left
}
.step-process #progressbar {
    margin-bottom:10px;
    overflow: hidden;
    color: lightgrey; padding: 0;
}
.step-process #progressbar .active {
    color: #673AB7
}
.step-process #progressbar li {
    list-style-type: none;
    font-size: 15px;
    width: 25%;
    float: left;
    position: relative;
    font-weight: 400; z-index: 2;
}
.step-process #progressbar .active#account:before {
    /*font-family: FontAwesome;
    content: "\f13e";*/
    content: "";
    background-image: url(../images/Pencil.svg); background-repeat: no-repeat; background-position: center center;background-size: 24px;font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar .active#personal:before {
    /*font-family: FontAwesome;
    content: "\f13e";*/
    content: "";
    background-image: url(../images/Pencil.svg); background-repeat: no-repeat; background-position: center center;background-size: 24px;font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar .active#payment:before {
    /*font-family: FontAwesome;
    content: "\f13e";*/
    content: "";
    background-image: url(../images/Pencil.svg); background-repeat: no-repeat; background-position: center center;background-size: 24px;font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar .active#confirm:before {
    /*font-family: FontAwesome;
    content: "\f13e";*/
    content: "";
    background-image: url(../images/Pencil.svg); background-repeat: no-repeat; background-position: center center;background-size: 24px;font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar #account:before {
    /* font-family: FontAwesome; */
    content: "1";
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar #personal:before {
    /* font-family: FontAwesome; */
    content: "2";
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar #payment:before {
    /*font-family: FontAwesome;*/
    content: "3";
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar #confirm:before {
    /*font-family: FontAwesome;*/
    content: "4";
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 20px;    
    background: #fff;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px;
    border:3px solid lightgray;color: lightgray;
    /*border:3px solid var(--primary-color);color: var(--primary-color);*/
}
/*.step-process #progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    border: 1px dashed lightgray;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1;
}*/
.step-process #progressbar li:after {
    content: '';
    width: 100%;
    height: 0;
    border: 1px dashed lightgray;
    position: absolute;
    top: 25px;
    z-index: -1;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.step-process #progressbar li:last-child:after{border:none !important;}
.step-process #progressbar li.active:before {
    background: #fff;
    border: 3px solid var(--primary-color); color: #AB8238;
}
.step-process #progressbar li.active:after {
    /*background: #673AB7;*/
    border: 1px dashed var(--primary-color);
}
.step-process .progress {
    height: 20px
}
.step-process .progress-bar {
    background-color: #673AB7
}
.step-process .fit-image {
    width: 100%;
    object-fit: cover
}
.step-process .themebtn_colored,
.step-process .btnOnlyLink,
.step-process .themebtn_gray {
    display: inline-block;
    width: 140px !important;
    margin: 1rem 8px !important;
}
.Preview-body .themebtn_colored,
.Preview-body .btnOnlyLink,
.Preview-body .themebtn_gray {
    margin: 1rem 19px !important;
}
.step-process .last_Tab .themebtn_colored,
.step-process .last_Tab .btnOnlyLink,
.step-process .last_Tab .themebtn_gray {
    display: inline-block;
    width: 225px !important;
    margin: 1rem auto 0 !important;
}
.step-process .last_Tab .Preview-body .themebtn_colored,
.step-process .last_Tab .Preview-body .btnOnlyLink,
.step-process .last_Tab .Preview-body .themebtn_gray {
    margin: 1rem 19px !important;width:140px !important;
}
.PreviewModal .action-button{margin: 1rem auto !important;width:140px !important;}

textarea{min-height: 130px; max-height: 130px; height: 130px;}
/*#progressbar li span {
    position: absolute;
    top: 0;
    bottom: 0;    
    line-height: 50px;
    font-size: 27px;
    text-align: center;
    width: 0;
}*/
.step-process .Close_Sec {
    background: url(../images/closeRed.svg);
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 1;
    width: 10px;
    height: 10px;
    border: none;
    padding: 1rem 1rem;
    position: absolute;
    right: 10px;
    top: -5px;
    background-size: 13px;
}

.upload-files-container{
    background: #333333; width: 174.64px; height: 226px; text-align: center; display: flex !important; align-items: center; justify-content: center; border-radius:10px;
}
.upload-files-container svg{margin: 0 0 1rem; fill: #efefef;}
.upload-files-container span{text-align: center; display: flex; font-size:35px; line-height: normal; color: #efefef;}

@media (min-width:320px){
    .d-xs-none {
        display: none!important;
    }
}
@media (min-width:768px){
    .d-xs-none {
        display: block !important;
    }
}
/* custom Select */
.SelectOPtionDiv {
    display: flex;
    align-items: end;
    justify-content: end;
    position: absolute;
    right: 0;
    top:15px; z-index: 9;
}
.ClearBtn.EditData.SelectOPtionDiv {
    z-index: 9999;
    position: relative;
}
.SelectOPtionDiv span {
    color: var(--primary-color); font-size: 15px; font-weight: normal;
}
@media(min-width:768px){
    .SelectOPtionDiv span {
      font-size: 16px;
    }   
}
.SelectOPtionDiv .drop {
  margin: 0 auto;
  width:170px; text-align: left;
}
.SelectOPtionDiv .drop dt a:after {
    content: '';
    background-image: url(../images/drop_arrow_blue.svg) !important;
    background-repeat: no-repeat !important;
    background-position: right 5px center !important;
    position: absolute;
    display: flex;
    right: 0;
    z-index: 9999;
    width: 20px;
    height: 20px;
    cursor: pointer;
    top:3px;
}
.commonModal.SingleBoatModal .SelectOPtionDiv .drop {
  width:170px;
}

@media(min-width:768px){
    .SelectOPtionDiv .drop {
      width:200px;
    }   
}
.SelectOPtionDiv .drop dt{
    appearance: none !important;
    border: none !important;
    text-align: left !important;
    height: 25px;
    width: 180px;    
}
.SelectOPtionDiv .drop dt a {
  background-color: transparent;
  /*border: 1px solid #000;*/
  color: var(--primary-color);
  display: block;
  width: 100%;
  text-decoration: none;
  transition: all 0.3s ease-out;
}
.SelectOPtionDiv .drop dt a span {
  cursor: pointer;
  display: block;
  padding:3px 0;
}
/*.SelectOPtionDiv .drop dt a:hover {
  background-color: #fff;
  color: #000;
}*/
.SelectOPtionDiv .drop dd {
  position: relative; margin: 0;
}
.SelectOPtionDiv .drop dd ul {
  background-color: #fff;
  border: 1px solid #fff;
  display: none;
  list-style: none;
  padding: 0.5rem 0;
  position: absolute;
  width: 100%; z-index: 9;
}
.SelectOPtionDiv .drop dd ul li {
  cursor: pointer;
  padding:0.5rem 0 0;
  transition: all 0.3s ease-out;
}
.SelectOPtionDiv .drop dd ul li a {
  color: var(--primary-color);
  text-decoration: none;font-size: 15px;
}
@media(min-width:768px){
    .SelectOPtionDiv .drop dd ul li a {
      font-size: 16px;
    } 
}
/*.SelectOPtionDiv .drop dd ul li:hover {
  background-color: #fff;
  color: #000;
}*/

.onboard-add-item {
    font-size: 16px;
    font-weight: 400;
}

/* final report */
.commonModal.FinalReport_Modal .modal-body .content .equipment_readingsSec p {
    color: #000;
    text-align: center;
    font-size: 13px;
    font-weight: 400;
}
.rate-face-parent p {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* finalStepCheck */
.cust-check.finalStepCheck{
        padding-left: 0;
}
.finalStepCheck .checkmark{right: 0; left: auto;}
.finalStepCheck small {
    font-weight: 400;
    font-size: 16px!important;
    color: #333 !important;
}
pre.error {
    display: inline;
    font-size: 15px;
    font-family: Roboto;
    font-weight: 400;
    color: #E40707;
    margin: 0 5px;
    position: relative;
}
/**/
.note-editable.card-block {
    font-weight: 400;
}
.commonModal .Service-HistoryPTruckText p{width: 80px !important}
.commonModal .table.Service-HistoryPTruckText th,
.commonModal .table.Service-HistoryPTruckText td{padding:0.55rem 5px;}
/*.commonModal .maintenanceTable .table-icon.arrow{
    fill:red;
}*/

.expense_tbl td,
.expense_tbl th {
    padding: 0.55rem 5px;
}
.commonModal.SingleBoatModal .table.trip_log_tbl tbody tr td p{
    width:185px !important;
}
/* PreviewBox */
.PreviewBox{border: 1px solid #333; border-radius: 10px; width: 96%}
.PreviewBox .Preview-header{ background:#333; border-top-left-radius:6px;border-top-right-radius:6px;  
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem; }
.PreviewBox .Preview-header h4{
    color: #FFF;
    font-size: 20px;
    font-weight: 400;
    text-transform: capitalize;
}
.PreviewBox .Preview-body {
    position: relative;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem;
}
.PreviewBox .Preview-body label {
    text-align: left;
}
span.BoardLabel {
    color: #000;
    width: 70%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: middle;white-space: nowrap;
}
span.i_name {
    width: 84%;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: left;
    vertical-align: top;white-space: nowrap;
}

.other-step input#maintenance_hours,
.other-step input#maintenance_days {
    width: 130px;
    text-align: center;
}
.other-step .fs-title {
    font-size: 25px;
    color: var(--primary-color);
    font-weight: normal;
    text-align: center;
}
.Cirlce0{
    visibility: hidden;
}
.faq-drawer.disable{
    opacity: 0.5
}
.faq-drawer.disable .faq-drawer__content-wrapper{
    display: none;
}
.faq-drawer.disable .faq-drawer__trigger:checked + .faq-drawer__title::before {
    transform: rotate(45deg);
    top: 6px;
}
.mtb-156{
    margin-bottom: -15px;
    margin-top: -6px;
}
.nohide{
    display: none;
}
small.report_pil{
    width: 94%;
    display: inline-block;
}
.aright{
    text-align: right;
}
.logrmsg{ color: #979797;text-align: center;padding: 10px 0;font-size: 1rem; }
.upload-files-container{margin: auto;}
.rpmodel{margin-left: 8px;}
.pretext{
    font-weight: 400;
    font-size: 11px !important;
    line-height: 19px;
    color: #333 !important;
}
.pretext1{
    font-weight: 400;
    font-size: 10px !important;
    line-height: 19px;
    color: #333 !important;
}
.mbp-11{
    margin-bottom: 10px;
    text-align: center;
}
.gnametext0 {
    text-align: left;
    word-wrap: break-word;
}
.preview_item_label_0 {
    text-align: left;
    word-wrap: break-word;
}
.hr-top-gray{
    border-top: 2px solid #EDEDED !important;
    padding-right: 15px !important;
    margin-top: 17px;
}
.lhr-top-gray{
    border-top: 2px solid #EDEDED !important;
    margin-bottom: 17px;
    margin-top: 17px;
}
.Label_checkbox {
    width: 100%;
    position: relative;
}
.Label_checkbox label {
    word-wrap: break-word;
    width: 84%;
}
.Label_checkbox .form-group.col-12 {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0;
}
.mtb15{
    margin: 15px 0 15px 0;
}
.mtb20{
    margin-top: -20px;
    margin-bottom: 15px;
}
.mb18{
    margin-bottom: 18px;
}
.mtb11{
    margin: -11px 0 11px 0;
}
.desc_title{
    text-align: justify;
}
/* reportList */
.reportList{
    padding: 0;
}
.reportList li{ font-weight:normal; margin:0 10px 5px; }

span.circle {
    border-radius: 50%;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin: 0px 3px 0 0;
    position: relative;
    top: 2px;
}
b.amt {
    text-align: right;
    display: block;
    margin:0; font-size: 16px;
}
.faq-drawer .faq-drawer__title pre {
    display: inline-block;
    font-size: inherit;
    font-family: 'Roboto';
    max-width: 60%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
    margin: 0 2px 0 0; font-weight: 500;
}

.plr-15{padding:0 5rem}

@media(min-width: 768px){
   .plr-15{padding:0 15rem} 
}

/* select2 */
.select2-container--default .select2-selection--single {
    background-color: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 0px !important;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    left: 4.2px !important;
    position: absolute !important;
    top: 40% !important;
    background-image: url(../images/drop_arrow_white.svg) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100%;
    width: 13px !important;
    height: 7px !important;
    border: transparent !important;
    margin: 0 auto!important;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    font-size: 16px !important;
}
span.select2-selection__clear {
    position: absolute;
    right: 3px;
    width: auto;
    z-index: 99999999;
    font-size: 14px;
}
.select2-dropdown input, .select2-dropdown select, .select2-dropdown textarea {
    height: 35px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #000;
    font-size: 14px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #fff !important;
    }
@media(min-width:1024px){
    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #000 !important;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow b {
        background-image: url(../images/drop_arrow_black.svg) !important;
    }
}
span.select2-selection__clear {
    display: none;
}
#campaign_report{
  max-width:300px;
  max-height:300px;
}
.mh85{
    min-height: 66px;
    height: 66px !important;
}
#pdf-preview .btn-close {
    background: url(../images/closeWhite.svg);
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 1;
    width: 17px;
    height: 16px;
    border: none;
    padding: 1rem 1rem; z-index: 99;
}

div#pdf-preview {
    z-index: 999999;
}
#pdf-preview {
    background-color: #00000096;
}
#pdf-preview .modal-content {
    background-color: transparent;
}
#pdf-preview  .modal-header{
    background-color: transparent;
    border: none;
}
.tip-popup-pdf {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}
.tip-popup-pdf iframe {
    height: 100vh;
    width: 100%;
}
.efsize{
    font-size: 20px !important;
}
.fbi16{
    font: italic bold 16px Georgia, serif;
}
.font-14{
    font-size: 14px; /*color: #6A6A6A;*/
    line-height: normal;
}

ul.AppStoreBtn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0;
    padding: 0;
    width: 100%;
}
.buy-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    width: 80px !important;
    height: 40px !important;
    text-align: center;
}
button.btn.smallBtn.themebtn_colored {
    width: 100%;
}
.blackBox {
    background: #000;
    text-align: center;
    width: 70%;
    padding: 10px;
}

.DL_Selection{
    margin: 10px auto; text-align: center;
}
/*  Toggle Switch  */

.toggleSwitch span span {
    display: none;
}  
  
.toggleSwitch {
    display: inline-block;
    height: 18px;
    position: relative;
    overflow: visible;
    padding: 0;
    cursor: pointer;
    width: 200px;
    background-color: #fafafa;
    border: 1px solid var(--primary-color);
    border-radius:50px;
    height:34px; font-size: 18px;
}
.toggleSwitch * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.toggleSwitch label,
.toggleSwitch > span {
    line-height: 20px;
    height: 20px;
    vertical-align: middle;
}
.toggleSwitch input:focus ~ a,
.toggleSwitch input:focus + label {
    outline: none;
}
.toggleSwitch label {
    position: relative;
    z-index: 3;
    display: block;
    width: 100%;
}
.toggleSwitch input {
    position: absolute;
    opacity: 0;
    z-index: 5;
}
.toggleSwitch > span {
    position: absolute;
    left: 0;
    width: calc(100% - 6px);
    margin: 0;
    text-align: left;
    white-space: nowrap;
  margin:0 3px;
}
.toggleSwitch > span span {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    display: block;
    width: 50%;
    margin-left: 50px;
    text-align: left;
    font-size: 0.9em;
    width: auto;
    left: 0;
    top: -1px;
    opacity: 1;
    width:40%;
    text-align: center;
  line-height:34px;
}
.toggleSwitch a {
    position: absolute;
    right: 50%;
    z-index: 4;
    display: block;
    top: 0;
    bottom: 0;
    padding: 0;
    left: 0;
    width: 50%;
    background-color: var(--primary-color);
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); border-radius: 50px;
}
.toggleSwitch > span span:first-of-type {
    color: #FFF;
    opacity: 1;
    left: 0;
    margin: 0;
    width: 50%;
}
.toggleSwitch > span span:last-of-type {
    left:auto;
    right:0;
    color: var(--primary-color);
    margin: 0;
    width: 50%;
}
.toggleSwitch > span:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: -2px;
    /* background-color: #fafafa;
    border: 1px solid #ccc; */
    border-radius: 30px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.toggleSwitch input:checked ~ a {
    left: calc(50% - 0px);
}
.toggleSwitch input:checked ~ span:before {
    /* border-color: #0097D1;
    box-shadow: inset 0 0 0 30px #0097D1; */
}
.toggleSwitch input:checked ~ span span:first-of-type {
    left:0;
    color:var(--primary-color);
}
.toggleSwitch input:checked ~ span span:last-of-type {
    /* opacity: 1;
    color: #fff;     */
    color:#FFF;
}
/* Switch Sizes */
.toggleSwitch.large {
    width: 60px;
    height: 27px;
}
.toggleSwitch.large a {
    width: 27px;
}
.toggleSwitch.large > span {
    height: 29px;
    line-height: 28px;
}
.toggleSwitch.large input:checked ~ a {
    left: 41px;
}
.toggleSwitch.large > span span {
    font-size: 1.1em;
}
.toggleSwitch.large > span span:first-of-type {
    left: 50%;
}
.toggleSwitch.xlarge {
    width: 80px;
    height: 36px;
}
.toggleSwitch.xlarge a {
    width: 36px;
}
.toggleSwitch.xlarge > span {
    height: 38px;
    line-height: 37px;
}
.toggleSwitch.xlarge input:checked ~ a {
    left: 52px;
}
.toggleSwitch.xlarge > span span {
    font-size: 1.4em;
}
.toggleSwitch.xlarge > span span:first-of-type {
    left: 50%;
}

  /*  End Toggle Switch  */

/* steps-publishApp */
.steps-publishApp{padding: 0; margin: 5px 10px;}
.steps-publishApp li {
    list-style: decimal;
    margin: 0 10px;
    font-weight: normal;
    font-size: 16px;
    line-height: normal;
}
.hash {
    font-size: .9em;
    position: relative;
    position: relative;
    top: 0;
    width: 65%;
    display: inline-block;
}
.hash .colorPickerInput {
    padding-right: 0;
}
/*
.hash {
    font-size: .9em;
    position: relative;
    position: relative;
    top: 0;
}*/
.hash span {
    position: absolute;
    top: 8px;
    left: 6px;
}
.hash input {
    padding: .375rem 0.75rem .375rem 1rem;
}

/* Safari Browser */
@media not all and (min-resolution: 0.001dpcm) and (min-width: 0px) {
  @supports (-webkit-appearance: none) {
    /* Safari-specific CSS */
    #generateReport_modal span.circle {
        margin: 0px 3px 0 31px;
    }
    #generateReport_modal  .faq-drawer__title::before {
        top: 16px; left: 0;
    }
  }
}

@supports (-webkit-overflow-scrolling: touch) {
  /* iOS Safari-specific CSS */
    #generateReport_modal  span.circle {
        margin: 0px 3px 0 31px;
    }
    #generateReport_modal  .faq-drawer__title::before {
        top: 16px; left: 0;
    }

}

@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) and (hover: hover) {
    /* macOS Safari-specific CSS */
    #generateReport_modal  span.circle {
        margin: 0px 3px 0 31px;
    }
    #generateReport_modal  .faq-drawer__title::before {
        top: 16px; left: 0;
    }
  }
}


/* Pro Version Start */
.Pro-app-cover{display: inline-block !important; position:relative; margin:0 !important }
.Pro-app-cover label{display: inline-block !important; position: relative; right:65px;}
.Pro-app-cover .toggle-button-cover {
    display: inline-block !important;
    position: absolute;
}
.Pro-app-cover .toggle-button-cover {
    top: -16px;
    right:15px;
}
.BoatModelsTable thead th{text-align: right!important;}

.BoatModelsTable thead th:nth-child(2){text-align: left!important;}

.BoatModelsTable tbody td:nth-child(5),
.BoatModelsTable thead th:nth-child(5),
.BoatModelsTable tbody td:nth-child(6),
.BoatModelsTable thead th:nth-child(6) {
  display: none;
}
@media (min-width: 576px) {
    .BoatModelsTable tbody td:nth-child(5),
    .BoatModelsTable thead th:nth-child(5),
    .BoatModelsTable tbody td:nth-child(6),
    .BoatModelsTable thead th:nth-child(6) {
      display: table-cell;
    }
}

.ModalMaintenanceTable thead th:nth-child(3),
.ModalMaintenanceTable tbody td:nth-child(3),
.ModalMaintenanceTable thead th:nth-child(4),
.ModalMaintenanceTable tbody td:nth-child(4){display: none;}

@media (min-width: 768px) {
    .ModalMaintenanceTable thead th:nth-child(3),
    .ModalMaintenanceTable tbody td:nth-child(3),
    .ModalMaintenanceTable thead th:nth-child(4),
    .ModalMaintenanceTable tbody td:nth-child(4) {
      display: table-cell;
    }
}

.commonModal.ProModelDesktop.show .modal-dialog, .commonModal.ProModelDesktop .modal-dialog{
    max-width:375px;
 }
@media(min-width:768px){
    .commonModal.ProModelDesktop.show .modal-dialog, .commonModal.ProModelDesktop .modal-dialog{
        max-width:768px;
     }
}
/* file Upload */
.addfileModel .file-preview {
    margin-top: 10px; position: relative;
    font-size: 14px;
    color: #333;border: 1px solid #979797;
    border-radius: 20px; height: 373px; width: 288px; margin: auto; display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.addfileModel .file-preview img,
.addfileModel .file-preview video {
    max-width: 100%;
    height: auto;
    display: block;
    vertical-align: middle;
    overflow: hidden;
    padding:5px;
    border-radius: 20px;
}
.addfileModel .file-preview iframe {
    width: 95%;
    margin-top: 0;
    height: 353px;
    display: block;
    border-radius: 20px;
}
.addfileModel .file-name {
    color: #000;
    font-size: 14px;margin: 5px 0;
}
.selectFile {
    color: var(--primary-color);
    cursor: pointer; width: 100%; 
}

@media(min-width:768px){
    .addfileModel .file-name {
        margin-left: 10px; margin:0 10px;
    }
    .selectFile {
         width: auto;
    }
}
.toogle-app-cover {
    display: flex !important;
    width: auto;
    margin: 0px auto;
    counter-reset: button-counter;
    position: relative;
    top: -10px;
    align-items: center;
    justify-content: center;
    left: 20px;
}

.linkequipmentModel .InnerSearch .TopSearch{ display:inline-block; margin:auto; }

.linkequipmentTable thead th:nth-child(2),
.linkequipmentTable tbody td:nth-child(2),
.linkequipmentTable thead th:nth-child(4),
.linkequipmentTable tbody td:nth-child(4),
.linkequipmentTable thead th:nth-child(5),
.linkequipmentTable tbody td:nth-child(5),
.linkequipmentTable thead th:nth-child(6),
.linkequipmentTable tbody td:nth-child(6){display: none;}

@media (min-width: 768px) {
    .linkequipmentTable thead th:nth-child(2),
    .linkequipmentTable tbody td:nth-child(2),
    .linkequipmentTable thead th:nth-child(4),
    .linkequipmentTable tbody td:nth-child(4),
    .linkequipmentTable thead th:nth-child(5),
    .linkequipmentTable tbody td:nth-child(5),
    .linkequipmentTable thead th:nth-child(6),
    .linkequipmentTable tbody td:nth-child(6)  {
      display: table-cell;
    }
}
.LinkEquipment_TableIcon{
    width: 22px !important; height: 22px !important; position: relative; top: 2px;
}
.add_edit-equipmentModel .SwitchToggleBtn{width: 100%}

.AddEdit-EquipmentFiles .filesTableToogles #app-cover,
.AddEdit-EquipmentMaintenance .filesTableToogles #app-cover{
    margin: -10px 0;
}

.AddEdit-EquipmentMaintenance thead th:nth-child(3),
.AddEdit-EquipmentMaintenance tbody td:nth-child(3),
.AddEdit-EquipmentMaintenance thead th:nth-child(4),
.AddEdit-EquipmentMaintenance tbody td:nth-child(4){
    display: none;
}

@media (min-width: 768px) {
    .AddEdit-EquipmentMaintenance thead th:nth-child(3),
    .AddEdit-EquipmentMaintenance tbody td:nth-child(3),
    .AddEdit-EquipmentMaintenance thead th:nth-child(4),
    .AddEdit-EquipmentMaintenance tbody td:nth-child(4)  {
      display: table-cell;
    }
}

ul.HullBoatName {
    margin: 0 0 10px;
    padding: 0;
    top: 0;
    position: relative;
}
.HullBoatName li{ display:inline-block; margin:10px 0 10px; vertical-align:middle; }

@media(min-width:768px){
   ul.HullBoatName {
    top: 10px; margin: 0;
    } 
   .HullBoatName li{margin: 0; } 
}

.DesktopView{display: none;}
.MobileView{
    display: inline-block; float: right;
}

@media(min-width:768px){
    .DesktopView{display: inline-block; float: right;}
    .MobileView{
        display: none;
    }
}

.boatModel3dotbtn button{
    border: none;
    background: transparent;
    padding: 0;
}
.boatModel3dotbtn .dropdown-menu.show {
    max-height: auto;
     overflow-y: initial; 
    width: 154px;
    border-radius: 10px;
    border: 1px solid #6A6A6A;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 4px 4px;
}
.boatModel3dotbtn .dropdown-item:hover {
     background-color:transparent; 
}
.boatModel3dotbtn .dropdown-item.text-red:hover {
    color: #FF0000;
}  
.boatModel3dotbtn .dropdown-item {
    padding: .25rem 0.7rem;
}  
.addBtn{cursor: pointer;}

.customIconSelect.boat_model_icon_select li object, .customIconSelect.edit_boat_model_icon_select li object{
    width: 40px !important;
    height: auto;
 }
 .boat_model_icon_list .icons_ul li object, .edit_boat_model_icon_list .icons_ul li object{
    width: 32px !important;
    height: auto;
}
.boatmodelIcon{
    width: 32px !important;
    height: 22px !important;
}
.lang-select {
    background-image: url(../images/drop_arrow_black.svg) !important;
    background-repeat: no-repeat !important;
    background-position: right 5px center !important;
    z-index: 99;
    display: block;
    background-size: 20px 20px;
    background: transparent;
}
.customIconSelect.boat_model_icon_select , .customIconSelect.edit_boat_model_icon_select{
    background-color: transparent;
}

/* equipment table */
    .table.dataTable.addhullequipmentTable thead {
        display: none;
    }
    .table.dataTable.addhullequipmentTable tbody tr td {
        display: inline-table;
    }

    .table.dataTable.addhullequipmentTable tbody tr.repeatTR td:nth-child(1),
    .table.dataTable.addhullequipmentTable tbody tr.repeatTR td:nth-child(2){
        display: none;
    }

    .table.dataTable.addhullequipmentTable thead tr th:nth-child(1){width: 10%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(2){width: 83%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(3){width: 40%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(4){width: 30%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(5){width: 19%}

    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(1){width: 10%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(2){width: 83%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(3){width: 40%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(4){width: 30%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(5){width: 19%}

@media(min-width:768px){
    .table.dataTable.addhullequipmentTable thead {
        display: contents;
    }
    .table.dataTable.addhullequipmentTable tbody tr td {
        display: table-cell;
    }
    .table.dataTable.addhullequipmentTable tbody tr.repeatTR td:nth-child(1),
    .table.dataTable.addhullequipmentTable tbody tr.repeatTR td:nth-child(2){
        display: table-cell;
    }
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(1){width: 5%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(2){width: 35%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(3){width: 30%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(4){width: 20%}
    .table.dataTable.addhullequipmentTable thead tr th:nth-child(5){width: 10%}

    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(1){width: 5%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(2){width: 35%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(3){width: 30%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(4){width: 20%}
    .table.dataTable.addhullequipmentTable tbody tr td:nth-child(5){width: 10%}
}

/* select add group */
.AddgroupSelectBox .custom-input {
/*    display: none; */
    margin-top: 10px;
    width: 100%;
    position: relative;
}
.AddgroupSelectBox select#select1,
.AddgroupSelectBox input#newItemInput {
    width: 100%;
}
.AddgroupSelectBox  #select1 .addGroup{color: #164BA0; font-weight: 600; font-size: 16px;}
.AddgroupSelectBox  button.addGroupBtn {
    position: absolute;
    top: 11px;
    right: 0;
    background: transparent;
    border: 0;
}
.fileDetails{
    font-size: 16px; color: gray; margin-top: 10px; text-align: center;
}
.mobileSmall_Letter{font-size: 13px;}

@media(min-width:400px){    
    .mobileSmall_Letter{font-size: 16px;}
}

#clearBtn {
    font-size: 18px;
    color: #888;
    background-color: transparent;
    border: none;
    cursor: pointer;
    transition: color 0.3s;
}

#clearBtn:hover {
    color: #333;
}


.search-field:focus {
    cursor: text;
    outline: 0;
}
.search-form
.search-submit { 
display:none;
}
.disabled{opacity: 0.6}

.all_boat_search_div{display: block;}
.make_search_div{display: block;}

.addEquipmentbtn {
    position: relative;
    right: 22px;
    color: var(--primary-color);
    display: block;
    margin: 20px 0 0;
    float: right;
}
.addEquipmentbtn svg{margin: 0 5px}

@media(min-width:768px){
    .addEquipmentbtn {
        position: absolute;
        right: 30px; display: inline-flex;margin: 0;
    }
    .all_boat_search_div{display: flex; align-items: center; justify-content: center;}
    .make_search_div{display: flex; align-items: center; justify-content: center;}
}
.showPdficon{
    position: absolute; z-index: 99; right: 30px; bottom: 50px;
}
.form-group.MinMaxBox{
    width: 45%;
}
.form-group.MinMaxBox input.form-control {
    text-align: center;
}
.BoatModelsDiv3dots .faq-drawer__content-wrapper.active {
    overflow: visible !important;
}
.BoatModelsDiv3dots .dropdown-menu-right.show{
    position: absolute; transform: translate3d(-136px, -39px, 0px); top:60px; left: 0px; will-change: transform;
}
.BoatModelsDiv3dots .faq-drawer__content-wrapper.active .table-responsive{overflow-x:visible}

/*.showPdficon.edit {
    position: absolute;
    z-index: 99;
    right: 30px;
    bottom:35px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOEAAADhCAMAAAAJbSJIAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAALpQTFRFAAAAsSYjsSglsSonryAcsHp6eQAApG1tgR4dbgAAdxsbrhcSrx0Z8vLy7+fnu1FP9vv7oGlp9Pb29fj43cPCyH18yIKBy4iH2Kuq6dvb7OPjy4yM05+e3MDArQoA483M6NbWrQ0Gv2JgxHBvxXZ2szQyuEhGtj47zZGQvVta2Li32rOzoyUioyckoR4anxEMnQAAq0JAoyIft2hmvHRzoh4ZpzQyslhWr09NpjAtnw8Ix5CPqj47zqKhYkLTlQAAAD50Uk5TAP/////////////////////////////////////////////////////////////////////////////////RS/p+AAAP7klEQVR4nO2dCVfbOhaAJctSnI1CaQsFCqXQlvLmLWfO/P/fMG/mdXmPvraULtAVCNnsWBrZWSx5ixc5TjrcnlMcx7H95UpX915dORCECYQwdP+MBUJLwUkiTj0XhEyH/dwnmW9CAmluxDkn1FhuxHknBLkR554wN+L8E+ZFXADCnIiLQJgPcSEIcyEuBmEexAUhzIG4KITZEaMIs50tw6XiRCTMjBh+2XqG25kqbW36MbJIhFkRgyTN0L35hWmXaRFlwoyI4YRFCGJ5CbMhLhRhJsTFIgTM+J72ugtGmEGLi0aYHnHhCFMjTiHE4vvMy3yR0L3i7sB7qgjT9sV4Qqx53g335MzxHTcHUB8AfcD/QXihaeJu5x8Y/YGmh6iMMKUW4wkJJt+8E69eLF/YzhZeopPd7I6td03T3V3B34Aot7Vzc/JCHWE6xGmErZ7wkt6jVw4iJ3wvXE+712IOCa4Yb+WT3/9eCGEqxCSEjLlHOodumpY5JhzudjMpW9qlNSYc7nalvl4QYRrEBIRs7xPfXLM+d/mZq4iNCIe7180TvoPun4IRIYONycfXLgYFEaYwNwkI4YpjLpC10ecaMla65pAQbjudDpHaaW+82yGkS8IpkSlsKyVMrsUkhKPehOoXXQfAnhC6fZKSDt/96MyeENqhV1JMmFiLKQi5qeRtEyzJhAAPlnmn3PwOZkyYVIspCAHkKIzdNGVCQFaPNLDJbc2MCRNqMY0Om5pj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);
    width: 50px;
    background-repeat: no-repeat;
    height: 50px;
    background-size: 100%;
}*/
    .showPdficon.edit{
        bottom:32px;
    }

/* Search Boat */
.SearchBoatModel_Circle .Mobile_Svg{ display:inline-block; }
.SearchBoatModel_Circle .process_card {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: none;
    position: relative;
    margin:-20px 0 20px;
}
.SearchBoatModel_Circle .process_card .percent {
  position: relative;
}
.SearchBoatModel_Circle .process_card svg {
  position: relative;
  width: 120px;
  height: 120px;
  transform: rotate(-90deg);
}
.SearchBoatModel_Circle .process_card svg circle {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #979797;
  stroke-width:8;
  stroke-linecap: round;
}
.SearchBoatModel_Circle .process_card svg circle:last-of-type {
  stroke-dasharray: 308px;
  stroke-dashoffset: calc(308px - (308px * var(--percent)) / 100);
  stroke: #3498db; 
}
.SearchBoatModel_Circle .process_card svg.Mobile_Svg circle:last-of-type {
  stroke-dasharray: 171px;
  stroke-dashoffset: calc(171px - (171px * var(--percent)) / 100);
  stroke: #3498db; 
}
.SearchBoatModel_Circle .process_card .number {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.SearchBoatModel_Circle .process_card .number h3 {
    color: #153468;
    text-align: center;
    font-family: Roboto;
    font-size:25px;
    font-weight: 500; margin: 0;
}
.SearchBoatModel_Circle .process_card .number h3 span {
  font-size: 2rem;
}
.SearchBoatModel_Circle .process_card .title h2 {
    margin:0;
    color: var(--primary-color);
    text-align: center;
    font-size:14px;
    font-weight: 500;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 0;
    right: 0;
}
.SearchBoatModel_Circle .process_card svg circle.Critical:last-of-type{stroke: #c50202;}
.SearchBoatModel_Circle .process_card svg circle.Medium:last-of-type{stroke: #ffc034;}
.SearchBoatModel_Circle .process_card svg circle.Low:last-of-type{stroke: #3ab702;}
.SearchBoatModel_Circle .process_card svg circle.Maintenance:last-of-type{stroke: #3e79da;}
svg.unfill {
    fill: transparent;
    stroke: #7E7D7D;
}

.ConnectedBoatTable thead th:nth-child(4),
.ConnectedBoatTable tbody td:nth-child(4){display: none;}

@media (min-width: 768px) {
    .ConnectedBoatTable thead th:nth-child(4),
    .ConnectedBoatTable tbody td:nth-child(4) {
      display: table-cell;
    }
}
.w-225 {
    width: 235px !important;
}
.AddEditHullError{
    position: absolute;
}
.LifetymSub_BoaeBrandname{
    padding: 0; margin: 0;
}
.LifetymSub_BoaeBrandname li{display: inline-flex; vertical-align: middle;}
.LifetymSub_BoaeBrandname li b{margin: 0 0px 0 10px;}

.ModalOpacityLow{
    opacity: 0.5;
}