.featured-content {
	margin: 3rem 0 0 0;
	padding: 0;
}
.section {
	border: 0 !important;
	padding-top: 0 !important;
}
.featured-content .container .section-header {
	border-top: 1px solid #dee2e6;
	padding-top: 2rem;
}
/* Read More Button */
.link-collapse-more:hover > *,
.link-collapse-less:hover > * {
	cursor: pointer;
	text-decoration: underline;
}
.link-collapse-more:after {
	content: "\f107";
}
.link-collapse-less:after {
	content: "\f106";
}
/* Tabbed Title */
.nav-link__title {
	font-weight: normal;
	margin-bottom: 0;
	line-height: 1.5;
}
.tab-pane-header a {
	display: none
}
.ui.popup {
	max-width: 50%;
}
@media (min-width: 576px) {
	section-sm-border {
		border: 0;
	}
}
@media (max-width: 575.98px) {
	.featured-page .featured-content .section:not(:first-child) {
		padding-top: 0;
		padding-bottom: 0;
	}
	.article-page-tabbed .tab-content > .tab-pane {
		margin-bottom: 1.5rem !important;
	}
	.tabs-collapse-sm > .tab-content > * + * {
		margin-top: 1.5rem !important;
	}
	.tab-pane-header {
		border: 1px solid #dee2e6;
		background: #f6f7f8;
		-webkit-box-shadow: 2px 2px 8px 0px rgb(0 0 0 / 15%);
		box-shadow: 2px 2px 8px 0px rgb(0 0 0 / 15%);
		margin-bottom: 1rem;
	}
	.tab-pane-header h3 {
		margin-top: 0.5rem;
	}
	.tab-pane-header a {
		display: block;
		line-height: 2.7rem;
		margin-top: -2.5rem;
	}
	.link-collapse-less.collapsed:after {
		content: "\f107";
	}
}
.padding_tab.collapse.show {
	padding-bottom: 1.5rem;
}

/* Tab_1-1 Seamless Switching
========================================= */
.swapimg-container {
	position: relative;
	margin: 0 auto;
	background-color: #000;
	-webkit-box-shadow: 0px 0px 0px 7px rgb(0 0 0);
	-moz-box-shadow: 0px 0px 0px 7px rgba(0, 0, 0, 1);
	box-shadow: 0px 0px 0px 7px rgb(0 0 0);
	overflow: hidden;
	width: 648px;
	height: 430px;
	max-width: 97%;
}
.swapimg-1, .swapimg-2 {
	position: absolute;
/*		background-size: contain !important;*/
	width: inherit;
	height: inherit;
}
.swapimg-1 {
	background: url(../jpg/seamless-switching-1-lgrvur.jpg) no-repeat;
}
.swapimg-2 {
	background: url(../jpg/seamless-switching-2-lgnd76.jpg) no-repeat;
}

@media (max-width: 600px) {
	.swapimg-container {
		-webkit-box-shadow: 0px 0px 0px 5px rgb(0 0 0);
		-moz-box-shadow: 0px 0px 0px 5px rgba(0, 0, 0, 1);
		box-shadow: 0px 0px 0px 5px rgb(0 0 0);
		width: 550px;
		height: 365px;
	}
	.swapimg-1 {
		background: url(../jpg/seamless-switching-175kr.jpg) no-repeat;
	}
	.swapimg-2 {
		background: url(../jpg/seamless-switching-2i1xl.jpg) no-repeat;
	}
}
@media (max-width: 460px) {
	.swapimg-container {
		-webkit-box-shadow: 0px 0px 0px 3px rgb(0 0 0);
		-moz-box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 1);
		box-shadow: 0px 0px 0px 3px rgb(0 0 0);
		width: 417px;
		height: 277px;
	}
	.swapimg-1 {
		background: url(../jpg/seamless-switching-1-sm1nqm.jpg) no-repeat;
	}
	.swapimg-2 {
		background: url(../jpg/seamless-switching-2-sm40co.jpg) no-repeat;
	}
}

.cut-in {
	opacity: 1;
}
.cut-out {
	opacity: 0;
}

