* { font-family: proxima-nova, sans-serif; padding: 0;	margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#main { font-size: calc(15px + 0.234375vw); }
#main h1 { color: #474747; border-bottom: 0px; display:inline-block; min-width: 75px;
	font-weight: 700; font-style: normal;font-size: 2.4rem; padding-bottom: calc(0.625vw); line-height: 100%; }
#main h2 { font-weight: 600; font-style: normal; font-size: 1.89rem; padding-bottom: calc(0.9375vw); line-height: 100%; color: #16588e;  }
#main h3 { font-weight: 400; font-size: 1.2rem; padding-bottom: calc(16px + 0.78125vw); line-height: 100%; color: #000; letter-spacing: 0.03rem; text-align: left; }
#main h3 a { font-weight: 600; }
#main h3 b { font-weight: 700; line-height: 100%; text-decoration: none; font-size: 1.2rem; }
#main h4 { font-weight: 500; line-height: 100%; color: #000; font-size: 1.05rem; }
#main h4 b, #main h4 a { font-weight: 700; line-height: 100%; text-decoration: none; font-size: 1.05rem; }

#main .b { font-weight: 800; padding:0; margin:0; font-size: 16px; }
#main p, p a { font-weight: 400; font-style: normal; font-size: 18px; line-height: 110%;  }
#main p b { font-size: 18px; }
#main p a { text-decoration: none; }

.flex1 { display: flex; justify-content: flex-start; flex-direction: row; gap:6px; align-items: baseline; } 
.center3 { display: flex; justify-content: center; align-items: flex-end; height: auto; border: 0; padding: 10px; margin:0; } 
.sfimg {float: none; max-width: 80%; margin-left: 0px; border: 0; display: block; margin: 10px auto 30px; width: 80%; height: auto; }

#main li { padding-bottom: 12px; text-align: justify; }
#main ul { padding-left: 18px; }

