/* This is the styles of letters and sizes of the text forms */

*{
   padding: 0;
   margin: 0;
   box-sizing: border-box;
}



section{
   min-height: 100vh;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: aliceblue;
 
}



.container {
    display: block;
    align-items: center;
   width: 90%;
   max-width: 900px;
       background-color: white;
    margin: 0 auto;
    box-shadow: 0px 0px 20px #00000020;
    padding: 20px; 
    border-radius: 8px;
   
}

.step {
   display: none;
}

.step.active {
   display: block;
}

/* .firstBlock {
height: 260px;
} */

.page_title {
    margin-bottom: 0px;
}

.subTitles {
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: left;
    
}

a {
    color: red;
}

.access_Code, .phonePattern {
    font-size: 12px;
    font-style: italic;
    
    /* opacity: 5; */
    
margin-bottom: 0;
}

.text_Box1 {
   width: 210px;
   height: 30px; 
   margin-top: 5px;
   text-indent: 10px;
   margin-bottom: 10px;
}

.note {
    width: 540px;
    margin-top: 25px;
    font-size: 15px;
font-weight: bold;
}

.text_Box2 {
    width: 300px;
    height: 30px; 
    text-indent: 10px;
 }

 .address {
    /* display: inline-block; */
float: left;
    width: 250px;
    margin-right: 0px;
 }



 .phone {
    /* display: inline-block; */
    float: left;
    width: 250px;
    margin-left: 0px;
    height: 50px;
 }

 .addres_Phone::after{
    content: "";
    clear: both;
    display: table;
    width: 600px;
/* vertical-align: text-top;
display: inline-block; */
 }

 .text_Box3 {
    width: 300px;
    height: 30px; 
    text-indent: 10px;
 }

 .email {
    display: inline-block;
    width: 300px;
    padding: auto;
 }

 
 .emailContainer {
    position: relative;
    overflow: hidden;
 }

 .next,.save {
    width: 80px;
    height: 30px;
       text-align: center;
       transition-duration: 0.8s;
 }

 .save {
   float: right;
    border-radius: 8px;
    border: 1px solid blue;
    color: blue ;
    background-color: white;
 }

 .save:hover {
    background-color: #e7e7e7;
    border: 1px solid red;
 }

 .next {
    margin-left: 10px;
    
    /* border-radius: 8px;
    border: 2px solid blue; */
    border: none;
    color: white ;
    background-color: blue ;
 }

 .next:hover {
    /* background-color: #e7e7e7; */
    font-size: 15px;
 }

 .form_Div {
   display: none;
 }

 .form_Div.active {
   display: block;
 }


/* Second Page Css Decoration --------------------------------------------------- */


.pageContainer {
   margin-left: 40px;
width: auto;
margin-right: 40px;

}

.title {
   width: 100%;
   height: 50px;
   background-color: aqua;
   text-align: center;
}

.h1 {
   text-align: center;
   font-size: 50px;
   margin-top: 15px;
}

.note {
   font-size: 15px;
   font-weight: bold;
}

h3{
   text-align: center;
}

h4 {
   margin-left: 40px;
}

.textPaidEquipment {
   margin-left: 60px;
}

a {
   color: red;
}



.equiptmentRequested {
   margin-left: 0;
}

/* This is the table code */

.equipmentOS {
   margin-left: none;
}

.label {
   font-family: monospace;
   font-size: 12px;
}

.OS {
  font-family: monospace;
}

.radioBtm {
   margin-left: 20px;
   margin-top: 10px;
}

th {
   width: 155px;
}

tr {
   width: 700px;
}


/* This is the table code  UP*/


.note2 {
   font-size: 15px;
   font-weight: bold;
   text-align: justify;
   border: solid  1px red;  
}

.deliveryOpt, .PaymentOpt, .Process, .termsAndConditions, .comments, .contactUs
{
   margin-left: 0;
   font-size: 18px;
}

/* This to set the size of the drop Down */

#delivery, #paymentMenu {
   width: 500px; 
   height: 25px;
}

.deliveryContainer {
   width: 700px;
}

.deliveryMenu {
   min-width: 700px;
   height: 30px;
   margin-bottom: 5px;
}

.deliveryNote, .commentsNote {
   font-size: 12px;
   font-style: italic;
   /* opacity: 5; */
margin-bottom: 0;
margin-top: 2px;
}


/* This section is for the terms and confitions Decoration */
.agreeBox {
   width: 200px;
 
}

#agree {
   margin-right: 0px;
   display: inline-block;
}

.agreeLabel {
   margin-left: 5px;
   display: inline-block;
}

/* This section is for the Comments Decoration */
.commentsBox {
   width: 700px;
   height: 70px;
   margin-top: none;
   margin-bottom: 0PX;
}

.comments {
   margin-bottom: 5px;
}


/* This section is for the Contact us Decoration */
.bold {
   font-weight: bold;
   color: black;
}

.emailContact {
   text-decoration: underline ;
}



 /* SEcond page btns */
 .submit, .previus {
margin-top: 5px;
padding: 10px 30px;
border: none;
outline: none;
background-color: aqua;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 14px;
float: right;
transition: .8s;
cursor: pointer;
 }

 .previus{
   float: left;
   background-color: rgb(180, 220, 255);
 }

 .submit:hover, .previus:hover{
   color: red;
 }

 .btnDiv {
   height: 50px;
 }

 #emailError, #codeError, #phoneError {
   color: red;
 }

 /* This section is the stylysg for the APply now btn */
 /* .applynow:hover {
   background-color: rgb(125, 192, 125);
 }
 
 .applynow {
width: 160px;
height: 60px;
font-size: 18px;
color: white;
background-color: rgb(96, 165, 44);
border-radius: 30px;
align-items: center;
border: none;
transition: .5s;

 } */