/**

 * Icons and other styles related to icons.

 * Part of the font icon styles based on Font Awesome - http://fontawesome.io

 */







/* Icon %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */



.ic {

	display: inline-block;

	font-family: ThemeIcons;

	font-style: normal;

	font-weight: normal;

	font-variant: normal;

	text-transform: none;

	line-height: 1em;

	-webkit-font-smoothing: antialiased;

	-moz-osx-font-smoothing: grayscale;

}



/* If icon is applied to 'i' tag */

i.ic {

	font-style: normal;

}



/* Floating icons - with generic modifiers

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

.ic.left {

	margin-right: .3em;

}

.ic.right {

	margin-left: .3em;

}



/* Size

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

/* Makes the font 33% larger relative to the icon container */

.ic-lg {

	font-size: 1.33333333em;

	line-height: 0.75em;

	vertical-align: -15%;

}

.ic-2x {

	font-size: 2em;

}

.ic-3x {

	font-size: 3em;

}

.ic-4x {

	font-size: 4em;

}

.ic-5x {

	font-size: 5em;

}

.ic-6x {

	font-size: 6em;

}

.ic-7x {

	font-size: 7em;

}

.ic-8x {

	font-size: 8em;

}

.ic-fw {

	width: 1.28571429em;

	text-align: center;

}



/* Lists

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

.ic-ul {

	padding-left: 0;

	margin-left: 2.14285714em;

	list-style-type: none;

}

.ic-ul > li {

	position: relative;

}

.ic-li {

	position: absolute;

	left: -2.14285714em;

	width: 2.14285714em;

	top: 0.14285714em;

	text-align: center;

}

.ic-li.ic-lg {

	left: -1.85714286em;

}

.ic-border {

	padding: .2em .25em .15em;

	border: solid 0.08em #eeeeee;

	border-radius: .1em;

}

.pull-right {

	float: right;

}

.pull-left {

	float: left;

}

.ic.pull-left {

	margin-right: .3em;

}

.ic.pull-right {

	margin-left: .3em;

}



/* Stacking

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

.ic-stack {

	position: relative;

	display: inline-block;

	width: 2em;

	height: 2em;

	line-height: 2em;

	vertical-align: middle;

}

.ic-stack-1x,

.ic-stack-2x {

	position: absolute;

	left: 0;

	width: 100%;

	text-align: center;

}

.ic-stack-1x {

	line-height: inherit;

}

.ic-stack-2x {

	font-size: 2em;

}

.ic-inverse {

	color: #ffffff;

}



/* Effects

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

.ic-spin {

	-webkit-animation: spin 2s infinite linear;

	-moz-animation: spin 2s infinite linear;

	-o-animation: spin 2s infinite linear;

	animation: spin 2s infinite linear;

}

@-moz-keyframes spin {

	0% {

		-moz-transform: rotate(0deg);

	}

	100% {

		-moz-transform: rotate(359deg);

	}

}

@-webkit-keyframes spin {

	0% {

		-webkit-transform: rotate(0deg);

	}

	100% {

		-webkit-transform: rotate(359deg);

	}

}

@-o-keyframes spin {

	0% {

		-o-transform: rotate(0deg);

	}

	100% {

		-o-transform: rotate(359deg);

	}

}

@keyframes spin {

	0% {

		-webkit-transform: rotate(0deg);

		transform: rotate(0deg);

	}

	100% {

		-webkit-transform: rotate(359deg);

		transform: rotate(359deg);

	}

}

.ic-rotate-90 {

	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);

	-webkit-transform: rotate(90deg);

	-moz-transform: rotate(90deg);

	-ms-transform: rotate(90deg);

	-o-transform: rotate(90deg);

	transform: rotate(90deg);

}

.ic-rotate-180 {

	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);

	-webkit-transform: rotate(180deg);

	-moz-transform: rotate(180deg);

	-ms-transform: rotate(180deg);

	-o-transform: rotate(180deg);

	transform: rotate(180deg);

}

.ic-rotate-270 {

	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

	-webkit-transform: rotate(270deg);

	-moz-transform: rotate(270deg);

	-ms-transform: rotate(270deg);

	-o-transform: rotate(270deg);

	transform: rotate(270deg);

}

.ic-flip-horizontal {

	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);

	-webkit-transform: scale(-1, 1);

	-moz-transform: scale(-1, 1);

	-ms-transform: scale(-1, 1);

	-o-transform: scale(-1, 1);

	transform: scale(-1, 1);

}

.ic-flip-vertical {

	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);

	-webkit-transform: scale(1, -1);

	-moz-transform: scale(1, -1);

	-ms-transform: scale(1, -1);

	-o-transform: scale(1, -1);

	transform: scale(1, -1);

}





/* Characters as icon (letters, numbers etc.)

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ic-char {

	font-weight: bold;

	font-family: Arial, Helvetica, sans-serif !important;

}





/* Images as icons

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ic-img {

	font-family: inherit; /* Remove icon font to fix vertical alignment */

}

