/******************************************************************************
 * SECT 1.  BASE RULES
 *****************************************************************************/
 
html {
    position: relative;
    min-height: 100%;
    height:100%; 
    font-family: 'Droid Sans',sans-serif;
}
body{
    background:#f3f5fa;
    color:#000;
    font-family: Arial, Verdana, sans-serif;
    font-size: 14px;
    margin-bottom: 9em;
    height:100%;
}

input, select, textarea, button, keygen, isindex, legend, a{
    font-size:1em;
}
a{
	text-decoration: underline;
}
.h1, h1 {
    font-size:3em;
    font-family: Hind,sans-serif;
}
.h2, h2 {
    font-size:1.5em;
    font-family: Hind,sans-serif;
    color:#bde0fb;
}
.h3, h3 {
    font-size:1.17em;
}
label{
	   font-family: 'Hind';
}
label .label-note{
    font-weight:normal;
    font-style:italic;
 
}



/******************************************************************************
 * SECT 2. FACES AND BOOTSTRAP OVERRIDE
 *****************************************************************************/
 .input-lg{
 	font-size:1em;
 }

.btn-primary{
    padding: 20px 40px;
    border-radius:30px;
    -moz-border-radius:30px;
    -webkit-border-radius:30px;
   	background:#1ea5f8;
   	border:0px;
   	width:80%;
   	margin: 15px 0px;
   	transition:all .3s ease-out;
}
.btn-primary:hover{
	background:#0682c3;
}


/******************************************************************************
 * SECT 3.  UTILITY COMPONENTS
 *****************************************************************************/
 
ul.messages{
    list-style-type:none;
    padding:10px;
    background:#fff;
    border:1px solid #e7e9f0;   
}
ul.messages .info:before {
   font-family: FontAwesome;
   content: " \f05a";
   margin-right:10px;
}


/* Login */
.login-body{
	background:#0682C3;
}
.login-container{
	padding: 30px 30px 0px 30px;
	margin:40px 15px;
}
.login-container img{
	max-width:100%;
}
.login-logo{
	padding-top:20px;
	padding-bottom:20px;
	text-align:center;
	margin-bottom:10px;
}
.login-links{
	list-style-type:none;
	padding:0px;
    text-align: center;
}
.login-links li{
	display:inline-block;
	border-right:1px solid #e7e9f0;
	font-size:.8em;
}
.login-links li:first-child{
    padding-right:15px;
}

.login-links li:last-child{
	border-right:0px;
	padding-left:10px;
}
.login-submit .btn-default{
	width:80%;
	text-align:center;
}
.login-container .button-panel{
	text-align:center;
}
#loginRight{
	padding-top:44px;
}

.btn:hover .rotate, .open .btn .rotate {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=9);
}
.home-button{
	padding:20px;
	background:#efefef;
	text-align:center;
	width:100%;
	text-decoration:none;
	transition: all .3s;
	display:block;
	margin-top:30px;
}
.home-button:hover{
	color:#fff;
	background:#1ea5f8; 
	text-decoration:none;
}

.login-body #left{
	width:90%;
	background:#fff;
	position:relative;
	margin:auto;
}

.login-body #right{
	display:none;
	position:relative;
}
.no-flexbox .login-body #left{
	margin:auto;
}
.no-flexbox .login-body #right{
	display:none;
}
.store-img{
	margin-top:40px;
}
#acc-banner{
	background:#F6F9FB;
	position:relative;
	padding-right:20px;
	display:none;
}
#acc-banner p{
	margin:5px 0px;
	font-size:.91em;
	text-align:center;
	font-family: 'Droid Sans',sans-serif;
	line-height:1.7em;
	color: #3b3d40;
}
#acc-banner p a{
	text-decoration: underline;
}
#acc-banner #acc-close{
	position:absolute;
	top:5px; 
	right:0px;
	left:auto;
	display:none;
}
.description-toggle {
     border-radius: 50%;
     transform: rotate(45deg);
     font-weight:normal;
     z-index: 10;
     background: #01b8f4;
     color: #fff;
     height: 20px;
     width: 20px;
     display: inline-block;
     text-align: center;
     margin-right: 10px;
     position: absolute;
     cursor: pointer;
     transition: all .3s;
     left:20px;
     top:21px;
     line-height: 20px;
     font-size: 15px;
     font-family: "Droid sans";
     position:absolute;
     left:15px;
}
 .description-toggle:hover{
     background:#077CB6
}
.copy{
	position:absolute;
	padding: 1rem;
	background: #0682C3;
	left:0;
	right:0;
	text-align:center;
	color: #fff;
}
.copy a{
	color:#fff;
	text-decoration:underline;
}

