@charset "utf-8";
/* CSS Document */


.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/*------------------
HR Custom
---------------------*/

/* Red border */
hr.new1 {
border-top: 1px solid red;
}

/* Dashed red border */
hr.new2 {
border-top: 1px dashed red;
}

/* Dotted red border */
hr.new3 {
border-top: 1px dotted red;
}

/* Thick red border */
hr.new4 {
border: 1px solid black;
margin-top: 0.1em;
margin-bottom: 0.1em;
border-bottom: 20px 

}

/* Large rounded green border */
hr.new5 {
border: 10px solid green;
border-radius: 5px;
}

/* ----------------
start font category - content 
---------------------*/

.sub-title 
{
font-size: 14px;
font-weight:bold;
color:#0070b9;
}

.sub-title a
{
color: #0070b9;
text-decoration: none;
background-color: transparent

}

.content-title
{
font-size: 13px;
white-space: pre;
margin-top: 0.7em;
margin-bottom: 0.7em;
color:#0070b9;
font-weight: 500;
}

.content-title a
{
color: #0070b9;
text-decoration: none;
background-color: transparent
font-weight: 500;
}


.content-title-sub
{
font-size: 12px;
white-space: pre;
margin-top: 0.3em;
margin-bottom: 0.3em;
font-weight: 500;
border-bottom: 1px dotted grey;
color:#0070b9;
}

/* ----------------
end font category - content 
---------------------*/

.dropdowns-content {
display: none;
position: absolute;
width: 100%;
margin-left: 0px;
z-index: 1000000;
}

.dropdowns-contents:after {
content: " ";
z-index: -10;
display: block;
position: absolute;
height: 500%;
top: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.3);
}

/* Create three equal columns that floats next to each other */
.columns {
float: left;
width: 20%;
padding: 5px;
border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
background-color: #f0f0f0;
height: auto;
font-size: 14px;

}

.columns a {
float: none;
color: #3f3f3f;
padding: 10px;
text-decoration: none;
display: block;
text-align: left;
}

.columns a:hover {
background-color: #ddd;
}

.clr{
color:#000;
}

/* sub menu */

/*  social media */
.dropdowns-content-row {
display: none;
position: absolute;
color: #cacaca;

width: 17%;
margin-left: 235px;
margin-top: -87px;
line-height: 2.5;

border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
background-color: #ddd;
height: auto;
font-size: 14px;
}

/*  market place */
.dropdowns-content-row-2 {
display: none;
position: absolute;
color: #cacaca;

width: 17%;
margin-left: 235px;
margin-top: -46px;
line-height: 2.5;

border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
background-color: #ddd;
height: auto;
font-size: 14px;
}

/*  category */
.dropdowns-content-row-3 {
display: none;
position: absolute;
color: #cacaca;

width: 65%;
margin-left: 235px;
margin-top: -133px;
line-height: 2;

border-bottom-left-radius:3px;
border-bottom-right-radius:3px;
background-color: #fff;
font-size: 14px;
text-decoration: none;

height:400px;
overflow:auto;
}

.dropdowns-content:hover .dropdowns-content-row  {
display: block;
padding-top: 14px;
padding-bottom: 14px;
}

.dropdowns-content:hover .dropdowns-content-row-2 {
display: block;
padding-top: 14px;
padding-bottom: 14px;
}

.dropdowns-content:hover .dropdowns-content-row-3 {
display: block;
padding-top: 14px;
padding-bottom: 14px;
}

/* Clear floats after the columns */
.rows:after {
content: "";
display: table;
clear: both;

}

/* Responsive layout - iphone 6/7/8 */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .columns {
	width: 38%;
	height: auto;
	font-size:10px;

  }

  .dropdowns-content {
	display: none;
	position: absolute;
	width: 100%;
	margin-left: -20px;
	z-index: 1000000;
  }


  /*  social media */
.dropdowns-content-row {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 40%;
  margin-left: 142px;
  margin-top: -82px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

 /*  social media */
.dropdowns-content-row-2 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 40%;
  margin-left: 142px;
  margin-top: -46px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

  /*  category */
 .dropdowns-content-row-3 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 65%;
  margin-left: 142px;
  margin-top: -130px;
  line-height: 2;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #fff;
  height: auto;
  font-size: 12px;

  height:500px;
  display: grid;
  overflow:auto;
}

 /* ----------------
	start font category - content 
  ---------------------*/

  .sub-title 
  {
	font-size: 12px;
	font-weight:bold;
	color:#0070b9;
  }

  .content-title
  {
	font-size: 12px;
	white-space: pre;
	margin-top: 1em;
	margin-bottom: 1em;
	font-weight: 500;
  color:#0070b9;
  }

  .content-title-sub
  {
	font-size: 12px;
	white-space: pre;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	color:#0070b9;
  }

}

