
.sectionMain{
    padding:3rem 8rem 10rem 8rem;
    
}
.sectionLogin{
    padding:3rem 15rem 10rem 15rem;
}
.headtitleContainer,
.stateContainer{
    display: flex;
    justify-content: center;
    margin:3rem 0 2rem 0;
    gap:8rem;
}
.headtitleBox{
    display: flex;
    gap:1rem;
    background-color: #FDECD1;
    padding:0.8rem 2rem;
    border-radius: 25rem;
    align-items: center;
}
.titleicon{
    width:3rem;    
}
.headtitle{
    color:#56277D;
    font-size:2.4rem;
    font-weight:400;
}
.infomationContainer{
    display: flex;
    justify-content: center;
    /* padding:0 40%; */
}

.secondaryTitle{
    /* text-align: center; */
    color:#56277D;
    font-weight:400;
    margin-bottom: 1rem;
}
.thirdTittle{
    color:#56277D;
}
.impmark{
    color:red;
}
.label{
    display: block;
    margin-bottom: 0.8rem;
    color:#555;
}
.radiolabel{
    color: #777;
}
.radiolabel2{
    color:#0a3a5f;
}
.inputContainerLogin{
	display: flex;
    margin:3rem 0;
    gap:2.5rem;
    flex-direction: column;
    border-left:  1.5px solid #1E5E8E;
	padding:2rem 2rem 2rem 5rem;
}
.inputContainer{
    display: flex;
    margin:3rem 0;
    gap:2.5rem;
    flex-direction: column;
    border-left:  1.5px solid #1E5E8E;
	padding:2rem 2rem 2rem 5rem;
}
.lastinputContainer{
    border:none;
}
.inputBox{
    display: flex;
    flex-wrap: wrap;
    gap:2rem;
    align-items: center;
}
.radioBox{
    margin-bottom: 3rem;
    flex-direction: column;
    align-items: flex-start;
}
.inputBox *:focus{
    outline:none;
    box-shadow: 0 0 0.2rem 0.2rem rgba(234, 185, 243, 0.469)!important;
} 

.input,.select{
    border:1px solid #480a5f;
    font-size:1.8rem;
    color:#1E5E8E;
    padding:0.6rem 2rem;
    background-color: #fff;
    border-radius: 5px;
    width:35rem;
    box-shadow:0 2px 0.2rem 0.2rem rgba(232, 232, 232, 0.469)
}
.adressinput{
    width:40rem;
}
::placeholder{
    color:#989898;
}
.paymentimgContainer{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-items: center;
    margin-top: 3rem;
}
.paymentImg{
    width:80%;
}
/* validation */
.sectionVerify{
    padding:3rem 8rem;
    margin-bottom: 10rem;
}
.verifyTitleBox{
    display: flex;
    justify-content: center;
    transform: translate(-20rem,5rem);
}
.verifyTitle{
    display: inline-block;
    padding:1rem 3rem;
    background-color: #fff;
    border-top-right-radius: 25rem;
    border-top-left-radius: 25rem;
    border-bottom-left-radius: 25rem;
    text-align: center;
}
.verifyImgBox{
    display: flex;
    justify-content: center;
}
.verifyImg{
    width:40rem;
}
/* login */
.sectionLogin{
    margin-bottom:10rem;
}
.loginheadtitleContainer{
    margin:3rem 0 5rem 0;
}

.headerlogin:link,
.headerlogin:visited{
    background-color: rgba(255, 255, 255, 0.6);
    border: #1E5E8E 1.5px solid;
    padding:0.8rem 2rem;
    border-radius:25rem;
    display: flex;
    gap:0.5rem;
    align-items: center;
    color:#1E5E8E;
    transition: all 0.3s;
}
.headerlogin:hover,
.headerlogin:active{
    transform: scale(1.05);
}
.loginactive:link,
.loginactive:visited{
    background-color: #1E5E8E;
    padding:0.8rem 2rem;
    border-radius:25rem;
    display: flex;
    gap:0.5rem;
    align-items: center;
    color:#fff;
}
.loginInputContainer{
	display: grid;
	grid-template-columns: 1fr 1fr;
    justify-items: center;
	align-items: center;
}
.companyLoginLogo{
	width:85%;
}
.fotrgetLinkBox{
    display: flex;
    justify-content: flex-end;
}
.forgetLink:link,
.forgetLink:visited{
    color:rgb(204, 53, 53);
    font-size:1.5rem;
}
/* forget */
.sectionForget{
    padding-bottom:20rem;
}
.forgetTitle{
    margin-top: 10rem;
    color:#EE4D1B;
    text-align: center;
    font-size:3rem;
}
.forgerLabel{
    margin-bottom: 1.5rem;
    font-size:1.8rem;
}
/* radio Button */
/* customer radio BTN ////////////
////////////////////////////////*/
.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* Hide the browser's default radio button */
.container input {
    position:absolute;
    opacity:0;
    cursor:pointer;
    height:0;
    width:0;
}
  /* Create a custom radio button */
.radiocheckmark {
    position:absolute;
    top:0;
    left:0;
    height:25px;
    width:25px;
    background-color: #f0f0f0;
    border-radius:50%;
}
/* On mouse-over, add a grey background color */
.container:hover input ~ .radiocheckmark {
    background-color: #f0f0f0;
    box-shadow: 0 0 0.2rem 0.5rem rgba(223, 183, 251, 0.469);
}
/* When the radio button is checked, add a blue background */
.container input:checked ~ .radiocheckmark {
    background-color: #f0f0f0;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.radiocheckmark:after {
    content: "";
    position:absolute;
    display:none;
}
/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .radiocheckmark:after {
    display:block;
}
/* Style the indicator (dot/circle) */
.container .radiocheckmark:after {
    top: 6px;
    left: 6.3px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: rgb(189, 136, 243);
}

/* ////////////// 
/////forget///////
/////////////// */
.forgetTitle{
    text-align: center;
    margin-bottom: 3rem;
}
/* .sectionLogin{
    height:70vh;   
} */
.forgetInputContainer{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap:3rem;
}
.LoginInputBox{
    margin-bottom: 1rem;
}
.forgetInfo{
    margin-bottom: 3rem;
    color:#EE4D1B;
}