.dissolve-in {
	animation-name: fadingin;
	-webkit-animation-name: fadingin;
	animation-duration: .8s;
	-webkit-animation-duration: .8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes fadingin {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fadingin {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.dissolve-out {
	animation-name: fadingout;
	-webkit-animation-name: fadingout;
	animation-duration: .8s;
	-webkit-animation-duration: .8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes fadingout {
	100% {
		opacity: 0;
	}
}
@keyframes fadingout {
	100% {
		opacity: 0;
	}
}

.wipes-out.wipes-up, .wipes-out.wipes-right, .wipes-in.wipes-left, .wipes-in.wipes-down {
	z-index: 10;
}
.wipes-in, .wipes-out {
	opacity: 1;
}

.wipes-in.wipes-left {
	animation-name: slideleft;
	-webkit-animation-name: slideleft;
	animation-duration: 0.8s;
	-webkit-animation-duration: 0.8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes slideleft {
	0% {
		width: 0px;
	}
	100% {
		width: inherit;
	}
}
@keyframes slideleft {
	0% {
		width: 0px;
	}
	100% {
		width: inherit;
	}
}

.wipes-out.wipes-right {
	animation-name: slideright;
	-webkit-animation-name: slideright;
	animation-duration: 0.8s;
	-webkit-animation-duration: 0.8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes slideright {
	0% {
		width: inherit;
	}
	100% {
		width: 0px;
	}
}
@keyframes slideright {
	0% {
		width: inherit;
	}
	100% {
		width: 0px;
	}
}

.wipes-out.wipes-up {
	animation-name: slideup;
	-webkit-animation-name: slideup;
	animation-duration: 0.8s;
	-webkit-animation-duration: 0.8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-out;
}
@-webkit-keyframes slideup {
	0% {
		height: inherit;
	}
	100% {
		height: 0px;
	}
}
@keyframes slideup {
	0% {
		height: inherit;
	}

	100% {
		height: 0px;
	}
}

.wipes-in.wipes-down {
	animation-name: slidedown;
	-webkit-animation-name: slidedown;
	animation-duration: 0.8s;
	-webkit-animation-duration: 0.8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-timing-function: ease-out;
}
@-webkit-keyframes slidedown {
	0% {
		height: 0px;
	}
	100% {
		height: inherit;
	}
}
@keyframes slidedown {
	0% {
		height: 0px;
	}
	100% {
		height: inherit;
	}
}
/* End of Seamless Switching
=================================================*/

/* Tab_1-2 Preview & Program Outputs
========================================= */
.preview-screen,
.program-screen {
	position: relative;
	overflow:hidden;
}
.preview-screen .overlay-img img,
.program-screen .overlay-img img {
	position: absolute;
	width: inherit;
	top: 0%;
	left: 0%;
}
.program-screen {
	max-width: 490px;
}
.audience img {
	width: 90%;
}
.behind-screen {
	z-index: 0;
}
.preview-screen {
	z-index: 10;
}
.change {
	-webkit-animation: fade 1s;
	animation: fade 1s;
}
.change2 {
	-webkit-animation: fade2 1s;
	animation: fade2 1s;
}
@keyframes fade {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes fade2 {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
/* End of Preview & Program Outputs
=================================================*/

/* Tab_1-3 4K/60 4:4:4
========================================= */
.fourk-logo {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 15%;
	flex: 0 0 15%;
	min-width: 5rem;
	max-width: 9rem;
}
@media (max-width: 767.98rem) {
	#chromefourtwo {
		font-size: .8rem;
	}
	#chromefourfour {
		font-size: .8rem;
	}
}

/* Tab_1-4 Picture in Picture
========================================= */
.pip-canvas {
	position: relative;
	max-width: 662px;
	margin: 1 auto;
	overflow: hidden;
}
@media (max-width: 700px) {
	.pip-canvas {
		width: 100%;
	}
}
.pip-overlay-img {
	position: absolute;
	width: 58%;
	left: 38%;
	top: 20%;
}
.nonvisible {
	position: absolute;
	opacity: 0;
	transition: ease-out;
	transition-duration: 1s;
}
.visible {
	position: absolute;
	opacity: 1;
	transition: ease-in;
	transition-duration: 1s;
}

/* Tab_2-1 Keying Effects
========================================= */
.draggable-canvas {
	position: relative;
	max-width: 982px;
	margin: 0 auto;
}
.draggable-container {
	position: absolute;
	top: 4%;
	right: 16.4%;
	width: 67%;
	height: 88%;
}
.draggable-item {
	width: 10%;
	top: 11%;
	left: 3%;
	min-width: 40px
}
.draggable-item img {
	width: 100%;
}

/* Tab_2-2 Matrix Mode
========================================= */
.embedding-canvas {
	position: relative;
	display: block;
	width: 100%;
	overflow:  hidden;
	background-color: #fff;
}
.embedding-canvas img.embedding-diagram {
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.overlay-img.switcher-1 {
	position: absolute;
	width: 10.3%;
	left: 28.8%;
	top: 37%;
}
.overlay-img.program {
	position: absolute;
	width: 25.2%;
	left: 74%;
	top: 8.9%;
}
.img-fluid.front {
	position: absolute;
	z-index: 10;
}
.img-fluid.behind {
	z-index: 5;
}
.overlay-img.switcher-2 {
	position: absolute;
	width: 10.3%;
	left: 28.8%;
	top: 64%;
}
.overlay-img.preview {
	position: absolute;
	width: 15.5%;
	left: 79%;
	top: 70.6%;
}
.transition1 {
	animation-name: transition1;
	-webkit-animation-name: transition1;
	animation-duration: .8s;
	-webkit-animation-duration: .8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-timing-function: ease-in;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes transition1 {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}
@keyframes transition1 {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.transition2 {
	animation-name: transition2;
	-webkit-animation-name: transition2;
	animation-duration: .8s;
	-webkit-animation-duration: .8s;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-timing-function: ease-in;
	-webkit-animation-timing-function: ease-in;
}
@-webkit-keyframes transition2 {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}
@keyframes transition2 {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

/* Tab_2-3 Audio Management
========================================= */
.callout-list-item__title{
	font-size: 1.1em;
}
.callout-list-item{
	padding-left: 2.25rem;
	background-color: #e2f0ff;
	border: 2px solid #fff;
}
.callout-list-item:before{
	content: attr(data-point);
	position: absolute;
	font-size: 1.1rem;
	font-weight: 500;
	top: .35rem;
	left: 1rem;
}
.callouts-container:hover .callout-points .callout-point.active:before, .callouts-container:hover .callout-points .callout-point:hover:before {
	color: #fff;
	background: #0069d9;
	border: 1px solid #0069d9;
	-webkit-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.5), -3px -3px 10px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.5), -3px -3px 10px 0px rgba(0, 0, 0, 0.5);
}
.callout-list-item:hover, .callout-list-item.active {
	color: #fff;
	background-color: #0069d9;
	border: 1px solid #0069d9;
	-webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.callouts-container .callout-points .callout-point:before {
	margin-left: -0.7rem;
	margin-top: -0.7rem;
}
@media (max-width: 991.98px) and (min-width: 576px) {
	.callout-list-item{
		padding-right: 0.5rem !important;
	}
}

/* Tab_2-4 Flexible System Control
================================================================ */
#flexible-system .iss608-img {
	width: 90%
}
.usb img {
	width: 70%;
}
.rs232 img {
	width: 35%;
	margin-top: 3%;
}
.ethernet img {
	width:100%;
}
@media (max-width: 767.98px) {
	#flexible-system .iss608-img {
		width: 93%
	}
	.usb img {
		width: 80%;
	}
	.rs232 img {
		width: 50%;
	}
}
@media (max-width: 575.98px) {
	#flexible-system figcaption {
		font-size: 90%
	}
	.usb img {
		width: 90%;
	}
	.rs232 img {
		width: 60%;
	}
	.ethernet {
		padding-left: 0;
	}
}

/* Tab_3-1 Vector 4K
========================================= */
.vector-logo {
	align-self: self-end;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 25%;
	flex: 0 0 25%;
	min-width: 8rem;
	max-width: 15rem;
}
.vector-logo.col img {
	padding-bottom: 0.3rem;
}
@media (max-width: 625px) {
	.vector-header {
		text-align: right;
		max-width: min-content;
	}
}