/*
CSS Name: Utilities CSS
CSS URI: http://www.o2system.net/css/utilities.html
Author: PT. Lingkar Kreasi (Circle Creative)
Author URI: http://www.o2system.net/
Description: Utilities CSS
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Global Style ---- START */
.shadow_box
{
	-moz-box-shadow: 0px 3px 5px #000;
	-webkit-box-shadow: 0px 3px 5px #000;
	box-shadow: 0px 3px 5px #000;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#000000');
}

.flip
{
	-moz-transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
	-o-transform: scaleY(-1);
	transform: scaleY(-1);
	-ms-filter: flipv; /*IE*/
	filter: flipv; /*IE*/
}

/* BORDER */
.clear-border-left {
	border-left:none;
}

/* ROUNDED */
.clear-rounded-left {
	-webkit-border-top-left-radius: 0px;
	-webkit-border-bottom-left-radius: 0px;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-bottomleft: 0px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.clear-rounded-right {
	-webkit-border-top-right-radius: 0px;
	-webkit-border-bottom-right-radius: 0px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-bottomright: 0px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.clear-rounded {
	-webkit-border-radius: 0px 0px 0px 0px !important;
	-moz-border-radius: 0px 0px 0px 0px !important;
	border-radius: 0px 0px 0px 0px !important;
}

.rounded-md
{
	-moz-border-radius: 10px !important;
	-webkit-border-radius: 10px !important;
	border-radius: 10px !important; /* future proofing */
	-khtml-border-radius: 10px !important; /* for old Konqueror browsers */
}

.rounded-sm
{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px; /* future proofing */
	-khtml-border-radius: 5px; /* for old Konqueror browsers */
}

.rounded-top-md
{
	border-top-right-radius:10px;
	border-top-left-radius:10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-topleft: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
}

.rounded-top-sm
{
	border-top-right-radius:5px;
	border-top-left-radius:5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-top-left-radius: 5px;
}

.rounded-bottom-md
{
	border-bottom-right-radius:10px;
	border-bottom-left-radius:10px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
}

.rounded-bottom-sm
{
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
}

.transition
{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
/* Global Style ---- END */

/* MARGIN */
.clear-margin { margin: 0px !important; }
.clear-margin-side { margin-left: 0px !important; margin-right: 0px !important; }
.clear-margin-top { margin-top: 0px !important; }
.clear-margin-bottom { margin-bottom: 0px !important; }

.margin-xl { margin: 35px !important; }
.margin-lg { margin: 25px !important; }
.margin-md { margin: 15px !important; }
.margin-sm { margin: 5px !important; }
.margin-xs { margin: 2px !important; }

.margin-top-xl { margin-top: 35px !important; }
.margin-top-lg { margin-top: 25px !important; }
.margin-top-md { margin-top: 15px !important; }
.margin-top-sm { margin-top: 5px !important; }
.margin-top-xs { margin-top: 2px !important; }

.margin-bottom-xxl { margin-bottom: 55px !important; }
.margin-bottom-xl { margin-bottom: 35px !important; }
.margin-bottom-lg { margin-bottom: 25px !important; }
.margin-bottom-md { margin-bottom: 15px !important; }
.margin-bottom-sm { margin-bottom: 5px !important; }
.margin-bottom-xs { margin-bottom: 2px !important; }

.margin-left-xl { margin-left: 35px !important; }
.margin-left-lg { margin-left: 25px !important; }
.margin-left-md { margin-left: 15px !important; }
.margin-left-sm { margin-left: 5px !important; }
.margin-left-xs { margin-left: 2px !important; }

.margin-right-xl { margin-right: 35px !important; }
.margin-right-lg { margin-right: 25px !important; }
.margin-right-md { margin-right: 15px !important; }
.margin-right-sm { margin-right: 5px !important; }
.margin-right-xs { margin-right: 2px !important; }

/* PADDING */
.clear-padding { padding: 0px !important; }
.clear-padding-left { padding-left: 0px !important; }
.clear-padding-right { padding-right: 0px !important; }
.clear-padding-side { padding-left: 0px !important; padding-right: 0px !important; }
.clear-padding-top { padding-top: 0px !important; }
.clear-padding-bottom { padding-bottom: 0px !important; }

.padding-xl { padding: 35px !important; }
.padding-lg { padding: 25px !important; }
.padding-md { padding: 15px !important; }
.padding-sm { padding: 5px !important; }
.padding-xs { padding: 2px !important; }

.padding-side-sm { padding-left: 5px !important; padding-right: 5px !important; }
.padding-side-xs { padding-left: 2px !important; padding-right: 2px !important; }

.padding-top-xl { padding-top: 35px !important; }
.padding-top-lg { padding-top: 25px !important; }
.padding-top-md { padding-top: 15px !important; }
.padding-top-sm { padding-top: 5px !important; }
.padding-top-xs { padding-top: 2px !important; }

.padding-bottom-xl { padding-bottom: 35px !important; }
.padding-bottom-lg { padding-bottom: 25px !important; }
.padding-bottom-md { padding-bottom: 15px !important; }
.padding-bottom-sm { padding-bottom: 5px !important; }
.padding-bottom-xs { padding-bottom: 2px !important; }

.padding-left-xl { padding-left: 35px !important; }
.padding-left-lg { padding-left: 25px !important; }
.padding-left-md { padding-left: 15px !important; }
.padding-left-sm { padding-left: 5px !important; }
.padding-left-xs { padding-left: 2px !important; }

.padding-right-xl { padding-right: 35px !important; }
.padding-right-lg { padding-right: 25px !important; }
.padding-right-md { padding-right: 15px !important; }
.padding-right-sm { padding-right: 5px !important; }
.padding-right-xs { padding-right: 2px !important; }

/* ALIGNMENT */
.align-center { text-align: center !important; }
.align-left { text-align: left !important; }
.align-right { text-align: right !important; }

/* DISPLAY */
.inline { display: inline; }
.inline-block { display: inline-block; }
.inline-table { display: inline-table; }

.as-table { display: table; }
.as-column { display: table-column; }
.as-cell { display: table-cell; }

/* ROUNDED */
.rounded {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

/* TEXT */
.text-lowercase  { text-transform: lowercase !important; }
.text-uppercase  { text-transform: uppercase !important; }
.text-capitalize { text-transform: capitalize !important; }
.text-strike { text-decoration: line-through !important; }
.text-overline { text-decoration: overline !important; }
.text-underline { text-decoration: underline !important; }
.text-normal { text-decoration: none !important; text-transform: none !important; font-weight: normal !important; }
.text-nowrap { white-space: nowrap; }
.text-wrap {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: pre-wrap;
}

.text-shadow { text-shadow: 2px 2px 3px rgba(0, 0, 0, .50); }
.text-italic { font-style: italic !important; }

.text-xl { font-size: 25px !important; }
.text-lg { font-size: 20px !important; }
.text-md { font-size: 14px !important; }
.text-nm { font-size: 12px !important; }
.text-sm { font-size: 10px !important;}
.text-xs { font-size: 8px !important; }

/* BORDER */
.light-border {
	border:1px solid #ebebeb;
}

/* TRANSPARENT */
.transparent-25 {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";
	filter: alpha(opacity=25);
	-moz-opacity:0.25;
	-khtml-opacity: 0.25;
	opacity: 0.25;
}

.transparent-50 {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

.transparent-75 {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	filter: alpha(opacity=75);
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

.transparent-100 {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity:1.0;
	-khtml-opacity: 1.0;
	opacity: 1.0;
}

/* WIDTH */
.width-fit {
	width:1%;
    white-space:nowrap;
}

/* BORDER */
.clear-border {
	border: none !important;
}

.clear-border-top {
    border-top: none !important;
}

.clear-border-bottom {
    border-bottom: none !important;
}

.clear-border-left {
	border-left: none !important;
}
.clear-border-right {
	border-right: none !important;
}
.clear-border-side {
	border-left: none !important;
	border-right: none !important;
}
.solid-border-top-xs {
	border-top: 1px solid #ebebeb;
}

.solid-border-bottom-xs {
	border-bottom: 1px solid #ebebeb;
}

/* FILETYPE */
.file-type-icon{clear:both; margin:30px auto; width:32px;}
/*end of not important*/

.file-type-icon{display:block; width:30px; height:40px; background:#F9F9F9; position:relative; border:1px solid #E6E6E6; border-radius:2px; box-shadow:inset 1px 1px 0 0 #ffffff, inset -1px -1px 0 0 #ffffff, inset 0 10px 20px -10px rgba(0,0,0,.05);}
.file-type-icon .corner{display:block; position:absolute; top:-1px; right:-1px; width: 0; height: 0; border-left: 12px solid #eeeeee; border-top: 12px solid #ffffff; /*change this color if you want to use it on custom background*/ box-shadow:-1px 1px 0px 0 #E6E6E6;}
.file-type-icon .type{background:#777; text-align:center; display:block; position:absolute; bottom:6px; left:-2px; height:15px; line-height:15px; font-size:10px; color:#fff; border-radius:1px; width:25px;}
.file-type-icon .type.txt{background:#F9B142;}
.file-type-icon .type.doc{background:#0088CC;}
.file-type-icon .type.xls{background:#85A91A;}
.file-type-icon .type.pdf{background:#C80000;}

.relative-center {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	margin: auto !important;
}

/* EXTRAS */

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

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

.space30 {
    margin-bottom: 30px !important;
}

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

.space50 {
    margin-bottom: 50px !important;
}

.space60 {
    margin-bottom: 60px !important;
}

.space70 {
    margin-bottom: 70px !important;
}

.space80 {
    margin-bottom: 80px !important;
}

.space90 {
    margin-bottom: 90px !important;
}

.space100 {
    margin-bottom: 100px !important;
}

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

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

.padding30 {
    padding-top: 30px !important;
    padding-top: 30px !important;
}

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

.padding50 {
    padding-top: 50px !important;
    padding-top: 50px !important;
}

.padding60 {
    padding-top: 60px !important;
    padding-top: 60px !important;
}

.padding70 {
    padding-top: 70px !important;
    padding-top: 70px !important;
}