﻿/*************************************************************
  Author    :Md.Razibul Islam
  Purpose   :Set Style for LoginPage of Internet Banking
  Date      :08/07/2018
***************************************************************/
body {}
*{margin:0px; padding:0px;}
#MainBox {
    width:65%;
    margin:0 auto;
}
#wrapper {
    border:2.5px solid #B83190;
    border-top:0;
    border-left-color:#0081C5;
}
#wrapper_i {
}
#header{}
.headerTitle {
    background: linear-gradient(to right, #0081C5, #B83190); height:55px;
}
.headerIultimus{ 
    overflow: hidden;
    width:100%;
}
.Heder_Left_Logo {
    float:left;
    width:48%;
    padding:2%;
}
.Heder_Left_Logo > img {
    display:block;
}
.Heder_Right_Logo {
    float:right;
    width:44%;
    padding:2%;
    text-align:right;
}
.Heder_Right_Logo > img {
     display:block;
     float:right;
     width:25%;
}
.SuccessMessage {
    color:green;
}
#whole{}
.whole_head {}
.whole_header{padding-top:15px;}
.whole_header > span{font-size:30px; color:#0081C5; display: block; text-align:center; padding-bottom:15px;}
.input_box{
    width:400px;
    margin:0 auto;
    border:2.5px solid #B83190;
    border-left-color:#0081C5;
    border-bottom-color:#0081C5;
}
table {
    padding:15px;
    width:100%;
    margin:0 auto;
}
table tbody > tr > td {
    padding-bottom:5px !important;
}
table tbody > tr > td:first-child {
    width:110px !important;
}
#lblNumOne {
    width:44px;
    color:#0081C5;
    font-size:16px;
}
#lblPlusSign {
    width:44px;
    color:#B83190;
    font-size:18px;
}
#lblNumTwo {
    width:44px;
    color:#0081C5;
    font-size:16px;
}
input[type="text"],
input[type="number"]
{
    width:220px;
    height:20px;
}
#LsddlHomeBranch,
#LsddlCustomer {
    width:224px;
    height:25px;
}
#btnValidate{
    width:95px;
    height:30px;
}
#btnCancel {
    width:55px;
    height:30px;
    font-family: 'Ubuntu', sans-serif;
}
#LoginUI {
    display:inline-block;
    color:#0081C5;
    font-size:14px;
    font-family: 'Ubuntu', sans-serif;
    padding-left:5px;
}
#btnValidate {
    background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
#btnCancel {
     background:#B83190;
    border:1px solid #B83190;
    color:#ffffff;
    cursor:pointer;
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
#btnValidate:hover {
    background:#0081C6;
}
.input_box_self {
    width:340px;
}
#btnGoNext {
    width:65px;
    height:30px;
     background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
#btnHomePage {
    width:60px;
    height:30px;
     background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
#btnGoBack {
    width:65px;
    height:30px;
     background:#B83190;
    border:1px solid #B83190;
    color:#ffffff;
    cursor:pointer;
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
.bottom_area {
    padding:25px;
    border-top:2px solid #e6e6e6;
    margin-top:20px;
}
.footer {
   position:relative;
   padding-bottom:25px;
}
.footer_link {
    padding-right: 100px;
}
.footer_img {
  position:absolute;
  top:-15px;
  right:0;
}
.footer_img > img {
    width:100px;
}
.footer_link > a {
    font-size:11px;
}
#Footer {
   position:relative;
   padding-right: 100px;
}
#Footer > p {
 font-family:Arial;
 font-size:12px;
 font-weight:bold;
 color:gray;
}
#FooterLogo {
    position:absolute;
    top:0;
    right:0;
}
#FooterLogo > img {
    width:100px;
}

@media screen and (max-width: 992px) {
  #MainBox {
    width:90%;
    margin:0 auto;
}
}
@media screen and (max-width: 768px) {
  #MainBox {
    width:95%;
    margin:0 auto;
}
  .Heder_Left_Logo > img {
    width: 82%;
}
  .Heder_Right_Logo > img {
     width: 40%;
}
  .headerTitle {
    height:25px;
}
.whole_header > span {
   font-size: 18px;
  }
}
@media screen and (max-width: 560px) {
 #MainBox {
    width:100%;
}
.Heder_Left_Logo > img {
    width: 100%;
}
.input_box{
    width:310px;
}
table {
    padding:10px;
    width:100%;
    margin:0 auto;
    padding-right:0;
}
table tbody > tr > td {
    padding-bottom:2px !important;
    font-size:14px;
}
table tbody > tr > td:first-child {
    width:100px !important;
}
input[type="text"],
input[type="number"]
{
    width:180px;
    height:25px;
}
#LsddlHomeBranch,
#LsddlCustomer {
    width: 182px;
    height: 27px;
}
 #lblNumOne {
    width:30px;
    font-size:16px;
}
#lblPlusSign {
    width:30px;
    font-size:16px;
}
#lblNumTwo {
    width:30px;
    font-size:16px;
}
#btnValidate {
   margin:5px 0 10px 0;
   height:35px;
}
#btnCancel {
margin:5px 0 10px 0;
    height:30px;
}
.footer_img > img {
    width:75px;
}
#FooterLogo > img {
    width:75px;
}

.footer_link > a {
    font-size: 8px;
}
#Footer > p {
    font-size: 10px;
}
.bottom_area {
    padding: 16px;
}
#btnGoNext {
    width:60px;
}
#btnHomePage {
    width:55px;
}
.footer_img {
    top: 0px;
}
}

/* Online user Creation SEBL*/
.wrapper_i {
    padding-bottom:10px !important;
}
#colorMsg {
    padding-bottom:10px;
}
.ErrorMessage {
    color:#ff0000;
}
.inner_head {
    width:90%;
    border:1px solid #0081C5;
    margin:0 auto;
}
.inner_container {
    overflow:hidden;
    width:100%;
}
.container_left {
    float:left;
    width:50%;
}
.container_right {
    float:right;
    width:50%;
}
.container_left > table > tbody > tr > td:first-child {
    width:200px !important;
}
.container_right > table > tbody > tr > td:first-child {
    width:200px !important;
}
.action_controll {
   text-align:center;
   padding-top: 20px;
}
#btnOk {
    width:60px;
    height:30px;
    background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}
#btnRefresh {
    width:65px;
    height:30px;
    background:#B83190;
    border:1px solid #B83190;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}
#btnOTPReset {
    width:85px;
    height:30px;
    background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}
#btnExit {
    width:65px;
    height:30px;
    background:#B83190;
    border:1px solid #B83190;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}
#btnUnlock {
    width:65px;
    height:30px;
    background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}
#btnProceed {
    width:65px;
    height:30px;
    background:#0081C5;
    border:1px solid #0081C5;
    color:#ffffff;
    cursor:pointer;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-bottom:10px;
}

@media screen and (max-width: 768px) {
  .container_left {
    float:none;
    width:100%;
}
.container_right {
    float:none;
    width:100%;
}
.container_left > table > tbody > tr > td:first-child {
    font-size:14px;
}
.container_right > table > tbody > tr > td:first-child {
    font-size:14px;
}
.container_left > table {
   padding-bottom:0 !important;
}
.container_right > table {
    padding-top:0 !important;
}
}
@media screen and (max-width: 560px) {
.container_left > table > tbody > tr > td:first-child {
    width: 140px !important;
}
.container_right > table > tbody > tr > td:first-child {
    width: 140px !important;
}
table {
    padding-right: 10px;
}
}