/*
~   Copyright (c) 2018 WSO2 Inc. (http://wso2.com) All Rights Reserved.
~
~   Licensed under the Apache License, Version 2.0 (the "License");
~   you may not use this file except in compliance with the License.
~   You may obtain a copy of the License at
~
~        http://www.apache.org/licenses/LICENSE-2.0
~
~   Unless required by applicable law or agreed to in writing, software
~   distributed under the License is distributed on an "AS IS" BASIS,
~   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~   See the License for the specific language governing permissions and
~   limitations under the License.
*/

html {
  font-size: 16px;
}

.main {
  margin: 1rem;
}

.card {
  width: 64rem;
}

html,
body {
    width: 100%;
    height: 100%;
}
#app div{
    height:100%
}

/* Custom Button Styles */

.btn-dark {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.4);
}
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    opacity: 0.85;
    color: #fff;
}
/* Custom Horizontal Rule */

hr.small {
    max-width: 100px;
}
.custom-hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #025678;
    margin: 1em;
}
.toggle {
    margin: 5px 5px 0 0;
}
/* About */

.about {
    background: #eee;
}
/* create, view */

.create,
.view {
    padding: 20px 0;
}
/* Footer */

footer {
    padding-top: 20px;
}
/* Allocations */

#allocations a {
    color: #fff;
    text-decoration: none;
}
#allocations a:hover {
    color: #eee;
    text-decoration: none;
}
.tab-nav .active:after {
    content: " ";
    position: absolute;
    left: 46%;
    opacity: 1;
    margin: 0 auto;
    bottom: -20px;
    border: 10px solid transparent;
    border-top-color: #EDB500;
}
.tab-nav li:after {
    content: " ";
    position: absolute;
    left: 46%;
    opacity: 0;
    margin: 0 auto;
    bottom: 0;
    border: 5px solid transparent;
    border-bottom-color: #EDB500;
    transition: 0.1s ease-in-out;
}
/*    --------------------------------------------------
	:: Login Section
	-------------------------------------------------- */

#login {
    padding-top: 50px
}
#login .form-wrap {
    margin: 0 auto;
    background: #f7f7f7;
    padding: 20px;
}
#login .form-wrap-header {
    margin: 0 auto;
    background: #e4e4e4;
    padding: 20px;
    margin-top: 30%
}
#login h1 {
    color: #025678;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
    padding-bottom: 20px;
}
#login .form-group {
    margin-bottom: 25px;
}
#login .btn.btn-custom {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 20px;
    border-radius: 0;
}
#login .forget {
    font-size: 13px;
    text-align: center;
    display: block;
}
.login-footer .text-muted {
    color: #eee;
}
.btn-login {
    margin-top: 10px;
    font-size: 16px;
}
/*    --------------------------------------------------
	:: Inputs & Buttons
	-------------------------------------------------- */

.form-control {
    color: #212121;
}
.btn-custom {
    color: #fff;
}
.btn-custom:hover,
.btn-custom:focus {
    color: #fff;
}
/*    --------------------------------------------------
    :: Footer
	-------------------------------------------------- */

#footer {
    color: #6d6d6d;
    font-size: 12px;
    text-align: center;
}
#footer p {
    margin-top: 10px;
}
#footer a {
    color: inherit;
}
/*    --------------------------------------------------
    :: Swift
	-------------------------------------------------- */
/*  custom tab */

