/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

@import url("google-kanit.css");

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
  color: #0366d6;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    font-family: 'Kanit', sans-serif;
    margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px; /* Vertically center the text there */
}



/* Custom Style*/
.bg-img {
    /* The image used */
    background-image: url(../img/banner.png);
    min-height: 200px;
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /* Needed to position the navbar */
    position: relative;
    width: -webkit-fill-available;
}


/* The navbar */
.topnav {
    overflow: hidden;
    background-color: #333;
}

/* Navbar links */
.topnav a {
    float: left;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
}

.topnav a:hover {
    background-color: #ddd;
    color: black;
}




.dropbtn {
    background-color: #04AA6D;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}
.nav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

/*form*/
.form-control {
    border: none;
    border-bottom: 1px solid darkgray;
    border-radius: 0;
}

.grid-modal {
    display: grid;
    grid-template-columns: 35.5% 35.5%;
    justify-content: center;
    column-gap: 5%;
}

.grid-modal-child {
    display: grid;
    grid-template-columns: 25% 75%;
    align-items: end;
}

.grid-con-paren {
    display: grid;
    grid-template-columns: 45.5% 45.5%;
    justify-content: center;
    column-gap: 5%;
}


.grid-con-child1 {
    display: grid;
    grid-template-columns: 80% 20%;
    align-items: end;
    justify-items: start;
}

.grid-con-paren2 {
    display: grid;
    grid-template-columns: 96% 0%;
    justify-content: center;
    
}

.grid-con-child2 {
    display: grid;
    grid-template-columns: 20% 80%;
    align-items: end;
    justify-items: start;
}

.grid-con-paren4 {
    display: grid;
    grid-template-columns: 44% 22% 30%;
    justify-content: center;
}

.grid-con-child4 {
    display: grid;
    /*grid-template-columns: 20% 80%;*/
    align-items: end;
    justify-items: start;
}

.grid-con-child5 {
    display: grid;
    align-items: end;
    justify-items: start;
    justify-content: center;
}

.grid-con-paren6 {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: start;
    padding-left: 20px;
}

.grid-con-paren7 {
    display: grid;
    grid-template-columns: 20% 20% 20%;
    justify-content: center;
    gap: 10px
}

.formOther {
    border: none;
    border-bottom: 1px solid darkgray;
    border-radius: 0;
}

.btn-card-header {
    display: flex;
    justify-content: space-between;
}

.grid-con-paren-chk {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: start;
    padding-left: 33px;
}
.label-chk {
    margin-right: 7.5rem;
}

.grid-con-child-chk {
    display: grid;
    grid-template-columns: 5% 84%;
    align-items: center;
    margin-left: -3rem;
    column-gap: 3%;
    justify-items: start;
}

.bg-form {
    background: whitesmoke;
}
.bg-submit-form {
    background: transparent linear-gradient(93deg, #034EA2 0%, #ED1C24 100%) 0% 0% no-repeat padding-box;
    min-width: 15rem;
    height: 3rem;
}
.set-width-year {
    width: 10%;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
    background-size: calc(1.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.form-control.is-valid, .was-validated .form-control:valid {
    background-size: calc(1.75em + 0.375rem) calc(0.75em + 0.375rem);
}


.sweet-alert {
    font-family: 'Kanit', sans-serif !important;
}

.form-addr {
    border: none !important;
    border-bottom: 1px solid darkgray !important;
    border-radius: 0 !important;
}

.btn-shareholder {
    background: #0a529c;
    border-radius: 1rem;
    box-shadow: #52aee0c4 0 10px 20px -10px;
    font-family: 'Kanit';
    padding: 8px 8px;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: fit-content;
    word-break: break-word;
    border: 0;
}
.remove {
    background: #dc3545;
    border-radius: 1rem;
    box-shadow: #dc3545cc 0 10px 20px -10px;
    font-family: 'Kanit';
    padding: 8px 8px;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: fit-content;
    word-break: break-word;
    border: 0;
}

.h1-titlepage {
    padding: 25px;
    color: white;
}

.term-bg {
    background: #f3f3f3;
    border-radius: 2px;
    text-align: left !important;
}
.pdpa-bg {
    background: #f3f3f3;
    border-radius: 2px;
}

.card-shr {
    border: solid 1px #d0d0d0;
    background-color: #f5f5f5;
    line-height: 2.5rem;
}
.line-textheight {
    line-height: 25px !important;
}



@media (max-width: 50rem) {

    .grid-con-child-chk {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: center;
        padding-top: 15px;
    }

    .radios {
        display: flex;
        justify-content: center;
    }

    .grid-con-paren7 {
        display: flex;
        flex-direction: row;
        gap: 10px;
    }

    .grid-con-child1, .grid-con-child2 {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
    }

    .grid-modal {
        display: flex;
        flex-direction: column;
    }

    .grid-modal-child {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .grid-con-paren-chk {
        display: flex !important;
        flex-direction: column !important;
    }

    .label-chk {
        margin-right: 1.5rem !important;
    }

    .grid-con-paren {
        display: flex;
        flex-direction: column;
    }

    .grid-con-child4 {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .grid-con-child {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding-top: 15px;
    }
}

.grid-con-child {
    display: grid;
    /*grid-template-columns: 40% 60%;*/
    grid-template-columns: 41% 60%;
    align-items: end;
    justify-items: start;
    align-items: start;
}