/* Set max size for images displayed as icons */

.ic-img img,

.icon img /* For backward compatibility */

{

	vertical-align: middle;

}







/* Iconbox - an icon with background color %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */



.ib,



/* For backward compatibility */

.social-links a > span.icon

{

	vertical-align: middle; /* TODO: check in which cases it's required */

	text-align: center;

	background-color: #e5e5e5;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

}





/* Size

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ib,

/* For backward compatibility: */

.feature > span.icon,

.social-links a > span.icon

{

	line-height: 36px;	

	width: 36px;

	height: 36px;

}

.ib-size-l,

/* For backward compatibility: */

.feature > span.icon.large

 {

	line-height: 48px;

	width: 48px;

	height: 48px;

}

.ib-size-xl {

	line-height: 60px;

	width: 60px;

	height: 60px;

}

.ib-size-xxl {

	line-height: 72px;

	width: 72px;

	height: 72px;

}

.ib-size-xxxl {

	line-height: 84px;

	width: 84px;

	height: 84px;

}



/* For backward compatibility: align center the content of the iconbox */

.feature > span.icon { text-align: center; }





/* Labels

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* Label which immediately follows the iconbox */

.ib + .label {

	line-height: 36px;

	display: inline-block;

}

.ib-size-l + .label {

	line-height: 48px;

}

.ib-size-xl + .label {

	line-height: 60px;

}

.ib-size-xxl + .label {

	line-height: 72px;

}

.ib-size-xxxl + .label {

	line-height: 84px;

}





/* Hover state

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ib-hover:hover, /* Apply hover state color only when special class is present */

.feature-icon-hover:hover .ib,



/* For backward compatibility: */

.icon-hover:hover,

.feature-icon-hover:hover > span.icon

{

	background-color: #333;

	color: #fff;

}





/* Transitions

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ib,

.icon-hover, /* For backward compatibility */

.feature-icon-hover .ib,

.feature-icon-hover .icon /* For backward compatibility */

{

	/* TODO: position animation deprecated */

	transition: 			color 300ms ease-in-out, background-color 300ms ease-in-out, background-position 300ms ease-in-out;

	-moz-transition: 		color 300ms ease-in-out, background-color 300ms ease-in-out, background-position 300ms ease-in-out;

	-webkit-transition: 	color 300ms ease-in-out, background-color 300ms ease-in-out, background-position 300ms ease-in-out;

	-o-transition: 			color 300ms ease-in-out, background-color 300ms ease-in-out, background-position 300ms ease-in-out;

}





/* Characters as icon - modify styles if inside iconbox

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.ib.ic-char,

.ib.i-char /* For backward compatibility */

{

	/*font-size: 16px;*/ /* Important: do not add font size here, it would override standard classes such as "ic-2x" */

	text-align: center;

}





/* Additional utility classes

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/



/* Background

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

/* Icon without background color */

.ib-no-bg,

.ib.no-bg-color /* For backward compatibility */

{

	background-color: transparent !important;

}



/* Shapes

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

.ib-circle,

.ib.circle /* For backward compatibility */

{

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

}

.ib-rounded,

.ib.rounded /* For backward compatibility */

