/* Color settings */

.pink:hover{
   
	
	color:rgba(239,33,74,1);
}

.pink:hover:before{
   
	color:rgba(239,33,74,1);
}

.pink:hover:after{
    
	color:rgba(239,33,74,1);
	
}

.pink:before{
	background:rgba(91,175,199,1);

} 
 
.pink:after{
	background:rgba(239,33,74,1);
	
} 

.purple:hover{
    border:0.0625em solid rgba(112,52,84,1);
	background:rgba(112,52,84,0.75);
	color:rgba(112,52,84,0.75);
}

.purple:hover:before{
    border:0.0625em solid rgba(112,52,84,1);
	color:rgba(112,52,84,1);
}

.purple:hover:after{
    border:0.0625em solid rgba(112,52,84,1);
	color:rgba(112,52,84,1);
	background:rgba(112,52,84,1);
}

.purple:before{
	background:rgba(112,52,84,1);
	border:0.0625em solid rgba(112,52,84,1);
} 
 
.green:after{
	background:rgba(155,232,91,1);

} 
 
.blue:hover{
    border:0.0625em solid rgba(6,129,128,1);
	background:rgba(6,129,128,0.75);
	color:rgba(6,129,128,0.75);
}

.blue:hover:before{
    border:0.0625em solid rgba(6,129,128,1);
	color:rgba(6,129,128,1);
}

.blue:hover:after{
    border:0.0625em solid rgba(6,129,128,1);
	color:rgba(6,129,128,1);
	background:rgba(6,129,128,1);
}

.blue:before{
	background:rgba(6,129,128,1);
	border:0.0625em solid rgba(6,129,128,1);
} 
 
.blue:after{
	background:rgba(241,195,195,);
	
} 
 
.yelow:hover{
    border:0.0625em solid rgba(243,202,22,1);
	background:rgba(243,202,22,0.75);
	color:rgba(243,202,22,0.75);
}

.yelow:hover:before{
    border:0.0625em solid rgba(243,202,22,1);
	color:rgba(243,202,22,1);
	background:rgba(243,202,22,1);
}

.yelow:hover:after{
    border:0.0625em solid rgba(243,202,22,1);
	color:rgba(243,202,22,1);
}

.yelow:before{
	background:rgba(243,202,22,1);
	border:0.0625em solid rgba(243,202,22,1);
} 
 
.yelow:after{
	background:rgba(243,202,22,1);
	border:0.0625em solid rgba(243,202,22,1);
} 

.green:hover{
    border:0.0625em solid rgba(0,214,96,1);
	background:rgba(0,214,96,0.75);
	color:rgba(0,214,96,0.75);
}

.green:hover:before{
    border:0.0625em solid rgba(0,214,96,1);
	color:rgba(0,214,96,1);
}

.green:hover:after{
    border:0.0625em solid rgba(0,214,96,1);
	color:rgba(0,214,96,1);
	background:rgba(0,214,96,1);
}

.green:before{
	background:rgba(0,214,96,1);
	border:0.0625em solid rgba(0,214,96,1);
} 
 
.green:after{
	background:rgba(241,195,195,1);
	border:0.0625em solid rgba(0,214,96,1);
} 

/* Rectangle button */

.rectangle{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 1.25em;
	background:#555;
	color:#fff;
	text-decoration:none;
	overflow:hidden;
}

.rectangle:before{
    position: absolute;
    content: attr(data-text);
    display: inline-block;
    padding:0.25em 1.25em;
    color:#fff;
    text-decoration:none;
    top:0em;
    left:-100%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:none !important;
}

.rectangle:hover{
	border:none !important;
	background:#555;
	color:#fff;
}

.rectangle:hover:before{
    left: 0%;
	border:none !important;
    box-shadow: inset -5px -5px 10px -7px rgba(0,0,0,0.5), inset 5px 5px 10px -7px rgba(0,0,0,0.5);
	color:#fff;
}

.rectangle:after{
	border:none !important;
}

/* Hover button */

.hover{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 1.25em;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	border:none !important;
}

.hover:hover{
	border:none !important;
	background:none;
	color:#555;
}

.hover:before{
    position: absolute;
    content: attr(data-text);
    display: inline-block;
    padding:0.25em 1.25em;
    color:#fff;
    text-decoration:none;
    top:1.6875em;
    left:0em;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:none !important;
}

