/* Add your custom code here  */


/* header */
header { padding: 0px 0px 20px 0px; }
header .logo { float: left; padding: 20px 0px; max-width: 150px; }
header .logo a { display: block; }

.menubtn { display: none; }
.menu { clear: both; background: #192e51; padding: 1px 0; }
.menu ul { text-align: right; border-bottom: 1px solid #eff6f5; padding: 5px 0; }
.menu ul li { display: inline-block; padding: 0px 0px }
.menu ul li a { font-size: 12px; line-height: 20px; color: #ffffff; display: block; padding: 4px 10px 6px; text-transform: uppercase; }
.menu ul li a:hover { color: #000; }
.menu ul li.active a { color: #000; }

/* content */
.main-content {float:right;width:75%; padding: 0 0px; }
.left-content {float:left; width:20%; padding: 0 0px 20px; }

.leftmenu { }
.leftmenu ul li { display: block; margin: 0px 0px 6px 0px; padding: 0px 0px; background: #d5d9e2; }
.leftmenu ul li a { font-size: 12px; line-height: 18px; color: #000000; text-transform: uppercase; display: block; padding: 6px 8px; -webkit-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease; }
.leftmenu ul li a:hover { background: #2fbfea; color:#ffffff; }
.leftmenu ul li.active a { background: #2fbfea; color:#ffffff; }
.alert-danger {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}
.alert {
    border: 1px solid transparent;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 15px;
}
.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
}
.alert {
    border: 1px solid transparent;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 15px;
}

.btn { display: inline-block; padding: 5px 20px; border:2px solid #28e6fd; color:#ffffff;
       background: -webkit-linear-gradient(#83acff, #0c83ff); 
       background: -o-linear-gradient(#83acff, #0c83ff); 
       background: -moz-linear-gradient(#83acff, #0c83ff);
       background: linear-gradient(#83acff, #0c83ff); 
}
.btn:hover { background: #0c83ff}

.content-topbar { padding:0px 0px 20px 0px; }
.content-topbar:after { content: ''; display: table; clear: both; }
.dashboard-btn { float: left; }
.dashboard-btn .btn { font-size: 16px; font-weight: 600; padding: 4px 30px; }
.content-searchbox { float: right; width: 300px; background: url("../images/search.png") no-repeat right center transparent;}
.content-searchbox input { border-bottom:1px solid #99a3b6; background: none; padding: 5px 20px 5px 0; font-size: 15px; font-weight: 300; width: 100%; }

.res-table { width: 100%; max-width: 100%; overflow-x: auto; margin:0px 0px 50px 0px;}
.res-table table {width: 100%; max-width: 100%; border: 1px solid #a2a8bc; border-spacing: 0px; border-collapse: collapse; background:#fff;}
.res-table table th { border:1px solid #a2a8bc; padding: 10px; background: #d5d9e2; text-transform: uppercase; }
.res-table table td { border:1px solid #a2a8bc; padding: 10px; }
.res-table table td span { display: none; }
.res-table table tr:nth-of-type(2n+1) { background: #f1f1f1; }
.res-table table td a:hover{ text-decoration: underline; }

.squaredThree { width: 15px; position: relative; margin: 0px auto; }
.squaredThree label { width: 15px; height: 15px; cursor: pointer; position: absolute; top: 0; left: 0; background:#ffffff; border-radius: 4px; border: 2px solid #a0a0a0; box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4); }
.squaredThree label:after {content: ''; width: 9px; height: 5px; position: absolute; top: 3px; left: 2px; border: 2px solid #ffffff; border-top: none; border-right: none; background: transparent;  opacity: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
.squaredThree label:hover::after {opacity: 0.3;}
.squaredThree input[type=checkbox] { visibility: hidden;}
.squaredThree input[type=checkbox]:checked + label { background: #ffa500; border:1px solid #ffa500  }
.squaredThree input[type=checkbox]:checked + label:after { opacity: 1; }

.login-wrapper{ padding-top: 90px; }
.login-wrapper .logo{ float: none; max-width: 171px; margin: 0 auto; }
.login-wrapper .container{ width: 900px; min-height: 450px; }
.loginbox { width: 530px; margin: 30px auto 0; }
.loginbox .inputbox { width: 100%; border:0; border-bottom:1px solid #b7c0cc; position: relative; margin-bottom:20px;  }
.loginbox .inputbox:before { content: ''; border:0; width:99.90%; position: absolute; top: 0px; bottom: 0; left: 1px;  }
.loginbox .inputbox input { border:0; background: transparent; padding: 15px 0; z-index: 99; position: relative; color: #192e51; font-size: 13px; width: 99%; }

.loginbox .submitbtn-box { clear: both; padding-top: 30px; text-align: center; }
.loginbox .submitbtn-box input { font-size: 13px; color: #3dc3eb; line-height: 30px; border: 2px solid #2fbfea; background: transparent; border-radius: 5px; padding: 5px 30px; text-transform: uppercase; }
.loginbox .remember-box { width: 50%; float: left; line-height: 18px; padding: 10px 0px 0px 0px; font-size: 11px; color: #192e51; text-transform: uppercase; }

.loginbox .squaredThree { width: 20px; position: relative; margin: 0px 15px 0px 0px; float: left;}
.loginbox .squaredThree label { width: 20px; height: 20px; cursor: pointer; position: absolute; top: 0; left: 0; background:#ffffff; border-radius: 5px; border: 1px solid #b4bcc3; box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4); }
.loginbox .squaredThree label:after {content: ''; width: 12px; height: 7px; position: absolute; top: 4px; left: 3px; border: 2px solid #192e51; border-top: none; border-right: none; background: transparent;  opacity: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
.loginbox .squaredThree label:hover::after {opacity: 0.3;}
.loginbox .squaredThree input[type=checkbox] { visibility: hidden;}
.loginbox .squaredThree input[type=checkbox]:checked + label { background: transparent; border:1px solid #b4bcc3; }
.loginbox .squaredThree input[type=checkbox]:checked + label:after { opacity: 1; }
.loginbox .forgotpassword { text-align: right; float: left; width: 50%;padding-top: 10px;}
.loginbox .forgotpassword a { font-size: 11px; color: #1b3054; text-transform: uppercase;  }
.loginbox .forgotpassword a:hover { color: #2fbfea;}


.content-topbar h1 {  padding-bottom: 12px; position: relative; }
.content-topbar h1::after { background-color: #7edbf8; bottom: -2px; height: 4px; left: 0; position: absolute; width: 46px; content: "";}
.content-topbar .left{ padding-top: 10px; text-transform: uppercase; font-size: 11px; }
.content-topbar .left select { margin: 0 10px; font-size: 14px; font-weight: normal; line-height: 20px; padding: 0px; color: #333; border: 1px solid #d9d9d9;border-radius: 5px; }
.paging { text-transform: uppercase; font-size: 11px; } 
.paging input {font-size: 11px; font-weight: normal; line-height: 16px; padding: 2px; width: 20px; text-align: center; color: #333; border: 1px solid #d9d9d9;border-radius: 5px; margin: 0 5px;}

.form-container { width: 100%; background: #fff; padding: 20px 15px; margin-bottom: 30px; }
.form-containe:after { content: ''; display: table; clear: both }
.form-container .elementbox { margin-bottom: 15px; }
.form-containe  .elementbox:after { content: ''; display: table; clear: both }
.form-container input, .form-container button, .form-container select, .form-container textarea {
    font-size: 14px; font-weight: normal; line-height: 20px; padding: 6px; color: #333; border: 1px solid #d9d9d9;border-radius: 5px;}
.form-container label { display: block; margin-bottom: 5px; font-size: 12px; font-weight: normal; line-height: 20px;}
.form-container .small { width: 160px; }
.form-container .medium { width: 200px; }
.form-container .large { width: 250px; }
.form-container .form-label { float: left; width: 180px; padding-top: 5px; margin-top: 2px;font-size: 14px; font-weight: 600}
.form-container .controls { margin-left: 200px;}
.form-container select.csselest { width: 220px; background-color: #FFF; background-image: none !important; border: 1px solid #E5E5E5; outline: medium none; height: 34px !important; line-height: 30px;}
.form-container .controls .radio, .form-container .controls .checkbox { display: inline-block; padding: 0px !important; margin: 8px 15px 0px 0px !important;min-height: 20px; }
.form-container .controls .radio.line, .controls .checkbox.line { display: block; padding: 0px !important; margin: 5px 0px 0px !important;}
.form-container textarea.csarea { height: auto; }
.form-container .btn { background: #32c6f4; border: 1px solid #32c6f4; color: #ffffff; margin-right: 5px; cursor: pointer; padding: 10px 13px; text-transform: uppercase; }
.form-container .btn:hover { background: #192e51; border: 1px solid #192e51; }




.dataTables_length {font-size: 14px; margin-bottom: 10px;}
.main-content select{margin: 0 5px;}
.dataTables_filter input[type="search"]{padding: 5px 10px; font-weight: normal;}
table.dataTable thead th{text-align: center;}
.res-table {overflow-x: visible; padding-top: 15px;}
.table-bordered.dataTable{margin-bottom: 10px;}

.main-content *:focus, .main-content *:visited {color: inherit;}
.main-content .btn:focus, .main-content .btn:visited{color: #ffffff;}

span.error{color: red;margin: 5px;}
.err{color: red;}
.error{color: red;}

.upload-parent {
  display: inline-block;
  margin: 0 20px 0 0;
}

.ship-item-img {
  display: inline-block;
  margin: 0 10px 10px 0;
}
.elementbox .controls { padding-top: 10px; }
#open_btn { color: #fff !important;  }