/**
 * Custom CSS file
 *
 * @package Web Services Support Site
 * @author Rich
 * @copyright Copyright 2016 Trxadegroup, Inc.
 * @version $Id:  $ 
 */

a, a:active, a:hover, a:focus { color: #51c0d4; }

a.no-underline,
a.no-underline:hover,
a.no-underline:focus {
    text-decoration: none !important;
}

body {
    font-family: "Arial Regular", sans-serif;
    /* bottom margin is equal to footer height */
    margin: 0 0 80px 0;
    padding: 0 0 40px 0;
    height: 100%;
}

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 80px;
}

h1, h2, h3, h4, h5, h6 { color: #51c0d4; }
h1 { font-size: 1.4em; }
h2 { font-size: 1.2em; }

html {
    position: relative;
    min-height: 100%;
}

hr { border-color: #51c0d4; }


.navbar-default .navbar-nav .active a, a.active {
    color: #51c0d4; 
    background: none; 
    box-shadow: none;
    font-weight: bold;
}

.bottom-border { border-bottom: 10px solid #51c0d4; }

.btn { border-radius: 0; }

.btn:hover, 
.btn:focus, 
.login-form input[type="submit"]:hover, 
.btn-custom:hover, 
.login-form input[type="submit"]:focus, 
.btn-custom:focus {
    color: white;
    background-color: #51c0d4;
}

.btn-success {
    background-color: #51c0d4;
    background-image: -moz-linear-gradient(top, #70d900, #51c0d4);
    background-image: -ms-linear-gradient(top, #70d900, #51c0d4);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#70d900), to(#51c0d4));
    background-image: -webkit-linear-gradient(top, #70d900, #51c0d4);
    background-image: -o-linear-gradient(top, #70d900, #51c0d4);
    background-image: linear-gradient(top, #70d900, #51c0d4);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#70d900', endColorstr='#51c0d4', GradientType=0);
}

.btn-success:hover,
.btn-success:active,
.btn-success.active,
.btn-success.disabled,
.btn-success[disabled] {
    background-color: #51c0d4;
}

.btn-success:active, .btn-success.active {
    background-color: #51c0d4;
}

a.brand { color: #51c0d4; }
a.brand:hover { color: #51c0d4; }

.clear { clear: both; }

div.left-menu { width: 175px; float: left; }
div.main-panel { margin-left: 20px; }

.divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #d5d5d5;
}

.dropdown-header {
    font-size: 14px;
}

/* make sidebar nav vertical */ 
@media (min-width: 768px) {
    .sidebar-nav .navbar .navbar-collapse {
        padding: 0;
        max-height: none;
    }
    .sidebar-nav .navbar ul {
        float: none;
    }
    .sidebar-nav .navbar ul:not(.dropdown-menu) {
        display: block;
    }
    .sidebar-nav .navbar li {
        float: none;
        display: block;
    }
    .sidebar-nav .navbar li a {
        padding-top: 6px;
        padding-bottom: 6px;
    }
}
@media(min-width:1600px){
    .container { width: 1570px }
}

.header { 
    border-bottom: 10px solid #51c0d4; 
    margin-bottom: 20px;
    padding: 5px;
}
.header-title { float: right; }

.jumbotron h1, .jumbotron .h1 { color: #51c0d4; }

.list-group-item, .list-group-item:first-child, .list-group-item-heading {
    border-radius: 0;
    border: none;
    padding: 6px 0 6px 33px;
    background: transparent;
}

.list-group-item-heading { color: #333333; }

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    font-weight: bold;
}

.navbar {
    margin-bottom: 0;
    padding: 10px 0;
    border: none;
}

.navbar-default .navbar-nav .active a, 
.navbar-default .navbar-nav .active a:hover,
.navbar-default .navbar-nav .active a:focus,
.navbar-default .navbar-nav li a,
.navbar-default .navbar-nav li a:hover, 
.navbar-default .navbar-nav li a:focus {
    color: #51c0d4;
    background: none;
}

.navbar-default .navbar-nav .active a:hover,
.navbar-default .navbar-nav a:hover {
    text-decoration: underline;
}

.navbar-header h1 { font-size: 1em; }

.panel-title { 
    color: #51c0d4;
    font-size: 1.4em;
}

.panel-header {
    background-image: linear-gradient(to bottom, #FCFCFC 0%, #F9F9F9 100%);
    background-repeat: repeat-x;
}
.panel-body { background-color: #F8F8F8; }


/* Login classes. The login form's outer div has the class "login-form" to localize the styles. */
.login-form input
{
    box-sizing: border-box;
    margin-left: 5px;
    padding: 5px;
    width: 180px;
}

.login-form input[type="submit"], .btn-custom 
{
    width: 150px;
    height: 32px;
    background-color: #51c0d4;
    border: 0;
    font-weight: 700;
    color: #FFF;
    font-size: 13px;
    margin: 0 30px 0 0;
}

.login-form fieldset { width: 260px; text-align: right; margin: 0 auto; }

.login-form label { display: block; }

.message {
    font-size: 14px;
    margin: 5px;
    color: red;
}

.vertical-center {
    min-height: 75%;  /* Fallback for browsers do NOT support vh unit */
    min-height: 75vh; /* These two lines are counted as one :-)       */
    display: flex;
    align-items: center;
}

.login-panel {
    width: 450px;
    margin: 0 auto;
    display: block;
}
/* End Login Classes */

/* Table styles */
table.table thead tr { background-color: #BCBCBC; }
table.table thead th { border-bottom: none; }
table.table tr.transaction-header { background-color: #51c0d4; }
table.table td.nowrap { white-space: nowrap; }

/* Documentation */
.documentation.row .table { 
    background-color: #FFF; 
    font-family: "Arial Regular","Arial";
    font-size: 13px;
}

.documentation.row .table thead tr {
    background-color: #FFF; 
    color: #FFF;
}

.documentation.row .table thead tr th {
    background-color: #51c0d4;
    padding: 1px;
    font-weight: 100 !important;
}

.documentation.row .table tbody tr th {
    padding: 1px;
}

.documentation.row .table tbody tr td {
    padding: 1px;
}

.documentation.row .apiTitle {
    font-family: 'Arial Regular', 'Arial';
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
    color: #51c0d4;
    margin: 5px 0 7px 0;
}

.documentation.row .apiInfo {
    color: #51c0d4;
    font-family: "Arial Regular","Arial";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    margin: 10px 0 10px 0;
}
.documentation.row .apiText {
    color: #00;
    font-family: "Arial Regular","Arial";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    margin: 10px 0 10px 0;
}

.documentation.row .table-nonfluid {
   width: auto !important;
}

.documentation.row .panel:not(:first-child) .panel-body {
    margin-top: 18px;
}

.logs-tr {
    cursor: pointer;
}

.logs-details {
    background-color:#e7e7e7;
    display:none;
}

.error-span {
    color : red;
}