/*General Style*/

h3 {
   color: #1d3f70;
   padding: 8px;

}

a {
    color: #576269;
    text-decoration: none;
}

a:active,
a:focus,
a:hover {
    color: #576269;
        background-color: transparent;
        text-decoration: underline;
}

a:not(.btn) {
    text-decoration: none;
}

/*Customer Profile Page*/

.crmEntityFormView, .entitylist {
    color: #576269;
}

.crmEntityFormView {
    border: 1px solid #576269;
    padding: 8px;
}


.btn-default {
    color: #007cc0;
    border-color: #007cc0;
}

.btn-default:hover, .btn-default:active, .btn-default.active, .btn-default:focus, .btn-default.focus {
    color: #007cc0;
    border-color: #007cc0;
}

.btn-primary {
    color: white;
    background-color: #007cc0;
    border-color: #007cc0;
}
.btn-primary:hover {
    color: white;
    background-color: #DF3410;
    border-color: #DF3410;
}

.btn-info {
    background-color: #1CB3B4;
    border-color: #1CB3B4;
}

.btn-info:hover {
    background-color: #DF3410;
    border-color: #DF3410;
}
   
/* Navigation */
    .navbar-inverse .navbar-nav > li > a:focus,
    .navbar-inverse .navbar-nav > li > a:hover {
        color: #576269;
        background-color: transparent;
        text-decoration: underline;
    }

    .navbar-static-top.navbar .menu-bar > .navbar-nav > li > a 
    {
        color: #576269;
    }

    .navbar-inverse .navbar-nav > .open > a:active,
    .navbar-inverse .navbar-nav > .open > a:focus {
        background-color: transparent;
        color: #576269;
        text-decoration: none;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu {
        background-color: #1CB3B4;
    }

    .navbar-inverse .navbar-toggle {
        background-color: #007cc0;
        border: 1px solid #007cc0;
    }


    .navbar-inverse .navbar-toggle:hover,
    .navbar-inverse .navbar-toggle:active,
    .navbar-inverse .navbar-toggle:focus {
        background-color: #1CB3B4;
        border: 1px solid #1CB3B4;
    }


/*********		HOME PAGE		*******/

    div.centerText {
        text-align: center;
        color: #1d3f70;
        margin: 100px 0px 100px 0px;
        font-size: 35px;
        font-weight: bold;
    }

    .bodyContainer {
    padding-left: 10%;
    padding-right: 10%;
    font-family: sans-serif;
    margin-bottom: 10%;
    }
    
    
      .containerHome {
        width: 100%;
        box-sizing: border-box;
        padding-left: 15%;
      }
      
      .box1 {
        width: 40%;
        height: 150px;
        background-color: #e6e4e4;
        margin-bottom: 10px;
        margin-right: 10px; /* Add margin-right for space */
        display: flex;
        align-items: center;
        
      }
      
      .box2 {
        width: 40%;
        height: 150px;
        background-color: #e6e4e4;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
      }
      
      .box3 {
        width: 40%;
        height: 150px;
        background-color: #e6e4e4;
        margin-bottom: 10px;
        margin-right: 10px; /* Add margin-right for space */
        display: flex;
        align-items: center;
      }
      
      .box4 {
        width: 40%;
        height: 150px;
        background-color: #e6e4e4;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
      }
      
      @media (min-width: 768px) {
        .containerHome {
          display: flex;
          flex-wrap: wrap;
        }
        div.bodyContainer .containerHome .box1 .row .containerBox img {
            width: auto;
            height: 60px;
        }
    
        div.bodyContainer .containerHome .box2 .row .containerBox img {
            width: 75px;
            height: auto;
        }
    
        div.bodyContainer .containerHome .box3 .row .containerBox img {
            width: auto;
            height: 75px;
        }
    
        div.bodyContainer .containerHome .box4 .row .containerBox img {
            width: auto;
            height: 75px;
        }

        div.homeOverlay img {
            width: 300px; 
            position: absolute; 
            top: 185px; 
            right: -5px; 
            padding: 8px; 
            margin: 0px;
           }

    }

    @media (max-width: 768px) {
        div.bodyContainer .containerHome .box1 .row .containerBox img {
            width: auto;
            height: 30px;
        }
    
        div.bodyContainer .containerHome .box2 .row .containerBox img {
            width: 37px;
            height: auto;
        }
    
        div.bodyContainer .containerHome .box3 .row .containerBox img {
            width: auto;
            height: 37px;
        }
    
        div.bodyContainer .containerHome .box4 .row .containerBox img {
            width: auto;
            height: 37px;
        }

        div.homeOverlay img {
            width: 150px; 
            position: absolute; 
            top: 250px; 
            right: -5px; 
            padding: 8px; 
            margin: 0px;
        }

        h1 {
           font-size: 25px; 
        }
    }

    @media (max-width: 957px) {

        div.text {
            display: none;
        }

    }

    @media (max-width: 490px) {

        div.containerBox{
            display: block;
        }

    }

    .containerBox {
        display: flex;
        align-items: center;
        padding-left: 10%;

    }

    div.profile {
        margin-left: 5%;
        font-weight: bold;
    }

    div.text {
        font-weight: normal;
    }

    


/*********		SIGN IN 		*******/

#content-container.signinpage {background-image: url("petsourceloginhero.png"); background-size: cover; background-repeat: no-repeat; background-position-y: 23%; margin-top: -18px}
#content-container.signinpage #content .nav.nav-tabs {display:none!important;}

img.overlay {
    position: fixed;
    left: 0;
    right: 0;
}

#content-container.signinpage .page-content {
    background-image: url("group1359.png");
    background-position: right bottom, left top;
    background-repeat: no-repeat;
    
}

