/*body styling*/
body
{
    height:auto;
}

/* Header styling */
.navbar-static-top
{
    position: fixed;
    width:100vw;
    display: flex;
    justify-content: space-between;
    top: 0;
}

.navbar-static-top .customNavMenuButton
{
    display: none;
}

.navbar-static-top.annon
{
    height: 92px;
}

.navbar-static-top.user
{
    height: 50px;
    min-height: 50px;
}

@media only screen and (max-width:600px)
{
    .navbar-static-top.user
    {
        height: 45px;
        min-height: 45px;
    }
    .navbar-static-top .customNavMenuButton
    {
        display: block;
    }
}

.navbar-static-top.navbar-inverse
{
    background-color: white!important;
}

.navbar-header{
    flex-grow: 1;
}

.navbar-header .navbar-brand
{
    width: 100%;
    justify-content: center;
}

.navbar-static-top> .container
{
    display: flex;
    flex-direction: row-reverse;
    align-content: center;
    align-items: center;
    height:100%;
}

.profile-portrait a:not(.btn)
{
    text-decoration: none;
}

.profile-portrait img
{
    height: 32px;
    width: 32px;
}

.profile-portrait #profile-display-text
{
    height: 32px;
    width: 32px;
    background-color: #00a68f;
    color: White;
    border-radius: 50%;
}



/*Navigation styling*/

.collapsed .side-menu
{
    width: 56px;
}

.sidenavNavigationLeft
{
    height: 100%;
    display: flex;
    flex-direction: column;
}

.collapse-section
{
    width: 100%;
    background-color: rgba(0, 0, 0, 0.08);
    margin-top: auto;
    display: flex;
    flex-direction: row-reverse;
    padding: 8px;
}

.collapse-section img#right
{
    display: none;
}

.collapsed .collapse-section img#right
{
    display: block;
    margin: auto;
}

.collapsed .collapse-section img#left
{
    display: none;
}

.sideNavweblinks
{
    padding:0;
}

.side-menu
{
    z-index:1999;
}

.side-section
{
    margin-bottom: 26px;
    margin-right:16px;
}

.sidenav {
    position: fixed;
    top:0;
    left:0;
    background-color: white;
    width: 208px;
    height: 100vh;
    text-align: initial;
    overflow-x: hidden;
    padding-top: 11px;
    box-shadow: 3px 0 5px rgba(57, 63, 72, 0.3);
    z-index: 1999;
    transition: 0.5s all 0s;
}

@media only screen and (max-width:600px) {
    .navbar .container{
        width:100%;
        margin-left: default;
        margin-right: default;
    }

    .navbar .container .customNavMenuButton
    {
        margin-right: auto;
        background-color: transparent;
        color: #343330;
    }

    .navbar .container .customNavMenuButton .icon-bar
    {
        background-color: #343330;
    }

    .sidenav {
        height: calc(100% - 45px);
        top: 45px;
        padding-top: 11px;
        width:0;
    }

    .sidenav.mobile-visible
    {
        width: 208px;
    }

    .sidenav .collapse-section
    {
        display: none;
    }
}

.collapsed .sidenav
{
    width: 56px;
}

.sideNavweblinks 
{
    list-style: none;
}

.side-header
{
    margin-bottom: 1rem;
}

.sidenav a:not(.btn) 
{
    display: block;
    color: black;
    padding: 6px 8px;
    text-decoration: none;
    font-size: 14px;
    margin-right: 5px;
    border-radius: 5px;
}

.collapsed .side-sections
{
    margin-left: 0;
}

.collapsed .side-section
{
    margin-right: 0;
}

.collapsed .side-section h6
{
    font-size:0;
}

.collapsed .side-section h6:before
{
    content:"•";
    font-size: initial;
    height: 7px;
    color: #d9d9d9;
    position: relative;
    left: calc(50% - 3px);
}

.collapsed .sidenav a
{
    width: 36px;
    margin: auto;
    display: flex;
    align-content: center;
    justify-content: center;
}

.collapsed .sidenav a .link-content,
.collapsed .sidenav a .caret
{
    display: none;
}

.sidenav a:hover 
{
    background-color: #00a68f;
    color: white;
}

.sidenav .side-sections img
{
    max-width: 20px;
    max-height:20px;
}

.sidenav a.current-page
{
    background-color: rgba(0,166,147,0.15)
}

.side-sections
{
    margin-left: 16px;
}

.weblink-sublinks {
    position: relative;
}

.weblink-sublinks .caret 
{
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
}

.sideNavdropdown-menu 
{
    display: none;
    background-color: #fff;
    padding: 0;
    margin: 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 999;
}

.weblink-sublinks:hover .sideNavdropdown-menu 
{
    display: block; 
}

.sideNavdropdown-menu li 
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.sideNavdropdown-menu a 
{
    display: block;
    padding: 8px 16px;
    color: cornsilk;
    text-decoration: none;
}

.sideNavdropdown-menu .caret
{
    display: none;
}

/*All Pages Styling*/
#mainContent>h1
{
    text-align: initial;
    margin-left:32px;
}

#mainContent
{
    margin-top: 75px;
}

#mainContent{
    transition: 0.5s all 0s;
}

.entity-grid
{
    background-color: white;
}

@media only screen and (max-width:600px) {

    #mainContentWrapper #mainContent
    {
        margin-top: 70px;
        margin-left: 0;
    }
}

/* progress bar styling */

