/* 
	csw-icontextblock.css
		
	Version: [2018-01-09 16:20]
*/



/************************************** 
	FOR ALL Textblocks 
****************************************/

/* Main Container */
.cswIconTextblock {
  	display: flex;
   display: -ms-flexbox;
   -ms-flex-align: start;
  	flex-wrap: wrap; 
 	justify-content: center;
}

/* Each Individual Icon-Textblock */
.cswIconTextblock .cswIconTextblockContainer {
	display: inline-block;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
}

.cswIconTextblock .cswIconTextblockContainer .cswIconWrapper {
	display: inline-block; 
}

.cswIconTextblock .cswBtnWrapper {
    margin-bottom: 0;
    margin-right: 0;
}



/*************************************
	Icon Alignment
*************************************/	
.cswIconTextblock .cswIconWrapper i {
	/* make stacked with same width and height */
	position: relative;
   display: inline-block;
   width: 2em;
   height: 2em;
   line-height: 2em;
   vertical-align: middle;
   text-align: center; 
}

.cswIconTextblock .cswIconWrapper.cswIconStyle-plain i {
	/* override stacked for cswPlain */
	position: inherit;
   display: inline-block;
   width: initial;
   height: initial;
   line-height: initial;
   vertical-align: initial;
	margin:0;
	
	/* make fixed width */
   /* width: 1.28571429em; */
}



/*************************************
 Iconbox styles 
**************************************/

.cswIconTextblock .cswIconWrapper.cswIconStyle-circle {
    width: auto;
    height: auto;
    border-radius: 100%; 
}	

.cswIconTextblock .cswIconWrapper.cswIconStyle-rounded {
    width: auto;
    height: auto;
    border-radius: 15%; 
}	

.cswIconTextblock .cswIconWrapper.cswIconStyle-square {
    width: auto;
    height: auto;
    border-radius: 0%; 
}	

.cswIconTextblock .cswIconWrapper.cswIconStyle-plain {
	background-color: transparent;
	border: none;
	margin: 0;
	padding: 0; 
}

.cswIconTextblock .cswIconWrapper.cswOutline {
	background-color: transparent;
	border-style: solid;
	/*
	border-size: 2px; 
	border-color: black; 
	*/
}


.cswIconTextblock .cswIconTextblockContainer.cswTextAlign-left .cswIconWrapper {
	/* margin: 20px 20px 0 0; */
}

.cswIconTextblock .cswIconTextblockContainer.cswTextAlign-right .cswIconWrapper {
	/* margin: 20px 0px 0 0; */
}


/* Alignment within the Container */
.cswIconTextblock .cswIconTextblockContainer.cswTextAlign-left {
	text-align: left; 
}
.cswIconTextblock .cswIconTextblockContainer.cswTextAlign-center {
	text-align: center; 
}
.cswIconTextblock .cswIconTextblockContainer.cswTextAlign-right {
	text-align: right; 
}

/* Line - turned off by default */
.cswIconTextblock .cswLine {
	display: inline-block;
	border-top-style: solid;
	margin: 15px 0; 
}



/*===============================================
   Stacked
		
		.cswIconTextblock.cswLayout-Stacked
 *===============================================*/

 
 
/*===============================================
   Stacked Above
		
		.cswIconTextblock.cswLayout-StackedAbove
 *===============================================*/

.cswIconTextblock.cswLayout-StackedAbove .cswIconTextblockContainer {
	padding: 0 20px 20px 20px;
}
.cswIconTextblock.cswLayout-StackedAbove .cswTitle {
	margin-top:0 !important;
	padding-top:0 !important;
}
.cswIconTextblock.cswLayout-StackedAbove .cswIconWrapper {
    -webkit-transform: translateY(-51%);
    -ms-transform: translateY(-51%);
    transform: translateY(-51%);
} 

.cswIconTextblock.cswLayout-StackedAbove .cswCard {
	margin-bottom: 50px;
}
 

/*===============================================
   Icon Title On Same Line With Text Below
	
		.cswIconTextblock.cswLayout-IconTitleOnSameLine
		
 *===============================================*/
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer {
	display:block; 
}
 
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswSameLineWrapper {
	/* force centering vertically of icon and title */
	display: inline-flex;
	align-items: center; 
}
 
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconWrapper,
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswTitle {
	display: inline-block; 
}

.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer .cswTextblock {
	display:block;
	width: 100%; 
}

/* Center Icon and Title */
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer.cswTextAlign-center .cswSameLineWrapper {
	text-align: center; 
}	

.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer.cswTextAlign-right .cswSameLineWrapper {
	/* reverse the order of icon and title if right aligned */	
	flex-direction: row-reverse; 
}

.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer.cswTextAlign-left .cswIconWrapper,
.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer.cswTextAlign-center .cswIconWrapper {
    margin: 0 10px 0 0; 
}

.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswIconTextblockContainer.cswTextAlign-right .cswIconWrapper {
    margin: 0 0 0 10px; 
}

.cswIconTextblock.cswLayout-IconTitleOnSameLine .cswTitle {
	/* remove any margin or padding to align with icon */
	margin: 0 5px;
	padding: 0; 
}


