.clearfix:before,
.clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix {	*zoom: 1; }

.clear { clear: both; }

.visuallyhidden {
	position: absolute;
	width: 1px; /* Setting this to 0 make it invisible for VoiceOver */
	height: 1px; /* Setting this to 0 make it invisible for VoiceOver */
	padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;    
}

.ir {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.break {
	-ms-word-break: break-all;
	word-break: break-all;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
}

.ellipsis {
	width: 250px;
	white-space: nowrap;
	overflow: hidden;
	-ms-text-overflow: ellipsis; /* Required for IE8 */
	-o-text-overflow: ellipsis; /* Required for Opera */
	text-overflow: ellipsis;
}

pre {
	white-space: pre-wrap;       /* Chrome & Safari */
	white-space: -moz-pre-wrap;  /* Mozilla since 1999 */
	/*white-space: -pre-wrap;      *//* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

.f-right { float: right; }
.f-left { float: left; } 

.hide { display: none; }
.show { display: block; }

.m-top { margin-top: 10px; }
.m-btm { margin-bottom: 10px; }
.m-rht { margin-right: 10px; }
.m-lft { margin-left: 10px; }
.m-top-50 { margin-top: 50px; }

.m-top-2 { margin-top: 20px; }
.m-btm-2 { margin-bottom: 20px; }
.m-rht-2 { margin-right: 20px; }
.m-lft-2 { margin-left: 20px; }

.p-top { padding-top: 10px; }

.hide-column-names table thead tr {
    display: none;
}

.blc-center {
	margin: auto;
}

.disp-blc {
	display: block;
}

.text-center { text-align: center; }
.text-up { text-transform: uppercase; }
.text-underline { text-decoration: underline; }

.font-bold { font-weight: bold; }

.disabled {
	pointer-events: none;
	opacity: 0.5;
}

.form {
	font-size: 13px;
}

/* `INPUT ELEMENTS
--------------------------------------------------------------------------------*/

input[type="text"],
input[type="password"],
textarea,
select,
.input-element {
	border: 1px solid #c7c7c7;
	border-radius: 3px;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
	color: #333;
    margin: 1px;
	padding: 7px 7px;
	height: 34px;
    font-size: 13px;
    -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
	transition: border .25s linear, color .25s linear, background-color .25s linear;
	-webkit-box-shadow: inset 0 1px 2px #e5e5e5;
	-moz-box-shadow: inset 0 1px 2px #e5e5e5;
	-o-box-shadow: inset 0 1px 2px #e5e5e5;
	box-shadow: inset 0 1px 2px #e5e5e5;
}

select {
    height: 34px;
    padding: 0;
}

.ui-selectonemenu-label {
	height: 100%;
}

textarea {
    min-height: 70px;
    font-family: 'Permian Sans', Arial, 'Liberation Sans', FreeSans, sans-serif;
}

.input-element:hover,
input[type="text"]:hover,
input[type="password"]:hover,
textarea:hover,
select:hover {
    border-color: #888;
    background: #fff;
}

.input-element:focus,
input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus,
#tag ul:focus{
    outline: none;
    border-color: #02baf2;
    color: #333;
    background: #fff;
}

input::-webkit-input-placeholder { color: #ccc!important; }
input:-moz-placeholder { color: #ccc!important; }
.ui-watermark {	color: #ccc !important; }
input:-ms-input-placeholder { color: #ccc !important; }

.input-err {
    color: #ca1416;
    padding: 0 2px 10px;
    line-height: 1.7em;
    display: block;
}

.chk-box-2x {
	width: 20px;
	height: 20px;
}

/* `BUTTONS
--------------------------------------------------------------------------------*/

.btn,
.ui-button.ui-state-default,
.btn.ui-commandlink {
    background: #95a5a6;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    height: 34px;
    line-height: 1.4;
    padding: 0 13px;
    text-align: center;
    text-shadow: none;
    text-decoration: none;
    webkit-transition: all 0.218s;
    -moz-transition: all 0.218s;
    -ms-transition: all 0.218s;
    -o-transition: all 0.218s;
    transition: all 0.218s;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    cursor: pointer;
    font-family: 'PT Sans', 'Arial', serif;
    font-weight: normal;
}

.ui-button-text-only .ui-button-text {
	padding: 0 !important;
	line-height: inherit;
}

.btn:hover {
    background-color: #bdc3c7;
    color: #fff;
    /*box-shadow: 0 1px 1px rgba(0,0,0,0.2);*/
}

.btn:focus { outline: none; }

.btn:active {
    background-color: #b4bbc2;
}

.btn:disabled,
.btn:disabled:hover,
.btn:disabled:active {
    opacity: 0.4;
    filter: Alpha(Opacity=40);
}

.btn-green, .ui-button.btn-green.ui-state-default { background-color: #27ae60; }
.btn-green:hover, .ui-button.btn-green.ui-state-hover { background-color: #2ecc71; }
.btn-green:active, .ui-button.btn-green.ui-state-active { background-color: #32a367; }

.btn-blue, .ui-button.btn-blue.ui-state-default { background-color: #02baf2; }
.btn-blue:hover, .ui-button.btn-blue.ui-state-hover { background-color: #35c8f5; }
.btn-blue:active, .ui-button.btn-blue.ui-state-active { background-color: #009dcd; }

.btn-yellow, .ui-button.btn-yellow.ui-state-default { background-color: #e67e22; }
.btn-yellow:hover, .ui-button.btn-yellow.ui-state-hover { background-color: #f39c12; }
.btn-yellow:active, .ui-button.btn-yellow.ui-state-active { background-color: #d35400; }

.btn-red, .ui-button.btn-red.ui-state-default  { background-color: #f84545; }
.btn-red:hover, .ui-button.btn-red.ui-state-hover  { background-color: #f96a6a; }
.btn-red:active, .ui-button.btn-red.ui-state-active { background-color: #cc0000; }

.btn-dark, .ui-button.btn-dark.ui-state-default { background-color: #2c3e50; }
.btn-dark:hover, .ui-button.btn-dark.ui-state-hover { background-color: #494949; }
.btn-dark:active, .ui-button.btn-dark.ui-state-active { background-color: #262626; }

.btn-indigo, .ui-button.btn-indigo.ui-state-default { background-color: #16a085; }
.btn-indigo:hover, .ui-button.btn-indigo.ui-state-hover  { background-color: #1abc9c; }
.btn-indigo:active, .ui-button.btn-indigo.ui-state-active { background-color: #178872; }

.btn-center {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.btn.btn-act {
	height: 24px;
	font-size: 11px;
}

.btn-mng {
    height: 24px;
    width: 24px;
    display: inline-block;
    *display: block;
    zoom: 1;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    padding: 2px 5px;
}

.btn-view {
	font-size: 12px !important;
	height: 24px;
}

.btn-mng:hover {
	box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
	-o-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
	-ms-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.2);
}

.btn-mng:active {
	box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.2);
	-o-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.2);
	-ms-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.2);
}

.btn-edit { background-position: 0 0; }
.btn-delete { background-position: -24px 0; }
.btn-view { background-position: -48px 0;}
.btn-print { background-position: -72px 0; }
.btn-protocol { background-position: -96px 0; }

.btn-edit:hover { background-position: 0 -24px; }
.btn-delete:hover { background-position: -24px -24px; }
.btn-view:hover { background-position: -48px -24px;}
.btn-print:hover { background-position: -72px -24px; }
.btn-protocol:hover { background-position: -96px -24px; }


/* `LINKS
--------------------------------------------------------------------------------*/

.link {
    padding: .5em;
    margin: -.5em;
    color: #c6ccd2;
    position: relative;
    text-decoration: none;
    transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
}

.link:hover { color: #dee2e7; }

.link-green { color: #24aa98; }
.link-green:hover { color: #42c7b7; }

.link-blue { color: #65abd0; }
.link-blue:hover { color: #77bfe5; }

.link-orange { color: #d9c26c; }
.link-orange:hover { color: #e8d48b; }

.link-red { color: #db7560; }
.link-red:hover { color: #e79f91; }

.link-black { color: #383737; }
.link-black:hover { color: #494949; }

/* `WIDTH
--------------------------------------------------------------------------------*/

.w-100 { width: 100px; }
.w-200 { width: 200px; }
.w-300 { width: 300px; }
.w-400 { width: 400px; }
.w-500 { width: 500px; }

.w-1-1 { width: 100%; }
.w-1-1-i { width: 100% !important; }

.w-1-2 { width: 48%; }
.w-2-3 { width: 66%; }
.w-1-3 { width: 32%; }
}
.half-width {
    width: 50%;
}

/* `COLORS
--------------------------------------------------------------------------------*/

.color-green { border-color: #24aa98; }
.color-blue { border-color: #65abd0; }
.color-orange { border-color: #d9c26c; }
.color-red { border-color: #db7560; }
.color-black { border-color: #383737; }

/* `BORDER COLORS
--------------------------------------------------------------------------------*/

.border-green { border-color: #24aa98; }
.border-green:hover { border-color: #42c7b7; }
.border-green:focus { border-color: #1a9385; }

.border-blue { border-color: #65abd0; }
.border-blue:hover { border-color: #77bfe5; }
.border-blue:focus { border-color: #5093b7; }

.border-orange { border-color: #d9c26c; }
.border-orange:hover { border-color: #e8d48b; }
.border-orange:focus { border-color: #c9b248; }

.border-red { border-color: #db7560; }
.border-red:hover { border-color: #e79f91; }
.border-red:focus { border-color: #c25842; }

.border-black { border-color: #383737; }
.border-black:hover { border-color: #494949; }
.border-black:focus { border-color: #262626; }

/* `EFFECTS
--------------------------------------------------------------------------------*/

.no-transition {
	-webkit-transition: initial !important;
    -moz-transition: initial !important;
    -ms-transition: initial !important;
    -o-transition: initial !important;
    transition: initial !important;
}