h1.signin-page {
text-align: center;
padding-top: 25%;
color: #ffffff;
font-family: Open-Sans;
font-size: 50px;
vertical-align: middle;
}


/* Sign In form */ 

.login-heading-section {
    border-bottom: 1px solid #e5e5e5;
    line-height: inherit;
    margin-top: 0;
    margin-bottom: 21px;
    color: #007cc0;
    font-weight: bold;
    padding-bottom: 21px;
    font-size: 27px;
}

#content-container.signinpage .page-content {display: flex;}

#content-container.signinpage .page-content.row .row {background: #ffffff; display: flex; align-self: flex-end; border-top-right-radius: 100px !important; margin-top: 100px; margin-bottom: 100px;
    padding-left: 2.14rem !important; padding-right: 2.14rem !important; padding-top: 2.14rem !important; padding-bottom: 2.14rem !important;
    flex-direction: column; justify-content: space-between;}

@media (min-width: 992px){
#content-container.signinpage .page-content.row .row { -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 30%;}
}
@media (max-width: 992px){
#content-container.signinpage .page-content {flex-direction: column-reverse;}
#content-container.signinpage .page-content.row .row {background: #fff;}
}
#content-container.signinpage .page-content.row .row .col-md-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; width: 70%;}
#content-container.signinpage .page-content.row .row .col-md-6:first-child {margin-bottom: 40px;}

#content-container.signinpage .page-content.row .row .col-md-6 .form-group .label, 
#content-container.signinpage .page-content.row .row .col-md-6 .form-group .col-sm-8 {-ms-flex: 0 1 auto; flex: 0 1 auto; max-width: 100%; }
#content-container.signinpage .page-content.row .row .col-md-6 .form-group .col-sm-4 {white-space: nowrap;}
#content-container.signinpage .page-content.row .row .col-md-6 .form-group .form-control {padding: 1em;}

#content-container.signinpage .page-content #submit-signin-local {padding: .5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: .3rem; display: block; width: 100%;}

#content-container.signinpage .page-content.row .row .col-md-6 form fieldset {position: relative;}
#content-container.signinpage .page-content.row .row .col-md-6 button.btn[name='provider'] 
{margin: 5px auto!important; width: 100%; padding: 1rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: .3rem; flex: 0 0 auto;} 


#content-container.signinpage .page-content.row .row .col-md-6 button.btn[title*="Google"]		{border-color: #4285F4; background: #4285F4 url('[...]/google.png') no-repeat 5% center;		background-size: auto 40%;}
#content-container.signinpage .page-content.row .row .col-md-6 button.btn[title*="Sign in with your LinkedIn account."]	{border-color: #0077B5; background: #0077B5 url('[...]/linkedin.png') no-repeat 5% center;	background-size: 100% auto; color: #ffffff; font-weight: bold;}
#content-container.signinpage .page-content.row .row .col-md-6 button.btn[title*="Sign in with your Microsoft account."] {border-color: #00875F; background: #00875F url('[...]/microsoftlogo.png') no-repeat 5% center;	background-size: 100% auto; color: #ffffff; font-weight: bold;}
#content-container.signinpage .page-content.row .row .col-md-6 button.btn:hover {background-color: #DF3410;}

