//background colors
@bg-base: #273238;
@bg-lightbase: #36474f;
@bg-transparent: none;
//colors
@white: #ffffff;
@black: #000000;
@grey: #ccc;
@red: #ff0000;
@orange: #f57c23;
@blue: #2196F3;
//fonts size
@fs12: 12px;
@fs14: 14px;
@fs15: 15px;
@fs16: 16px;
@fs17: 17px;
@fs18: 18px;
@fs20: 20px;
@fs30: 30px;
@fs40: 40px;
@fs45: 45px;
@fs50: 50px;

//position
@pos-abs: absolute;

//media queries
@xs-min: 320px;
@sm-min: 768px;
@md-min: 992px;
@lg-min: 1200px;

.round-borders (@radius) {
  border-radius: @radius;
  -moz-border-radius: @radius;
  -webkit-border-radius: @radius;
}

.border (@border){
	border: solid 1px @border;
}

//margin mixins
.margin(@TB, @LR){
	margin: @TB @LR;
}
.margin(@T, @LR, @B){
	margin: @T @LR @B;
}
.margin(@T, @R, @B, @L){
	margin: @T @LR @B;
}
.margin(@all){
	margin: @all;
}


//padding mixins
.padding(@TB, @LR){
	padding: @TB @LR;
}
.padding(@T, @LR, @B){
	padding: @T @LR @B;
}
.padding(@T, @R, @B, @L){
	padding: @T @LR @B;
}
.padding(@all){
	padding: @all;
}


body.login-container.login-bg {
	background: @bg-base;
	.navbar{
		ul.nav.navbar-nav{
			float: left;
		}
		.navbar-collapse.collapse{
			ul.nav.navbar-nav{
				.dropdown{
					.dropdown-menu{
    					top: 95%;
						right: 7px;
						.padding(0);
						background: @bg-base;
						.round-borders(0);
						li{
							a{
								color:@white;
								&:hover, &:focus{
									color:@white;
							    	background-color: @blue;
						    		border-color: @blue;
								}
							}
						}
					}
					.login-top-btn{
						background: @bg-transparent;
						.border(@white);
						.margin(10px,7px,0);
						.padding(2px,10px);
						.round-borders(0);
						&:hover, &:focus{
							color:@white;
					    	background-color: @blue;
				    		border-color: @blue;
						}
					}
				}
			}
		}
		@media (min-width:@xs-min) {
			.collapse#navbar-mobile{
				display: block;
			}
		}
	}
	.login-form {
		background: @bg-base;
		border: none;
		.panther-text{
			color:@orange;
			font-size: @fs16;
		    display: block;
		    position: @pos-abs;
		    right: 40px;
		    top: 6px;
		    z-index: 9;
			/*span.circle-icn{
			    color: @white;
			    text-align: center;
			    font-style: normal;
				background: @red;
			    padding: 5px 9px;
			    margin-left: 8px;
			    .round-borders(50%);
			}*/
		}
		img.login-logo{
			width: 100%;
		}
		.content-group{
			font-size: @fs40;
			color: @white;
		}
		.btn-signin{
			margin-left: 10px;
			background: transparent;
			border: 1px solid @white;
		    .round-borders(0);
		    &:hover{
		    	background-color: @blue;
	    		border-color: @blue;
		    }
		}
		.form-group{
			input.form-control{
			    .round-borders(0);
			}
			label{
				color:@white;
				font-size: @fs14;
				font-weight: normal;
			}
			.form-control-feedback{
				top: 27px;
			}
			a{
				color: @white;
			}
		}
	}
}

body.pace-done{
	.navbar.header-highlight{
		.navbar-header{
			background: #2e3a40;
			a.navbar-brand{
			    width: 100%;
				height: auto;
				.padding(0px);
			    text-align: center;
			    img{
			    	height: auto;
			    	.margin(-2px,0,0);
			    	display: inline;
			    }
			}
		}		
	}
}