/* Responsive layout - iphone 6/7/8 - landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
 
  
}

/* Responsive layout - iphone 6/7/8 plus IOS 11 */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: portrait) {
  .columns {
	width: 38%;
	font-size: 12px;
	height: auto;
  }

  .dropdowns-content {
	display: none;
	position: absolute;
	width: 100%;
	margin-left: -20px;
	z-index: 1000000;
  }

  /*  social media */
.dropdowns-content-row {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 40%;
  margin-left: 155px;
  margin-top: -82px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

 /*  social media */
.dropdowns-content-row-2 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 40%;
  margin-left: 155px;
  margin-top: -46px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

  /*  category */
 .dropdowns-content-row-3 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 65%;
  margin-left: 155px;
  margin-top: -130px;
  line-height: 2;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #fff;
  height: auto;
  font-size: 12px;

  height:500px;
  display: grid;
  overflow:auto;
}

}

/* Responsive layout - iphone 6/7/8 plus IOS 11 */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: landscape) {

.columns {
	width: 38%;
	font-size: 12px;
	height: auto;

  }

  .dropdowns-content {
	display: none;
	position: absolute;
	width: 80%;
	margin-left: -20px;
	z-index: 1000000;
  }


  /*  market place */
.dropdowns-content-row {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 28%;
  margin-left: 222px;
  margin-top: -82px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

 /*  social media */
.dropdowns-content-row-2 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 28%;
  margin-left: 222px;
  margin-top: -46px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

  /*  category */
 .dropdowns-content-row-3 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 65%;
  margin-left: 222px;
  margin-top: -130px;
  line-height: 2;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #fff;
  height: auto;
  font-size: 12px;

  height:500px;
  display: grid;
  overflow:auto;
}

 /* ----------------
	start font category - content 
  ---------------------*/

  .sub-title 
  {
	font-size: 12px;
	font-weight:bold;
	color:#0070b9;
  }

  .content-title
  {
	font-size: 12px;
	white-space: pre;
	margin-top: 1em;
	margin-bottom: 1em;
	font-weight: 500;
  color:#0070b9;
  }

  .content-title-sub
  {
	font-size: 12px;
	white-space: pre;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	color:#0070b9;
  }

}

/* Responsive layout - ipad  */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .columns {
	width: 23%;
	font-size: 12px;
	height: auto;
  }

  .dropdowns-content {
	display: none;
	position: absolute;
	width: 100%;
	margin-left: -20px;
	z-index: 1000000;
  }

  /*  social media */
.dropdowns-content-row {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 25%;
  margin-left: 176px;
  margin-top: -82px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

 /*  social media */
.dropdowns-content-row-2 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 25%;
  margin-left: 176px;
  margin-top: -46px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

  /*  category */
 .dropdowns-content-row-3 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 65%;
  margin-left: 176px;
  margin-top: -130px;
  line-height: 2;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #fff;
  height: auto;
  font-size: 12px;

  height:500px;
  display: grid;
  overflow:auto;
}

}
/* Responsive layout - ipad  */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {

 .columns {
	width: 23%;
	font-size: 12px;
	height: auto;
  }

  .dropdowns-content {
	display: none;
	position: absolute;
	width: 100%;
	margin-left: -20px;
	z-index: 1000000;
  }

  /*  social media */
.dropdowns-content-row {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 25%;
  margin-left: 234px;
  margin-top: -82px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

 /*  social media */
.dropdowns-content-row-2 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 25%;
  margin-left: 234px;
  margin-top: -46px;
  line-height: 2.5;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #ddd;
  height: auto;
  font-size: 12px;
}

  /*  category */
 .dropdowns-content-row-3 {
  display: none;
  position: absolute;
  color: #cacaca;

  width: 65%;
  margin-left: 234px;
  margin-top: -130px;
  line-height: 2;

  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  background-color: #fff;
  height: auto;
  font-size: 12px;

  height:500px;
  display: grid;
  overflow:auto;
}

}

