/************ button styles ***************************/

  .btn {

    border: 1px solid transparent;
    padding: 5px 10px;
    border-radius: 4px;
    font-family: 'RocknRoll One';
    cursor: pointer;
    border: transparent;

}

.vertical-center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
  }

.btn-red {

    background:#990f02;
    color:white;

}

.btn-red:hover, .btn-red:focus,.btn-red:active {

    background:#b90e0a;

}

.btn-blue {

    background:#3944bc;
    color:white;

}

.btn-blue:hover, .btn-blue:focus,.btn-blue:active {

    background:#1520a6;


}

.btn-green {

    background:#00ad00;
    color:white;

}

.btn-green:hover, .btn-green:focus,.btn-green:active {

    background:#008a00;


}


.btn-pink {
	
	background-color:#fd367e;
	color:white ;
	
}

.btn-pink:hover,.btn-pink:focus {
	
	background-color:#c82d65;
	color:white;
	
}


.btn-pink:active {
	
	background-color:#a52251;
	color:white;
	
}

/***************** neon orange **********************/

.btn-orange {
	
	background-color:#ff4105;
	color:white ;
	
}

.btn-orange:hover,.btn-orange:focus {
	
	background-color:#cd3201;
	color:white;
	
}


.btn-orange:active {
	
	background-color:#a62d07;
	color:white;
	
}

/***************** neon purple **********************/

.btn-purple {
	
	background-color:#993CF3 ;
	color:white ;
	
}

.btn-purple:hover,.btn-purple:focus {
	
	background-color:#7e2ecc;
	color:white;
	
}


.btn-purple:active {
	
	background-color:#60229d;
	color:white;
	
}

/***************** slate type color **********************/

.btn-slate {
	
	background-color:#3e6b89;
	color:white ;
	
}

.btn-slate:hover,.btn-slate:focus {
	
	background-color:#2f5168;
	color:white;
	
}


.btn-slate:active {
	
	background-color:#1c3a4d;
	color:white;
	
}

/***************** aqua type color **********************/

.btn-aqua {
	
	background-color:#009999;
	color:white ;
	
}

.btn-aqua:hover,.btn-aqua:focus {
	
	background-color:#018282;
	color:white;
	
}


.btn-aqua:active {
	
	background-color:#006666;
	color:white;
	
}

/*#547c66*/

/***************** army green type color **********************/

.btn-army {
	
	background-color:#547c66;
	color:white ;
	
}

.btn-army:hover,.btn-army:focus {
	
	background-color:#446754;
	color:white;
	
}


.btn-army:active {
	
	background-color:#365343;
	color:white;
	
}

/*#00adb5*/

/***************** teal type color **********************/

.btn-teal {
	
	background-color:#00adb5;
	color:white ;
	
}

.btn-teal:hover,.btn-teal:focus {
	
	background-color:#049097;
	color:white;
	
}

.btn-teal:active {
	
	background-color:#01777c;
	color:white;
	
}