body{
	margin:0;
	padding:0;
	width:100%;
	overflow-x:hidden;
	background-color:#AAA;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

.bold{
	font-weight:bold;
}
.header{
	position:absolute;
	top:0;left:0;
	width:100%;
	height:auto;
	color:#FFF;
	background-color:rgba(0, 0, 0, 0);
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	cursor:pointer;
	z-index:2000;
}
.header_container{
	padding-top:10px;
	padding-bottom:10px;
}
.header_container>div, .header_container>div>div{
	display:flex;
	align-items: center;
	justify-content: center;
}
.logo_container{
	justify-content: left !important;
}
.header_item {
	padding:5px;
	border: 2px solid transparent;
	border-radius:5px;
	position:relative;
	height:auto;
	transition: border 0.3s;
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.header_item:hover{
	border: 2px solid #FFF;
}
.header_item a, .header_item a:hover{
	color : #FFF;
	text-decoration:none !important;
	/*
	display:block;
	width:100%;
	height:100%;
	text-align;center;
	*/
}
.button_style {
	outline: none;
    transition: background-color .1s linear,border-color .1s linear,color .1s linear;
    cursor: pointer;
    border: 0;
    background: transparent;
}
.blog_login_btn {
	height:auto;
	color:#FFF;
	background-color:rgba(0, 0, 0, 0);
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}
.slider{
	position:relative;
	z-index: 1000;
}
.slider_img{
	width:100%;
	height:500px;
	object-fit: cover;
	filter: contrast(100%) brightness(80%);
}

.detail_header_img{
	width:100%;
	max-height:135px;
	object-fit: cover;
	filter: contrast(100%) brightness(80%);
}

.slider_desc{
	position:absolute;
	width:100%;
	height:100%;
	top:0;left:0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction:column;
	color:#FFF;
	font-size:32px;
    font-family: Segoe UI, serif;
}

.slider_title{
	max-width:640px;
	text-align:center;
	margin:20px;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

.product_slider_title{
	max-width:640px;
	text-align:center;
	margin:20px;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	font-size:80px;
	font-weight:600;
	letter-spacing:2px;
}

.read_more_btn{
	color: #fff;
	background-color: #000;
	padding:10px;
	padding-left:15px;
	padding-right:15px;
	font-size:14px;
	border-radius:5px;
	margin-top:60px;
	font-weight:700;
	cursor:pointer;
}

.start_now_btn{
	color: #333;
	background-color: #fff;
	padding:10px;
	padding-left:80px;
	padding-right:80px;
	font-size:16px;
	border-radius:10px;
	margin-top:10px;
	font-weight:700;
	cursor:pointer;
	letter-spacing:1px;
}

.info_content{
	max-width:1000px;
	min-height:400px;
	width:100%;
	height:auto;
	margin: auto;
	margin-top:0;
	z-index:5;
}

.grid_content{
	max-width:1000px;
	min-height:600px;
	margin: auto;
	margin-top:0;
	margin-bottom:50px;
	z-index:5;
}

.grid_item{
	min-height:600px;
	text-align:center;
	padding-left:10px !important;
	padding-right:10px !important;
	margin-bottom:20px;
}

.grid_inner_item{
	cursor:pointer;
	transition: box-shadow 0.2s;
}

.grid_inner_item:hover{
	box-shadow: 8px 8px 8px -5px rgba(0,0,0,0.35);
}

.grid_img_container{
	width:100%;
	height:380px;
}

.related_grid_img_container{
	width:100%;
	height:200px;
}

.grid_img{
	width:100%;
	height:100%;
	object-fit: cover;
}

.grid_item_detail{
	padding:15px;
	/*letter-spacing:1px;*/
}

.grid_item_category{
	text-align:left;
	margin-top:10px;
	margin-bottom:10px;
	font-size:14px;
}
.grid_item_title{
	text-align:left;
	margin-bottom:10px;
	font-size:18px;
}
.grid_item_title h3{
	text-align:left;
	margin-bottom:10px;
	font-size:18px;
	font-weight:400;
}
.grid_item_desc{
	text-align:left;
	margin-bottom:10px;
	font-size:14px;
}
.grid_item_read_more{
	text-align:left;
	font-size:12px;
}

.grid_item_read_more_text{
	text-decoration: underline;
	cursor:pointer;
	margin-right:10px;
}

/* replace bootstrap css */
.grid_item_read_more_text>a, .grid_item_read_more_text>a:visited, .grid_item_read_more_text>a:hover, .grid_item_read_more_text>a:active{
	color: #212529 !important;
}

.grid_item_modified_date{
	color: #999;
}
.logo{
	width:auto;
	height:70px;
}

.category_row{
	margin-top:30px;
	margin-bottom:30px;
	text-align:center;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	color:#FFF;
	background-color:#FFF;
	z-index:10;
}

.category_item{
	padding:5px;
	border:1px solid #FFF;
	white-space: nowrap;
	display:flex;
	align-items: center;
	justify-content: center;
	color:#999;
	cursor:pointer;
	/*transition: border 0.3s, color 0.2s;*/
	transition: color 0.2s;
	text-decoration: none;
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.category_item:before {
	content: "";
	position: absolute;
	width: 90%;
	height: 2px;
	bottom: 0;
	left: 5%;
	background-color: #000;
	visibility: hidden;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transition: all 0.2s ease-in-out 0s;
	transition: all 0.2s ease-in-out 0s;
}


.category_item:hover{
	color:#000;
	/*border:1px solid #666;*/
}

.category_item:hover:before{
	visibility: visible;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

.category_item.selected:before{
	visibility: visible;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

.category_item.selected{
	color:#000;
}

.read_more_left{
	display:inline-block;
}
.read_more_right{
	display:inline-block;
	float:right;
}

.blog_detail_content{
    font-family: "Segoe UI", serif;
	display:flex;
	flex-direction:column;
	align-items: center;
	/*
	align-items: center;
	justify-content: center;
	*/
}

.category_section_title{
	font-size:20px;
	margin-bottom:20px;

}
.category_section_title h2{
	font-size:20px;
	margin-bottom:20px;
	font-weight:400;
}
.reading_time{
	width:100%;
	text-align:right;
	font-size:14px;
	color:#999;
}

.account_detail{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.5);
	cursor:default;
	align-items: center;
	justify-content: center;
	display:none;
	z-index:1000;
}

.account_detail_box{
	max-width:1000px;
	max-height:90%;
	background-color:#FFF;
	color:#000;
	padding:20px;
	border-radius:10px;
	min-width:400px;
	opacity: 0;
	margin-top:50%;
	transition: opacity 0.3s, margin-top 0.3s;
	display:flex;
	/*align-items: center;
	justify-content: center;*/
	flex-direction:row;
	overflow-y:auto;
}


.account_detail_box.show{
	opacity: 1.0;
	margin-top:0;
}

.account_detail_box>div{
	width:100%;
	text-align:center;
}

.login_header, .login_header>img, .register_header, .register_header>img{
	width:auto;
	height:60px;
	text-align:left;
	margin: auto;
	margin-bottom:20px;
	position:absolute;

}
.login_text_header{
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	font-size:24px;
	font-weight:bold;
	color:#555;
}
.forget_text_header{
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	font-size:24px;
	font-weight:bold;
	color:#555;
}
.forget_form_email{
	padding: 20px 0 20px 0;
}
.login_subtext_header{
	text-align:center;
	font-size:16px;
	color:#666;
}
.login_subtext_header>span{
	font-size:16px;
	margin-left:0;
}
.login_form{
	width:100%;
	text-align:left;
}

.register_form, .fb_register_form, .forget_form{
	width:100%;
	display:none;
	text-align:left;
}
.login_field, .register_field{
	background-size: 15px 15px !important;
	padding-left:30px !important;
}

.account_detail_box .input_title{
	color:#333;
	font-size:16px;
	margin-bottom:3px;
}

.login_btn{
}
.register_btn{
	font-size:12px;
	margin-left:20px;
	cursor:pointer;
}
.forget_btn{
	cursor:pointer;
}
.account_detail_box .footer{
	display:flex;
	align-items: baseline;
	justify-content: center;
}

.register_back{
	margin-bottom:20px;
}
.submit_register{
	margin-top:10px;
}
.logout_btn{

}

@media only screen and (max-width: 600px) {
	.submit_register{
		margin-bottom:200px;
	}
	.login_btn{
		margin-bottom:20px;
	}
}

.section_description{
	max-width:1000px;
	margin:auto;
	margin-top:20px;
	margin-bottom:20px;
}

.comment_section{
	width:100%;
	max-width:1000px;
	min-height:400px;
	/*background-color:#AAAAFF;*/
	margin:auto;
	margin-bottom:300px;
	padding:0;
	text-align:center;
	padding-left:10px;
	padding-right:10px;
}

.comment_container{
	padding-left:10px;
	padding-right:10px;
}

.comment_section .left_container{
	text-align:center;
	display:flex;
	align-items: center;
	justify-content: center;
	flex-direction:row;
	padding:0;
}

.comment_section .right_container{
	padding:5px;
}

.new_comment_div{
	border-radius:5px;
}

.comment_section .user_icon{
	width:100%;
	height:auto;
	margin:5px;
	max-width:50px;
	padding:0;
	border-radius:5px;
}

.comment{
	border-bottom:1px solid #ccc;
	padding-top:10px;
	padding-bottom:10px;
}

.new_comment{
	width:100%;
	height:auto;
	min-height:100px;
}

.text_limit{
	text-align:left;
	font-size:14px;
	color:#70717f;
}

.reply{
	text-align:left;
}
.comment_user{
	font-size:16px;
	font-weight:bold;
	color:#333;
}
.comment_date{
	font-size:14px;
	color:#656c7a;
}
.comment_footer{
	margin-top:3px;
	font-size:14px;
	color:#656c7a;
}
.load_comment{
	width:100%;
	height:auto;
	text-align:left;
	/*background-color:#F3F3F3;*/
	padding-top:3px;
	padding-bottom:3px;
}

.comment_container_footer{
	display:flex;
}

.info_left{
	width:70%;
	height:50px;
	display:flex;
	align-items: center;
    justify-content: left;
	padding-left:10px;
}

.info_right{
	width:30%;
	height:50px;
	display:flex;
	align-items: center;
    justify-content: flex-end;
	padding-right:10px;
	text-align:right;
}

.submit_btn{
	display:flex;
	align-items: center;
    justify-content: center;
}

.comment_footer .icon{
	width:15px;
	height:auto;
	margin-left:5px;
	cursor:pointer;
}

.submit_comment{
	float:right;
}
.cancel_comment{
	float:right;
}

.reply_section{
	margin-top:5px;
	font-size:14px;
	color:#4e5266;
}

.comment_login{
	color:#26c9a6;
	cursor:pointer;
	font-weight:bold;
}


.comment_edit, .comment_delete{
	width:15px;
	height:auto;
	cursor:pointer;
	float:right;
	margin-left:5px;
}

.comment_reply_delete{
	width:10px;
	height:auto;
	cursor:pointer;
	float:right;
	margin-left:5px;
	margin-top:4px;
	display:none;
}

.edit_del_box{
	display:none;
}

.reply_comment .date{
	font-size:12px;
	color:#666;
}

.new_reply_comment{
	margin-bottom:10px;
}

.fb_login_btn{
    background-size: 15px 15px !important;
	padding-left:35px !important;
	height:35px;
    background: #4267b2 url('/images/fb_icon2.png') no-repeat scroll 10px 10px;
    border: none;
	color:#FFF;
	font-size:18px;
	font-weight:400;
	border-radius:5px;
	cursor:pointer;
}

.product_content{
	text-align:center;
}

.product_main_title{
	color:#333;
	font-size:24px;
	font-weight:700;
	margin-top:20px;
	margin-bottom:20px;
}

.product_main_desc{
	color:#333;
	font-size:18px;
	text-align:justify;
}

.related_articles_container{
	max-width:1000px;
    margin: 0 auto 50px;
    z-index:5;
}

.related_articles_container .title{
	font-size:24px;
	color:#333;
	margin-bottom:10px;
}

@media only screen and (max-width: 1080px){
	.grid_content{
		margin-left: 20px;
		margin-right: 20px;
	}
	.grid_img_container{
		height:300px;
	}
	.account_detail_box{
		min-width:60%;
	}
}

.reply_comment{
	display:flex;
	align-items: center;
    justify-content: left;
	font-size:14px;
}
.reply_comment input{
	padding-top:1px !important;
	padding-bottom:1px !important;
}

.detail_info{
	text-align:center;
	margin:10px;
}

.detail_info .category, .detail_info .category>a{
	font-size:20px;
	color: rgba(14,19,24,.45);
}

.detail_info .title{
	font-size:40px;
}

.detail_info .name{
	font-size:20px;
}

.detail_html{
	width:100%;
}

.detail_html img{
	max-width:100%;
	height:auto !important;
}

.about_us{
	width:100%;
	height:auto;
	display:flex;
	align-items: center;
    justify-content: center;
	font-size:20px;
	margin-top:50px;
}

.about_us>div{
	display:inline-block;
}

.loading_ind{
	width:100%;
	height:auto;
	display:flex;
	align-items: center;
    justify-content: center;
    margin-top:30px;
}

.lds-ring {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 51px;
  height: 51px;
  margin: 6px;
  border: 6px solid #7d77b6;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #7d77b6 transparent transparent transparent;
}
.lds-ring.white div{
	border: 6px solid #ffffff;
	border-color: #ffffff transparent transparent transparent;
}

.lds-ring.small {
	width: 25px;
	height: 25px;
}
.lds-ring.small div{
	width: 20px;
	height: 20px;
	margin: 3px;
	border-width: 3px;
}

.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #f5c6c6;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top:0;
    left:0;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}


.menu_header{
	width:100%;
	height:auto;
	text-align:right;
	color:#FFF;
	cursor:pointer;
	padding-right:5px;
	padding-bottom:20px;
}

.menu_item{
	padding:10px;
	font-size:20px;
	color:#FFF;
	text-align:center;
	display:none;
}
.menu_item>a,.menu_item>a:hover,.menu_item>a:active,.menu_item>a:focus{
	color:#FFF;
}

.menu.open .menu_item{
	display:block;
}

/*
.menu a{
	text-align:center;
	font-size:20px;
	color:#FFF;
	padding:20px;
	text-align:center;
}
*/
.menu_icon{
	padding-top:30px;
	width:20px;
	height:auto;
}

.menu{
	width:200px;
	height:100%;
	background-color:transparent;
	position:fixed;
	top:0;
	left:-160px;
	transition: left 0.2s, background-color 0.2s;
	display:none;
	z-index:20;
}

.menu.open{
	left:0;
	background-color:rgba(0,0,0,0.7);
}
/*
.header{
	background-image:none;
	background-color: rgba(0,0,0,0.6);
}
*/
.header_community{
	background-color: rgba(0,0,0,0.4);
	padding:10px;
	border-radius:0 0 0 10px;
}

.header_community{
	color:#FFF;
	font-size:28px;
	transition: font-size 0.2s, background-color 0.2s;
}

.header_community>a{
	color:#FFF;
}

.header_community:hover{
	 font-size:40px;
	 background-color: rgba(0,0,0,0.7);
}

.outer_box{
	width:100%;
	height:100vh;
	position:relative;
	display:flex;
	align-items: center;
	justify-content: center;
	padding-left:20px;
	padding-right:20px;

}
.reset_title>p{
	font-size:36px;
	text-align:center;
	color:#444;
	letter-spacing:3px;
	font-weight:bold;
}

@media only screen and (max-width: 768px){
	.header{
		display:none;
	}
	.menu{
		display:block;
	}
	/*
	.header{
		padding-left:5px;
		padding-right:5px;
		position:relative;
		background-color:#333;
	}

	.detail_header_img{
		display:none;
	}

	.logo_container{
		justify-content: center !important;
	}
	.header_container>div{
		margin-top:5px;
	}
	.slider_desc{
		font-size:22px;
	}
	.grid_item{
		height:auto;
		margin-bottom:30px;
	}
	.grid_img_container{
		height:600px;
	}
	.header_mid{
		margin-left:0 !important;
		margin-right:0 !important;
		margin-top:10px !important;
		margin-bottom:10px !important;
	}
	*/
	.category_row{
		padding-left:10px;
		padding-right:10px;
	}
	.category_item{
		margin-top:10px;
		margin-bottom:10px;
		white-space: normal;
	}

	.account_detail_box{
		min-width:80%;
	}

	.comment_section{
		padding-left:10px;
		padding-right:10px;
	}

	.left_container{
		margin-top:10px;
	}

}

.create_project_modal_create{
	display:flex;
	/*align-items: center;
	justify-content: left;*/
}
/*
.roundedDotChatButton{
	display:none;
}
*/