/* LOGIN PAGE */
.min-h-screen.flex.flex-col.sm\:justify-center.items-center.pt-6.sm\:pt-0.bg-gray-100.dark\:bg-gray-900{
    background-color: rgba(38,44,46,1);
    display: flex;
    justify-content: center;
}

.w-full.sm\:max-w-md.mt-6.px-6.py-4.bg-white.dark\:bg-gray-800.shadow-md.overflow-hidden.sm\:rounded-lg {
    background-color: transparent !important;
}

body{
    background-color: rgba(38,44,46,1);
}

/* Navigation Builder Icon */
ul.navbar-nav.builder {
    position: absolute;
    right: 25px;
}

svg#svg-icon {
    width: 20px;
}

.navbar-nav .dropdown-menu {
    position: fixed;
    top: 47px;
    left: auto;
    right: 25px;
}

@media (min-width: 992px){
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: fixed;
    }
}


.login-button {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.login-button:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #787878;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.login-button:active {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.registration-button {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.registration-button:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #787878;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.registration-button:active {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

.register-builder-button {
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-style: none;
}

.register-builder-button:hover {
    background-color: rgba(38,44,46,1);
    height: 50px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-style: none;
}

a.btn.btn-primary.register-builder-button:active {
    background-color: #F2994A;
}

button.btn.btn-primary.registration-button:active {
    background-color: #F2994A;
}

.register-organization-button {
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-style: none;
}

.register-organization-button:hover {
    background-color: rgba(38,44,46,1);
    height: 50px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-style: none;
}

a.btn.btn-primary.register-organization-button:active {
    background-color: #F2994A;
}

button#accessCameraBtn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    color: #000000;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#accessCameraBtn:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    color: #ffffff;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#takePhotoBtn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    color: #000000;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#takePhotoBtn:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    color: #ffffff;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#unvalidated_docs_btn {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    color: #000000;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#unvalidated_docs_btn:hover {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    color: #ffffff;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#validated_docs_btn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    color: #000000;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button#validated_docs_btn:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    color: #ffffff;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button.btn.btn-primary.document_btn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

button.btn.btn-primary.document_btn:hover {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2994A;
    height: 50px;
    border-radius: 25px;
    border-style: none;
}

input#name {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#doc_name {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#company_name {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#email {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#password {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#password_confirmation {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

input#project_title {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

textarea#project_description {
    text-align: center;
    height: 200px;
    border-radius: 25px;
}

input#formFileMultiple {
    text-align: center;
    /*height: 50px;*/
    border-radius: 25px;
}

select#builder_id{
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

select#companyid{
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

select#trade{
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

select#doc_company{
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

select#companies {
    text-align: center;
    height: 50px;
    border-radius: 25px;
}

a#sign-up {
    color: #ffffff;
    font-weight: bold;
    text-decoration: none;
}

.container-fluid.footer-text-position {
    justify-content: center;
}

.footer-text {
    color: #ffffff;
    font-size: small;
}

main{
    background-color: rgba(38,44,46,1);
}

.dashboard-screen {
    background-color: rgba(38,44,46,1);
}

h1{
    color: #ffffff;
}

h3 {
    text-align: center;
    color: #ffffff;
}

.container-fluid.form-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.form-content {
    width: inherit;
    max-width: 600px;
}

.container-fluid.connections-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

button.btn-close {
    background-color: white;
}

.modal-header {
    background-color: black;
    color: white;
}

.modal-body {
    background-color: #333333;
}

.modal-footer {
    background-color: #787878;
}

button.btn.btn-secondary {
    background-color: black;
}

div#points-chart-container {
    background-color: #787878;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 1em;
    justify-content: center;
    align-items: center;
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
}

div#chart {
    width: 100%;
    min-width: 300px;
    max-width: 600px;
}

.container.mt-4.projects-container {
    background-color: #787878;
    max-width: fit-content;
    /* height: 100vh; */
    border-radius: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.container.project-container {
    /* width: 600px; */
    max-width: 800px;
    min-width: 300px;
    padding: 1em;
    background-color: white;
    border-radius: 25px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 25px;
    display: flex;
    align-items: center;
    height: 300px;
}

.carousel-item img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

span.carousel-control-next-icon {
    background-color: rgba(38,44,46,1);
}

span.carousel-control-prev-icon {
    background-color: rgba(38,44,46,1);
}



/* Organization Projects Page */
.container-fluid.all-projects {
    display: flex;
    flex-wrap: wrap;
}

.container.project {
    max-width: 512px;
    min-width: 300px;
    padding: 1em;
    background-color: white;
    border-radius: 25px;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Global SVG Icons */
svg {
    width: 20px;
}

/* Organization Projects Page and Visual Resume */
.col.svg-flex {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
}

.mt-4.form-header{
    display: flex;
    flex-direction: column;
    /* justify-content: normal; */
    align-items: center;

}

.alert.alert-danger {
    /*width: 600px;*/
}

.form-check-label{
    color: #ffffff;
}

div#project_id {
    color: #ffffff;
}

p.no-builders{
    color: #ffffff;
}

button.btn.btn-primary.share-button {
    background-color: #F2994A;
    border-style: none;
}
button.btn.btn-primary.confirm_request {
    background-color: #F2994A;
    border-style: none;
}
button.btn.btn-primary.cancel_request {
    background-color: #F2994A;
    border-style: none;
}

/* DASHBOARD PAGE */
.modal-image {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: auto;
}

.connection_request {
    color: #ffffff;
    padding: 1em;
}


img.document-image {
    max-width: 100%;
}

img.preview-image {
    max-width: 100%;
}