/*----------------------------------------------------------------------------------------------------------
	Quick Styles
		Simple, generic styles for quick markup which can be used as an alternative for many design
		features which would otherwise likely use inline styles.

		last updated on October 13, 2013
----------------------------------------------------------------------------------------------------------*/

.static { position: static; }
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }

.pull-left { float: left; }
.pull-right { float: right; }

.clear { clear: both; }
.clear-left { clear: left; }
.clear-right { clear: right; }
.no-clear { clear: none; }

.hidden { display: none; }
.invisible { visibility: hidden; }

.margin-0, .margin-0px { margin: 0; }
.margin-5px { margin: 5px; }
.margin-10px { margin: 10px; }
.margin-20px { margin: 20px; }
.margin-vertical-0, .margin-vertical-0px { margin-top: 0; margin-bottom: 0; }
.margin-vertical-5px { margin-top: 5px; margin-bottom: 5px; }
.margin-vertical-10px { margin-top: 10px; margin-bottom: 10px; }
.margin-vertical-20px { margin-top: 20px; margin-bottom: 20px; }
.margin-bottom-5px { margin-bottom: 5px; }
.margin-bottom-10px { margin-bottom: 10px; }
.margin-bottom-20px { margin-bottom: 20px; }
.margin-center { margin: 0 auto; }

.padding-0, .padding-0px { padding: 0; }
.padding-5px { padding: 5px; }
.padding-10px { padding: 10px; }
.padding-20px { padding: 20px; }
.padding-vertical-0, .padding-vertical-0px { padding-top: 0; padding-bottom: 0; }
.padding-vertical-5px { padding-top: 5px; padding-bottom: 5px; }
.padding-vertical-10px { padding-top: 10px; padding-bottom: 10px; }
.padding-vertical-20px { padding-top: 20px; padding-bottom: 20px; }
.padding-bottom-5px { padding-bottom: 5px; }
.padding-bottom-10px { padding-bottom: 10px; }
.padding-bottom-20px { padding-bottom: 20px; }

.width-full { width: 100%; }
.height-full { height: 100%; }

.border-solid { border-style: solid; }
.border-dotted { border-style: dotted; }
.border-dashed { border-style: dashed; }

.border-1px { border-width: 1px; }
.border-2px { border-width: 2px; }
.border-3px { border-width: 3px; }

.border-white { border-color: #fff; }
.border-light-grey { border-color: #bbb; }
.border-grey { border-color: #888; }
.border-dark-grey { border-color: #444; }
.border-black { border-color: #000; }

.overflow-visible { overflow: visible; }
.overflow-scroll { overflow: scroll; }
.overflow-hidden { overflow: hidden; }

.overflow-x-visible { overflow-x: visible; }
.overflow-x-scroll { overflow-x: scroll; }
.overflow-x-hidden { overflow-x: hidden; }

.overflow-y-visible { overflow-y: visible; }
.overflow-y-scroll { overflow-y: scroll; }
.overflow-y-hidden { overflow-y: hidden; }

.bold, .strong { font-weight: bold; }
.italic, .em { font-style: italic; }

.underline { text-decoration: underline; }
.overline { text-decoration: overline; }
.line-through { text-decoration: line-through; }

.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }
.small-caps { font-variant: small-caps; }

.text-align-left { text-align: left; }
.text-align-right { text-align: right; }
.text-align-center { text-align: center; }
.text-align-justify { text-align: justify; }

.block { display: block; }
.inline { display: inline; }
.roles{position: absolute; top: 25px; margin-left: 18px;}
.inline-block { display: inline-block !important; }
.table-cell { display: table-cell; }

.vertical-align-center { vertical-align: center; }

.z-top { z-index: 10000; }
.z-0 { z-index: 0; }
.z-bottom { z-index: -10000; }

.fade-25 { opacity: 0.25; filter: alpha(opacity=25); }
.fade-50 { opacity: 0.5; filter: alpha(opacity=50); }
.fade-75 { opacity: 0.75; filter: alpha(opacity=75); }