/* ----- Header ----- */
/*google sign in */
.g-signin2{
  width: 100%;
}

.g-signin2 > div{
  width: 100%!important;
  height: 38px!important;
}

.nav-menu {
    color: rgb(5, 5, 5);
}

.bg-color {
    background-color: #86c522 !important;
}


#tittle {
    color: white;
}

/* ----- Main ------ */

main {
    margin-top: 1rem;
}

main p,
#orderTab p {
    text-align: center;
    font-size: 140% !important;
    color: #3a3a3a !important;
}

#buttonSpacing {
    margin: 0px 0px 10px 0px;
}

#buttonSpacing1 {
    margin: 10px 0px 10px 10px;
    width: 150px;
    color: white !important;
}


/* Home Tab */

#image {
    border: transparent !important;
}

#file {
    border: 1px solid #cccccc;
}

#file img {
    padding: 1rem 0 0 1rem;
}

#file #image {
    padding-bottom: 3rem;
}

.form-group input:focus {
    border-color: #218838;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 0 0px rgba(255, 0, 0, 0);
}

#password .form-group input:focus {
    border-color: #218838;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 0 0px rgba(255, 0, 0, 0);
}

.checkBox {
    margin-bottom: 15px;
}

#password,
#password1,
#password2,
#password3 {
    border: 1px solid #cccccc;
    padding: 10px;
    margin-bottom: 10px;
}

#password h5 {
    color: #218838;
    margin-bottom: 15px;
}

#vadName,
#vadEmail,
#vadNumber,
#vadPassword,
#vadNewpass,
#vadConpass,
#vadName1,
#vadEmail1,
#vadNumber1,
#vadPassword1,
#vadNewpass1,
#vadConpass1,
#vadAddress {
    display: none;
    color: rgb(255, 51, 0);
    font-size: 80%;
}

#vadName,
#vadEmail,
#vadNumber,
#vadName1,
#vadEmail1,
#vadNumber1,
#vadAddress {
    padding-top: 10px;
}

/* Address Tab */

option {
    font-size: 120%;
    padding: 30px 0px !important;
}

#opt:hover {
    background-color: #cccccc !important;
}

#newAddress {
    padding: 2rem 0;
}

.form-group input:focus,
.form-group select:focus {
    border-color: #218838;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 0 0px rgba(255, 0, 0, 0);
}

#inputDiv {
    border: 1px solid #cccccc;
}

#addElement {
    margin: 35px 0;
}

.bill {
    margin: 20px 0;
    padding: 15px;
    border: 1px solid #cccccc;
}

#inputBill {
    margin-top: 15px;
}

#block {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;
}

.selectpicker option:hover {
    background-color: #f0f0f0 !important;
}

btn-info {
    background-color: #cccccc !important;
}

/* Payment Tab */

.input-group-append,
.input-group-prepend {
    display: block !important;
}

#radioCard {
    padding: 0.5rem 0 1rem 0;
}



/*.card {
    margin-top: 35px !important;
}*/

.cardDetail {
    padding-top: 10px;
}

#exampleFormControlSelect1 {
    overflow: auto !important;
}

/* Order Tab */

#order {
    padding-bottom: 30px;
}

.card-header {
    padding: 0% !important;
    background-color: #eeeeee !important;
}

#accordBtn {
    width: 80% !important;
    text-align: left !important;
    background-color: #eeeeee !important;
    border-style: none !important;
}

#accordBtn:hover,
#accordBtn:active,
#accordBtn:visited,
#accordBtn:focus {
    background-color: #eeeeee !important;
    border: 1px solid #eeeeee !important;
}

#checkIcon {
    color: #218838;
    float: right;
    margin: 10px;
}

.orderTab {
    border-right: 1px solid #cccccc !important;
    border-left: 1px solid #cccccc !important;
    border-bottom: 1px solid #cccccc !important;
}

/* PROGRESS BAR */

.one,
.two,
.three,
.four {
    position: absolute;
    margin-top: -13px;
    z-index: 1;
    height: 30px;
    width: 30px;
    border-radius: 25px;
}

.one {
    left: 0%;
}

.two {
    left: 33%;
}

.three {
    left: 66%;
}

.four {
    left: 98%;
}

.roundIcon {
    color: white !important;
    font-size: 100% !important;
    margin-top: 0px !important;
    margin-left: 9px !important;
    padding-top: 10px;
}

.success-color {
    background: #218838 !important;
}

.danger-color {
    background: red !important;
}

.progress-status-color {
    background: #d3d3d3 !important;
}

.progress-bar-custom {
    background: #218838 !important;
    height: 5px !important;
}

/* .progress {
      height: 5px !important;
  } */

.progress h6 {
    font-size: 12px;
    width: 110px;
    padding-top: 20px;
}

.prg {
    padding: 30px 100px 0px 100px;
}

#table {
    /*border: 1px solid #cccccc !important;*/
    margin-bottom: 25px !important;
    padding-top: 30px !important;
}

#table thead th {
	border:none !important;
}

#tcell {
    /*border: 1px solid #cccccc !important;*/
    width: 50% !important;
}

#tcell1 {
    text-align: right;
}

#oderBtn {
    float: right;
    
}

#orderbtn1,
#orderbtn2,
#orderbtn3,
#refundorderbtn4
{
    margin: 3px 0px 3px 6px;
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
}



/* Combine */

#home,
#address,
#payment,
#order {
    border-bottom: 1px solid #dee2e6;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
}

#homeTab,
#paymentTab,
#addressTab,
#orderTab {
    padding:8px 10px !important;
}

/* ------------------------------------ */

/* ------- ADDRESS CHECK & VALIDATION STYLE ------ */

/* ------------------------------------ */

.addressdetails {
    display: none;
}

#Error-summary {
    display: none;
}

.input-corners {
    border-radius: 5px;
    box-shadow: none !important;
    border: 1px solid #ced4da;
}

#Sign_firstname_Errormsg {
    display: none;
}

#Sign_lastname_Errormsg {
    display: none;
}

#Signup_email_Errormsg {
    display: none;
}

#Signup_Password_Errormsg {
    display: none;
}

#Signup_RetypePassword_Errormsg {
    display: none;
}

#Signup_Telephone_Errormsg {
    display: none;
}

#autocomplete_Errormsg {
    display: none;
}

#apt_Errormsg {
    display: none;
}

/* ------------------------------------ */

/* ------ MEDIA QUERIES --------- */

/* ------------------------------------ */

@media only screen and (max-width: 997px) {
    .prg {
        padding: 30px 0px 0px 0px;
    }

    .two {
        left: 30%;
    }

    .three {
        left: 60%;
    }

    .four {
        left: 90%;
    }

    .progress h6 {
        font-size: 9px;
		
    }
}