{

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.ib-square,

.ib.square /* For backward compatibility */

{

	-webkit-border-radius: 0;

	-moz-border-radius: 0;

	border-radius: 0;

}



/* All icons square */

.ib-wrapper--square .ib,

.icon-wrapper-square .ib /* For backward compatibility */

{

	-webkit-border-radius: 0;

	-moz-border-radius: 0;

	border-radius: 0;

}







/* Feature - box with icons, images, text etc. %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */



/* Basic styles */

.feature { margin: 10px 0; }

.feature:after { display: block; content: "."; clear: both; font-size: 0; line-height: 0; height: 0; overflow: hidden; }

.feature.first { margin-top: 0; }

.feature.last { margin-bottom: 0; }



/* With top/bottom border line */

.feature.top-border { border-top: 1px solid #f5f5f5; padding-top: 10px; }

.feature.bottom-border { border-bottom: 1px solid #f5f5f5; padding-bottom: 10px; }



/* Wrapper with top/bottom line

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

.feature-wrapper.top-border {

	border-top: 1px solid #f5f5f5;

	margin-top: 20px;

	padding-top: 20px;

}

.feature-wrapper.bottom-border {

	border-bottom: 1px solid #f5f5f5;

	margin-bottom: 20px;

	padding-bottom: 20px;

}





/* Feature headings

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.feature .heading {

	font-size: 1.3333em; /*16px*/

	line-height: 1.25em; /*20px*/

	margin-bottom: 0.625em; /*10px*/

	font-weight: normal;

}

.feature .above-heading {

	margin: 0 0 5px;

	font-size: 11px;

	line-height: 1.4545em; /*16px*/

	text-transform: uppercase;

	color: #888;

}

.feature .below-heading {

	font-size: 1em;

	font-style: italic;

	line-height: 1.3333em; /*16px*/

	color: #888;

}





/* Feature and icons

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/



/* Floating icons - additional margin

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

.feature .ic.left {

	margin: 0 15px 10px 0;

}

.feature .ic.right {

	margin: 0 0 10px 15px;

}



/* Vertically centered icon

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

.feature.v-centered-content .v-center .ic {

	margin: 0 5px 0 0;

}





/* Indented feature

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* IMPORTANT: inside indented feature, the first level icon automatically floats left */

.feature.indent > .ic,

.feature.indent > .icon /* For backward compatibility */

{

	float: left;

	margin: 0 15px 0 0;

}

/* But override this behavior if an icon is explicitly floated right */

.feature.indent > .ic.right,

.feature.indent > .icon.right /* For backward compatibility */

{

	float: right;

	margin: 0 0 0 15px;

}



/* Size of indentation

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

/* Size of indentation = width of iconbox + right margin of the iconbox */



/* Default */

.feature.indent

{

	padding-left: 15px; /* 36 + 15 */

}

.feature.indent > .ic,

.feature.indent > span.icon /* For backward compatibility */

{

	margin-left: -51px;

}



/* Large */

.feature.indent-size-l,

.feature.indent.large /* For backward compatibility */

{

	padding-left: 63px;

}

.feature.indent-size-l > .ic,

.feature.indent.large > .ic, /* For backward compatibility */

.feature.indent.large > span.icon.large /* For backward compatibility */

{

	margin-left: -63px;

}



/* X Large */

.feature.indent-size-xl

{

	padding-left: 75px;

}

.feature.indent-size-xl > .ic

{

	margin-left: -75px;

}



/* XX Large */

.feature.indent-size-xxl

{

	padding-left: 87px;

}

.feature.indent-size-xxl > .ic

{

	margin-left: -87px;

}



/* XXX Large */

.feature.indent-size-xxxl

{

	padding-left: 99px;

}

.feature.indent-size-xxxl > .ic

{

	margin-left: -99px;

}





/* Feature centered

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

.feature.centered { text-align: center; }

.feature.centered .ic {

	margin: 0 0 10px;

}



/* Additional styles

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

*/

/* Auto-size: allow for big icons. IMPORTANT: don't use "span" tag together with "icon" in this selector! */

.feature .ic.auto-size { width: auto; max-width: none; height: auto; max-height: none; }







/* Utility classes %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */