@font-face{
	font-family:BlackOpsOne;
	src:url('../fonts/BlackOpsOne-Regular.ttf');
}
@font-face{
	font-family:Oswald;
	src:url('../fonts/Oswald-VariableFont_wght.ttf');
}
@font-face{
	font-family:JosefinSans;
	src:url('../fonts/JosefinSans-VariableFont_wght.ttf');
}
@font-face{
	font-family:Anton;
	src:url('../fonts/Anton-Regular.ttf');
}

/* NavBar */
.navbar a, .navbar {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.navbar {
   min-height: 40px !important;
   background-color: #fff !important;
}
.navTitle{
	font-family:BlackOpsOne;
	text-decoration: none;
	color: #000 !important;
}
.nav-item:hover{
	background-color: #eee;
	border-radius: 4px;
	padding: 0px;
}
.nav-link, .dropdown-item{
	font-family:Oswald;
}
.tit{
	font-family:Oswald;
	font-size: 0.7em;
}
.nav-link{
	color: #000;
}
.nav-link:hover{
	color: #111;
}

.shadowx-nav{
	box-shadow: 2px 2px 10px 2px #222;
}
.shadowx {
	box-shadow: 1px 1px 5px 1px #222;
	margin: 2px 2px 2px 2px;
}
/* NavBar - End*/

.row {
	display: inline-block;
	text-align: center;
	width: 100%;
	
	padding: 5px 10px 5px 10px;
	margin: 0 auto;
}
@media (max-width:991px) {
	#main, .row{
		padding-right: 0;
		padding-left: 0;
		margin-right: 0;
		margin-left: 0;
	}
}


.toc {
	margin-bottom: 10px;
}
.toc a:link {color:#000;}
.toc a:visited {
	text-decoration: none;
	color:#000;
}
.toc a:hover {text-decoration: none;}
.toc{
	background-color: #fff;
	border-radius: 10px;
	padding: 5px;
}
.toc ul a{}
.toc ul{
	list-style: none;
	margin:0;
    padding-left:20px;
}
.toc li{
	
	margin: 10px 0 10px 0;
}
.toc li a{padding:5px;border-radius: 3px;}
.toc li a:hover{background-color: #eee;}

div {
	border: 0px dotted #555;
}

html{
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #000;
	text-align: left;position: relative;
	min-height: 100%;
	margin: 0;
	background-color:#fff;
}
body{
	text-align: left;
	background-color:#fff;
	margin-top:3.6rem;min-height: 100%;
	margin-bottom: 8em;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: underline;}

h1{font-size: 2em;}
h2{font-size: 1.8em;}
h3{font-size: 1.6em;}
h4{font-size: 1.4em;}
h5{font-size: 1.2em;}
h6{font-size: 1em;}

/* Sign Form Color */
form {
	color: #000;
	background-color: #fff !important;
}
/* DropDown Menu */
.dropdown-menu, .dropdown-item{
	border: 0px dotted #000;
	background-color: #fff;
	color: #000;	
}
.dropdown-item:hover{
	color: #111;
	background-color: #eee;
}

/* The side navigation menu */
.mySidenavToggle {
	position: fixed;
	z-index: 1;
	left:0px;
	top: 41px;
	background-color: #fff;
	opacity: 0.9;
	color: #000;
	border-style: none;
	border-radius: 0px 7px 7px 0px;
	transition: 0.5s;
	box-shadow: 0 0 0 1px #888 inset; 
}
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 41px; /* Stay at the top */
  left: 0;
  background-color: #fff; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 0px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
  box-shadow: 0 0 0 1px #888 inset; 
}

/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 8px;
  text-decoration: none;
  font-size: 20px;
  color: #000;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  background-color: #eee;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
  transition: margin-left .5s;
  padding: 0;
}
.row {
	display: inline-block;
	text-align: center;
	width: 100%;
	
	padding: 5px 10px 5px 10px;
	margin: 0 auto;
}
.page_title{
	color:#000;
}
.page_title_sub{
	color:#333;
	text-align: left;
}
.youtube-result{
	display: inline-block;
	text-align: center;
}

