// Buttons

@import "colors.less";

// Sizes -------------------------------------------------------------------------------------------
.btn {
	display: inline-block;
	padding: 4px 12px;
	margin-bottom: 0;
	margin-left: 5px;
	margin-right: 5px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	color: #333333;
	background-color: transparent;
	border: 2px solid @black;
	border-bottom-color: @black;
	border-radius: 4px;
	text-shadow: none;
	/* Create Mission: */
	font-family: Avenir-Book;
	font-style: normal;
	color: #333333;
	text-transform: none;
}

.btn-small {
	font-size: 11px;
	font-weight: 300;
}

.btn-large {
     font-family: Avenir-Black;
     font-size: 21px;
     color: #333333;
     line-height: 20px;
     padding: 7px 15px 5px 15px;
}

.btn-huge {
  font-family: Avenir-Black;
  font-size: 36px;
  color: #333333;
  line-height: 40px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 15px;
  padding-bottom: 10px;
  width: 280px;
  text-transform: uppercase;
  margin-top: 10px;
  margin-bottom: 10px;
}

.btn:hover {
	background: rgba(0, 0, 0, 0.2);
}

.btn-link {
	border: none;
}

.btn-link:hover {
	border: none;
	background-color: transparent;
}

// Colors

.btn.btn-primary {
	color: @blue;
	border-color: @blue;
}
.btn.btn-primary:hover { background-color: fade(@blue, 25%); }
.btn.btn-link.btn-primary:hover { background-color: transparent; text-decoration: underline; }

.btn.btn-success {
	color: @green;
	border-color: @green;
}
.btn.btn-success:hover { background-color: fade(@green, 25%); }
.btn.btn-link.btn-success:hover { background-color: transparent; text-decoration: underline; }

.btn.btn-danger {
	color: @red;
	border-color: @red;
}
.btn.btn-danger:hover { background-color: fade(@red, 25%); }
.btn.btn-link.btn-danger:hover { background-color: transparent; text-decoration: underline; }

.btn.btn-alert {
	color: @yellow;
	border-color: @yellow;
}
.btn.btn-alert:hover { background-color: fade(@yellow, 25%); }
.btn.btn-link.btn-alert:hover { background-color: transparent; text-decoration: underline; }


// btn inverse -------------------------------------------------------------------------------------------

// a btn inverse
.btn.inverse { border-color: @white; color: @white;}
.btn.inverse:hover { background-color: @white; color: @black;}
.btn.btn-primary.inverse { border-color: @blue; color: @blue;}
.btn.btn-primary.inverse:hover { background-color: @blue; color: @black;}
.btn.btn-success.inverse { border-color: @green; color: @green;}
.btn.btn-success.inverse:hover { background-color: @green; color: @black;}
.btn.btn-danger.inverse { border-color: @red; color: @red;}
.btn.btn-danger.inverse:hover { background-color: @red; color: @black;}
.btn.btn-alert.inverse:hover { background-color: @yellow; color: @black;}
.btn.btn-alert.inverse { border-color: @yellow; color: @yellow;}

// button inverse
button.btn.inverse, input[type="submit"].btn.inverse {
	border: 2px solid @white;
	color: @white;
}

// button inverse hover
button.btn.inverse:hover, input[type="submit"].btn.inverse:hover {
	background-color: @white;
	border: 2px solid @light-gray;
	color: @black;
}

// button inverse primary
button.btn.btn-primary.inverse, input[type="submit"].btn.btn-primary.inverse {
	color: @blue;
	border: 2px solid @blue;
}

// button inverse primary hover
button.btn.btn-primary.inverse:hover, input[type="submit"].btn.btn-primary.inverse:hover {
	background-color: @blue;
	color: @black;
	border: 2px solid @blue;
}

// button inverse sucess
button.btn.btn-success.inverse, input[type="submit"].btn.btn-success.inverse {
	color: @green;
	border: 2px solid @green;
}

// button inverse sucess hover
button.btn.btn-success.inverse:hover, input[type="submit"].btn.btn-success.inverse:hover {
	background-color: @green;
	color: @black;
	border: 2px solid @green;
}

// button inverse danger
button.btn.btn-danger.inverse, input[type="submit"].btn.btn-danger.inverse {
	color: @red;
	border: 2px solid @red;
}

// button inverse danger hover
button.btn.btn-danger.inverse:hover, input[type="submit"].btn.btn-danger.inverse:hover {
	background-color: @red;
	color: @black;
	border: 2px solid @red;
}

// button inverse alert
button.btn.btn-alert.inverse, input[type="submit"].btn.btn-alert.inverse {
	color: @yellow;
	border: 2px solid @yellow;
}

// button inverse alert hover
button.btn.btn-alert.inverse:hover, input[type="submit"].btn.btn-alert.inverse:hover {
	background-color: @yellow;
	color: @black;
	border: 2px solid @yellow;
}

// btn link inverse
a.btn.btn-link.inverse {
	color: @white;
}

// btn link inverse hover
a.btn.btn-link.inverse:hover {
	color: @white;
	text-decoration: underline;
	border: none;
	background-color: transparent;
}


.validation_dropdown a {
	color: @black;
}
.validation_dropdown .dropdown-toggle .caret {
	margin-top: 8px;
	border-top-color: @black;
	border-bottom-color: @black;
}

.nav.btn a:hover { background: rgba(0, 0, 0, 0); }
.nav.btn a:visited { background: rgba(0, 0, 0, 0); }

// Hacks -------------------------------------------------------------------------------------------

// Accordion with dropdown menu fix
.overflow { overflow:visible; }

.in.collapse { 
	overflow:visible;
}

.collapse.in:hover { overflow:visible; }