div.custom-tab-container {
    z-index: 10;
    background-color: #fff;
    padding: 0 !important;
    border-radius: 4px;
    -moz-border-radius: 4px;
    border: 1px solid #ddd;
    -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background-clip: padding-box;
    opacity: 0.97;
    filter: alpha(opacity=97);
    margin-top: 40px;
}
div.custom-tab-menu {
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
}
div.custom-tab-menu div.list-group {
    margin-bottom: 0;
}
div.custom-tab-menu div.list-group>a {
    margin-bottom: 0;
}
div.custom-tab-menu div.list-group>a .fa {
    color: #598292;
}
div.custom-tab-menu div.list-group>a:first-child {
    border-top-right-radius: 0;
    -moz-border-top-right-radius: 0;
}
div.custom-tab-menu div.list-group>a:last-child {
    border-bottom-right-radius: 0;
    -moz-border-bottom-right-radius: 0;
}
div.custom-tab-menu div.list-group>a.active,
div.custom-tab-menu div.list-group>a.active .fa {
    background-color: #598292;
    color: #ffffff;
}
div.custom-tab-menu div.list-group>a.active:after {
    content: '';
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -13px;
    border-left: 0;
    border-bottom: 13px solid transparent;
    border-top: 13px solid transparent;
    border-left: 10px solid #598292;
}
div.custom-tab-content {
    background-color: #fff;
    padding-left: 20px;
    padding-top: 10px;
}
div.custom-tab div.custom-tab-content:not(.active) {
    display: none;
}
div.custom-tab-menu .list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
    border-color: #598292;
}
.navbar-custom-swift {
    margin-bottom: 0;
    border-radius: 0;
    border-bottom: 4px solid #025678;
}
.navbar-custom-swift .navbar-nav>li>a {
    color: #fff;
    font-weight: 500;
}
.custom-primary-swift {
    background: #025678;
}
.hero-widget {
    color: #7b7b7b;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}
.hero-widget .icon {
    display: block;
    font-size: 30px;
    text-align: center;
}
.hero-widget var {
    display: block;
    font-size: 30px;
    line-height: 64px;
    font-style: normal;
    color: #5e8595;
}
.hero-widget label {
    font-size: 17px;
}
.hero-widget .options {
    margin-top: 10px;
}
.swift .well {
    background-color: #fff;
}
/*    --------------------------------------------------
    :: Dispatch
	-------------------------------------------------- */

.active .service-item {
    border-bottom: 2px solid #EDB500;
}
.navbar-custom {
    margin-bottom: 0;
    border-radius: 0;
    border-bottom: 4px solid #EDB500;
}
.navbar-custom .navbar-nav>li>a {
    color: #fff;
    font-weight: 500;
}
.text-link {
    color: #fff;
}
/*    --------------------------------------------------
    :: Common styling
	-------------------------------------------------- */

#to-top {
    display: none;
    position: fixed;
    bottom: 5px;
    right: 5px;
}
.img-circle {
    border-radius: 50%;
}
.tile-container {
    transform: translateY(50%);
}
.lead {
    font-size: 16px !important;
}
.pickup-primary-bg {
    background: #025678;
}
.pickup-primary-color {
    color: #025678;
}
.custom-primary {
    background: #EDB500;
}
.custom-primary-color {
    color: #EDB500!important;
}
.text-secondary {
    top: 30%;
}
.user-name a {
    font-size: 18px;
}
.text-gray {
    color: #666;
}
.circle {
    color: #555;
}
.add-padding-bottom-1x {
    padding-bottom: 5px;
}
.add-padding-bottom-3x {
    padding-bottom: 15px;
}
.add-margin-top-4x {
    margin-top: 20px;
}
.navbar-custom .navbar-brand>img,
.navbar-custom-swift .navbar-brand>img {
    display: inline-block;
}
.wso2-logo-link:hover {
    text-decoration: none;
}
.wso2-logo-link .fw-wso2 {
    vertical-align: middle;
}
.app-title {
    color: #666;
    font-size: 32px;
    text-align: center;
    font-weight: bold;
    margin-top: -10px;
}
.login-dispatch {
    background: #444;
}
.login-swift {
    background: #003e56;
}
.pickup-logo, .user-icon{
    height: 30px;
}
.user-icon{
    height: 30px;
    width: 30px;
}
.wso2-logo{
    height: 35px;
}
.pickup-logo-login{
    height: 55px;
}