.error_area {
	color:red;
	margin: 0 auto;
}
.cost {
	text-align: left;
}
.table-title{
	background-color: #fff;
	color: #000;
	text-align: left;
}
.table-content{
	background-color: #6c83a2;
	color: #fff;
	text-align: left;
	max-width:100px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.table-content-noEllipsis{
	background-color: #6c83a2;
	color: #fff;
	text-align: left;
	max-width:100px;
}
.pricing_policy{
	padding: 10px 15px;
	background-color: #eee;
	border-radius: 5px;
	font-size: 0.9em;
	text-align: left;
}
.table-list{
	color:#fff;
	
	a:link, a:visited, a:hover{
		text-decoration: none;
	}
}
.table-detail td a:link{
	text-decoration: none;
	color:#f1b94c;
}
.table-detail td a:visited{
	text-decoration: none;
	color:#f1b94c;
}
.table-detail td a:hover{
	text-decoration: none;
	color:#fff;
}
.table-list tr{
	
}
.table-list th{
	background-color: #fff;
	text-align: center;
}
.table-list td{
	background-color: #6c83a2;
	font-size: 0.9em;
	height: 34px !important;
	padding: 0 5px 0 5px;
	vertical-align: middle;
}
.fa-check-circle{
	color:#18ce60;
}
.fa-spinner{
	color:#f1b94c;
}
hr.hr_line_01{
	width: 100%;
	border: 1px solid #aaa;
}
.custom-checkbox input, .custom-checkbox label{
	cursor: pointer;
}
/* EditForm */
.form-row{
	border: 0px dashed #000;
}
.form-item{
	width: 100%;
	border-radius: 5px;
	margin: 5px;
}
.form-group{
	border: 0px dashed #000;
	margin: 1px 0px 1px 0px;
}
.form-label{
	padding-top: 5px;
	font-size: 1.1em;
}
.form-input{

}
.form-btn{
	padding-top: 4px;
	text-align: center;
}
.btn-layer{
	margin-top: 7px;
	height: 30px;
}

.profile{
	max-width: 1000px;
	border-radius: 10px;
	margin: 0 auto;
	padding:10px 10px 10px 0px;
	margin-bottom: 10px;
}
.form-title{
	font-size: 1.5em;
	padding-left: 20px;
}
.custom-switch{
	padding-top:9px;
}
.custom-switch input, .custom-switch label{
	cursor: pointer;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.footer{
	padding: 15px 0 15px 0;
	text-align: center;
	background-color: #fff;
	color: #000;position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;	
}


.cb-row{
	display: flex;
	display: inline-block;
	width: 100%;
}
.cb-wrap{
	width: 100%;
	#max-width: 1024px;
	padding: 0;
	margin: 0 auto;
	#border: 1px solid red;
	font-size:0;
}
.cb{
	font-size:12px;
	margin: 0 0 0 0 !important;
	#border: 1px solid gray;
	display: inline-block;
	#float: left;
	#text-align: center;
	width: 100%;
	vertical-align: top;
}
.cb-wordpress-block{
	width: 100%;
	#max-width: 1024px;
	padding: 0;
	margin: 0 auto;
	#border: 1px solid red;
	font-size:0;
	#position: relative;
	display: table;
	
}
.cb-wp-block{
	font-size:12px;
	margin: 0 0 0 0 !important;
	#border: 1px solid gray;
	#display: inline-block;
	float: left;
	#text-align: center;
	width: 100%;
	vertical-align: top;
	display: table-cell;
}
.wp-item-block{
	margin: 2px;min-height: 100%;padding: 10px;
	background-color: #33383e;color: #fff;font-size: 15px;
	border-radius: 5px;
}
.limit-width{
	width: 100%;
	overflow: hidden;
}
.dserver-btn{
	border-radius: 6px 6px 0 0;
	border: 1px solid gray;
	padding: 0 3px;
	margin: 0px;
}

@media all and (min-width:674px) {
	#.cb{min-height: 150px;}
	.cb-1{width:100%;}
	.cb-2{width:50%;}
	.cb-3{width:33.333%;}
	.cb-4{width:50%;}
	.cb-5{width:50%;}
	.cb-6{width:50%;}
	.cb-7{width:33.333%;}
	.cb-8{width:33.333%;}
	.cb-9{width:20%;}
	.cb-10{width:20%;}
}

@media all and (min-width:1024px) {
	.cb-1{width:100%;}
	.cb-2{width:50%;}
	.cb-3{width:33.333%;}
	.cb-4{width:25%;}
	.cb-5{width:20%;}
	.cb-6{width:16.66667%;}
	.cb-7{width:14.285714286%;}
	.cb-8{width:12.5%;}
	.cb-9{width:11.1111%;}
	.cb-10{width:10%;}
}


.wp-title{
	min-height: 0%;
	border: none;
	font-size: 1.1rem;
}

.btn-icon{
	border: none;
}
.blog_header{
	font-size: 1.2rem;
	color: #0764e1;
}


.WTF_group{}
.WTF_group_pre{background-color: #33383e;width: 25%;}
.WTF_group_pre span{background-color: #33383e;color: #fff;font-size: 15px;border: none;}
.WTF_input_text{background-color: #fffbdb;color: #192048;font-size: 15px;}
.WTF_option{background-color: #fffbdb;color: #192048;font-size: 15px;cursor: pointer;}
.blog_textarea{width: 100%;height: 50px;background-color: #4c4c4c;color: #fff;border-radius: 5px;resize: none;}