.onboarding_progressbar ul
{
    display: flex;
    list-style: none;
    padding: 0;
    margin-top: 1rem;
    margin-left:50px;
    margin-right:50px;
    border: 1px solid #CCC;
    border-radius: 5px;
}

.onboarding_progressbar ul li
{
    flex-grow: 1;
    text-decoration: none;
    text-align: center;
    margin-left: 0;
    padding: 5px;
    border-right: 1px solid #CCC;
    padding: 15px 5px;
}

.onboarding_completed_step
{
    background-color: #C3F7C8;
}

.onboarding_current_step
{
    background-color:#CFE4FF;
}

/* form general styling */

table tbody tr .info label,
table tbody tr td .info .field-label
{
    font-weight: normal;
}

table tbody tr td .control input,
table tbody tr td .control select,
table tbody tr .control select
{
    border-radius: 5px;
}

.crmEntityFormView .actions,
.crmEntityFormView .actions .col-sm-6.clearfix
{
    position: relative;
    background-color: white;
    bottom: 55px;
    margin-left: 32px;
    margin-right: 32px;
    display: flex;
    justify-content: flex-end;
    border-color: white;
}

html[dir=ltr] .crmEntityFormView .actions .btn:first-child 
{
    margin-right: 110px;
    /*margin-bottom: 16px;*/
}

.term-clause
{
    position:relative;
    bottom: 50px;
    padding-left: 152px;
}

.term-clause label
{
    margin-left: 5px;
    font-weight: normal;
}

.term-clause p
{
    margin-left: 20px;
    font-weight: bold;
    font-size: 10pt;
}

.glyphicon-file
{
    font-size: 20pt;
    color:#82ef8d;
}

@media only screen and (max-width:600px) {

    html[dir=ltr] .crmEntityFormView .actions .btn:first-child 
    {
        margin-right: 45px;
    }

    .term-clause
    {
        bottom: 24px;
        padding-left: 82px;
    }
}

/* #accept_terms
{
    margin-left: 28px;
} */

/* Multistrep form general styling */

.progress.list-group .list-group-item.active
{
    background-color: #00a68f;
    border-color: #00a68f;
    border-radius: 5px;
}

/* Sectioning the general form */

.columnBlockLayout ol
{
    margin-left: 32px;
    margin-right: 32px;
}

#mainContent .container
 {
    margin: 0;
    width:100%;
 }

 #mainContent .container,
 #EntityFormPanel
 {
    background-color: transparent;
    border-color: transparent;
 }

 .tab .tab-column fieldset

 {
    margin: 16px 32px;
    padding: 24px 6.64%;
    padding-top: 48px;
    background-color: white;
    border-color: white;
    margin-bottom: 32px;
 }

 .tab .tab-column fieldset:first-of-type
 {
    margin-top: 0;
 }

 html[dir=ltr] .crmEntityFormView .cell input[type=text]
 {
    padding-left: 8px;
 }

 .tab .tab-column fieldset legend
 {
    position: relative;
    top: 40px;
    left: 26px;
    width: max-content;
    background-color: white;
    font-size: 14pt;
 }

 .tab .tab-column fieldset legend h3
 {
    font-size: 12pt;
    font-weight: bold;
    margin: 0;
 }

 .tab .tab-column fieldset table button
 {
    border-radius: 5px;
 }


 /* List styling */

 .columnBlockLayout > .entitylist
 {
    margin-left: 20px;
    margin-right: 30px;
    margin-top: 16px;
 }

 .columnBlockLayout .panel-default
 {
    margin-bottom: 0;
 }

 .columnBlockLayout .panel-default > .panel-body
 {
    background-color: white;
 }

 .columnBlockLayout .entity-grid .view-grid > table
 {
    margin-bottom: 0;
 }

 .columnBlockLayout .entity-grid .view-empty
 {
    background-color: white;
    height: 486px;
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
 }

 .columnBlockLayout .entity-grid .view-empty img
 {
    display: block;
 }

 .columnBlockLayout .entity-grid .view-empty p,
 .columnBlockLayout .entity-grid .view-empty img,
 .columnBlockLayout .entity-grid .view-empty a
 {
    margin:auto;
    text-align: center;
 }

 .columnBlockLayout .entity-grid .view-grid thead
 {
    background-color: #FAFAFA;
 }

 .columnBlockLayout .entity-grid .view-grid thead th
 {
    align-content: center;
    justify-content: center;
 }

 .columnBlockLayout .entity-grid .view-grid thead th a
 {
    color: black;
    text-decoration: none;
    font-size: 14px;
 }

 .columnBlockLayout .entity-grid .view-grid tbody tr
 {
    background-color: white;
 }

 /* Modal Styling */
 .modal.fade .modal-dialog
 {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    transition: transform .3s ease-out;
 }


 .modal-dialog .modal-content
 {
    border-radius: 10px;
    background-color: white;
 }

 .modal-dialog .modal-content .modal-header
 {
    padding-top: 0;
    text-align: start;
    padding-left: 43px;
 }

 .modal-dialog .modal-content .modal-header h2
 {
    font-size: 16px;
    font: "Inter";
    font-weight: 600;
    color: black;
    margin-bottom: 28px;
 }

 /* specific styling */
 p.warning
 {
    color: red;
 }

 /* Adding a media query to respond to responsiveness */
 @media screen and (max-width: 767px)
 {
    .crmEntityFormView .cell
    {
        padding-left: 15px;
        padding-right: 15px;
    }
 }