/* Edit $vision_home/public/css/btns.css */

.btn { text-decoration: none !important; }

.btn-lg {
	font-size: 125% !important;
}

.btn-jumbo { 
	font-size: 200% !important;
}

.btn-giant {
	font-size: 300%;
}

.btn-center {
  display: table;
  text-align: center;
  margin: 0px auto 0px auto;
  width: auto !important;
}

.btn-block {
  text-align: center;
  margin: 0 auto;
  width: 90%;
}

button {
	outline: none !important;
}

.buttonset {
  margin: 0px .5em !important;
}

/* TRANSPARENT, BLACK TEXT  ******************************* */
.btn-black-text {
	float: left;
	width: 60px;
  border: 1px solid transparent;
  color: #000;
  background: transparent;
	margin-left: 0px; 
	margin-right: 10px; /* why? */
}

.btn-black-text:hover,
.btn-black-text:focus,
.btn-black-text:active,
.btn-black-text.active,
.open .dropdown-toggle.btn-black-text {
  color: black;
  background: transparent;
	cursor: pointer;
}

/* TRANSPARENT, WHITE TEXT  ******************************* */
.btn-white-text {
	width: 60px;
	float: left;
  border: 1px solid transparent;
  color: #fff;
  background: transparent;
	margin-left: 0px; 
	margin-right: 10px; /* why? */
}

.btn-white-text:hover,
.btn-white-text:focus,
.btn-white-text:active,
.btn-white-text.active,
.open .dropdown-toggle.btn-white-text {
  color: fff;
  background: transparent;
	cursor: pointer;
}

/* TRANSPARENT, WHITE TEXT, WHITE BORDER  ******************************* */
.btn-transparent-white {
  border: 1px solid white !important;
  color: white !important;
  background: transparent !important;
	margin-left: 0px; 
	margin-right: 10px; /* why? */
}

.btn-transparent-white:hover,
.btn-transparent-white:focus,
.btn-transparent-white:active,
.btn-transparent-white.active,
.open .dropdown-toggle.btn-transparent-white {
  color: black !important;
  background: white !important;
}

/* NAVBAR ************************************************************** */

.btn-navbar-transparent-white { 
	margin-left: 5px; 
	margin-right: 5px; 
} /* built into navbar */

.btn-search { margin-left: 5px; margin-right: 5px; } /* built into navbar */

/* TRANSPARENT, BLACK TEXT, BLACK BORDER  ******************************* */
.btn-transparent-black {
  border: 1px solid black !important;
  color: black !important;
  background: transparent !important;
}

.btn-transparent-black:hover,
.btn-transparent-black:focus,
.btn-transparent-black:active,
.btn-transparent-black.active,
.open .dropdown-toggle.btn-transparent-black {
  color: white !important;
  background: black !important;
}

/* TRANSPARENT, MAROON TEXT, MAROON BORDER  ******************************* */
.btn-transparent-maroon {
  border: 1px solid maroon !important;
  color: maroon !important;
  background: transparent !important;
}

.btn-transparent-maroon:hover,
.btn-transparent-maroon:focus,
.btn-transparent-maroon:active,
.btn-transparent-maroon.active,
.open .dropdown-toggle.btn-transparent-maroon {
  color: white !important;
  background: maroon !important;
}

.btn-maroon {
  border: 1px solid maroon !important;
  color: white !important;
  background: maroon !important;
}

.btn-maroon:hover,
.btn-maroon:focus,
.btn-maroon:active,
.btn-maroon.active,
.open .dropdown-toggle.btn-maroon {
  color: white !important;
  background: black !important;
}

/* BLACK, WHITE TEXT, WHITE BORDER  ******************************* */
.btn-black-white {
  color: white !important;
  background: black !important;
  border: 1px solid black !important;
  border-radius: 3px !important;
  -moz-border-radius: 3px !important;
  -webkit-border-radius: 3px !important;
}

.btn-black-white:hover,
.btn-black-white:focus,
.btn-black-white:active,
.btn-black-white.active,
.open .dropdown-toggle.btn-black-white {
  border: 1px solid black !important;
  color: black !important;
  background: white !important;
}

/* WHITE, BLACK TEXT, BLACK BORDER  ******************************* */
.btn-white-black {
  border: 1px solid black !important;
  color: black !important;
  background: white !important;
}

