/*
	For general buttons
*/

		.buttonwrapper a
		{
			text-decoration: none;
			color: #33383c;
		}

		.button
		{
			background-color: #c3d692;
			font-size: 1.4em;
			font-weight: bold;
			text-align: center;
			padding: 10px;
			margin-bottom: 45px;
			display: block;
			border-radius: 10px;
		}


		.button:hover
		{
			background-color:#3B8D8D;
			color: white;
		}


/* -------------------------------------

		Typography

 ------------------------------------- */

.center {
	text-align:center !important;
}

.left {
	text-align:left !important;
}

.right {
	text-align:right !important;
}

.small-caps {
	font-variant: small-caps !important;
}

.uppercase {
	text-transform: uppercase !important;	
}

.lowercase {
	text-transform: lowercase !important;	
}

.capitalize {
	text-transform: capitalize !important;	
}

.font-xxsmall {
	font-size:0.7em !important	
}

.font-xsmall {
	font-size:0.8em !important	
}
		
.font-small {
	font-size:0.9em !important;
}

.font-medium {
	font-size: 1.1em !important;
}

.font-large {
	font-size: 1.2em !important;
}
		
.font-xlarge {
	font-size: 1.4em !important;
}

.font-xxlarge {
	font-size: 1.5em !important;
}

p {
	margin: 0 0 10px !important;
}


/* --------------------------------------

		Margins

---------------------------------------- */
.pmargin {
	margin: 0 0 10px !important;
}

.top-margin {
	margin: 10px 0 0 0 !important;
}

.bottom-margin {
	margin: 0 0 10px 0 !important;
}

.left-margin {
	margin: 0 0 0 10px !important;
} 

.right-margin {
	margin: 0 10px 0 0 !important;
} 

/* --------------------------------------

		Margins (Bootstrap 4 classes)

---------------------------------------- */

.m-0 {
	margin: 0 !important;
}

.m-1 {
	margin: 10px !important;
}

.m-2 {
	margin: 15px !important;
}

.m-3 {
	margin: 20px !important;
}

.m-4 {
	margin: 40px !important;
}

.mt-0 {
	margin-top: 0 !important;
}

.mt-1 {
	margin-top: 10px !important;
}

.mt-2 {
	margin-top: 15px !important;
}

.mt-3 {
	margin-top: 20px !important;
}

.mt-4 {
	margin-top: 40px !important;
}

.mb-0 {
	margin-bottom: 0 !important;
}

.mb-1 {
	margin-bottom: 10px !important;
}

.mb-2 {
	margin-bottom: 15px !important;
}

.mb-3 {
	margin-bottom: 20px !important;
}

.mb-4 {
	margin-bottom: 40px !important;
}

.ml-0 {
	margin-left: 0 !important;
}

.ml-1 {
	margin-left: 10px !important;
}

.ml-2 {
	margin-left: 15px !important;
}

.ml-3 {
	margin-left: 20px !important;
}

.ml-4 {
	margin-left: 40px !important;
}

.mr-0 {
	margin-right :0 !important;
}

.mr-1 {
	margin-right: 10px !important;
}

.mr-2 {
	margin-right: 15px !important;
}

.mr-3 {
	margin-right: 20px !important;
}

.mr-4 {
	margin-right: 40px !important;
}

.mx-0 {
	margin: 0 !important;
}

.mx-1 {
	margin: 0 10px !important;
}

.mx-2 {
	margin: 0 15px !important;
}

.mx-3 {
	margin: 0 20px !important;
}

.mx-4 {
	margin: 0 40px !important;
}

.my-0 {
	margin: 0 !important;
}

.my-1 {
	margin: 10px 0 !important;
}

.my-2 {
	margin: 15px 0 !important;
}

.my-3 {
	margin: 20px 0 !important;
}

.my-4 {
	margin: 40px 0 !important;
}





/* --------------------------------------

		Padding

---------------------------------------- */

.p-0 {
	padding: 0 !important;
}

.p-1 {
	padding: 10px !important;
}

.p-2 {
	padding: 15px !important;
}

.p-3 {
	padding: 20px !important;
}

.p-4 {
	padding: 40px !important;
}

.p-sm {
	padding:10px !important;
}

.p-md {
	padding:15px !important;
}

.p-lg {
	padding:20px !important;
}

.p-top {
	padding: 10px 0 0 0 !important;
}

.p-bottom {
	padding: 0 0 10px 0 !important;
}

.p-right {
	padding: 0 10px 0 0 !important;
}

.p-left {
	padding: 0 0 0 10px !important;
}

.p-horizontal {
	padding: 0 10px 0 10px !important;
}

.p-vertical {
	padding: 10px 0 10px 0 !important;
}


/* --------------------------------------

		Padding (Bootstrap 4 classes)

---------------------------------------- */

.pt-0 {
	margin-top: 0 !important;
}

.pt-1 {
	margin-top: 10px !important;
}

.pt-2 {
	padding-top: 15px !important;
}

.pt-3 {
	padding-top: 20px !important;
}

.pt-4 {
	padding-top: 40px !important;
}

.pb-0 {
	padding-bottom: 0 !important;
}

.pb-1 {
	padding-bottom: 10px !important;
}

.pb-2 {
	padding-bottom: 15px !important;
}

.pb-3 {
	padding-bottom: 20px !important;
}

.pb-4 {
	padding-bottom: 40px !important;
}

.pl-0 {
	padding-left: 0 !important;
}

.pl-1 {
	padding-left: 10px !important;
}

.pl-2 {
	padding-left: 15px !important;
}

.pl-3 {
	padding-left: 20px !important;
}

.pl-4 {
	padding-left: 40px !important;
}

.pr-0 {
	padding-right :0 !important;
}

.pr-1 {
	padding-right: 10px !important;
}

.pr-2 {
	padding-right: 15px !important;
}

.pr-3 {
	padding-right: 20px !important;
}

.pr-4 {
	padding-right: 40px !important;
}

.px-0 {
	padding: 0 !important;
}

.px-1 {
	padding: 0 10px !important;
}

.px-2 {
	padding: 0 15px !important;
}

.px-3 {
	padding: 0 20px !important;
}

.px-4 {
	padding: 0 40px !important;
}

.py-0 {
	padding: 0 !important;
}

.py-1 {
	padding: 10px 0 !important;
}

.py-2 {
	padding: 15px 0 !important;
}

.py-3 {
	padding: 20px 0 !important;
}

.py-4 {
	padding: 40px 0 !important;
}