/******************************************************************************
 * SECT 5. TOOLTIPS
 *****************************************************************************/
[data-tooltip] {
    display: inline-block;
    position: relative;
    cursor: help;
}
/* Tooltip styling */
[data-tooltip]:before {
    content: attr(data-tooltip);
    display: none;
    position: absolute;
    background: #486776;
    color: #fff;
    padding: 4px 8px;
    font-size: 12px;
    text-transform:none;
    line-height: 1.4;
    min-width: 120px;
    text-align: center;
    border-radius: 4px;
}
/* Dynamic horizontal centering */
[data-tooltip-position="top"]:before,
[data-tooltip-position="bottom"]:before {
    left: 50%;
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
/* Dynamic vertical centering */
[data-tooltip-position="right"]:before,
[data-tooltip-position="left"]:before {
    top: 50%;
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
[data-tooltip-position="top"]:before {
    bottom: 120%;
    margin-bottom: 6px;
}
[data-tooltip-position="right"]:before {
    left: 100%;
    margin-left: 6px;
}
[data-tooltip-position="bottom"]:before {
    top: 100%;
    margin-top: 6px;
}
[data-tooltip-position="left"]:before {
    right: 100%;
    margin-right: 6px;
}

/* Tooltip arrow styling/placement */
[data-tooltip]:after {
    content: '';
    display: none;
    opacity:0;
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
/* Dynamic horizontal centering for the tooltip */
[data-tooltip-position="top"]:after,
[data-tooltip-position="bottom"]:after {
    left: 50%;
    margin-left: -6px;
}
/* Dynamic vertical centering for the tooltip */
[data-tooltip-position="right"]:after,
[data-tooltip-position="left"]:after {
    top: 50%;
    margin-top: -6px;
}
[data-tooltip-position="top"]:after {
    bottom: 120%;
    border-width: 6px 6px 0;
    border-top-color: #486776;
}
[data-tooltip-position="right"]:after {
    left: 100%;
    border-width: 6px 6px 6px 0;
    border-right-color: #486776;
}
[data-tooltip-position="bottom"]:after {
    top: 100%;
    border-width: 0 6px 6px;
    border-bottom-color: #486776;
}
[data-tooltip-position="left"]:after {
    right: 100%;
    border-width: 6px 0 6px 6px;
    border-left-color: #486776;
}
/* Show the tooltip when hovering */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
    display: block;
    opacity:1;
    transition:all 1s;
    z-index: 50;
}



/******************************************************************************
 * SECT 6. MEDIA QUERIES
 *****************************************************************************/
 
    @media only screen and (min-width : 320px) {
      
        
    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {
        
		
    }

	
    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {
        #menuContainer {
            padding:0px;
        }
        .table-title p{
            overflow: hidden;
            white-space: nowrap;
            max-width:100%;
        }
       	.login-container{
       		margin:0px;
       	}
        .login-body{
        	width: 100%;
        	height: 100%;
        	margin: 0;
        	background:#0682c3;
        }
        .login-body #page{
			display: -webkit-box;
		    display: -ms-flexbox;
		    display: flex;
		    flex-direction:row;
		    width:100%;
		    height:100%;
		     min-height: 100%;
		    flex-wrap: nowrap;
		    align-items: stretch;
		    
		}
		.login-body #left, .login-body #right{
			display: flex;
			flex-direction: row;
    		justify-content: center;
    		padding:20px 20px 0px 20px;
    		margin:0;
		}
		.login-body #left{
			width:350px;
			background:#fff;
			max-width: 450px;
			
		}
		
		.login-body #right{
			display:block;
			color:#fff;
			text-align:center;
			flex-grow: 1;
			
		}
		.login-body .panel-wrap{
			display: -webkit-box;
		    display: -ms-flexbox;
		    display: flex;
		    flex-direction:column;
		    width:100%;
		    height:100%;
		    min-height: 100%;
		    align-content: center;
		    position: absolute;
			bottom: 0px;
			top: 0px;
		    
		}
		.return{
			display:flex;
			margin-top: auto;
			margin-bottom:15px;
			margin-left: 10px;
			margin-right: 10px;
		}
    }
    @media only screen and (min-width : 990px) {
		.login-body #left{
			width:450px;
		}
	}
    @media (max-width: 767px){
        .navbar-nav>li>.dropdown-menu{
            position: static !important;
            float: none;
            width: auto;
            display:block;
            margin-top: 0;
            background-color: #fff;
            border-radius:0px;
        }
        .navbar-default .navbar-nav>li>a.dropdown-toggle:focus, .navbar-default .navbar-nav>li>a.dropdown-toggle:hover{
            background:#077CB6;
            color:#fff;
        }
    }
    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {
        
    }

    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {

    }