.btn-white-black:hover,
.btn-white-black:focus,
.btn-white-black:active,
.btn-white-black.active,
.open .dropdown-toggle.btn-white-black {
  border: 1px solid white !important;
  color: white !important;
  background: black !important;
}

/* RED, WHITE TEXT, WHITE BORDER  ******************************* */
.btn-red-white {
  border: 1px solid red !important;
  color: white !important;
  background: red !important;
}

.btn-red-white:hover,
.btn-red-white:focus,
.btn-red-white:active,
.btn-red-white.active,
.open .dropdown-toggle.btn-red-white {
  border: 1px solid red !important;
  color: red !important;
  background: white !important;
}

.btn-transparent-red {
  border: 1px solid red !important;
  color: red !important;
  background: transparent !important;
}

.btn-transparent-red:hover,
.btn-transparent-red:focus,
.btn-transparent-red:active,
.btn-transparent-red.active,
.open .dropdown-toggle.btn-red-white {
  border: 1px solid white !important;
  color: white !important;
  background: red !important;
}

/* TEAL, WHITE TEXT, WHITE BORDER  ******************************* */
.btn-teal-white {
  border: 1px solid white !important;
  color: white !important;
  background: teal !important;
}

.btn-teal-white:hover,
.btn-teal-white:focus,
.btn-teal-white:active,
.btn-teal-white.active,
.open .dropdown-toggle.btn-teal-white {
  border: 1px solid teal !important;
  color: teal !important;
  background: white !important;
}

.btn-white-teal {
  border: 1px solid teal !important;
  color: teal !important;
  background: white !important;
}

.btn-white-teal:hover,
.btn-white-teal:focus,
.btn-white-teal:active,
.btn-white-teal.active,
.open .dropdown-toggle.btn-teal-white {
  border: 1px solid white !important;
  color: white !important;
  background: teal !important;
}

.btn-transparent-teal {
  border: 1px solid teal !important;
  color: teal !important;
  background: tranparent !important;
}

.btn-transparent-teal:hover,
.btn-transparent-teal:focus,
.btn-transparent-teal:active,
.btn-transparent-teal.active,
.open .dropdown-toggle.btn-transparent-white {
  border: 1px solid white !important;
  color: white !important;
  background: teal !important;
}

/* GREEN, WHITE TEXT, WHITE BORDER  ******************************* */
.btn-green {
  border: 1px solid green !important;
  color: white !important;
  background: green !important;
}

.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green.active,
.open .dropdown-toggle.btn-green {
  border: 1px solid green !important;
  color: white !important;
  background: darkgreen !important;
}

.btn-green-2 {
 	border: 0px solid #555;
 	color: white !important;
 	background: green;
 	margin-right: 10px;
}

.btn-green-2:hover, .btn-green-2:active {
 	color: #fff;
 	background: darkgreen;
}

/* TRANSLUCENT, WHITE TEXT, WHITE BORER  ******************************* */
.btn-translucent-white {
  border: 1px solid white !important;
  color: white !important;
  background: rgba(0, 0, 0, .3) !important;
}

.btn-translucent-white:hover,
.btn-translucent-white:focus,
.btn-translucent-white:active,
.btn-translucent-white.active,
.open .dropdown-toggle.btn-translucent-white {
  color: black !important;
  background: white !important;
}

/* NAVBAR SEARCH BUTTON  ******************************* */
.btn-navbar {
  color: white !important;
  background: #222 !important;
	border: 1px solid rgba(255, 255, 255, 0.5);
}

.btn-navbar:hover,
.btn-navbar:focus,
.btn-navbar:active,
.btn-navbar.active,
.open .dropdown-toggle.btn-navbar {
	border: 1px solid rgba(255, 255, 255, 0.9);
  color: white !important;
  background: #333 !important;
}

.btn-neutral {
 	border: 0px solid #555;
 	color: white !important;
 	background: #555;
 	margin-right: 10px;
	border: 2px solid #555;
}

.btn-neutral:active,
.btn-neutral.active {
 	color: #fff !important;
 	background: #000 !important;
	border: 2px solid #000 !important;
}

.btn-neutral.hover,
.btn-neutral:hover {
	background: #222 !important;
	border: 2px solid #222 !important;
}

.btn-indigo {
 	border: 0px solid #555;
 	color: white !important;
 	background: indigo;
 	margin-right: 10px;
}