#content-container.signinpage .page-content.row .row .col-md-6 button.btn[title*="Skill-interne"] {border-color: transparent; background-color: transparent; background: tranparent; color: #333; position: absolute; bottom: -64px; left: 0;}
#content-container.signinpage .page-content.row .row .col-md-6 button.btn[title*="Skill-interne"]:hover {background: rgba(0,0,0,0.1); border-color: #DF3410;}

/* Redeem Invotation Code Page */

h2.redeem-page {
    padding-top: 5%;
    color: #ffffff;
    font-family: sans-serif;
    font-size: 30px;
    vertical-align: middle;
}

p.redeem-instructions {
    color: #ffffff;
    font-family: sans-serif;
}

#content-container.signinpage.redeem{ z-index: 1;}
#content-container.signinpage.redeem #content .page-content form {
    background: #ffffff; 
    display: flex; align-self: 
    flex-end; border-top-right-radius: 
    100px !important; margin-top: 100px; 
    margin-bottom: 100px;
    padding-left: 2.14rem !important; 
    padding-right: 3rem !important; 
    padding-top: 2.14rem !important; 
    padding-bottom: 2.14rem !important;
    flex-direction: column; 
    justify-content: space-between;}

@media (min-width: 992px){
    #content-container.signinpage.redeem #content .page-content form { 
        -ms-flex: 0 0 40%; 
        flex: 0 0 40%; 
        max-width: 30%; 
        margin-left: 5px;
    }
}

div.col-sm-offset-2.col-sm-10 {
    margin-left: 5px;
}
   
#content-container.signinpage.redeem #content .page-content form legend span {padding: 0px 10px;}
input#InvitationCode, label[for*="InvitationCode"] {width: 100%; display: block; word-break: normal; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; display:none;}
#content-container.signinpage.redeem .col-sm-offset-2.col-sm-10 .checkbox {display:none;}
button#submit-redeem-invitation {margin: 5px auto!important; width: 100%; padding: 1rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: .3rem;}
button#submit-redeem-invitation:hover {background: #DF3410;}

/* Register */
#ContentContainer_MainContent_PageCopy_PageCopy {margin: 0px;}
#Register {width: 100%;}
#ContentContainer_MainContent_MainContent_SecureRegister .alert{display:none;}
#Register #ContentContainer_MainContent_MainContent_SecureRegister .row {
    margin: 0 auto;
    margin-bottom: 50px;
    margin-top: 15%;
    margin-left: 25%;
    max-width: 50%;
}

#Register #ContentContainer_MainContent_MainContent_SecureRegister .row .col-md-6 button.btn[title*="Skill-interne"] {display:none;}
#Register #ContentContainer_MainContent_MainContent_SecureRegister .row .col-md-6 button.btn[title*="Microsoft"] {border-color: #00875F; background: #00875F url('[...]/microsoftlogo.png') no-repeat 5% center;	background-size: 100% auto; color: #ffffff; font-weight: bold;}
#Register #ContentContainer_MainContent_MainContent_SecureRegister .row .col-md-6 button.btn[title*="LinkedIn"] {border-color: #0077B5; background: #0077B5 url('[...]/linkedin.png') no-repeat 5% center;	background-size: 100% auto; color: #ffffff; font-weight: bold;}
#Register #ContentContainer_MainContent_MainContent_SecureRegister .row .col-md-6 button.btn:hover {background-color: #DF3410;}

/*****Meet The Team******/

h1.contact_us {
    text-align: center;
    color: #1d3f70;
    margin: 50px 0px 50px 0px;
    font-size: 35px;
    font-weight: bold;
}


/*****Footer******/


footer {
    color: #ffffff
}

footer .footer-bottom {
    width: 100%;
    min-height: 36px;
    background-color: #1D3F70;
    font-size: 14px;
    display: flex;
    align-items: center;
    padding: 12px 0px 12px 0px !important;
}