/* 
	csw-tabs-vertical.css
	
	Version: [2018-01-07 16:55]
*/

.cswTabsVert * {
    box-sizing: border-box;
}

.cswTabsVert .cswTabWrapper {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
}


/********************/
/* Tabbar Alignment */
/********************/
.cswTabsVert.cswTabVert-left .cswTabBar {
	float:left;
}
.cswTabsVert.cswTabVert-right .cswTabBar {
	float:right;
}

.cswTabsVert .cswTabBar {
	width: 50%;
	display: inline-block;
}
.cswTabsVert .cswTabContainers {
	width: 50%;
	display: inline-block;
}


/***************/
/*** Content ***/
/***************/
.cswTabsVert .tab-content  {
    margin-top: 10px;
}


.cswTabsVert .cswContentWrap {
	position: relative;
	color: black;
}

.cswTabsVert .cswContentWrap section {
	display: none;
}

.cswTabsVert .cswContentWrap section.content-current {
	display: block;
}


/*************/ 
/**** Nav ****/
/*************/
.cswTabsVert > div > nav ul {
	position: relative;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}



/*********************/
/* Tabs 					*/
/*********************/

.cswTabsVert > div > nav ul > li {
	position: relative;
	display: block;
	width: 100%;
	z-index: 1;
	margin: 0;
	text-align: left;
}

/* make current tab not have border on appropriate side */
.cswTabsVert.cswTabVert-left:not(.cswTab-iconcircle) nav > ul > li.tab-current > a {
	border-right: none !important;
}
.cswTabsVert.cswTabVert-right:not(.cswTab-iconcircle) nav > ul > li.tab-current > a {
	border-left: none !important;
}

