/* General button style (reset) */
.btn {
	border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	/* padding: 10px 20px; */
	display: inline-block;
	margin: 25px 0px;
	margin-right: 10px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}


.modal-button {
	font-family: inherit;
	border: 0px;
	cursor: pointer;
	padding: 10px 20px;
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 1px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-color: rgb(54, 83, 121);
	color: white;
}

.modal-button:focus {
	outline: none;
	color: white;
	text-shadow: none;
}

.modal-button:active {
	background-color: rgb(67, 120, 189);
}


/* Button 1 */
.btn-1 {
	color: white;
	background: transparent;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

.btn-1:active {
	top: 2px;
}

.btn-1:focus {
	outline: none;
	color: white;
	text-shadow: none;
} 

/* Button 6d */
.btn-1d {
	border: 2px solid white;
}

.btn-1d:hover {
	background: transparent;
	border: 2px solid #3378C0;
	color: #3378C0;
}

/* Button 2 */
.btn-2 {
	color: rgb(82, 81, 81);
	background: transparent;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

.btn-2:active {
	top: 2px;
}

/* Button 6d */
.btn-2d {
	border: 2px solid rgb(82, 81, 81);
}

.btn-2:focus {
	outline: none;
	color: rgb(82, 81, 81);
	text-shadow: none;
}

.btn-2d:hover {
	background: transparent;
	border: 2px solid rgb(216, 69, 0);
	color: rgb(216, 69, 0);
}

/* Button 3 */
.btn-3 {
	color: #fff;
	background: transparent;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

.btn-3:active {
	top: 2px;
}

.btn-3:focus {
	outline: none;
	color: white;
	text-shadow: none;
}

/* Button 6d */
.btn-3d {
	border: 2px solid white;
}

.btn-3d:hover {
	background: transparent;
	border: 2px solid rgb(216, 69, 0);
	color: rgb(216, 69, 0);
}


@-webkit-keyframes fadeOutText {
	0% { color: transparent; }
	80% { color: transparent; }
	100% { color: #fff; }
}

@-moz-keyframes fadeOutText {
	0% { color: transparent; }
	80% { color: transparent; }
	100% { color: #fff; }
}

@keyframes fadeOutText {
	0% { color: transparent; }
	80% { color: transparent; }
	100% { color: #fff; }
}

@-webkit-keyframes moveToRight {
	80% { -webkit-transform: translateX(250%); }
	81% { opacity: 1; -webkit-transform: translateX(250%); }
	82% { opacity: 0; -webkit-transform: translateX(250%); }
	83% { opacity: 0; -webkit-transform: translateX(-50%); }
	84% { opacity: 1; -webkit-transform: translateX(-50%);  }
	100% { -webkit-transform: translateX(0%); }
}

@-moz-keyframes moveToRight {
	80% { -moz-transform: translateX(250%); }
	81% { opacity: 1; -moz-transform: translateX(250%); }
	82% { opacity: 0; -moz-transform: translateX(250%); }
	83% { opacity: 0; -moz-transform: translateX(-50%); }
	84% { opacity: 1; -moz-transform: translateX(-50%);  }
	100% { -moz-transform: translateX(0%); }
}

@keyframes moveToRight {
	80% { transform: translateX(250%); }
	81% { opacity: 1; transform: translateX(250%); }
	82% { opacity: 0; transform: translateX(250%); }
	83% { opacity: 0; transform: translateX(-50%); }
	84% { opacity: 1; transform: translateX(-50%);  }
	100% { transform: translateX(0%); }
}

@-webkit-keyframes scaleUp {
	80% {
		opacity: 0;
		-webkit-transform: scale(2);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(2);
	}
}

@-moz-keyframes scaleUp {
	80% {
		opacity: 0;
		-moz-transform: scale(2);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(2);
	}
}

@keyframes scaleUp {
	80% {
		opacity: 0;
		transform: scale(2);
	}
	100% {
		opacity: 0;
		transform: scale(2);
	}
}

@-webkit-keyframes fillToRight {
	to { 
		width: 100%;
	}
}

@-moz-keyframes fillToRight {
	to { 
		width: 100%;
	}
}

@keyframes fillToRight {
	to { 
		width: 100%;
	}
}

@-webkit-keyframes emptyBottom {
	to { 
		height: 100%;
	}
}

@-moz-keyframes emptyBottom {
	to { 
		height: 100%;
	}
}

@keyframes emptyBottom {
	to { 
		height: 100%;
	}
}

@-webkit-keyframes scaleFade {
	50% { 
		opacity: 1;
		-webkit-transform: scale(1);
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(2.5);
	}
}

@-moz-keyframes scaleFade {
	50% { 
		opacity: 1;
		-moz-transform: scale(1);
	}
	100% {
		opacity: 0;
		-moz-transform: scale(2.5);
	}
}

@keyframes scaleFade {
	50% { 
		opacity: 1;
		transform: scale(1);
	}
	100% {
		opacity: 0;
		transform: scale(2.5);
	}
}


@-webkit-keyframes dropDown {
	to { 
		opacity: 1;
		-webkit-transform: scale(1);
	}
}

@-moz-keyframes dropDown {
	to { 
		opacity: 1;
		-moz-transform: scale(1);
	}
}

@keyframes dropDown {
	to { 
		opacity: 1;
		transform: scale(1);
	}
}


@-webkit-keyframes dropDownFade {
	50% { 
		opacity: 1;
		-webkit-transform: scale(1);
	}
	100% { 
		opacity: 0;
		-webkit-transform: scale(1.5);
	}
}

@-moz-keyframes dropDownFade {
	50% { 
		opacity: 1;
		-moz-transform: scale(1);
	}
	100% { 
		opacity: 0;
		-moz-transform: scale(1.5);
	}
}

@keyframes dropDownFade {
	50% { 
		opacity: 1;
		transform: scale(1);
	}
	100% { 
		opacity: 0;
		transform: scale(1.5);
	}
}

@-webkit-keyframes moveUp {
	0% {
		-webkit-transform: translateY(50%);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes moveUp {
	0% {
		-moz-transform: translateY(50%);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@keyframes moveUp {
	0% {
		transform: translateY(50%);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		transform: translateY(0);
	}
}


/* From Dan Eden's animate.css: http://daneden.me/animate/ */
@-webkit-keyframes shake {
	0%, 100% {-webkit-transform: translateX(0);}
	10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}
	20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}
}

@-moz-keyframes shake {
	0%, 100% {-moz-transform: translateX(0);}
	10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}
	20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}
}

@keyframes shake {
	0%, 100% {transform: translateX(0);}
	10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
	20%, 40%, 60%, 80% {transform: translateX(10px);}
}

@-webkit-keyframes scaleFromUp {
	0% {
		-webkit-transform: scale(0);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		-webkit-transform: scale(1);
	}
}

@-moz-keyframes scaleFromUp {
	0% {
		-moz-transform: scale(0);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		-moz-transform: scale(1);
	}
}

@keyframes scaleFromUp {
	0% {
		transform: scale(0);
		opacity: 0;
	}
	100% { 
		opacity: 1;
		transform: scale(1);
	}
}

@-webkit-keyframes openTrash {
	50% {
		-webkit-transform: rotate(-35deg);
	}
	100% { 
		-webkit-transform: rotate(0deg);
	}
}

@-moz-keyframes openTrash {
	50% {
		-moz-transform: rotate(-35deg);
	}
	100% { 
		-moz-transform: rotate(0deg);
	}
}

@keyframes openTrash {
	50% {
		transform: rotate(-35deg);
	}
	100% { 
		transform: rotate(0deg);
	}
}