.hover:hover:before{
    top: 0em;
	color:#fff;
}

/* DoorOut button */

.doorout{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 1.25em;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	border:0.0625em solid #555;
	z-index:1;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
}

.doorout:hover{
    color:#fff;
	background:none;
}

.doorout:before{
    position: absolute;
    content: '';
    display: inline-block;
    width:0%;
    height:100%;
    top:0em;
    right:50%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
    z-index:-1;
	border:none !important;
}

.doorout:hover:before{
	width:50%;
}

.doorout:after{
    position: absolute;
    content: '';
    display: inline-block;
    width:0%;
    height:100%;
    top:0em;
    left:50%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
    z-index:-1;
	border:none !important;
}

.doorout:hover:after{
	width:50%;
}

/* DoorIn button */

.doorin{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 1.25em;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:0.0625em solid #555;
}
.doorin:hover{
    color:#fff;
	background:none;
}

.doorin:before{
    position: absolute;
    content: '';
    display: inline-block;
    width:50%;
    height:100%;
    top:0em;
    left:-50%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
    z-index:-1;
	border:none !important;
}

.doorin:hover:before{
	left:0%;
}

.doorin:after{
    position: absolute;
    content: '';
    display: inline-block;
    width:50%;
    height:100%;
    top:0em;
    right:-50%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
    z-index:-1;
	border:none !important;
}

.doorin:hover:after{
	right:0%;
}

/* Circle button */

.circle{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 1.25em;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
}

.circle:hover{
    color:#fff;
	border:none !important;
}

.circle:before{
    position: absolute;
    content: '';
    display: inline-block;
    width:150%;
    height:250%;
    top:0em;
    left:-150%;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	-webkit-border-top-right-radius: 100%;
	-webkit-border-bottom-right-radius: 100%;
	-moz-border-radius-topright: 100%;
	-moz-border-radius-bottomright: 100%;
	-mos-border-radius-topright: 100%;
	-mos-border-radius-bottomright: 100%;
	-o-border-radius-topright: 100%;
	-o-border-radius-bottomright: 100%;
	border-top-right-radius: 100%;
	border-bottom-right-radius: 100%;
    z-index:-1;
	border:none !important;
}

.circle:hover:before{
	left:-50%;
}

/* Arrow-circle button */

.arrow-circle{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 2em 0.25em 0.5em ;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
    -webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:0.0625em solid #555;
}

.arrow-circle:hover{
	background:none;
	color:#555;
}

.arrow-circle:after{
	position: absolute;
	margin-top: 0.07em;
	right:0.25em;
	content: "\f0a9";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-size: 1.25em;
	-webkit-transition:all 0.5s ease;
    -moz-transition:all 0.5s ease;
    -mos-transition:all 0.5s ease;
    -o-transition:all 0.5s ease;
    transition:all 0.5s ease;
	-webkit-transform:rotateX(0deg);
	-moz-transform:rotateX(0deg);
	-mos-transform:rotateX(0deg);
	-o-transform:rotateX(0deg);
	transform:rotateX(0deg);
	padding-left:5px;
	background:none;
	border-left:0.0625em solid #555;
	border-top:none;
	border-right:none;
	border-bottom:none;
}

.arrow-circle:hover:after{
	-webkit-transform:rotateX(180deg);
	-moz-transform:rotateX(180deg);
	-mos-transform:rotateX(180deg);
	-o-transform:rotateX(180deg);
	transform:rotateX(180deg);
	background:none;
	border-top:none;
	border-right:none;
	border-bottom:none;
}

/* Arrow-right button */

.arrow-right{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 2em 0.25em 0.5em ;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
	-webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:0.0625em solid #555;
}

.arrow-right:hover{
	color:#fff;
}

.arrow-right:after{
	position: absolute;
	margin-top: -0.07em;
	right:0.25em;
	content: "\f061";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-size: 1.25em;
	padding-left:5px;
	background:none;
	border:none;
}

.arrow-right:hover:after{
	border:none;
	background:none;
	color:#fff;
	-webkit-animation: arrow 1s ease infinite;
	-moz-animation: arrow 1s ease infinite;
	-mos-animation: arrow 1s ease infinite;
	-o-animation: arrow 1s ease infinite;
	animation: arrow 1s ease infinite;
}

/* Angle-double button */

.angle-double{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 0.5em 0.25em 0.5em ;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
	-webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:0.0625em solid #555;
}

.angle-double:hover{
	color:#fff;
	padding:0.25em 2em 0.25em 0.5em ;
}

.angle-double:after{
	position: absolute;
	margin-top:0em;
	right:0.25em;
	content: "\f101";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-size: 1.25em;
	padding-left:5px;
	background:none;
	border:none;
	color:rgba(255,255,255,0);
}

.angle-double:hover:after{
	border:none;
	background:none;
	color:rgba(255,255,255,1);
	-webkit-animation: arrow 1s ease infinite;
	-moz-animation: arrow 1s ease infinite;
	-mos-animation: arrow 1s ease infinite;
	-o-animation: arrow 1s ease infinite;
	animation: arrow 1s ease infinite;
}

/* Caret-right button */

.caret-right{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 2.5em 0.25em 0.5em ;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
	-webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:0.0625em solid #555;
}

.caret-right:hover{
	border:0.0625em solid #555;
	color:#fff;
}

.caret-right:after{
	position: absolute;
	margin-top:-0.25em;
	right:-5px;
	content: "\f0da";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-size: 1.25em;
	padding:5px 15px 5px 10px ;
	background:#555;
	border:none;
	color:#fff;
}

.caret-right:hover:after{
    	border:none;
	color:#fff;
	background:#555;
	-webkit-animation: arrow 1s ease infinite;
	-moz-animation: arrow 1s ease infinite;
	-mos-animation: arrow 1s ease infinite;
	-o-animation: arrow 1s ease infinite;
	animation: arrow 1s ease infinite;
}

/* Chevron-right button */

.chevron-right{
	position:relative;
	display: inline-block;
	margin:0em .5em;
	padding:0.25em 0.5em 0.25em 2.5em ;
	color:#555;
	text-decoration:none;
	overflow:hidden;
	z-index:1;
	-webkit-transition:all 0.25s ease;
    -moz-transition:all 0.25s ease;
    -mos-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
	border:none;
}

.chevron-right:hover{
	border:none;
	color:#555;
	background:none;
}

.chevron-right:before{
	position: absolute;
	margin-top:0.06em;
	left:0px;
	content: "\f054";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	font-size: 1.25em;
	background:none;
	border:none;
	color:rgba(55,55,55,0);
}

.chevron-right:hover:before{
	border:none;
	left:20px;
	-webkit-transition:all 0.25s ease;
    	-moz-transition:all 0.25s ease;
    	-mos-transition:all 0.25s ease;
    	-o-transition:all 0.25s ease;
    	transition:all 0.25s ease;
	background:none;
	-webkit-animation: arrow 1s ease infinite;
	-moz-animation: arrow 1s ease infinite;
	-mos-animation: arrow 1s ease infinite;
	-o-animation: arrow 1s ease infinite;
	animation: arrow 1s ease infinite;
}

/*Arrow animations */

@-webkit-keyframes arrow{
  0%, 20%, 50%, 80%, 100%	{ -webkit-transform: translateX(0em); }
	40%						{ -webkit-transform: translateX(-0.25em); }
	60%						{ -webkit-transform: translateX(-.15em); }
}

@-moz-keyframes arrow{
  0%, 20%, 50%, 80%, 100%	{ -moz-transform: translateX(0); }
	40%						{ -moz-transform: translate(-0.25em,-1em); }
	60%						{ -moz-transform: translateX(-.15em); }
}

@-mos-keyframes arrow{
  0%, 20%, 50%, 80%, 100%	{ -mos-transform: translateX(0); }
	40%						{ -mos-transform: translateX(-0.25em); }
	60%						{ -mos-transform: translateX(-.15em); }
}

@-o-keyframes arrow{
  0%, 20%, 50%, 80%, 100%	{ -o-transform: translateX(0); }
	40%						{ -o-transform: translateX(-0.25em); }
	60%						{ -o-transform: translateX(-.15em); }
}

@keyframes arrow{
  0%, 20%, 50%, 80%, 100%	{ transform: translateX(0); }
	40%						{ transform: translateX(-0.25em); }
	60%						{ transform: translateX(-.15em); }
}