.userForm-w { width: 100%; padding: 20px 0; margin-top: -6px; direction: rtl; font-family: 'Cairo', sans-serif; } input,select { font-size: 12px; background-color: #fff; border: 2px solid #bda380; } /* input.ng-invalid.ng-touched { border: 2px solid #ccc; } input.ng-invalid { border: 2px solid #ccc; } select.ng-invalid{ border: 2px solid #ccc; } */ .custom-radio .custom-control-label::before{ border: 1px solid #b28c5e; } .custom-radio .custom-control-input:checked~.custom-control-label::before{ background-color: #906635; border: 1px solid #fff; } .formfieldset{ border: 1px solid #61606073; width: 100%; border-radius: 3px; margin-top: 40px; background-color: #a5a3a31a; } .formfieldset legend{ float: right; } .formfieldset legend span{ width: auto !important; font-size: 15px; border: 1px solid #616060; padding: 2px 15px; background-color: #616060; float: right; margin: -15px 14px 0px 0px; border-radius: 3px; color: #ffffff; } .imgProfile { width: 100%; border-radius: 20px 20px 0 0; border-radius: 50%; border: 1px solid #ccc; } .imgContainer { width: 200px; position: relative; border-radius: 20px; margin: 30px auto; } .iconUpload-w { width: 30px; font-size: 1.25em; font-weight: 700; color: #252525; display: inline-block; border-radius: 0 0 20px 20px; position: absolute; right: 40%; border: 1px solid #ccc; border-radius: 50%; bottom: 0; } .inputfile { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; } /* .inputfile + label { width: 100%; font-size: 1.25em; font-weight: 700; color: #252525; background-color: transparent; display: inline-block; border: 1px solid #ccc; border-radius: 0 0 20px 20px; } */ .inputfile:focus + label, .inputfile + label:hover { background-color: #00a99d; color: #fff; } .inputfile + label { cursor: pointer; /* "hand" cursor */ } .inputfile:focus + label { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px; } .table .fileName-w { position: absolute; bottom: -3px; right: 120px; } .inlineBlock-w { display: inline-block !important; float: right !important; margin: 40px 0 !important; } .regesterBtn-w { margin: 20px 10px; float: right; } .inlineBlock-w { display: inline-block !important; float: right !important; margin: 40px 0 !important; } .formStyle{ border: 1px solid #ccc; border-top: 4px solid #bda380; padding: 20px; margin: 0 auto } .titileLi-w { margin: 0 65px; } .titileLi-w li { margin: 0 5px; } .errorMessage-w { font-size: 14px; text-align: right; margin: 5px; color: red; } .wrapper { width: 100%; display: inline-block; padding: 10px 0; background: #f5f5f5; border: 1px solid #bdbdbd; border-radius: 5px; } .title { font-size: 16px; text-align: right; margin: 10px 0; background-color: #888; width: 200px; padding: 9px; border-radius: 5px 5px 0 0; margin-bottom: 0; margin-right: -12px; color: #fff; } .statusBtn-w { width: 80px; margin: 5px 7px; cursor: pointer; float: right; margin-top: 25px; margin-bottom: 10px; } /* file table style */ .askForOpinion-w { width: 100%; display: inline-block; padding: 20px 0; } .confirmed-w { width: 100%; display: inline-block; padding: 20px 0; } .wrapper .inputfile { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; } .wrapper .iconUpload-w { width: 265px; height: 37px; border-radius: 5px; font-size: 1.25em; font-weight: 700; display: inline-block; background-color: #fff; border: 1px solid #ccc; padding: 0 10px; position: absolute; right: 75px; } .wrapper .deleteRow-w { width: 100px !important; padding: 7px 8px !important; cursor: pointer !important; margin: 1px 0 !important; } .wrapper .table td, .table th { padding: 5px 15px !important; width: 150px !important; } .wrapper .table tbody tr:nth-child(odd):hover { color: #bda380 !important; } .wrapper .table tbody tr:nth-child(even):hover { color: #bda380 !important; } .departmentHeading-w { font-size: 18px; float: right; } .departmentHeading-w span{ color: red; } /* start media query style */ @media(max-width: 767px){ .formStyle { padding: 20px; } input,select { font-size: 12px; } } @media(min-width: 767px) and (max-width: 991px){ .formStyle { padding: 20px; } input,select { font-size: 12px; } }