/*===============================================
   Icon Next To Title And Text
	
		.cswLayout-IconNextTo
 *===============================================*/
.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-left,
.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-center {
	/* center does not make sense, so assume same as left */
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;	
	align-items: flex-start; 
}

.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-right {
	display: flex;
	flex-direction: row-reverse;
	flex-wrap: nowrap;	
	align-items: flex-start; 
}

.cswIconTextblock.cswLayout-IconNextTo .cswTextblock {
	display: inline-block; 
}

.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-left .cswIconWrapper,
.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-center .cswIconWrapper {
    margin: 0 1em 0 0; 
}

.cswIconTextblock.cswLayout-IconNextTo .cswIconTextblockContainer.cswTextAlign-right .cswIconWrapper {
    margin: 0 0 0 10px; 
}

.cswIconTextblock.cswLayout-IconNextTo .cswTitle {
	/* remove any padding on item, so it aligns top */
	margin-top: 0;
	padding-top: 0;	 
}

/* Border on Bottom (except last row) */
.cswIconTextblock.cswLayout-IconNextTo.cswBorderOnBottom .cswIconTextblockContainer {
	border-bottom: 1px solid; 
}



/*===============================================
   Two Column Wrap
	
		.cswIconTextblock.cswLayout-TwoColumnWrap
 *===============================================*/
 
 .cswIconTextblock.cswLayout-TwoColumnWrap {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
 }
 
.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconTextblockContainer {
	display: flex;
	align-items: flex-start;
/**	
	width: calc( (100% - 15px) / 2) !important; 
	margin: 0 0 15px 0; 
**/	
	text-align: left;
}

.cswIconTextblock.cswLayout-TwoColumnWrap .cswTextblock {
	display: inline-block; 
	text-align: left;
}

.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconWrapper {
	margin: 0 10px 20px 5px; 
}

.cswIconTextblock.cswLayout-TwoColumnWrap .cswTitle {
	margin-top: 0;
	padding-top: 0; 
}

/* Odd Children - Icon on Right */
.cswIconTextblock.cswLayout-TwoColumnWrap .cswCard:nth-child(odd) .cswIconTextblockContainer {
	flex-direction: row-reverse;
	text-align: right;
	margin-right: 15px;	
}
.cswIconTextblock.cswLayout-TwoColumnWrap  .cswCard:nth-child(odd) .cswIconTextblockContainer .cswTextblock {
	text-align: right;
}

.cswIconTextblock.cswLayout-TwoColumnWrap  .cswCard:nth-child(odd) .cswIconTextblockContainer .cswIconWrapper {
	margin: 0 5px 20px 10px; 
}

.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconWrapper.cswIconStyle-plain i {
	/* make fixed width */
   width: 1.28571429em;
	margin: 0 0;
}

/* Two Column Wrap for Handheld force to 100% */
@media (max-width: 768px) {
	.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconTextblockContainer {
		width: 100% !important;
		padding: 10px;	/*instead of 20px */
	}

	.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconTextblockContainer .cswIconWrapper {
		margin: 0 10px 20px 0px !important; 
	}
	
	/* force left aligned for mobile */
	.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconTextblockContainer:nth-child(odd) {
		flex-direction: row;
		text-align: left;
	} 
	/* force left aligned for mobile */
	.cswIconTextblock.cswLayout-TwoColumnWrap .cswIconTextblockContainer:nth-child(odd) .cswTextblock {
		text-align: left;
	} 	
}	





/***********************************************************************
 COLORS
 ***********************************************************************/

.cswIconTextblock .cswOutlined {
	border-style: solid; 
}


/* Title Color - link */
/* color definitions title with link */
.cswIconTextblock .cswTitle a,
.cswIconTextblock .cswTitle a:visited,
.cswIconTextblock .cswTitle a:hover,
.cswIconTextblock .cswTitle a:focus,
.cswIconTextblock .cswTitle a:active {
	color: inherit; }


/* icon sizes
 */
.cswIconTextblock .cswIconSize-sm { font-size: 1em; } 
.cswIconTextblock .cswIconSize-md { font-size: 1.5em; }
.cswIconTextblock .cswIconSize-lg { font-size: 2em; }
.cswIconTextblock .cswIconSize-xl { font-size: 4em; }
.cswIconTextblock .cswIconSize-1x { font-size: 1em; }
.cswIconTextblock .cswIconSize-2x { font-size: 2em; }
.cswIconTextblock .cswIconSize-3x { font-size: 3em; }
.cswIconTextblock .cswIconSize-4x { font-size: 4em; }
.cswIconTextblock .cswIconSize-5x { font-size: 5em; }
.cswIconTextblock .cswIconSize-6x { font-size: 6em; }
.cswIconTextblock .cswIconSize-7x { font-size: 7em; }
.cswIconTextblock .cswIconSize-8x { font-size: 8em; }
.cswIconTextblock .cswIconSize-9x { font-size: 9em; }
.cswIconTextblock .cswIconSize-10x { font-size: 10em; }