.centerbtn { margin:0; position: relative; left: 33%; -ms-transform: translate(-33%,0%); transform: translate(-33%,0%); }
.SBbuttontop a, .SBbuttonlast a { font-weight: 700; font-style: normal; border: 1px solid; border-color: #666666; padding:calc(0.625vw) calc(0.390625vw); color:#eee; text-decoration:none; display:block; width:14%; text-align:center; margin:4px 0 0 14px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; font-size: 1.22rem; vertical-align: middle; min-width: 200px; background-color: #007eed; }  
.SBbuttontop a:hover { background-color:#fff; color: #007eed; border-color: #007eed; }
.SBbuttontop a:active {position:relative; top:1px;}

button[class^='accordion-'] { padding: 4px 8px ; }
button[class^='accordion-'] h0 { font-size: 1.2rem; }
cp2{font-family: proxima-nova, sans-serif; font-size:1rem; margin-left:1.667em; font-weight:bold;}
cp3{font-family: proxima-nova, sans-serif; font-size:1rem; margin-left:0.833em;}

.fbox a { text-decoration: none; font-weight: normal; line-height: 120%; font-size: 1.3em; }
.flex1 p { text-decoration: none; font-weight: normal; line-height: 120%; font-size: 1.3em !important; color: #b00000; }

span.topics { display:inline-block;margin-left:1.5em;margin-top:0;margin-bottom:5px;text-align:justify;text-justify:inter-word;max-width:75%; } 
.topicsd { display: block; margin: 5px; overflow:hidden; }

/* HTable used for Home Table*/
/*.Htable {  display: flex;  flex-wrap: wrap;  margin: 0 0 0.5em 0;  padding: 0;  max-width: inherit;  border: 0px solid #CCC;	align-items: center;}*/

.Htable { margin: 0 0 1em 0; padding: 0;  border: 0px solid #CCC; align-items: center; justify-content: center;}
.Htable p { margin-bottom: 8px !important; }

.Htable-cell, .Htable-cell2 { display: table-cell;  box-sizing: border-box;  flex-grow: 1;  width: 100%;  height: 180px;  overflow: hidden;  list-style: none;  border: solid 3px white;  margin: 0;  min-width: 140px;  color:  white;}
.Htable-cell .text-block { position: absolute;  bottom: 20px;  right: 20px;  background-color: black;  color: white;  padding-left: 20px;  padding-right: 20px;}

.Htable-cell2 {	line-height: 120%; border: 1px solid #ccc;}

.Htable-cell a, .Htable-cell h3, .Htable-cell p, .Htable-cell2 a, .Htable-cell2 h3, .Htable-cell2 p {color:  white;}

.Htable-cellA {	background-color: #FFF;	padding: 4px 4px 6px 4px;	margin-bottom: 4px;}
.Htable-cellA p2 {	font-size: 1em;	color: black;}
.Htable-cellA hB {	font-size: 1em;	color: darkslategrey;	font-weight: bold;	line-height: 140%;}

.Htable-cellB {	background-color: #C8ECFB;	padding: 4px 4px 6px 4px;	margin-bottom: 4px;}
.Htable-cellB hB {	font-size: 1em;	color: darkslategrey;	font-weight: bold;	line-height: 140%;}
.Htable-cellB p2 {	font-size: 0.9em;	color: darkslategrey;}

.Htable-cellC {	background-color: #9EDFFB;	padding: 4px 4px 6px 4px;	margin-bottom: 4px;}
.Htable-cellC hB {	font-size: 1em;	color: darkslategrey;	font-weight: bold;	line-height: 140%;}
.Htable-cellC p2 {	font-size: 0.9em;	color: darkslategrey;}

.Htable-cellD {	background-color: #75D4FD;	padding: 4px 4px 6px 4px;	margin-bottom: 4px;}
.Htable-cellD hB {	font-size: 1em;	color: darkslategrey;	font-weight: bold;	line-height: 140%;}
.Htable-cellD p2 {	font-size: 1.1em;	color: darkslategrey;	position: absolute;	top: 50%;	left: 50%;	transform: translate(-50%, -50%);}
.Htable-cellD p2 b {	font-weight: bold;	font-size: 1.2em;}

.Htable-cell2 a {	text-decoration: none;	font-weight: bolder;}
.Htable-cell2 a:hover {	font-size: 3em;}

.no-flexbox .Htable {  display: block;}

/* Table column sizing
================================== */
.Htable--2cols > .Htable-cell  { width: 50%; }
.Htable--3cols > .Htable-cell  { width: 33.33%; }
.Htable--4cols > .Htable-cell  { width: 25%; }
.Htable--5cols > .Htable-cell  { width: 20%; }
.Htable--6cols > .Htable-cell  { width: 16.6%; }

.Htable--2cols > .Htable-cell2  { width: 50%; }
.Htable--3cols > .Htable-cell2  { width: 33.33%; }
.Htable--4cols > .Htable-cell2  { width: 25%; }

.Htable--2cols > .Htable-cellA { width: 74%; margin-right: 4px; }
.Htable--2cols > .Htable-cellB { width: 23%; padding: 4px 10px 0px 10px ; min-height: 230px;}

.Htable--course2cols > .Htable-cellA { width: 84%; margin-right: 4px; min-height: 370px;}
.Htable--course2cols > .Htable-cellA p { font-size: 1.15em; line-height: 105%; }
.Htable--course2cols > .Htable-cellA p b { font-size: 1.1em; line-height: 105%; }
.Htable--course2cols > .Htable-cellB { width: 13%; padding: 4px 10px 0px 10px ; background-color: #fff; min-height: 370px; }
.Htable--course2cols > .Htable-cellB p { font-size: 1em; line-height: 100%; }
.Htable--course2cols > .Htable-cellB p b { font-size: 1em; line-height: 100%; }

.Htable--3cols > .Htable-cellA { width: 59%; margin-right: 4px; }
.Htable--3cols > .Htable-cellB { width: 19%; margin-right: 4px; }
.Htable--3cols > .Htable-cellC { width: 19%; }

.Htable--course3cols { width: 100%;}
.Htable--course3cols > .Htable-cellA { width: 55%; margin-right: 4px; min-height: 210px;}
.Htable--course3cols > .Htable-cellA p { font-size: 1.15em; line-height: 105%; }
.Htable--course3cols > .Htable-cellA p b { font-size: 1.1em; line-height: 105%; }
.Htable--course3cols > .Htable-cellB { width: 22%; padding: 4px 10px 0px 10px ; background-color: #FFF; min-height: 210px;} /*background-color: #C8ECFB;  }*/
.Htable--course3cols > .Htable-cellB p { font-size: 1em; line-height: 100%; }
.Htable--course3cols > .Htable-cellB p b { font-size: 1em; line-height: 100%; }
.Htable--course3cols > .Htable-cellC { width: 22%; padding: 4px 10px 0px 10px ; background-color: #FFF; min-height: 210px;}
.Htable--course3cols > .Htable-cellC p { font-size: 1em; line-height: 100%; }
.Htable--course3cols > .Htable-cellC p b { font-size: 1em; line-height: 100%; }
.Htable--course3cols > .Htable-cellD { width: 50%; padding: 4px 10px 0px 0px ; background-color: #FFF; }
.Htable--course3cols > .Htable-cellD p { font-size: 1em; line-height: 100%; }
.Htable--course3cols > .Htable-cellD p b { font-size: 1em; line-height: 100%; }


.Htable--4cols { text-align: center; min-width: 100%; display: -moz-webkit-flex; display: -webkit-flex; display: -ms-box; display: flex;  
    -ms-flex-direction: row;  -moz-flex-direction: row;  -webkit-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;  flex-wrap: wrap; width: 100%; margin:0; }
.Htable--4cols > .Htable-cell  { width: 25%; }
.Htable--4cols > .Htable-cell2  { width: 25%; flex-direction: column; display: block; -ms-flex: 25%;
    /*-ms-flex-negative: 1;*/  -moz-flex: 25%;  -webkit-flex: 25%;  flex:auto;  min-width: 25%; margin:0; }


/*.Htable--4cols { text-align: center; min-width: 100%;   }*/

.Htable--4cols > .Htable-cellA { width: 24.2%; position: relative; background-color: #EEE; height: 220px; }
.Htable--4cols > .Htable-cellB { width: 24.2%; position: relative; background-color: #EEE; height: 220px; }
.Htable--4cols > .Htable-cellC { width: 24.2%; position: relative; background-color: #EEE; height: 220px; }
.Htable--4cols > .Htable-cellD { width: 24.6%; position: relative; background-color: #EEE; height: 220px; }

.Htable--4cols > .Htable-cellAb { width: 24.2%; position: relative; background-color: #FFF; height: 80px; }
.Htable--4cols > .Htable-cellBb { width: 24.2%; position: relative; background-color: #FFF; height: 80px; }
.Htable--4cols > .Htable-cellCb { width: 24.2%; position: relative; background-color: #FFF; height: 80px; }
.Htable--4cols > .Htable-cellDb { width: 24.6%; position: relative; background-color: #FFF; height: 80px; }

.Htable--4cols > .Htable-cellA img { width: 50%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellB img { width: 50%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellC img { width: 35%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellD img { width: 50%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellAb img { width: 30%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellBb img { width: 20%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellCb img { width: 30%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}
.Htable--4cols > .Htable-cellDb img { width: 30%; margin: 0; position: absolute; top: 50%; left: 50%; margin-right: -50%;  transform: translate(-50%,-50%);}

/* 2cols_guidance used for main body of catalog/guidance page */
.Htable--2cols_guidance { text-align: left; min-width: 100%; }
.Htable--2cols_guidance > div[class*='Htable-cell'] { position: relative; background-color: #FFF; border: 1px solid #ccc; }
.Htable--2cols_guidance > div[class*='Htable-cell'] p { color: black; }
.Htable--2cols_guidance > .Htable-cell1  { width: 58%; padding: 7px; }
.Htable--2cols_guidance > .Htable-cell2  { width: 40%; min-height: 410px; border: 0px solid #fff !important; } 
.Htable--2cols_guidance > .Htable-cell2 img  { width: 63%; margin: 0; position: absolute; top: 0px; right: 20%; border: 1px solid #969696; }
.Htable--2cols_guidance > .Htable-cell3  { width: 58%; border: 0px solid #fff !important; }
.Htable--2cols_guidance > .Htable-cell4  { width: 40%; border: 0px solid #fff !important; }
.Htable--2cols_guidance > .Htable-cell4 p  { text-align: center; margin: 20px 100px 60px 100px ; padding: 8px; border: 1px solid #969696; background-color: #3fcaf4; } /*#40E744;}*/
.Htable--2cols_guidance > .Htable-cell0 { width: 82%; padding: 7px; border: 0px solid #fff !important; }

/* Original text overlay */
.overlay-image .text {
 color: #fff;
	font-weight: bolder;
 font-size: 2em;
 line-height: 90%;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
}

/* Hover text */
.overlay-image .text2 {
 color: #fff;
 font-size: 2em;
	font-style: italic;
	font-weight: bold;
 line-height: 1.2em;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 90%;
	opacity: 1.0;
}

/* CONTROL HOW OVERLAY IMAGE AND TEXT BEHAVES WHEN CURSOR HOVERS*/
.overlay-image img {
	transition: all 0.3s; 
}
/* New overlay appearance on hover */
.overlay-image:hover .hover {
 	opacity: 1;
}
.overlay-image:hover img {
	transform: scale(1.5);
}
.overlay-image:hover .text {
	display:none;
}
.overlay-image { top: 50%; left: 50%; transform: translate(-50%, -50%)}

/* TOP IMAGE WITH ANIMATED TEXT STYLES 19/03/2019 */
/* HOME PAGE IMAGE PARALLAX 18/03/2019 */
.parallax-imageA {
  background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url('https://www.gis247.com/images/home/20190305/IMG_8611.JPG');
  height: 300px; 
  /* Create the parallax scrolling effect by putting background-attachment: fixed */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 8px;
  position: relative;
}
div[class*='parallax-image-'] {
	height: 11.6vw;
  /* Create the parallax scrolling effect by putting background-attachment: fixed */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 8px;
  position: relative;
}

	
.parallax-image-home {
  background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url('https://www.gis247.com/images/home/20190305/IMG_8611.JPG');
}
.parallax-image-sectors {
  background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url('https://www.gis247.com/images/home/20190305/DSCF6038.JPG');
}
.parallax-image-whatisgis247 {
  background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url('https://www.gis247.com/images/home/20190305/Land-cover_map.jpg');
}	

.parallax-imageB {
  background-image: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35)),url('https://www.gis247.com/images/home/20190305/DSCF6038.JPG');
  height: 300px; 

  /* Create the parallax scrolling effect by putting background-attachment: fixed */
  background-attachment: scroll;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 8px;
	position: relative;
}

.parallax-image-guidance {
 background-image: -webkit-linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35)),url('https://www.gis247.com/images/2k19/guidance/UserTypes.png');
 background-image: -o-linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35)),url('https://www.gis247.com/images/2k19/guidance/UserTypes.png');
 background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),url('https://www.gis247.com/images/2k19/guidance/UserTypes.png');
	background-attachment: scroll !important;
	background-size: contain !important;
}

/* Parallax text not needed if using anitext */
.parallax-text {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}
.parallax-text h1 {
	font-size:3em;
	font-style:normal;
	color: #FFF;
	font-weight:600;
	border-bottom:1px solid #a4afc3;
	display:inline-block;
	margin-bottom:12px;
	padding-bottom:1px;
	line-height: 115%;
	text-shadow: 2px 2px 2px #000;
}
.parallax-text p {
	font-size:1.2em;
	font-style:normal;
	color: #FFF;
	font-weight:400;
	display:inline-block;
	line-height: 100%;
	text-shadow: 1px 1px 1px #000;
}
 #topimage {
  text-align:center;
  font-weight:300;
  font-size:1em;
  overflow:hidden;
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.anitext {
	  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
}

.anitext:first-of-type {
	-webkit-animation: showup 7s infinite;
	  animation: showup 7s infinite;
}

.anitext:last-of-type {
  width:0px;
  
	-webkit-animation: reveal 7s infinite;
	animation: reveal 7s infinite;
}
.anitext:last-of-type span {
  margin-left:-640px;
  
	-webkit-animation: slidein 7s infinite;
	animation: slidein 7s infinite;
}

@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:0;}
}

@keyframes slidein {
    0% { margin-left:-640px; }
    20% { margin-left:-640px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:640px;}
    80% {opacity:1;}
    100% {opacity:0;width:640px;}
}

.anitext h1 {
	font-size:3em;
	font-style:normal;
	color: rgba(255,255,255,1);
	font-weight:600;
	border-bottom:0px solid #a4afc3;
	display:inline-block;
	margin-bottom:12px;
	padding-bottom:1px;
	line-height: 115%;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.8);
	margin-top: 4.5vw;
}
/*
@media all and (max-width: 800px) {
  .Htable--collapse  {
    display: block;
  }
}
*/
@media only screen and (max-width: 1366px) {
	.anitext h1 {
		display: none;
	}
	div[class*='parallax-image-'] {
		display: none;
	}
}
@media only screen and (max-width: 1366px) {
	div[class*='parallax-image-'] {
		background-attachment: scroll;
		height: 240px;
 	}

}
@media only screen and (max-width: 1366px) {
  .parallax-imageB {
    background-attachment: scroll;
	height: 240px;
  }
}

table {	height: 100%;}
.cell, .cell2, .cellimg { background: #fff;	padding: 4px 7px 7px 2px; margin-bottom: 3px;}
.cellh { background: #C8ECFB; margin: 0px 10px 0px 0px; padding: 10px; margin-bottom: 3px; border: 1px solid #969696;}
.cell0 { background: transparent;	padding: 0px 0px 0px 0px; margin-bottom: 0px; text-align: center; }
.cell0 p { line-height: 100%;}
.cell0 p b { font-size: 15px;}
.cell0 a { line-height: 175%; font-size: 20px; text-decoration: none; }
.cell0 a:hover { color: #125fa7;}
.cell2 { border: 0px solid #BFBFBF; }
.cell2 h0 { font-size: 20px; font-weight: bold; }
.cell3 { text-align: center; margin: 20px 100px 60px 100px ; padding: 8px; border: 1px solid #969696; background-color: #3fcaf4; }
.cell3 p { margin: 0px;}
.cellimg { padding: 0px !important; }
.cellimgbw { float: none; max-width: 60px; margin-left: 0px; -webkit-filter: grayscale(100%); filter: grayscale(100%); display: block; margin: 0 auto;}
.cellimgcol { float: none; max-width: 60px; margin-left: 0px; display: block; margin: 0 auto;}
.cellimg_timing { float: none; padding-right: 20px;}
.right_img {float: none; max-height: 590px;  max-width: 100%; height: auto; border: 1px solid #969696; display: block; margin: 0px 0px 0px 30px; object-fit: contain;}
.right_img2 {float: none; max-height: 200px;  max-width: 100%; height: auto; border: 0px solid #969696; display: block; margin: 0px 0px 0px 30px; object-fit: contain;}
.left_img {float: none; max-width: 600px; margin-left: 0px; border: 1px solid #969696; }
.mid_img {float: none; max-width: 100%; margin-left: 0px; border: 0px solid #969696; display: block; margin: 0 auto; }
.midimg2 { height: 200px; width: 200px; white-space: nowrap; text-align: center; display: block; margin: 0 auto; }
.midimg2 img { background: transparent; vertical-align: middle; max-height: 200px; max-width: 200px;}
.helper { display: inline-block; height: 100%; vertical-align: middle; margin: 0 auto;}

.midimg_sepia {float: none; max-width: 80%; margin-left: 0px; border: 1px solid #969696; display: block; margin: 0 auto; -webkit-filter: sepia(1); filter: sepia(1); }
.midimg_color {float: none; max-width: 80%; margin-left: 0px; border: 0px solid #969696; display: block; margin: 0 auto; }
.col-0 	{width: 4.166667%;}
.col-0adj {width: 2%}
.col-2adj { width: 18.75% }
.col-3adj {width: 24%;}
.col-4adj {width: 30%;}
.col-5adj {width: 45.83333%;}
.col-7adj, .col-7guidance {width: 62% }

.progress { min-height: 26px;  }
.progress p, py { display: inline; padding: 0px; margin: 0px; line-height: 100%; vertical-align: middle; font-size: 16px !important; }
.progress img { vertical-align: middle;}
.progress py { background-color: #339933; -webkit-background-clip: text; -moz-background-clip: text; background-clip: text; color: transparent; text-shadow: rgba(51,51,51,0.15) 0px 3px 3px;}

@media only screen and (max-width: 1360px) {
	.right_img {max-width: 85%;}
	.mid_img {max-width: 75%;}
}

@media only screen and (max-width: 800px) {
	.cellimgbw { display: none; }
}

/* DYNAMIC VIDEO & CAPTIONS */
.video-background {
    width: 600px;
    height: 300px;
    background-color: black;
    float:left;
}

.text-background {
    width: 600px;
    height: 300px;
    margin-left:600px;
    background-color: black;
}

/* srt container */
.vjs-text-track-display {
    position: absolute !important;
    left: 600px !important;
    top: 10px !important;
    width: 600px;
    display: block;
    z-index: 10000000 !important;
}

/* srt text style */
span.vjs-tt-cue{
    color: white;
    font-size:30px;
}


div.video-thumbnail {
    cursor: pointer;
    width:300px;
    padding:10px;
    float:left;
}

div.video-thumbnail p img {
    width:280px;
    height:280px;
}

/* CAPTIONS FONT SIZE */
video::-webkit-media-text-track-display {
  font-size: 0.8em;
}



/*.controls button[data-state="captions"] {
    height:85%;
    text-indent:0;
    font-size:16px;
    font-size:1rem;
    font-weight:bold;
    color:#FFF;
    background:#000;
    border-radius:2px;
}*/

/* PREVENT NATIVE CONTROLS APPEARING ON VIDEO FULLSCREEN 
video::-webkit-media-controls-enclosure {
  display:none !important;
}*/

/* CUSTOM VIDEO STYLING */
#player { float:left; padding: 0.35em 0.35em .5em;	background-color: #000; }
#player #controls { width: 100%; margin-left: auto; margin-right: auto; text-align: center; margin-top: 8px; padding-bottom: 3px; border-radius: 7px; display: block; opacity: 0.5; }
#player:hover > #controls { opacity: 1.0;}
#player button { text-indent:-9999px; width:16px; height:16px; border:none; cursor:pointer; background:transparent url('/images/2k19/video/buttons_gis247cc2.png') no-repeat 0 0; margin-right: 6px;  vertical-align: middle; outline: none; }
#player .pause { background-position:-19px 0; }
#player .stop { background-position:-38px 0; }
#player .ff { background-position:-57px 0; }
#player .rewind { background-position:-76px 0; }
#player .mute { background-position:-95px 0; margin-right: 30px; }
#player .unmute { background-position:-114px 0; margin-right: 30px;}
#player .replay { background-position:-133px 0; width: 13px !important; }
#player .captions { background-position:-146px 0; width: 23px !important;}
#player .nocaptions { background-position:-170px 0; width: 23px !important;}
#player #volume-bar { width: 75px; vertical-align: middle; padding:0px; }
#player .fullscreen { text-indent: 0px;	color: #3fcaf4;	background-color: black; background-image: none; padding: 0px; font-weight: bold; padding-bottom: 3px; margin-right: 30px; } 

#player progress { color: #3fcaf4; font-size: 12px; width: 35%; height: 16px; border: none; margin-right: 10px; margin-left: 4px; background: #434343; border-radius: 9px; vertical-align: middle; }
#player progress::-moz-progress-bar { color:#3fcaf4; background:#434343; }
#player progress[value]::-webkit-progress-bar { background-color: #434343; border-radius: 2px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset; } 
#player progress[value]::-webkit-progress-value { background-color: #3fcaf4; }
#player input[type=range] { -webkit-appearance: none; width: 100%; margin: 6.8px 0; display: inline !important; }
#player input[type=range]:focus { outline: none; }
#player input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 4.4px; cursor: pointer; box-shadow: 0.9px 0.9px 1.7px #002200, 0px 0px 0.9px #003c00; background: #205928; border-radius: 1px; border: 1.1px solid #3fcaf4; }
#player input[type=range]::-webkit-slider-thumb { border: 2.5px solid #3fcaf4; height: 18px; width: 9px; border-radius: 3px; background: #000; cursor: pointer; -webkit-appearance: none; margin-top: -7.9px; }
#player input[type=range]:focus::-webkit-slider-runnable-track { background: #041473; }

#player #videotime, #player #videogone { font-size: 1em; color: #3fcaf4; display: inline; vertical-align: middle; }
#player #videotime { margin-right: 10px;  }
#player #videogone { margin-left: 10px; }

/*input[type=range]::-moz-range-track {
  width: 100%;
  height: 4.4px;
  cursor: pointer;
  background: #205928;
  border-radius: 1px;
  border: 1.1px solid #18d501;
}
input[type=range]::-moz-range-thumb {
  border: 2.5px solid #83e584;
  height: 18px;
  width: 9px;
  border-radius: 3px;
  background: #439643;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 4.4px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #194620;
  border: 1.1px solid #3fcaf4;
  border-radius: 2px;
}
input[type=range]::-ms-fill-upper {
  background: #205928;
  border: 1.1px solid #18d501;
  border-radius: 2px;
}
input[type=range]::-ms-thumb {
  border: 2.5px solid #83e584;
  width: 9px;
  border-radius: 3px;
  background: #439643;
  cursor: pointer;
  height: 4.4px;
}
input[type=range]:focus::-ms-fill-lower {
  background: #205928;
}
input[type=range]:focus::-ms-fill-upper {
  background: #276c30;
 ground-color: lightgray;
}
*/

/* VARIATIONS TO CARD DEFINITION FOR SOFTWARE IMAGES & VERSIONS ON CATALOG PAGE */
.sw { background: #fff; }
div[class^='card-'] { height: 700px; background: #fff; }
div[class^='card-'] { width: 90%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); text-align: center; color: #fff; margin-left: 5%; }
div[class^='card-'] { cursor: default; }
div[class^='card-'] h1 { background: #fff; width: 100%; min-height: 200px; border: 0px !important; }
div[class^='card-'] p { padding: 0px 12px 4px; }
p1 { padding: 20px !important; color: black; font-size: 1.16667em; text-align: left;}
div[class^='card-'] .cardimg { height: 200px; width: 200px; white-space: nowrap; text-align: center; display: block; margin: 0 auto; }
div[class^='card-'] .cardimg img { background: #FFF; vertical-align: middle; max-height: 200px; max-width: 200px; margin-top:1px; }
.cell9 { background: #fff;	padding: 0px 0px 50px 0px; margin-bottom: 0px; text-align: center;   }
.cell9 a { font-size: 1.4rem; text-decoration: none; position: relative; line-height: 102%; }
.cell9 a:hover { color: #125fa7;}
.cell3adj { text-align: center; margin: 20px 10px 30px 10px ; padding: 8px; border: 1px solid #969696; background-color: #C8ECFB; }
.cell3adj p { margin: 0px;}
.card-3, .card-4, .card-5 { height: 475px !important;}


p a { text-decoration: none; font-weight: 600; }

/* Container holding the search image and the text */
.container { position: relative; }
.container a { font-size: 1.3em; text-decoration: none; font-weight: 600; color: #125fa7; text-shadow: 2px 2px 4px #fff;}
.container a:hover {color: white; text-shadow: 1px 1px 2px black, 0 0 25px #3fcaf4, 0 0 5px #0154a5; }
.right_img3 { width: 100%; height: auto; display: block; margin: 0px; object-fit: contain;}
.centered { position: absolute; top: 45%; left: 45%; transform: translate(-45%, -45%); font-size: 1.3em; font-weight: 600; text-shadow: 2px 2px 4px #fff;  }

/* VARIATIONS TO CATALOG PAGE */
.col-12adj { background: transparent; width: 100%; }
.cell0adj { background: transparent !important;}
.col-12split { width: 100% }
.col-1adj 	{width: 8.333333%;}
.col-2guidance { width: 12.5%; }

/* GUIDANCE PAGE */
.unify { padding: 0px 10px 2px 2px; display: inline-block; margin: 2px 6px 2px 20px; min-width: 230px; }

/* COURSE PAGE */
.unifycat { position: relative; height: 226px; display: inline-block; border: 1px solid #f1f1f1; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); background: #fff; margin: 12px; padding-bottom: 10px; vertical-align: top; width: 90%;}
.unifycat p.cattime, .unify p.cattime  { float: right; }
.asset-title { min-height: 40px; display: inline-block;}
.asset { position: relative; width: 100%; min-height: 40px; vertical-align: top; }
.modcard {width: 100%; border: 1px solid #f1f1f1; background: #fff;  }
.modcard-inner { position: relative; width: 100%;text-align: center; transition: transform 0.8s; transform-style: preserve-3d; margin-bottom: 10px;}
.modcard-front { position: absolute; width: 100%; backface-visibility: hidden; background-color: #fff; color: black; white-space: nowrap; text-align: center; display: block; margin: 0 auto; top: 0%; height: inherit; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.modcard-front img { background: #FFF; vertical-align: top; height: inherit; max-width: 100%;  }
.modcard-front:hover .btn { padding: 35px; }
.modcard-front .btn { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: transparent; color: white; padding: 24px; border: none; cursor: pointer; border-radius: 5px; display: inline-block;	background-image: url('/images/home/play.png');	background-repeat: none; background-size: cover; background-position: center; filter: opacity(0.6);	width: 7%; height: 7%; transition: all 0.5s; }
.modcard .btn:hover { background-color: transparent; filter: opacity(1); }

@media only screen and (min-width: 1281px) {
	.SBbuttontop a, .SBbuttonlast a { padding: 8px 5px; font-size: 22px; }
}

@media only screen and (max-width: 1280px) {
	.SBbuttontop a, .SBbuttonlast a { padding: 8px 5px; font-size: 22px; }
}

@media only screen and (max-width: 875px) {
	.cellh { display: none; }
	.col-7adj { width: 55%; }
	.col-1adj { width: 15%; }
	.right_img { display: none; }
	.col-7guidance { width: 100%; }
	.asset a, .unifycat p.cattime, .unify p.cattime { font-size: 0.9em;}
}

@media only screen and (max-width: 874px) {
	.cell2 { margin-right: 5px; padding-right: 15px;}
	.card-0, .card-2, .card-4 { margin-bottom: 30px; }
	.unify { margin-top: 14px;}
	.card-3, .card-4, .card-5 { height: 540px !important }
}

@media only screen and (max-width: 849px) {

	.card-0 { height: 710px !important; }
	.card-1, .card-2 { height: 590px !important; }
	.card-3 { height: 500px !important; }
	.card-4, .card-5 { height: 380px !important; }
	.cell9 a { font-size: 1.7rem; }
	.sfimg { display: none; }
}

@media only screen and (max-width: 650px) {
	.unifycat p.cattime { display: none;}
} 

@media only screen and (max-width: 585px) {
	button[class^='accordion-'] h0 { font-size: 1em; }
	button[class^='accordion-'] h0:after { font-size: 0.8em; }
	.cell9 a { font-size: 1.4rem; }
}

@media only screen and (max-width: 425px) {
	.centered a { font-size: 1em; }
	.cell3adj { display: none; }
}

.panel, .panelP, .panelG { box-shadow: none; border-left: 1px solid #D7D7D7; border-right: 1px solid #D7D7D7; padding-top: 0px; }
.panelP, .panelG { padding-left: 3.1em; text-indent: -3.1em; }
.panelP p, .panelG p { line-height: 90%;}
p { margin-bottom: 0.75em;}

button[class^='accordion-'] {margin-top: 20px; }  /*min-width: 365px;}*/
button[class^='accordion-'].active {background-color: #3fc3f4; } 
/* COURSE SECTION PAGE : PLAY VIDEO & DOWNLOAD EXERCISE */
.playcontainer { position: relative; width: 100%; top: 0%; height: inherit; }
.playcontainer:hover .btn { padding: 35px; }
.playcontainer .btn { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: transparent;
  color: white; padding: 24px; border: none; cursor: pointer; border-radius: 5px; display: inline-block;	background-image: url('/images/home/play.png');	background-repeat: none; background-size: cover; background-position: center; filter: opacity(0.6);	width: 7%; height: 7%; transition: all 0.5s; }
.playcontainer .btn:hover { background-color: transparent; filter: opacity(1); }

.pdfcontainer { position: relative; width: 100%; top: 0%; height: inherit; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.pdfcontainer:hover .btn { padding: 35px; }
.pdfcontainer .btn { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: transparent;
  color: white; padding: 24px; border: none; cursor: pointer; border-radius: 5px; display: inline-block;	background-image: url('/images/home/view.png');	background-repeat: none; background-size: cover; background-position: center; filter: opacity(0.6);	width: 7%; height: 7%; transition: all 0.5s; }
.pdfcontainer .btn:hover { background-color: transparent; filter: opacity(1); }
hr { display: block; overflow: hidden; border-style: inset; border-width: 1px;	width: 90%;	margin-left: auto; margin-right: auto; background-color:#666; }

p#tmpinfo1, p#tmpinfo2, p#tmpinfo3, p#tmpinfo4 { display: none;}