.cswTabsVert > div > nav > ul > li > a,
.cswTabsVert > div > nav > ul > li > a .cswInner,
.cswTabsVert .cswTabContent a.tabAccordionHeader,
.cswTabsVert .cswTabContent a.tabAccordionHeader .cswInner {
	position: relative;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* text-decoration on hover & focus */
.cswTabsVert > div > nav > ul > li > a:hover,
.cswTabsVert .cswTabContent a.tabAccordionHeader:hover,
.cswTabsVert > div > nav > ul > li > a:focus,
.cswTabsVert .cswTabContent a.tabAccordionHeader:focus {
	text-decoration: none;
}


.cswTabsVert > div > nav > ul > li > a:focus,
.cswTabsVert .cswTabContent a.tabAccordionHeader:focus {
	outline: none;
}
.cswTabsVert > div > nav > ul > li.tab-current > a:focus,
.cswTabsVert .cswTabContent.content-current a.tabAccordionHeader:focus {
	opacity: .9;
}


/*******************/
/*** Tab Corners ***/
/*******************/

/* slightly rounded */
.cswTabsVert.cswTabCorners-slightlyrounded nav > ul > li > a,
.cswTabsVert.cswTabCorners-slightlyrounded .cswTabContent a.tabAccordionHeader {
	border-radius: 4px 0px 0px 4px;
}

/* rounded */
.cswTabsVert.cswTabCorners-rounded nav > ul > li > a,
.cswTabsVert.cswTabCorners-rounded .cswTabContent a.tabAccordionHeader {
	border-radius: 10px 0px 0px 10px;
}

/* very rounded */
.cswTabsVert.cswTabCorners-veryrounded nav > ul > li > a,
.cswTabsVert.cswTabCorners-veryrounded .cswTabContent a.tabAccordionHeader {
	border-radius: 20px 0px 0px 20px;
}



/*****************/
/* Icon Position */
/*****************/

.cswTabsVert.cswTabIconAlign-left ul > li > a i,
.cswTabsVert.cswTabIconAlign-left .cswTabContent a.tabAccordionHeader i {
	margin-right: .25em;
}
.cswTabsVert.cswTabIconAlign-right ul > li > a i,
.cswTabsVert.cswTabIconAlign-right .cswTabContent a.tabAccordionHeader i {
	margin-left: .25em;
}
.cswTabsVert.cswTabIconAlign-top ul > li > a i,
.cswTabsVert.cswTabIconAlign-top ul > li > a .cswInner,
.cswTabsVert.cswTabIconAlign-top .cswTabContent a.tabAccordionHeader i,
.cswTabsVert.cswTabIconAlign-top .cswTabContent a.tabAccordionHeader .cswInner {
	display:block;
	text-align:center;
}


/* Fallback */
.cswTabsVert .no-js .cswContentWrap section {
	display: block;
	padding-bottom: 2em;
	border-bottom: 1px solid rgba(255,255,255,0.6);
}

.cswTabsVert .no-flexbox nav ul {
	display: block;
}

.cswTabsVert .no-flexbox nav ul li {
	min-width: 15%;
	display: inline-block;
}

/*********************/
/* Accordion Headers */
/*********************/
.cswTabsVert .cswTabContent a.tabAccordionHeader {
	display: block;
}




/*******************************/
/*** Responsive Device Sizes ***/ 
/*******************************/

/*--- XX-Small Devices ---*/
@media (max-width: 479px) { 
	.cswTabsVert.cswTabbarWidth-20-xxs .cswTabBar { width: 20%; }
	.cswTabsVert.cswTabbarWidth-25-xxs .cswTabBar { width: 25%; }
	.cswTabsVert.cswTabbarWidth-30-xxs .cswTabBar { width: 30%; }
	.cswTabsVert.cswTabbarWidth-40-xxs .cswTabBar { width: 40%; }
	.cswTabsVert.cswTabbarWidth-50-xxs .cswTabBar { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-xxs .cswTabBar { width: 100%; }

	.cswTabsVert.cswTabbarWidth-20-xxs .cswTabContainers { width: 80%; }
	.cswTabsVert.cswTabbarWidth-25-xxs .cswTabContainers { width: 75%; }
	.cswTabsVert.cswTabbarWidth-30-xxs .cswTabContainers { width: 70%; }
	.cswTabsVert.cswTabbarWidth-40-xxs .cswTabContainers { width: 60%; }
	.cswTabsVert.cswTabbarWidth-50-xxs .cswTabContainers { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-xxs .cswTabContainers { width: 100%; }
}

/*--- X-Small Devices ---*/
@media (min-width: 480px) and (max-width: 767px) { 
	.cswTabsVert.cswTabbarWidth-20-xs .cswTabBar { width: 20%; }
	.cswTabsVert.cswTabbarWidth-25-xs .cswTabBar { width: 25%; }
	.cswTabsVert.cswTabbarWidth-30-xs .cswTabBar { width: 30%; }
	.cswTabsVert.cswTabbarWidth-40-xs .cswTabBar { width: 40%; }
	.cswTabsVert.cswTabbarWidth-50-xs .cswTabBar { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-xs .cswTabBar { width: 100%; }

	.cswTabsVert.cswTabbarWidth-20-xs .cswTabContainers { width: 80%; }
	.cswTabsVert.cswTabbarWidth-25-xs .cswTabContainers { width: 75%; }
	.cswTabsVert.cswTabbarWidth-30-xs .cswTabContainers { width: 70%; }
	.cswTabsVert.cswTabbarWidth-40-xs .cswTabContainers { width: 60%; }
	.cswTabsVert.cswTabbarWidth-50-xs .cswTabContainers { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-xs .cswTabContainers { width: 100%; }
}

/*--- Small devices ---*/
@media (min-width: 768px) and (max-width: 991px) { 
	.cswTabsVert.cswTabbarWidth-20-sm .cswTabBar { width: 20%; }
	.cswTabsVert.cswTabbarWidth-25-sm .cswTabBar { width: 25%; }
	.cswTabsVert.cswTabbarWidth-30-sm .cswTabBar { width: 30%; }
	.cswTabsVert.cswTabbarWidth-40-sm .cswTabBar { width: 40%; }
	.cswTabsVert.cswTabbarWidth-50-sm .cswTabBar { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-sm .cswTabBar { width: 100%; }

	.cswTabsVert.cswTabbarWidth-20-sm .cswTabContainers { width: 80%; }
	.cswTabsVert.cswTabbarWidth-25-sm .cswTabContainers { width: 75%; }
	.cswTabsVert.cswTabbarWidth-30-sm .cswTabContainers { width: 70%; }
	.cswTabsVert.cswTabbarWidth-40-sm .cswTabContainers { width: 60%; }
	.cswTabsVert.cswTabbarWidth-50-sm .cswTabContainers { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-sm .cswTabContainers { width: 100%; }
}

/*--- Medium devices ---*/
@media (min-width: 992px) and (max-width: 1199px) { 
	.cswTabsVert.cswTabbarWidth-20-md .cswTabBar { width: 20%; }
	.cswTabsVert.cswTabbarWidth-25-md .cswTabBar { width: 25%; }
	.cswTabsVert.cswTabbarWidth-30-md .cswTabBar { width: 30%; }
	.cswTabsVert.cswTabbarWidth-40-md .cswTabBar { width: 40%; }
	.cswTabsVert.cswTabbarWidth-50-md .cswTabBar { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-md .cswTabBar { width: 100%; }

	.cswTabsVert.cswTabbarWidth-20-md .cswTabContainers { width: 80%; }
	.cswTabsVert.cswTabbarWidth-25-md .cswTabContainers { width: 75%; }
	.cswTabsVert.cswTabbarWidth-30-md .cswTabContainers { width: 70%; }
	.cswTabsVert.cswTabbarWidth-40-md .cswTabContainers { width: 60%; }
	.cswTabsVert.cswTabbarWidth-50-md .cswTabContainers { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-md .cswTabContainers { width: 100%; }
}

@media (min-width: 1200px) {
	.cswTabsVert.cswTabbarWidth-20-lg .cswTabBar { width: 20%; }
	.cswTabsVert.cswTabbarWidth-25-lg .cswTabBar { width: 25%; }
	.cswTabsVert.cswTabbarWidth-30-lg .cswTabBar { width: 30%; }
	.cswTabsVert.cswTabbarWidth-40-lg .cswTabBar { width: 40%; }
	.cswTabsVert.cswTabbarWidth-50-lg .cswTabBar { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-lg .cswTabBar { width: 100%; }

	.cswTabsVert.cswTabbarWidth-20-lg .cswTabContainers { width: 80%; }
	.cswTabsVert.cswTabbarWidth-25-lg .cswTabContainers { width: 75%; }
	.cswTabsVert.cswTabbarWidth-30-lg .cswTabContainers { width: 70%; }
	.cswTabsVert.cswTabbarWidth-40-lg .cswTabContainers { width: 60%; }
	.cswTabsVert.cswTabbarWidth-50-lg .cswTabContainers { width: 50%; }
	.cswTabsVert.cswTabbarWidth-100-lg .cswTabContainers { width: 100%; }
}


/* transitions */
.cswTabsVert > div > nav > ul > li > a,
.cswTabsVert .cswTabContent a.tabAccordionHeader {
	-webkit-transition: background-color 0.5s;
   -moz-transition: background-color 0.5s;
   -o-transition: background-color 0.5s;
   -ms-transition: background-color 0.5s;
   transition: background-color 0.5s;
}




/* slightly rounded */
.cswTabsVert.cswTabs-pills nav > ul > li > a,
.cswTabsVert.cswTabs-pills .cswTabContent a.tabAccordionHeader {
	border-radius: 4px 4px 4px 4px;
	border: none !important;
}


/* rounded */
.cswTabsVert.cswTabs-pills.cswTabCorners-rounded nav > ul > li > a,
.cswTabsVert.cswTabs-pills.cswTabCorners-rounded .cswTabContent a.tabAccordionHeader {
	border-radius: 10px 10px 10px 10px;
	border: none !important;
}

/* very rounded */
.cswTabsVert.cswTabs-pills.cswTabCorners-veryrounded nav > ul > li > a,
.cswTabsVert.cswTabs-pills.cswTabCorners-veryrounded .cswTabContent a.tabAccordionHeader {
	border-radius: 20px 20px 20px 20px;
	border: none !important;
}


/*****************************/
/* Slanted */
/*****************************/

.cswTabsVert.cswTabs-slanted nav ul li,
.cswTabsVert.cswTabs-slanted .cswTabContent {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}


.cswTabsVert.cswTabs-slanted nav ul li a,
.cswTabsVert.cswTabs-slanted .cswTabContent a.tabAccordionHeader {
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

/* left */
.cswTabsVert.cswTabVert-left.cswTabs-slanted nav ul li a,
.cswTabsVert.cswTabVert-left.cswTabs-slanted .cswTabContent a.tabAccordionHeader {
	padding: 0 1.5em 0 0.3em;
}
/* right */
.cswTabsVert.cswTabVert-right.cswTabs-slanted nav ul li a,
.cswTabsVert.cswTabVert-right.cswTabs-slanted .cswTabContent a.tabAccordionHeader {
	padding: 0 .3em 0 1.5em;
	text-align: right;
}


@media screen and (max-width: 54em) {
	.cswTabsVert.cswTabVert-left.cswTabs-slanted nav ul li a,
	.cswTabsVert.cswTabVert-left.cswTabs-slanted .cswTabContent a.tabAccordionHeader {
		padding: 0 0.5em 0 0.3em;
	}
	.cswTabsVert.cswTabVert-right.cswTabs-slanted nav ul li a,
	.cswTabsVert.cswTabVert-right.cswTabs-slanted .cswTabContent a.tabAccordionHeader {
		padding: 0 0.3em 0 0.5em;
	}
}

.cswTabsVert.cswTabs-slanted nav ul li a::after,
.cswTabsVert.cswTabs-slanted .cswTabContent a.tabAccordionHeader::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	content: '';
	outline: 1px solid transparent;
	-webkit-transform: perspective(5px) rotateX(0.93deg) translateZ(-1px);
	transform: perspective(5px) rotateX(0.93deg) translateZ(-1px);
	box-shadow: inset 0 -3px 3px rgba(0,0,0,0.05);	
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.cswTabsVert.cswTabVert-left.cswTabs-slanted nav ul li a::after,
.cswTabsVert.cswTabVert-left.cswTabs-slanted .cswTabContent a.tabAccordionHeader::after {
	border-radius: 10px 10px 0 0;
	-webkit-transform-origin: left 0;
	transform-origin: left 0;
}
.cswTabsVert.cswTabVert-right.cswTabs-slanted nav ul li a::after,
.cswTabsVert.cswTabVert-right.cswTabs-slanted .cswTabContent a.tabAccordionHeader::after {
	border-radius: 10px 0 0 10px;
	-webkit-transform-origin: right 0;
	transform-origin: right 0;
}

.cswTabsVert.cswTabs-slanted nav ul li.tab-current a::after,
.cswTabsVert.cswTabs-slanted .content-wrap,
.cswTabsVert.cswTabs-slanted .cswTabContent.content-current a.tabAccordionHeader::after {
	box-shadow: none;
}
.cswTabsVert.cswTabs-slanted nav ul .cswInner,
.cswTabsVert.cswTabs-slanted .cswTabContent .cswInner {
    z-index: 3;
}

.cswTabsVert.cswTabs-slanted .cswTabContent {
	position: relative;
	z-index: 2;
}

.cswTabsVert.cswTabs-slanted .cswContentAWrapper {
	position: relative;
}

/************/
/* Triangle */
/************/

.cswTabsVert.cswTab-triangle nav > ul > li > a {
	overflow: visible;
}

/* for left side tab bar */
.cswTabsVert.cswTabVert-left.cswTab-triangle nav ul > li.tab-current > a::after {
	position: absolute;
	top: 50%;
	margin-top: -10px;
 	right: -19px;
   width: 0;
   height: 0;
   border: solid transparent;
   border-width: 10px;
   content: '';
   pointer-events: none;
}

/* for right side tab bar */
.cswTabsVert.cswTabVert-right.cswTab-triangle nav ul > li.tab-current > a::after {
	position: absolute;
	top: 50%;
	margin-top: -10px;
 	left: -19px;
   width: 0;
   height: 0;
   border: solid transparent;
   border-width: 10px;
   content: '';
   pointer-events: none;
}

/******************/
/* Icon in Circle */
/******************/

.cswTabsVert.cswTab-iconcircle nav > ul > li > a,
.cswTabsVert.cswTab-iconcircle nav > ul > li .cswInner,
.cswTabsVert.cswTab-iconcircle .cswTabContent a,
.cswTabsVert.cswTab-iconcircle .cswTabContent a .cswInner {
	overflow: visible;
}

.cswTabsVert.cswTab-iconcircle nav > ul > li > a i,
.cswTabsVert.cswTab-iconcircle .cswTabContent a i {
   position: absolute;
   border-radius: 50%;
	border-style: solid;
   top: 50%;
	margin-right: 0;
	text-align:center;
}

.cswTabsVert.cswTab-iconcircle nav > ul > li > a i,
.cswTabsVert.cswTab-iconcircle nav > ul > li > a span,
.cswTabsVert.cswTab-iconcircle nav > ul > li > a .cswInner,
.cswTabsVert.cswTab-iconcircle .cswTabContent a,
.cswTabsVert.cswTab-iconcircle .cswTabContent a span,
.cswTabsVert.cswTab-iconcircle .cswTabContent a .cswInner {
	transition: color 0s, width .5s, height .5s, background-color .5s;
}

.cswTabsVert.cswTab-iconcircle nav > ul > li > a span,
.cswTabsVert.cswTab-iconcircle .cswTabContent a span {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
}