.btn-indigo:hover, .btn-indigo:active {
 	color: #fff;
 	background: #4b004f;
 	background: #300153; 
}

.btn-red {
 	border: 0px solid #555;
 	color: white !important;
 	background: red;
 	margin-right: 10px;
}

.btn-red:hover, .btn-red:active {
 	color: #fff;
 	background: darkred;
}

.btn-darkorange {
 	border: 0px solid #555;
 	color: white !important;
 	background: darkorange;
 	margin-right: 10px;
}

.btn-darkorange:hover, .btn-darkorange:active {
 	color: #fff;
 	background: orangered;
}

.btn-teal {
 	border: 0px solid #555;
 	color: white !important;
 	background: teal;
 	margin-right: 10px;
}

.btn-teal:hover, .btn-teal:active {
 	color: #fff;
 	background: #006262;
}

.btn-teal-transparent {
 	border: 1px solid teal;
 	color: teal !important;
 	background: transparent;
 	margin-right: 10px;
}

.btn-teal-transparent:hover, .btn-teal-transparent:active {
 	color: #fff;
 	background: teal;
}

.btn-blue {
 	border: 0px solid #555;
	color: white !important;
 	background: blue;
 	margin-right: 10px;
}

.btn-blue:hover, .btn-blue:active {
 	color: #fff;
 	background: navy;
}

.btn-blue-white {
 	border: 1px solid blue;
	color: blue;
 	background: white;
 	margin-right: 10px;
}

.btn-blue-white:hover, .btn-blue-white:active {
 	color: white;
 	color: white !important;
 	background: blue;
 	border: 1px solid white;
}

.btn-blue-transparent {
 	border: 1px solid blue;
 	color: blue !important;
 	background: transparent;
 	margin-right: 10px;
}

.btn-blue-transparent:hover, .btn-blue-transparent:active {
 	color: white !important;
 	background: blue;
}

.btn-deeppink {
 	border: 0px solid #555;
 	color: white !important;
 	background: deeppink;
 	margin-right: 10px;
}

.btn-deeppink:hover, .btn-deeppink:active {
 	color: #fff;
 	background: #d10372;
}

/* See: https://www.color-meanings.com/shades-of-green-color-names-html-hex-rgb-codes/ */

.btn-pleasant-green,
.btn-jade-green {
 	border: 0px solid #00a86b;
 	color: white !important;
 	background: #00a86b;
 	margin-right: 10px;
}

.btn-pleasant-green:hover, .btn-pleasant-green:active,
.btn-jade-green:hover, .btn-jade-green:active {
 	color: #fff;
 	background: #00756b;
}

.btn-avocado-green {
 	border: 0px solid #00a86b;
 	color: white !important;
 	background: #568203;
 	margin-right: 10px;
}

.btn-avocado-green:hover, .btn-avocado-green:active {
 	color: #fff;
 	background: #4a6f04;
}

.btn-mycolor {
 	border: 0px solid #555;
 	color: white !important;
 	background: mycolor;
 	margin-right: 10px;
}

.btn-mycolor:hover, .btn-mycolor:active {
 	color: #fff;
 	background: mycolor_dark;
}

.btn-mycolor {
 	border: 0px solid #555;
 	color: white !important;
 	background: mycolor;
 	margin-right: 10px;
}

.btn-mycolor:hover, .btn-mycolor:active {
 	color: #fff;
 	background: mycolor_dark;
}

.btn-mycolor {
 	border: 0px solid #555;
 	color: white !important;
 	background: mycolor;
 	margin-right: 10px;
}

.btn-mycolor:hover, .btn-mycolor:active {
 	color: #fff;
 	background: mycolor_dark;
}

.btn-mycolor {
 	border: 0px solid #555;
 	color: white !important;
 	background: mycolor;
 	margin-right: 10px;
}

.btn-mycolor:hover, .btn-mycolor:active {
 	color: #fff;
 	background: mycolor_dark;
}

.btn-mycolor {
 	border: 0px solid #555;
 	color: white !important;
 	background: mycolor;
 	margin-right: 10px;
}

.btn-mycolor:hover, .btn-mycolor:active {
 	color: #fff;
 	background: mycolor_dark;
}

.btn-primary, .btn-primary:hover,
.btn-warning, .btn-warning:hover {
	color: white !important;
}

.btn { margin-bottom: 5px; } 

