/*
Template Name : 
Author        : Rabie Elkheir
Version       : 1.0

#1. Typography
#2. General
#3. Pre Loader
#4. Header
    #4.1. Dropdown Menu
	#4.2. Search Modal
#5. Banner Slider
	#5.1. Full Slider
	#5.2. Banner Carousel

#6. Post Formate
	#6.1. Standard Post
	#6.2. SoundCloud Post
	#6.3. Video Post
	#6.4. Gallery Post
	#6.5. Audio Post
	#6.6. Quote Post 
#7. Pagination
#8. Sidebar
#9. Blog Details 
#10. About Me 
#11. Contact Me 
#12. 404 Page 
#13. Back to Top 
#14. Footer 
#15. Responsive Design

*/
/************* Typography ******************/

*{
	padding:0;
	margin:0;
}
img{
	border:none;
	outline:none;
	max-width:100%;
}
a,a:active,a:focus,a:hover{
	outline:none;
	text-decoration:none;
}
a:hover{
	color:#223f84;
}
a{
	-webkit-transition:all 0.25s ease-in-out;
	-moz-transition:all 0.25s ease-in-out;
	-ms-transition:all 0.25s ease-in-out;
	-o-transition:all 0.25s ease-in-out;
	transition:all 0.25s ease-in-out;
	color:#333;
}
ul{
}
ol{
}
h1 {
	font-family: "微軟正黑體",'Roboto', sans-serif;
    color: #333;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 15px;
    text-transform: uppercase;
}
h2{
	font-size:17px;
	font-weight:600;
	margin:0 0 12px;
	text-transform:uppercase;
	line-height:24px;
	font-family: "微軟正黑體",'Roboto', sans-serif;
}
h3{
	font-size:15px;
	font-weight:600;
	margin:0 0 20px;
	text-transform:uppercase;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	line-height:22px;
}
h4{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size:14px;
	margin:0 0 5px;
	line-height:19px;
	font-weight:normal;
}
p{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 300;
	color: #aaaaaf;
	line-height: 24px;
}


 input{
	border: 1px solid #eaeaea;
	/* margin-bottom: 20px; */
	padding: 5px 0;
}
img{
	max-width:100%;
	height:auto}
.clear{
	clear:both;}

.red{
    background-color:#ff5e3a ;
}

.blue{
	background-color: #00afec;
}
.yellow{
	background-color:#fab318 ;
}
/*=================== General ====================*/
body{
	font-size:14px;
	color: #858585;
	line-height:24px;
	font-weight:300;
	font-family: "微軟正黑體",'Roboto', sans-serif!important;
	background-color: #e6e6e6;
	height: 100%;
	position: relative;
}
body::-webkit-scrollbar {
    width: 1em;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color:  rgba(0,175,236,0.3);
  outline: 1px solid slategrey;
}
body:after{
	content:" ";
	width: 16.6667%;
	/* background-color: #f8f8f8; */
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: -1;
	}

::selection {
	background: #00afec;
	color: #fff;
}
::-moz-selection {
	background: #00afec;
	color: #fff;
}
.container-full{
	margin-right: 30px;
	margin-left: 30px;
}
.container-full:after{
	content:" ";
	width: 100%;
	display: block;
	clear: both;
}
header{
	background-color: #444444;
	padding-top: 20px;
	padding-bottom: 20px;
	/* position: fixed; */
	z-index: 1;
}
header a#main-category-toggler{
	color: #FFF;
	text-decoration: none;
	background-color: #66c0c2;
	text-align: center;
	display: block;
	float: right;
	height: 25px;
	width: 40px;
	margin-top: 8px;
}
header a#main-category-toggler-close{
	display:none;
	color: #FFF;
	text-decoration: none;
	background-color: #ff5e3a;
	text-align: center;
	float: right;
	height: 25px;
	width: 40px;
	margin-top: 8px;
}
.search-form{
	margin: 0px;
	border: none;
	outline: 0;
	position: relative;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
::-webkit-input-placeholder {
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

:-moz-placeholder { /* Firefox 18- */
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

::-moz-placeholder {  /* Firefox 19+ */
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

:-ms-input-placeholder {  
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

.search-form fieldset{
	margin: 0px;
	padding-top: 5px;
	padding-right: 15px;
	padding-bottom: 5px;
	padding-left: 5px;
	color: #999;
 }
 .management .search-form input{
 	background-color: #eee;
 	color: #3f3f3f;
 	border: 1px solid #cfcfcf;
 }
.search-form input {
	font-family: DroidKufi-Regular;
	display: block;
	width: 100%;
	color: #999  !important;
	border: none;
	font-size: 14px;
	outline: 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	background-color: transparent;
	margin: 0px;
	border:2px solid #999;
}
.search-form input[type="submit"] {
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	display: block;
	font-size: 0px;
	margin: auto;
	overflow: hidden;
	border: none !important;
	top: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding-right: 0px;
	padding-left: 0px;
	width: 30px;
	right: 5px;
	background-image: url(../img/search-icon.png);
	height: 30px;
	padding-top: 0px;
	padding-bottom: 0px;
}
.dropdown-menu{
	min-width: auto;
    border-radius: 0;
    left: 5px;
    border: 0;
    /* margin-top: px; */
	padding: 10px 0;
	background-color:#eee;
}
header ul.top-menu{
	/* text-align: center; */
	margin: 0px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
header ul.top-menu li{
	display: inline-block;
	margin: auto 10px;
}
header ul.top-menu li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #dfdfdf;
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	display: block;
	padding-right: 20px;
	padding-left: 0px;
}
header ul.top-menu li span{
	display: block;
	float: left;
	line-height: 2;
	font-size: 14px;
}

header ul.top-menu li span.animation{
	width: 20px;
	display: block;
	float: left;
}
header ul.top-menu li a:hover{
	color: #fab318;
}
header ul.notifications{
	text-align: center;
	margin:0;
	padding:0;
}
header ul.notifications li:hover{
	border-left:2px solid #00afec;
}
header ul.notifications li{
	display: inline-block;
	float: right;
	line-height: 1.8;
	width:100%;
	font-family: "微軟正黑體","Arial",sans-serif;
}
header ul.notifications li.blue{
	background-color: transparent;
}
header ul.notifications li a{
	font-size: 15px;
	color: #3f3f3f!important;
	border-top:0!important;
	border-left:0!important;
	border-right:0!important;
	border-bottom:1px solid #cfcfcf!important;
	display: block;
	padding-right: 10px;
	padding-left: 10px;
	position: static;
	
}
header ul.notifications li a{

	/* border: 1px solid #999; */
	/* background-color: #525252; */
	
}
header ul.notifications li.red a:hover{
	background-color:#ff5e3a ;
}
header ul.notifications li.blue a:hover{
	background-color:#00afec ;
}
header .header-badge {
    position: absolute;
    top: -5px;
    left: 20px;
    padding: 4px 6px;
    font-size: 11px;
}
header .badge-color1{
	background-color: #fab318;
}
header .badge-color2{
	background-color: #66c0c2;
}
header .badge-color3{
	background-color: #ff5e3a;
}
header a.user-area{
	display: block;
}
header a.user-area .thumb{
	float: left;
	height: 40px;
	width: 40px;
	margin-right: 15px;
	overflow: hidden;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;}
header a.user-area h2{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #dfdfdf;
	font-weight: 700;
	font-size: 12px;
	text-transform: capitalize;
	margin: 0px;
	line-height: 1.8;
	padding: 0px;
	}
header a.user-area h3{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #dfdfdf;
	font-weight: 400;
	font-size: 10px;
	text-transform: capitalize;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	}
header a.user-area .fa{
	position: absolute;
	top: 40%;
	right: 10px;
	font-size: 17px;
	color: #fefefe;
}	
header ul.dropdown-menu-friend-requests{
	min-width:300px;
	margin-top: 32px;
	position: absolute;
	padding: 0px;
	border-radius: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	left: -150px !important;

}
header ul.dropdown-menu-friend-requests li{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #efefef;
	width: 100%;
	padding: 20px;
}
header ul.dropdown-menu-friend-requests li:hover{
	background-color:#fafafa
}
header ul.dropdown-menu-friend-requests li a{
	margin: 0px;
	padding: 0px;
}
header ul.dropdown-menu-friend-requests li a.name{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 700;
	text-transform: capitalize;
	color: #515365;
	text-decoration: none;
	}
header ul.dropdown-menu-friend-requests li span{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #888da8;
	font-size: 12px;
	font-weight: 300;
}	
header ul.dropdown-menu-friend-requests li .thumb{
	float: left;
	height: 45px;
	width: 45px;
	margin-right: 20px;
}
header ul.dropdown-menu-friend-requests li  .thumb img{
	-webkit-border-radius: 45px;
	-moz-border-radius: 45px;
	border-radius: 45px;
}
header ul.dropdown-menu-help-cnter{
	min-width:300px;
	margin-top: 32px;
	position: absolute;
	padding: 30px;
	border-radius: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	left: -150px !important;
	}
header ul.dropdown-menu-help-cnter li{
	width: 100%;
}
header ul.dropdown-menu-help-cnter li h2.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #ff5e3a;
	margin-bottom: 15px;
	margin-top: 0px;
}
header ul.dropdown-menu-help-cnter .search-form{
	border: none;
	outline: 0;
	position: relative;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
}
header ul.dropdown-menu-help-cnter ::-webkit-input-placeholder {
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

header ul.dropdown-menu-help-cnter :-moz-placeholder { /* Firefox 18- */
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

header ul.dropdown-menu-help-cnter ::-moz-placeholder {  /* Firefox 19+ */
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

header ul.dropdown-menu-help-cnter :-ms-input-placeholder {  
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
   	padding: 3px;

}

header ul.dropdown-menu-help-cnter  .search-form fieldset{
	margin: 0px;
	padding-top: 5px;
	padding-right: 15px;
	padding-bottom: 5px;
	padding-left: 5px;
	color: #999;
 }
header ul.dropdown-menu-help-cnter .search-form input {
	font-family: "微軟正黑體",'Roboto', sans-serif;
	display: block;
	width: 100%;
	color: #999  !important;
	border: 1px solid #e6e6e6;
	font-size: 14px;
	outline: 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-top: 8px;
	padding-right: 20px;
	padding-bottom: 8px;
	padding-left: 20px;
	background-color: #fafafa;
	margin: 0px;
	-webkit-border-radius: 01px;
	-moz-border-radius: 0px;
	border-radius: 0px;}
header ul.dropdown-menu-help-cnter .search-form input[type="submit"] {
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	display: block;
	font-size: 0px;
	margin: auto;
	overflow: hidden;
	border: none !important;
	top: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding-right: 0px;
	padding-left: 0px;
	width: 30px;
	right: 5px;
	background-image: url(../img/search-icon.png);
	height: 30px;
	padding-top: 0px;
	padding-bottom: 0px;
}
header ul.dropdown-menu-help-cnter ul.help-cat-link li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #979797;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	display: block;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e6e6e6;
	padding-right: 0px;
	padding-left: 0px;
	}
header ul.dropdown-notifications-items{
	min-width:365px;
	margin-top: 32px;
	position: absolute;
	padding: 0px;
	border-radius: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	left: -150px !important;
	}	
header ul.dropdown-notifications-items li a{
	margin: 0px;
	padding: 20px;
}
header ul.dropdown-notifications-items li{
	margin: 0px;
	padding: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e6e6e6;
	width: 100%;
}
header ul.dropdown-notifications-items li .notification-info{}
header ul.dropdown-notifications-items li .notification-info .color-1{
	color:#ff5e3a}
header ul.dropdown-notifications-items li .notification-info .color-2{
	color:#66c0c2}
header ul.dropdown-notifications-items li .notification-info .color-3{
	color:#fab318}

header ul.dropdown-notifications-items li .notification-info a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #888da8;
	font-weight: 300;
	}
header ul.dropdown-notifications-items li .notification-info a span{
	color:#66c0c2
}
header ul.dropdown-notifications-items li .notification-info a .fa{
	margin-right: 10px;
}
header ul.dropdown-notifications-items li .notification-info a h5.time{
	font-size: 11px;
	color: #888da8;
	margin-bottom: 0px;
	padding-bottom: 0px;
}
header ul.dropdown-notifications-items li .notification-info a:hover{
	background-color: #f8f8f8;
}
header ul.dropdown-notifications-items li a.all_notifications{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	background-color: #66c0c2;
	font-weight: 700;
	text-transform: uppercase;
	color: #FFF;
	text-decoration: none;
	text-align: center;
	font-size: 12px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding: 12px;
}
header ul.dropdown-notifications-items li a.all_notifications:hover{
	background-color: #fab318;
}
header ul.account-menu{
	min-width:270px;
	margin-top: 25px;
	position: absolute;
	border-radius: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	/* left: -95px !important; */
	/* padding-top: 0px; */
	padding-right: 0px;
	/* padding-bottom: 30px; */
	padding-left: 0px;

	}
header ul.account-menu li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	color: #7f7f7f;
	font-size: 12px;
	text-decoration: none;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ececec;
}
header ul.account-menu li a .fa{
	padding-right: 10px;
}
header ul.account-menu li  .color-1{
	color: #ff5e3a;
}
header ul.account-menu li  .color-2{
	color: #66c0c2;
}
header ul.account-menu li  .color-3{
	color: #fab318;
}
header ul.account-menu li  .color-4{
	color: #444444;
}
#main-category{
	background-color: #FFF;
	-webkit-box-shadow: -1px 2px 26px -6px rgba(0,0,0,0.37);
	-moz-box-shadow: -1px 2px 26px -6px rgba(0,0,0,0.37);
	box-shadow: -1px 2px 26px -6px rgba(0,0,0,0.37);
	position: relative;
	z-index: 10;
}
#main-category ul.main-category-menu{
	margin: 0px;
	padding: 0px;
}
#main-category ul.main-category-menu li {
	display: inline-block;
	position: relative;
}
#main-category ul.main-category-menu li:hover i{
	-webkit-animation-name: hvr-pulse;
  animation-name: hvr-pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
#main-category ul.main-category-menu li a{
	font-family:"微軟正黑體", 'Roboto', sans-serif;
	color: #444444;
	font-weight: 700;
	font-size: 14px;
	display: block;
	/* margin-right: 30px; */
	text-transform: uppercase;
/* 	padding-top: 20px;
	padding-bottom: 20px; */
}
#main-category ul.main-category-menu li a .fa{
	color: #ffffff;
	background-color: #ff5e3a;
	height: 35px;
	width: 35px;
	margin-right: 10px;
	text-align: center;
	padding-top: 8px;
	font-size: 18px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}
#main-category ul.main-category-menu li.color-1 a .fa {
	background-color: #ff5e3a;
	}
#main-category ul.main-category-menu li.color-2 a .fa {
	background-color:#00afec;
	}
#main-category ul.main-category-menu li.color-3 a .fa {
	background-color: #fab318;
	}
#main-category ul.main-category-menu li.color-4 a .fa {
	background-color: #444444;
	}	
#main-category ul.main-category-menu > li > ul{
	display:none;
	position: absolute;
	top: 75px;
	width: 250px;
	margin: 0px;
	padding: 0px;
	border: 1px solid #D6D6D6;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
	transform: translateY(10%);
	-webkit-transform: translateY(10%);
	-moz-transform: translateY(10%);
	-o-transform: translateY(10%);
	-ms-transform: translateY(10%);
	opacity: 0;
	left: 0;
	right: auto;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	display: block;
	visibility: hidden;
	z-index: 9999;
	}
#main-category ul.main-category-menu > li:hover > ul{
	display: block;
	transform: translateY(0);
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-o-transform: translateY(0);
	-ms-transform: translateY(0);
	opacity: 1;
	visibility:visible;
}
#main-category ul.main-category-menu > li > ul > li{
	display: block;
	background-color: #f8f9f4;
	position: relative;
	width: 200px;
}
#main-category ul.main-category-menu > li > ul > li > a{
	display: block;
	padding-top: 12px;
	padding-right: 20px;
	padding-bottom: 12px;
	padding-left: 20px;
	font-size: 12px;
	color: #333;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D6D6D6;
	background-color: #FFF;
	width: 100%;
}
#main-category ul.main-category-menu > li > ul > li > a:hover{
	background-color: #EEE;
	padding-left: 25px;
	color: #66c0c2;
}
#main-category ul.main-category-menu > li > ul > li > ul{
	position: absolute;
	display:none;
	width: 250px;
	z-index: 5555;
	top: -1px;
	right: 248px;
	border: 1px solid #D6D6D6;
	

	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
	transform: translateY(10%);
	-webkit-transform: translateY(10%);
	-moz-transform: translateY(10%);
	-o-transform: translateY(10%);
	-ms-transform: translateY(10%);
	opacity: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	display: block;
	visibility: hidden;
}
#main-category ul.main-category-menu > li > ul > li:hover > ul{
	display:block;
	transform: translateY(0);
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-o-transform: translateY(0);
	-ms-transform: translateY(0);
	opacity: 1;
	visibility:visible;
	
}
#main-category ul.main-category-menu > li > ul > li > ul > li {}
#main-category ul.main-category-menu > li > ul > li.withsub:before {
	content: "\f105"; /* FontAwesome Unicode */
	font-family: FontAwesome;
	display: inline-block; /* same as padding-left set on li */
	margin-right: -1.3px;
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 16px;
}
#main-category ul.main-category-menu > li > ul > li > ul > li > a{
	display: block;
	padding-top: 12px;
	padding-right: 20px;
	padding-bottom: 12px;
	padding-left: 20px;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D6D6D6;
	background-color: #FFF;
}
#main-category ul.main-category-menu > li > ul > li > ul > li > a:hover{
	background-color: #EEE;
	padding-left: 25px;
	color: #dd0c2b;
}
#sidebar-stick{
	top: 50px!important;
}
.left-sidebar{
	padding: 20px;
	background-color: #f8f8f8;
	height: 100%;
}
.left-sidebar ul.menu-sidebar{
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
	top: 0px;
	width: 100%;
}	
.left-sidebar ul.menu-sidebar li{
	list-style-type: none;
	display: block;
	margin: 0px;
	padding: 0px;
	width: 100%;
}
.left-sidebar ul.menu-sidebar li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e7e7e7;
	padding-top: 8px;
	padding-bottom: 8px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	color: #999999;
}
.left-sidebar ul.menu-sidebar li a .fa{
	font-size: 17px;
	color: #777777;
	text-align: center;
	width: 20px;
	margin-right: 10px;
}
.no-padding-left{
	padding-left: 0px !important;
}
.video_content .channel-name{
	float: right;
}
h1.new-video-title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	padding-top: 30px;
	padding-bottom: 0px;
	font-weight: 700;
	color: #444444;
	font-size: 14px;
	margin: 0px;
	float: left;
}
h1.new-video-title .new{
	float: left;
	position: relative;
	top: 10px;
	-webkit-animation-name: flash;
  animation-name: flash;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
h1.new-video-title span{
	display: block;
	margin-left: 10px;
	float: left;
	margin-top: 10px;
	font-size: 18px;
	color: #444;
}
h1.new-video-title span b{
	font-size: 26px;
	font-style: italic;
	margin-right: 3px;
	font-weight: bold;
 
}
h1.new-video-title span b
h1.new-video-title .fa{
	font-size: 18px;
	color: #ff5e3a;
	margin-right: 10px;
}
.playbutton{
	float: right;
	
}
.playbutton i{
font-size: 12px;
border-radius: 100%;
/* border: 5px solid #eee; */
padding: 5px 8px;
position: relative;
top: -10px;
right: -10px;
}
/* .playbutton:hover i:after{
	content: "";
	border: 5px solid #ff5e3a;
	height: 35px;
	width: 35px;
position: absolute;
top: -6px;
right:-7px;
border-radius: 100%;
-webkit-transition-property: right;
  transition-property: right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
} */
.video_main{
	/* background-color: #111; */
	padding: 25px 20px;
}
.tab-content .about_video .video-item span.loader i{
	top: 12px;
	/* right: -5px; */
	display: block;
	padding: 0 15px 0 0;
}
.tab-content .video-item span.loader i{
	top: -35px;
}
.video-item span.loader i {
	position: relative;
	top: -28px;
	right: 4px;
	float: right;
	font-size: 14px;
	
}
.ball-clip-rotate > div .playbutton i{
	animation: none;
}
 .ball-clip-rotate > div {
  background-color: #111;

  border-radius: 100%;
  margin: 2px;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  border: 4px solid #111;
  border-color: #ccc;
  height: 35px;
  width: 35px;
  background: transparent !important;
  display: inline-block;
  }
.related .video-item:hover .ball-clip-rotate > div,
.video-item span.loader:hover .ball-clip-rotate > div{
	 -webkit-animation: rotate 0.75s 0s linear;
          animation: rotate 0.75s 0s linear ;
}
@keyframes rotate {
  0% {
  	 border-top-color: #00afec;
    -webkit-transform: rotate(0deg) scale(1);
            transform: rotate(0deg) scale(1); }
  50% {
  	border-right-color: #00afec;
    -webkit-transform: rotate(180deg) scale(0.6);
            transform: rotate(180deg) scale(0.6); }
  100% {
  	border-bottom-color: #00afec;
    -webkit-transform: rotate(270deg) scale(1);
            transform: rotate(270deg) scale(1); }
 }
 .video_recommend .video-item .video-info{
 	min-height: 150px;
 	max-height: 150px;
 }
 
 #video_info .video-item a.title{
 	font-size: 24px;
 	padding: 15px 0;
 }
 .related #videosList,
 #video_info #videosList{
 	min-height: auto;
 	max-height: 100%!important;
 }
 /* .toggled  #videosList{
 	min-height: 270px;
	max-height: 270px;
	overflow: hidden;
 } */
 .toggled .video_recommend #videosList{
 	height: 360px;
	overflow: hidden;
 }
 .video_recommend #videosList{
 	height: 300px;
 	    display: table-cell;
    vertical-align: middle;
    background-color: #000;
    float: left;
 	/* min-height: 300px;
	max-height: 300px;
	overflow: hidden; */
 }
 #videosList{
 	/* min-height: 190px; */
 	width: 100%;
	/* min-height: 270px; */
	
	background-color: #000;
		display: inline-block;
	vertical-align: middle;
 }

.video{

		height: 270px;
	overflow: hidden;
	 	display: flex;
	vertical-align: middle;

      /* padding: 15px 0px; */
	
	/* background-color: #111; */
	
}
.video video{
	width: 100%;

}
.video-item{
	margin-bottom: 15px;
	margin-top: 15px;
	float: left;
	width: 100%;
	/* height:400px; */

}
.about_video h2{
	font-size: 26px;
	line-height: 1.5;
}
.about_video.related .video-item a.title{
	font-size: 20px;
	line-height: 1.5;
}
.related .video-item a.title{
	font-size: 14px;
}
.related .video-item:hover a.title{
	color:#ff5e3a;
}
.related .video-item{
	/* border-top: 1px solid #cfcfcf; */
	padding-bottom: 15px;
	margin-top: 0;
	border-bottom: 1px solid #cfcfcf;
}
.about_video.related .video-item{
padding: 0 0px 50px;
}
.about_video.related .video-item .video-info{
	padding: 0 20px;
		background: transparent;
}
.about_video.related{
padding: 0 0px 0px;

	background: transparent;
}
.related{
	/* max-height: 700px; */
	overflow-y: scroll;
	margin-top: 20px;
	padding: 20px;
	float: left;
	background-color: #eee;
}
.related h1.new-video-title{
	padding-top: 0;
	margin-bottom: 10px;
	float: left;
}
.related .video{
	height: 7rem;
}
.related .video-item .thumb{
	width: 40%;
	float: left;
}
.related .video-item .video-info{
	width: 60%;
	background-color: #eee;
}
.share button,
.share textarea{
	float: left;
}
.share textarea{
	height: auto;
	width:100%;
	border: 0;
	outline: none;
	padding: 10px;

	/* min-height: 20px;
	max-height: 40px; */
	margin-bottom: 10px;
	background-color: #f8f8f8;
	 /* overflow: hidden; */
}
.share{
	width: 100%;
	background-color: #eee;
	float: left;
	margin-top: 15px;
	padding:10px 20px 20px;

}
.share h1.new-video-title{
	padding-top: 10px;
	float: left;
}
.embedcontent{
	float: left;
	width: 100%;
	clear: both;
	margin-top: 10px;
}
.embedcontent textarea{
	height:140px;
	line-height: 1.5;
}
.embedlink button{
	background-color: #3f3f3f;
	border: 0;
	color: #fff;
	padding: 12px 20px;
	float: left;
	margin: 0 0px 0 10px;
	outline: none;
	border-radius: 5px;
}
.buttons{
	font-size: 14px;
}
#trigger-upload{
	padding: 5px 8px;
}
button.copy{
	background-color: #3f3f3f;
	border: 0;
	color: #fff;
	padding: 12px 20px;
	float: left;
	/* margin: 0 0px 0 10px; */
	outline: none;
	border-radius: 5px;
}
.embedlink button:active,
.embedlink button:focus,
.embedlink button:hover,
button.copy:active,
button.copy:focus,
button.copy:hover{
	transition: all .3s ease-in-out;
	background-color:#00afec ;
	color: #fff;
}
 ul.social_icon{
	/* width: 100%; */
	display: block;
	float: right;
	text-align: center;
}
.facebook a{
	color:#3b5a9b ;
}
.twitter a{
	color: #41abe1;
}
.google a{
	color:#dd4d40 ;
}
/*.line {*/
	/*width: 38px;*/
	/*margin-top: 1px;*/
/*}*/
.line a{
	color:#00c300;
}
ul.social_icon li{
	display: inline-block;
	padding: 15px 5px;
	float: left;
}
ul.social_icon  li a{
	font-size: 30px;
}
ul.social_icon  li:hover{
	 -webkit-animation-name: hvr-pulse-grow;
  animation-name: hvr-pulse-grow;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}
.video-item .thumb{
	position: relative;
}
.video-item .thumb .watermark{
	/*content: " ";*/
	/*position: absolute;*/
	/*background: url(../demo_img/G.png);*/
	/*background-size: cover;*/
	/*width: 65px;*/
	/*height: 65px;*/
	/*right: 25px;*/
	/*bottom: 90px;*/
	/*opacity: .6;*/
	position: absolute;
	display: inline-block;
	z-index: 1;
	width: 20%;
}
.video-item .thumb .watermark img {
	width: 100%;
	height: auto;
}
.video-item .thumb small.time{
	font-family: 'Roboto',"微軟正黑體", sans-serif;
	font-size: 12px;
	font-weight: 900;
	color: #ffffff;
	background-color: rgba(0, 0, 0, 0.5);
	display: block;
	padding: 5px;
	width: 60px;
	position: absolute;
	right: 10px;
	bottom: 10px;
	text-align: center;
	line-height: 10px;
		
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	}

.video_wrapper .video-item .video-info{
	background-color: #eee;
	padding: 20px;
}
.video_content{
	width: 100%;
	float: left;
	margin: 10px 0;
	padding: 10px;
	border-top: 1px solid #cfcfcf;

}
.video_content p{

	color: #3f3f3f;
	font-size: 14px;
	line-height: 1.8;
}
.video_copyright h4{
	font-size: 14px;
	margin-bottom: 10px;
}
.video_copyright ul{
	width: 100%;
	display: block;
	padding: 15px 10px;
	float: left;
	border-top: 1px solid #cfcfcf;
}
.video_copyright ul li{
	display: block;
	float: left;
	width: 100%;
	line-height: 1.5;
	font-size: 14px;
}
.video_copyright ul li span{
	font-size: 14px;
	color: #3f3f3f;
	padding: 0 10px 0 0px;
}
.video-item .video-info{
	background-color:#eee;
	padding: 5px 15px 20px;
	float: left;
	height:15vh;
	width: 100%;
}
.video_wrapper .video-item a.title{
	font-size: 20px;
	line-height: 1.3;
	margin-bottom: 10px;

}
.video-item a.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 16px;
	font-weight: 900;
	text-transform: uppercase;
	color: #333333;
	line-height: 19px;
	margin: 10px 0;
	text-decoration: none;
	display: block;


	}

.video_wrapper .video-info a.channel-name{
	float: right;
}
.video-info a.channel-name{
	display: block;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #6f6f6f;
	margin-top: 4px;
	margin-bottom: 4px;
	line-height: 19px;
}
.video-item a.channel-name .fa{
	color: #00afec;
	margin-right: 10px;
}
.about_video .video-item span{
	float: right;
}
.about_video .video-item span.loader a{
	width: 100px;
	text-align: center;
	top: auto;
	line-height:3;
	color: #fff;
	background-color: #3f3f3f;
	border-radius: 5px;
}
.about_video .video-item span.loader a:hover{
	background-color:#00afec ;
}
.about_video .video-item span.loader a:hover i{
	-webkit-animation-name: hvr-wobble-horizontal;
  animation-name: hvr-wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
.video-item span.loader{
	position: absolute;
	right:20px;
	bottom:25px;
}
.video-item span.loader a{
	position: relative;
	/* top: -15px; */
	color:#00afec;
	right: 0;
	float: right;
	height: 35px;
	width: 35px;
}

.video-item span{
	color: #a7a7a7;
	font-size: 10px;
	font-weight: 500;
	padding-right: 10px;
	margin: 0px;
	padding-top: 4px;
	padding-bottom: 4px;
	/* float: left; */
}
.video-item span.date{}
.video-item  span .fa{
	padding-right: 5px;
}
#loading-more{
	display: block;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 900;
	color: #ff5e3a;
	margin-bottom:10px;
	margin-top: 15px;
	}
#loading-more span{
	margin-top: -8px;
	display: inline-block;
}
#loading-more:hover .fa{
	-moz-animation: rotating 1s infinite linear;
    -webkit-animation: rotating 1s infinite linear;
    animation: rotating 1s infinite linear;
}
#loading-more .fa{
	color: #00afec;
	font-size: 20px;
	margin-right: 10px;
	-moz-animation: rotating 2s infinite linear;
    -webkit-animation: rotating 2s infinite linear;
    animation: rotating 2s infinite linear;
}

@keyframes rotating{
	from{
		font-size: 20px;
		transform: rotate(0)
	}
	to{
		font-size: 20px;
		transform: rotate(-360deg);
	}
}
#category-cover-image{
	margin-top: 30px;
	margin-bottom: 30px;
	position: relative;
	z-index: 0;
	height: 260px;
}
#category-cover-image:after{
	content:" ";
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 29%, rgba(0,0,0,0.65) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 29%,rgba(0,0,0,0.65) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 29%,rgba(0,0,0,0.65) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );				position: absolute;
	height: 100%;
	width: 100%;
	top: 0px;
	right: 0px;

}
#category-cover-image h1.title img{
	background-color: #fff;
	border-radius: 5px;
	padding: 12px;
	width: 120px;
}
#category-cover-image .image-in{}
#category-cover-image h4.title{
	margin-bottom: 55px!important;
	font-size: 16px!important;
	color: #ccc!important;
}
#category-cover-image h4.title,
#category-cover-image h3.title,
#category-cover-image h1.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	position: absolute;
	bottom: 20px;
	margin: 0px 0 20px;
	padding: 0px;
	left: 30px;
	color: #ffffff;
	font-size: 20px;
	font-weight: 700;
	z-index: 2;
}
#category-cover-image h1.title .fa{
	background-color: #00afec;
	color: #FFF;
	text-align: center;
	height: 35px;
	width: 35px;
	padding-top: 10px;
	margin-right: 15px;
	font-size: 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	
}
#category-cover-image  ul.category-info{
	position: absolute;
	margin: 0px;
	padding: 0px;
	right: 0px;
	top: 30px;
	z-index: 2;
}
#category-cover-image  ul.category-info.social_icon{
	bottom: 30px!important;
	top: auto;
	right: 30px;
	padding: 5px 15px;
	border-radius: 5px;
	background-color: rgba(255, 255, 255, 0.7);
}
#category-cover-image  ul.category-info li{
	display: inline-block;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #FFF;
	margin-right: 30px;
	margin-left: 30px;
	text-transform: uppercase;
}
#category-cover-image  ul.category-info.social_icon li{
	margin: 0;
	padding: 5px;
}
#category-cover-image  ul.category-info li.subscribe a{
	background-color: #00afec;
	color: #FFF;
	display: block;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	line-height: 1.5;
} 
#category-cover-image  ul.category-info li.subscribe a:hover{
}
#category ul.category-menu{
	background-color: #FFF;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
}
#category ul.category-menu li{
	list-style-image: none;
	list-style-type: none;
}
#category ul.category-menu li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E6E6E6;
	font-weight: 700;
	text-transform: uppercase;
	color: #444444;
	padding-top: 8px;
	padding-right: 15px;
	padding-bottom: 8px;
	padding-left: 15px;
}
#category ul.category-menu li a:hover{
	background-color: #ff5e3a;
	color: #FFF;
}
#category ul.category-menu li.active a{
	color: #FFF;
	background-color: #66c1c3;
}
#category .share-in{
	background-color: #FFF;
	padding: 25px;
	margin-top: 30px;
	margin-bottom: 30px;
}
#category h1.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	}
#category ul.social-link{
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
#category ul.social-link li{}
#category ul.social-link li a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #FFF;
	display: block;
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: 12px;
	font-weight: 300;
	text-transform: uppercase;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}	
#category ul.social-link li a .fa{
	margin-right: 5px;
	text-align: center;
	width: 15px;
}
#category ul.social-link li.facebook a{
	background-color: #5d82d1;
}
#category ul.social-link li.twitter a{
	background-color: #40bff5;
}
#category ul.social-link li.google-plus a{
	background-color: #eb5e4c;
}
#category ul.social-link li.vimeo a{
	background-color: #35c6ea;
}
#category .advertising-block h1.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	margin: 0px;
	padding-top: 15px;
	padding-right: 30px;
	padding-bottom: 15px;
	padding-left: 30px;
	}
#category .advertising-block{
	background-color: #FFF;
	margin-bottom: 30px;
}
#category h1.new-video-title{
	margin-top: 0px;
	padding-top: 0px;
}
#category #top-channels{
	background-color: #FFF;
	padding: 10px;
}
#category #top-channels ul.channels{
	list-style-image: none;
	list-style-type: none;
}
#category #top-channels ul.channels li{
	margin-bottom: 10px;
}

.chanel-item{
	background-color: #FFF;
	margin-bottom: 30px;
	padding: 20px;
	text-transform: uppercase;
}
.chanel-item .chanel-thumb{
	float: left;
	height: 70px;
	width: 70px;
	margin-right: 20px;
}
.chanel-item .chanel-thumb img{}
.chanel-item .chanel-info{
	float: left;
	margin-right: 20px;
	margin-top: 15px;
}
.chanel-item .chanel-info a.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 700;
	color: #333333;
	display: block;
	}
.chanel-item .chanel-info a.title:hover{
	color: #ff5e3a;
}
.chanel-item .chanel-info span.subscribers{
	font-size: 11px;
	font-weight: 300;
	color: #888484;
}
.chanel-item a.subscribe{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	background-color: #becccc;
	height: 25px;
	width: 85px;
	text-align: center;
	display: block;
	float: right;
	font-size: 11px;
	font-weight: 900;
	color: #FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-top: 25px;
	position: relative;
	z-index: 5;
}
.chanel-item a.subscribe:hover{
	background-color:#ff5e3a ;
	}
.chanel-item:after{
	content:" ";
	display: block;
	clear: both;
	width: 100%;
}
.company_info li{
	font-size: 14px;
	line-height:2.3;
	color: #3f3f3f;
}
.company_info li a{
	color: #3f3f3f;
}
.company_info li a:hover{
	color:#00afec ;
}
.basic_info ul{
	display: block;
	width: 100%;
	float: left;
	margin-top: 20px;

}
.basic_info ul li{
	font-size: 14px;
	line-height:2;
	color: #3f3f3f;
}
.playlist-item{
	margin-bottom: 30px;
}
.playlist-item .thumb-playlist{
	position: relative;
}
.playlist-item .thumb-playlist .img-in{}
.playlist-item .thumb-playlist  a.paly{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	color: #FFF;
	text-decoration: none;
	text-align: center;
	display: block;
	padding: 3px;
	width: 100px;
	position: absolute;
	left: 25px;
	bottom: 15px;
	background:rgba(102,193,195,0.7);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}
.playlist-item .thumb-playlist  a.paly .fa{
	padding-right: 8px;
}
.playlist-item .thumb-playlist .video-num{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	color: #FFF;
	padding: 3px;
	width: 100px;
	position: absolute;
	right: 25px;
	background:rgba(255,94,58,0.7);
	bottom: 15px;
	text-align: center;
}
.playlist-item .playlist-info{}
.playlist-item .playlist-info{
	background-color: #FFF;
	padding: 25px;
}
.playlist-item .playlist-info a.title{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	color: #333333;
	line-height: 19px;
	text-decoration: none;
	display: block;
	}
.playlist-item .playlist-info a.channel-name{
	display: block;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #a7a7a7;
	margin-top: 4px;
	margin-bottom: 4px;
	line-height: 19px;
}
.playlist-item .playlist-info a.channel-name .fa{
	color: #fab318;
}
.playlist-item .playlist-info span{
	color: #a7a7a7;
	font-size: 10px;
	font-weight: 500;
	padding-right: 10px;
	margin: 0px;
	padding-top: 4px;
	padding-bottom: 4px;
}
.playlist-item .playlist-info  span .fa{
	padding-right: 5px;
}
.about-category{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 300;
	color: #888da8;
	line-height: 24px;
	background-color: #FFF;
	padding: 30px;
	}
.sing-up-page{
	background-color: #ff5e3a;
}	
.sing-up-page:after{
	content:" ";
	width: 100%;
	background-color: #f8f8f8;
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: -1;
	background-attachment: fixed;
	background-image: url(../demo_img/sing-up-ba.jpg);
	opacity: 0.2;
	
	}
.page-content.member{
	margin-top: 50px;
}
.upoload_ok h3{
	font-size: 18px;
}
.upoload_ok h3 a{
	color:#00afec ;
	margin: 0 5px;
}
.upoload_ok h3 a:hover{
	text-decoration: underline;
	transition: all .3s ease-in-out;
}
.member .upload_button{
	display: block;
	float: left;
	margin-top: 20px;
}

.member .correct_button a{
	/* float: left; */
	/* width: 45%; */
	width: 80px;
}
.member h1.new-video-title{
	padding-top: 0;
	float: left;
	/* margin-bottom: 20px; */
}
.member .user-status{
	margin-top: 10px;
	margin-bottom: 0px;
}
.member .user-name{
	font-size: 20px;
	color: #111;
	font-weight: bold;
}
.member .user-status,
.member .user-name{
	width: 100%;
	float: left;
}
.member ul.company_info{
	margin-top:20px ;
}
.member .user-info{
	display: block;
	float: left;
	margin: 20px 0 20px;
}
.member .user-info .user-pic img{
	border-radius: 10px;
	max-width: 100%;
}
.member .log-in-form .form-output{
	background-color: #eee;
	margin-bottom: 30px;
}
.member .log-in-form{
	margin-top: 0;
	 max-width: 100%!important;
	 background-color: transparent;
}
.member .form-control{
	background-color: #eee;
}
.radio span,
.checkbox span{
	float: left;
	margin-left: 5px;
	font-size: 16px;
}
.radio input,
.checkbox input{
	float: left;
	margin-left: 0px!important;
	margin-top: 0;
	width: 20px;
	height: 20px;
}
.log-in-form .remember label{
	padding-left: 0;
}
.remember .checkbox{
	width: auto!important;
}
.remember .checkbox input{
	margin-top: 3px;
	margin-right:10px;
}
.checkbox, .radio{
	float: left;
	width: 50px;
	margin-right: 10px ;
	margin-top: 10px!important;
}
.radio span{
	margin-left: 5px;
	color: #3f3f3f;
}
.register .log-in-form{
	/* max-width: 100%!important; */
	margin-top: 120px;
}
.log_in_page{
	background-color: rgba(0, 175, 236, 0.5);
}	
.log_in_page:after{
	content:" ";
	width: 100%;
	background-color: rgba(0, 175, 236, 0.8);
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: -1;
	background-attachment: fixed;
	background-image: url(../img/login_bg.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;

    opacity: 0.2;
	}	
.log-in-form{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	max-width:470px;
	background-color: #FFF;
	margin-right: auto;
	margin-left: auto;
	margin-top: 130px;
	margin-bottom: 100px;
	font-size: 13px;
	color: #888da8;
	font-weight: 300;
}
.log-in-form #log-in-head{
	background-color: #444444;
	padding: 20px;
}	
.log-in-form #log-in-head h1{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	float: right;
	margin-top: 15px;
	color: #FFF;
	font-size: 14px;
	font-weight: 900;
	text-transform: uppercase;
}
.log-in-form .form-output{
	padding: 30px;
	float: left;
    width: 100%;
    display: block;
    background-color: #fff;
	}
	.member .log-in-form .form-output label{
		margin-top: 0px;
	}
.log-in-form .form-output label{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-transform: capitalize;
	color: #686868;
	margin-bottom: 10px;
	width: 100%;


}
.log-in-form  .form-control{
	border-radius: 0px;
	-webkit-box-shadow:none;
	height: 50px;
}
.log-in-form .remember:after{
	content:" ";
	clear: both;
	width: 100px;
	display: block;
}
.log-in-form .remember label{
	float: left;
}
.log-in-form .remember a{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 13px;
	color: #888da8;
	font-weight: 300;
	}
.log-in-form .remember a.forgot{
	float: right;

}	
.log-in-form .or{
	margin-top: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D6D6D6;
	margin-bottom: 20px;	
	}
.log-in-form  .btn-primary:hover{
	background-color: #00afec;
}
.log-in-form  .btn-primary{
	border-radius: 0px;
	background-color: #575757;
	width: 100%;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 20px;
	margin-right: 10px;
	margin-bottom: 10px;
	border-radius: 5px;
	}	
.log-in-form   .bg-facebook{
	background-color: #2f5b9d;
	color: #FFF;
	text-decoration: none;
	border-radius: 0px;
	width: 100%;
}

 .log-in-form .basic_info .fa{
	margin-right: 10px;
}
.log-in-form   .bg-twitter{
	background-color: #38bff1;
	color: #FFF;
	text-decoration: none;
	border-radius: 0px;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
}	
#watch{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	background-color: #FFF;
	padding: 30px;
	margin-top: 30px;
	margin-bottom: 30px;
}
#watch h1.video-title{
	margin-bottom: 30px;
}
#watch .video-share{
	border: 1px solid #e6e8e8;
	padding: 20px;
	margin-top: 30px;
	margin-bottom: 30px;
	background-color: #fbfbfb;
}
#watch .video-share:after{
	content:" ";
	clear: both;
	width: 100%;
	display: block;
}
#watch .video-share ul.like{
	padding: 0px;
	float: left;
	list-style-image: none;
	list-style-type: none;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#watch .video-share ul.like li{
	display: inline-block;
	margin-right: 15px;
}
#watch .video-share ul.like li a{
	font-weight: 900;
}

#watch .video-share ul.like li a.deslike{
	color: #aaaaaa;
	text-decoration: none;
}
#watch .video-share ul.like li a.like{
	color: #66c0c2;
}
#watch ul.social_link{
	float: right;
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
#watch ul.social_link li{
	display: inline-block;
}
#watch ul.social_link li a{
	color: #a7a7a7;
	text-align: center;
	display: block;
	height: 30px;
	width: 30px;
	border: 1px solid #D2D2D2;
	padding-top: 4px;
	font-size: 14px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;	
}
#watch ul.social_link li a:hover{
	background-color: #fab318;
	border: 1px solid #FAAC0C;
	color: #FFF;
}
#watch .chanel-item{
	background-color: #fbfbfb;
	border: 1px solid #E8E8E8;
}
#comments{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	}
#comments h3.post-box-title{
	color: #ff5e3a;
	font-size: 14px;
	font-weight: 900;
	border-bottom-width: 2.5px;
	border-bottom-style: solid;
	border-bottom-color: #fab318;
	margin-top: 35px;
	margin-bottom: 25px;
	padding-top: 5px;
	padding-bottom: 5px;
}
#comments h3.post-box-title span{
	color: #66c1c3;
}
#comments  ul.comments-list{
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
#comments  ul.comments-list li {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e6e8e8;
	margin-bottom: 30px;
	padding-bottom: 30px;
}
#comments  ul.comments-list li a.reply{
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	color: #66c0c2;
	text-decoration: none;
}
#comments  ul.comments-list li .post_author{
	margin-bottom: 25px;
}
#comments  ul.comments-list li .post_author a.author-name{
	font-size: 14px;
	font-weight: 900;
	color: #6f6f6f;
	display: block;
	text-transform: uppercase;
}
#comments  ul.comments-list li .post_author time{
	font-size: 12px;
	color: #bbb8b9;
}
#comments  ul.comments-list li .post_author:after{
	content:" ";
	display: block;
	clear: both;
	width: 100%;
}
#comments ul.comments-list li .post_author .img_in{
	float: left;
	height: 45px;
	width: 45px;
	margin-right: 15px;
	-webkit-border-radius: 45px;
	-moz-border-radius: 45px;
	border-radius: 45px;
	overflow: hidden;
}
#comments  ul.comments-list li p{
	}
#comments  ul.children{
	margin-left: 55px;
}
#comments .form-control{
	border-radius: 0px;
	-webkit-box-shadow:none;
	}
#comments  .btn-dm{
	border-radius: 0px;
	color: #FFF;
	text-decoration: none;
	background-color: #66c0c2;
	margin-top: 20px;
}	
#related-posts{
	background-color: #FFF;
	padding: 30px;
	margin-top: 30px;
	margin-bottom: 30px;
}
#related-posts .related-video-item{
	margin-top: 15px;
	margin-bottom: 15px;
}
#related-posts .related-video-item:after{
	content:" ";
	display: block;
	clear: both;
	width: 100%;
	}
#related-posts .related-video-item .thumb{
	float: left;
	height: 85px;
	width: 120px;
	margin-right: 10px;
	position: relative;
	overflow: hidden;
}
#related-posts .related-video-item .thumb img{
	max-width:150%}
#related-posts .related-video-item .thumb small.time{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 900;
	color: #ffffff;
	background-color: #76c1c7;
	display: block;
	padding: 5px;
	width: 60px;
	position: absolute;
	right: 10px;
	bottom: 10px;
	text-align: center;
	line-height: 10px;
		
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	}
#related-posts .related-video-item a.title {
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	color: #333333;
	line-height: 19px;
	text-decoration: none;
	display: block;
	}
#related-posts .related-video-item  a.channel-name{
	display: block;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #a7a7a7;
	margin-top: 4px;
	margin-bottom: 4px;
	line-height: 19px;
}
#related-posts .related-video-item  a.channel-name .fa{
	color: #fab318;
}

#upload{
	margin-top: 30px;
	margin-bottom: 30px;
}	
#upload h1.page-title{
	color: #66c0c2;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D6D6D6;
	padding-top: 10px;
	padding-bottom: 10px;
}
#upload h1.page-title span{
	color: #ff5e3a;
}
#upload label{
	font-size: 12px;
	font-weight: 900;
	color: #333333;
	text-transform: uppercase;
}
#upload textarea{
	margin-bottom: 10px;
}
#upload .form-control{
	border-radius: 0px;
	-webkit-box-shadow:none;
	background-color: #f6f3f3;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	}
#upload .btn-dm{
	border-radius: 0px;
	color: #FFF;
	background-color: #66c0c2;
	width: 100%;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	margin-top: 10px;
}
.sidebar{
	margin-top: 30px;
}
.widget{
	background-color: #FFF;
	padding: 30px;
	margin-bottom: 45px;
	position: relative;
	border: 1px solid #e6e6e6;
} 
.widget h3.widget-title:before{
	content:" ";
	background-image: url(../img/right_sticky.png);
	width: 50px;
	top: -12px;
	right: 10px;
	float: left;
	margin-right: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #66c0c2;
	margin-top: 8px;
}
.widget h3.widget-title{
	margin-bottom: 20px;
	padding-bottom: 0px;
	text-align: left;
	font-size: 14px;
	font-weight: 900;
	text-transform: uppercase;
	color: #ff5e3a;
}
.about-me-widget{
	text-align: center;
}
.about-me-widget .about-me-img{
	text-align: center;
	margin-bottom: 20px;
}
.about-me-widget .about-me-img img{
	width: 90px;
	border: 8px solid #FFF;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
	}
.social-widget ul.social_link > li{
	float:left ;
	
}
.social-widget ul.social_link > li > a{
	color: #999;
	border: 1px solid #EEE;
}
.news-letter-widget{}
.news-letter-widget form input{
	width: 100%;
	border: 1px solid #eaeaea;
	margin-bottom: 20px;
	padding: 5px;
	background-color: #FBFBFB;
}
.news-letter-widget form input[type="submit"] {
	background-color: #66c0c2;
	color: #FFF;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
 }
.widget ul.recent-post{
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
.widget ul.recent-post li{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D6D6D6;
	margin-bottom: 15px;
	padding-bottom: 15px;
}
.widget ul.recent-post li .image-left{
	float: left;
	height: 90px;
	width: 90px;
	margin-right: 8px;
	position: relative;
	overflow: hidden;
}
.widget ul.recent-post li .image-left img{
	max-width:180%;
	
}
.widget ul.recent-post li .image-left .p-overlay{
	position: absolute;
	height: 100%;
	width: 100%;
	background: rgba(0, 0, 0, 0.6);
	opacity: 0;
	z-index: 5;
	top: 0px;
	right: 0px;
	}
.widget ul.recent-post li:hover .image-left .p-overlay{
	-webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
	opacity: 1;
	background: rgba(0, 0, 0, 0.6);
	text-align: center;
	padding-bottom: 30px;
}
.widget ul.recent-post li:hover .image-left .p-overlay .fa{
	font-size: 25px;
	color: #FFF;
	text-align: center;
	top: 70%;
	webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	position: relative;
}
.widget ul.recent-post li .p-content h3{
	margin-bottom: 5px;
	text-transform: capitalize;
}
.widget ul.recent-post li .p-content .p-date{
	font-size: 11px;
	font-style: italic;
}

.tag-widget .tag-details a{
	
	background: #f7f7f7;
    color: #c0c0c0;
    display: inline-block;
    font-weight: 500;
    line-height: 33px;
    margin: 5px 3px;
    padding: 0 15px;
    text-align: center;
}
.tag-widget .tag-details a:hover{
	color: #FFF;
	background-color: #66c0c2;
}
.category-post-no{}
.category-post-no ul {
	margin: 0px;
	padding: 0px;
}
.category-post-no ul li {
	display: block;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #EFEFEF;
}
#blog .posts{
	margin-top: 30px;
	margin-bottom: 30px;
}
#blog .posts .thumbnail {
    border: 1px solid rgba(169, 169, 169, 0.23);
    padding: 0;
    border-radius: 0;
}
#blog .posts .thumbnail .caption {
    padding: 15px 20px;
    padding-bottom: 30px;
}
#blog .posts .thumbnail .caption p a {	font-family: "微軟正黑體",'Roboto', sans-serif;
font-size: 17px;
    font-weight: bold;
    color: #3e3e3e;
}
#blog .posts .thumbnail .caption ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#blog .posts .thumbnail .caption ul li {
    margin-right: 40px;
}
#blog .posts .thumbnail .caption ul a {
	color: #ff5e3a;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-style: italic;
	font-size: 12px;
	font-weight: 400;
}
#blog .posts .thumbnail .caption ul li:last-child {
    color: #858585;	font-family: "微軟正黑體",'Roboto', sans-serif;
font-style: italic;
    font-size: 11px;
}
#blog .posts .thumbnail .caption p {
    color: #858585;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
}
#blog .posts .link-post .header {
    background-color: #f8931d;
    padding: 16px 5px 15px 25px;
}
#blog .posts .link-post .header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
}
#main .posts .link-post .header ul a {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: bold;
}
#blog .posts .link-post .header ul li {
    margin-right: 15px;
}
#blog .posts .link-post .header i {
    font-size: 24px;
}
#blog .posts .player-post .header {
    background-color: #66af17;
    padding: 16px 5px 15px 25px;
}
#blog .posts .player-post .header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
}
#blog .posts .player-post .header i {
    font-size: 12px;
    color: #FFF;
    margin-right: 35px;
}
#blog .slide-post img {
    width: 100%;
}
#blog .slide-post .swiper-container {
    width: 100%;
    height: 100%;
}
#blog .slide-post .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#blog .ctrl-btn {
    margin: 0 10px;
}
#blog .posts .thumbnail {
    border: 1px solid rgba(169, 169, 169, 0.23);
    padding: 0;
    border-radius: 0;
}
#main .posts .thumbnail .caption {
    padding: 15px 20px;
    padding-bottom: 30px;
}
#blog .posts .thumbnail .caption p a {	font-family: "微軟正黑體",'Roboto', sans-serif;
font-size: 17px;
    font-weight: bold;
    color: #3e3e3e;
}
#blog .posts .thumbnail .caption ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#blog .posts .thumbnail .caption ul li {
    margin-right: 40px;
}
#blog .posts .thumbnail .caption ul a {
	color: #ff5e3a;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-style: italic;
	font-size: 12px;
	font-weight: 300;
}
#blog .posts .thumbnail .caption ul li:last-child {
    color: #858585;	font-family: "微軟正黑體",'Roboto', sans-serif;
font-style: italic;
    font-size: 11px;
}
#blog .posts .thumbnail .caption p {
    color: #858585;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
}
#main .posts .link-post .header {
    background-color: #f8931d;
    padding: 16px 5px 15px 25px;
}
#main .posts .link-post .header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
}
#blog .posts .link-post .header ul a {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: bold;
}
#blog .posts .link-post .header ul li {
    margin-right: 15px;
}
#blog .posts .link-post .header i {
    font-size: 24px;
}
#blog .posts .player-post .header {
    background-color: #66af17;
    padding: 16px 5px 15px 25px;
}
#blog .posts .player-post .header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
}
#blog .posts .player-post .header i {
    font-size: 12px;
    color: #FFF;
    margin-right: 35px;
}
#blog .slide-post img {
    width: 100%;
}
#blog .slide-post .swiper-container {
    width: 100%;
    height: 100%;
}
#blog .slide-post .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#blog .ctrl-btn {
    margin: 0 10px;
}
#blog .video-post img {
    width: 100%;
}
#blog .video-post .header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}
#blog .video-post .header a {
    position: absolute;
}
#blog .video-post .header a i {
    font-size: 60px;
}
#blog .posts .pagin ul a {
    background-color: #f8931d;
    color: #FFF;
    border-radius: 50%;
    margin: 0 10px;
	font-family: "微軟正黑體",'Roboto', sans-serif;
    padding: 5px 12px;
    border: 0;
}
#blog .posts .pagin ul li:first-child a {
    margin: 0;
}
#blog .posts .pagin ul a.current {
    background-color: #66ae17;
}

#single-page{
	background-color: #FFF;
	margin-top: 30px;
	margin-bottom: 30px;
}
#single-page .content{
	padding: 30px;
}
#single-page .content h1.title{
	font-size: 36px;
	line-height: 46px;
	text-transform: capitalize;
	color: #66c0c2;
}

#single-page .video-share{
	border: 1px solid #e6e8e8;
	padding: 20px;
	margin-top: 30px;
	margin-bottom: 30px;
	background-color: #fbfbfb;
}
#single-page .video-share:after{
	content:" ";
	clear: both;
	width: 100%;
	display: block;
}
#single-page .video-share ul.like{
	padding: 0px;
	float: left;
	list-style-image: none;
	list-style-type: none;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#single-page .video-share ul.like li{
	display: inline-block;
	margin-right: 15px;
}
#single-page .video-share ul.like li a{
	font-weight: 900;
}

#single-page .video-share ul.like li a.deslike{
	color: #aaaaaa;
	text-decoration: none;
}
#single-page .video-share ul.like li a.like{
	color: #66c0c2;
}
#single-page ul.social_link{
	float: right;
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
#single-page ul.social_link li{
	display: inline-block;
}
#single-page ul.social_link li a{
	color: #a7a7a7;
	text-align: center;
	display: block;
	height: 30px;
	width: 30px;
	border: 1px solid #D2D2D2;
	padding-top: 4px;
	font-size: 14px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;	
}
#single-page ul.social_link li a:hover{
	background-color: #fab318;
	border: 1px solid #FAAC0C;
	color: #FFF;
}
.single-comments{
	background-color: #FFF;
	margin-bottom: 30px;
	padding: 30px;
}
.single-comments  h3.post-box-title{
	margin-top: 0px !important;
	padding-top: 0px !important;
}
.error-page{
	margin-top: 100px;
	margin-bottom: 100px;
}
.error-page h1.error-no{
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 200px;
	font-weight: 900;
	color: #ff5e3a;
	}
.error-page p.error-text{
	font-size: 13px;
	padding-top: 50px;
	font-weight: 300;
	text-decoration: none;
}	
.error-page input {
	background-color: #FFF;
}
#history{}
#history h1.title{
	font-size: 16px;
	font-weight: 900;
	color: #ff5e3a;
	padding: 0px;
	margin-top: 30px;
	margin-bottom: 30px;
}
#history .filter{
	background-color: #FFF;
}
#history .filter:after{
	content:" ";
	display: block;
	clear: both;
	background-color: #FFF;
	width: 100%;
}
#history .nav-tabs{
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
#history .nav-tabs>li>a{
	color: #444444;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	-webkit-border-radius:0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 900;
	padding-top: 15px;
	padding-bottom: 15px;
	}
#history .nav-tabs>li.active>a, #history .nav-tabs>li.active>a:focus, #history .nav-tabs>li.active>a:hover{
	background-color: #66c0c2;
	color: #FFF;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	-webkit-border-radius:0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 900;
	}
#history .search-form{
	margin: 0px;
	border: none;
	outline: 0;
	position: relative;
	font-family: "微軟正黑體",'Roboto', sans-serif;
	font-size: 12px;
	color: #adadb0;
	font-weight: 400;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#history .search-form fieldset{
	margin: 0px;
	padding-top: 5px;
	padding-right: 15px;
	padding-bottom: 5px;
	padding-left: 5px;
	color: #999;
 }
#history .search-form input {
	display: block;
	width: 100%;
	color: #999  !important;
	border: 1px solid #EFEFEF;
	font-size: 14px;
	outline: 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	background-color: #ffffff;
	margin: 0px;
}
#history .search-form input[type="submit"] {
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	display: block;
	font-size: 0px;
	margin: auto;
	overflow: hidden;
	border: none !important;
	top: 5px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	width: 35px;
	right: 5px;
	background-image: url(../img/search-icon-2.png);
	height: 35px;
	background-color: #fab318;
	padding: 0px;
}

#main-page{}
#main-page .main-header{
	background-color: #444;
	text-align: center;
	padding-top: 150px;
	padding-bottom: 150px;
	background-attachment: fixed;
	background-image: url(../demo_img/main.jpg);
}
#main-page .main-header h1{
	font-family: Raleway;
	font-weight: 700;
	color: #F8F8F8;
	text-transform: capitalize;
	margin-top: 50px;
	margin-bottom: 50px;
	font-size: 22px;
	line-height: 46px;
}
#main-page .main-header .wasf{
	max-width:600px;
	margin-right: auto;
	margin-left: auto;
	color: #E6E6E6;
	}	
#main-page .main-header .btn{
	margin-top: 50px;
	background-color: #ff5e3a;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}	

#main-page  #theme-page{
	background-color: #eee;
	padding-top: 70px;
	padding-bottom: 70px;
	text-align: center;
}
#main-page  #theme-page .btn-buy{
	margin-top: 50px;
	background-color: #ff5e3a;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}	
#main-page  #theme-page h3{
	margin-top: 20px;
	margin-bottom: 60px;
	text-transform: capitalize;
}
.page-item{
	margin-bottom: 30px;
}
.page-item .page-item-thumb{
	position: relative;
	box-shadow: 0 0 34px 0 rgba(63, 66, 87, 0.3);
	margin-bottom: 25px;
}
.page-item:hover a.btn-breez{
	display:block !important}
.page-item:hover a.full-block{
	display:block !important}
.page-item .page-item-thumb a.full-block{
	display:none;
	z-index: 3;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0px;
	right: 0px;
	background:	rgba(0,0,0,0.7) ;
}
.page-item .page-item-thumb a.btn-breez{
	display:none;
	position: absolute;
	top: 80px;
	right: 0%;
	color: #FFF;
	background-color: #fab318;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	left: 0px;
	height: 30px;
	width: 100px;
	z-index: 5;
}
.page-item  .title{
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
	padding-top: 8px;
	padding-bottom: 8px;
}



/* scrollToTop */
.scrollToTop{
    width:44px; 
    height:44px;
    padding:10px; 
    text-align:center; 
    /* background: whiteSmoke; */
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position:fixed;
    bottom:20px;
    right:20px;
    line-height: 1.5;
    display:none;
    background-color: #00afec;
    color: #fff!important;
    border-radius: 5px;
    /* background: url('arrow_up.png') no-repeat 0px 20px; */
}

.scrollToTop:hover{
    text-decoration:none;
}
/* tab */
.tab .nav-tabs{
		    position: relative;
		    border-bottom: none;
		    float: left;
		}
		.tab .nav-tabs li{
		    text-align: center;
		    margin-right: 10px;
		}
		.tab .nav-tabs li a{
		    display: block;
		    font-size: 16px;
		    font-weight: 600;
		    color: #444;
		    padding: 10px 15px;
		    background: #eee;
		    margin-right: 0;
		    border: none;
		    border-radius: 10px;
		    overflow: hidden;
		    position: relative;
		    /* z-index: 1; */
		    transition: all 0.5s ease 0s;
		}
		.tab .nav-tabs li a:before{
		    content: "";
		    width: 100%;
		    height: 3px;
		    background: #fff;
		    position: absolute;
		    top: 92%;
		    left: 0;
		    transition: all 0.3s ease 0s;
		}
		.tab .nav-tabs li a:hover:before,
		.tab .nav-tabs li.active a:before,
		.tab .nav-tabs li.active a:hover:before{
		    top: 0;
		}
		.tab .nav-tabs li a:after{
		    content: "";
		    width: 100%;
		    height: 100%;
		    background: #fff;
		    position: absolute;
		    top: 100%;
		    left: 0;
		    z-index: -1;
		    transition: all 0.3s ease 0s;
		}
		.tab .nav-tabs li a:hover:after,
		.tab .nav-tabs li.active a:after,
		.tab .nav-tabs li.active a:hover:after{
		    top: 0;
		}
		.nav-tabs li.active a,
		.nav-tabs li.active a:focus,
		.nav-tabs li.active a:hover,
		.nav-tabs li a:hover{
		    border: none;
		    background-color:#00afec;
		    color: #fff;
		}
		.tab .tab-content .about{
			margin-bottom: 40px;
		}
		.tab .tab-content{
		    /* padding: 30px 15px 20px; */
		    /* background: #eee; */
		    font-size: 14px;
		    color: #555;
		    line-height: 26px;
		    float: left;
		    width: 100%;
		    border-radius: 10px;
		}
		.tab .tab-content h3{
		    font-size: 24px;
		    margin-top: 0;
		}
		@media only screen and (max-width: 479px){
		    .tab .nav-tabs li{ width: 100%; }
		}
		#Section3{
			padding: 20px;
		}
		#Section3 h3{
			margin: 20px 0 10px;
			font-weight: bold;
		}
.about p{
	line-height: 2;
	color: #3f3f3f;
	padding: 0 20px;
}

.about_info{
	display: block;
	width: 100%;
	float: left;
	margin: 20px 0;
}
.about_link ul li a,
.about_info ul li a{
	color: #3f3f3f;
}
.about_link ul li a:hover,
.about_info ul li a:hover{
	color:#00afec ;
}
.about_info ul li {
	width: 100%;
	margin:5px 20px;
	float: left;
	
}
.about_info ul li span{
	width: 30px;
	float: left;
	height: 30px;
	font-size: 20px;
	display: block;
	text-align: center;
	background-color: #cfcfcf;
	border-radius: 5px;
	margin-right: 10px;
}
.about_info ul li a span{
	color: #fff;
}
.about_link ul{
	padding: 0 0px;
}
.about_link ul li{
	display: inline-block;
	margin:10px 20px ;
}
.video-input .radio{
	width: 100px;
}
.video-input ul {
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
	float: left;
}
.video-input ul li{
	/* display: table-cell; */
	width: 32%;
	float: left;
	/* margin: 0 8px; */
	/* height: 100px; */
	/* vertical-align: middle; */
	
}
.video-input ul li:nth-child(2){
margin: 0 10px;
}
.video_text{
	padding:70px 00px 0;
}
.video_text label{
	font-size: 16px;
	margin-bottom: 10px;
	color: #3f3f3f;
	font-weight: bold;
}
.video_editbg .video-input.form-output h4{
	display: block;
	float: left;
	width: 100%;
	color: #3f3f3f;
	font-weight: bold;
	margin: 20px 0 5px;
	font-size: 16px;

}
.video_editbg .video-input.form-output h4 a{
	margin-left: 5px;
	color: #3f3f3f;
}
.video_editbg .video-input.form-output h4 a:hover{
	color: #00afec;
}
.video-input ul li a{
	display: table-cell;
	vertical-align: middle;

}
textarea.form-control{
	margin-bottom: 20px;
}
.video_editbg  textarea.form-control{
	height: 100%;
	min-height: 350px;
	outline: none;
}
.video_editbg .video-input.form-output{
	padding:20px 0 0;
	background-color: transparent;
}
.video_editbg{
	background-color: #eee;
	padding: 0 20px 50px;
	margin-top: 50px;
}
.video_edit{
	background-color: #eee;
}
.video_edit h1.new-video-title{
	padding-top: 0;
}
.log-in-form .form-output{
	background-color: #fff;
}
.video_edit .log-in-form{
	max-width:100%!important;
	background-color: transparent;
	margin-top: 0;
}
.management h1.new-video-title{
	float: left;
	padding-top: 0;
}
.management{
	background-color: #eee;
	padding: 20px;
	margin-top: 50px;
}
.page ul{
	display: block;
	width: 100%;
	text-align: right;
}
.page ul li{
	display: inline-block;
}
.page ul li a{
	font-size: 16px;
	margin: 0 5px;
	color: #3f3f3f;
}
.page ul li a:hover{
	color:#00afec ;
}
#demo-switch{
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

#demo-switch li{
	display: inline-block;
	border: #aaa 1px solid;
	color: #aaa;
	letter-spacing: 1px;
	cursor: pointer;
	padding: 3px 8px;
	margin:10px 0px 0px 0px;
	font-size: 14px;
	background-color: #ffffff;
}

#demo-switch li.active{
	border: #1a1a1a 1px solid;
	background-color: #1a1a1a;
	color: #ffffff;
}

.demo-intro{
	margin-bottom: 30px;
	border: #1a1a1a 1px solid;
	background-color: #ffffff;
	padding: 10px 15px;
}

.demo-intro div{
	display: none;
}

.good, .bad{
	border-bottom: #ddd 1px dashed;
}

.good{
	color: #00acc1;
}
.bad{
	color:#e65100;
}

.good .fa, .bad .fa{
	margin-right: 5px;
}
.rwd-table{
	width: 99.9%;
	overflow-x: auto;
}
#demo-table,.css-table{
	
	/* background-color: #ffffff; */
	border-collapse: collapse;
	margin-bottom: 20px;
}

#demo-table td, #demo-table th,
.css-table .td, .css-table .th{
	padding: 5px;
}

#demo-table td,
.css-table .td{
	color: #666666;
	border: #ddd 1px solid;
}

#demo-table th,
.css-table .th{
	background-color: #444;
	color:#ffffff;
	border: #cfcfcf 1px solid;
	text-align: center;
}
.css-table .video{
	/* height: 9rem; */
	/* width: 250px; */
	height: auto;
	display: block;
	float: none;
	margin: 0 auto;
}
.css-table #videosList{
	min-height: auto;
	max-height: 100%;
	max-width: 200px;
}
.css-table small.time{
	position: relative;
	top: -20px;
	right: 50px;
	float: right;
	background-color: rgba(255,255,255,0.8);
	color: #3f3f3f;
	padding: 3px;
	border-radius: 5px;

}
.css-table{
	display: table;
	display: none;
	margin-top: 20px;
	width: 100%;
}
.css-table .thead{
	display:table-header-group;
}
.css-table .tbody{
	display:table-row-group;
}
.css-table .tr{
	display:table-row;
}
.css-table .th,
.css-table .td{
	display:table-cell;
	vertical-align: middle;
	padding: 10px;
	text-align: center;
}
.css-table .th a:hover, .css-table .td a:hover{
	color: #00afec;

}
.css-table .th a, .css-table .td a{
	color: #3f3f3f;

}
.css-table .td p{
	font-size: 14px;
	color: #3f3f3f;
	line-height: 1.5;
	white-space: nowrap;
}
.css-table .th:first-child{
	width: 60px;
}
.css-table .th:nth-child(2){
	width: 220px
}
.css-table .th:nth-child(5),
.css-table .th:nth-child(4){
	width: 100px;
}.css-table .th:nth-child(6){
	width: 100px;
}
.css-table .th:last-child{
	width: 100px;
}
@media only screen and (max-width: 960px) {
	.hide-column .large{
		display: none;
	}
	.css-table{
		width: 100%;
		background-color: transparent;
	}
	.css-table .thead{
		display: none;
	}
	.css-table .tr{
		display:block;
		border: #ddd 1px solid;
		margin-bottom: 20px;
		padding: 20px;
		/* background: #ffffff; */
	}
	.css-table .th,
	.css-table .td{
		display:inline-block;
		width: 100%;
		border: none;
	}
	.css-table .th, .css-table .td p{
		width: 80%;
		margin: 0 auto;
		line-height: 1.5;

	}
}
@media only screen and (max-width: 720px) {
	.hide-column .mobile{
		display: none;
	}

	.scroll-left:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
	.scroll-left thead:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
	.scroll-left{ width: 100%; border-collapse: collapse; border-spacing: 0; }
	.scroll-left th,
	.scroll-left td { margin: 0; vertical-align: top; }
	.scroll-left th { text-align: left; }
	.scroll-left{ display: block!important; position: relative; width: 100%; }
	.scroll-left thead { display: block; float: left; }
	.scroll-left tbody { display: block; width: auto; position: relative; overflow-x: auto; white-space: nowrap; }
	.scroll-left thead tr { display: block; }
	.scroll-left th { display: block; text-align: right; }
	.scroll-left tbody tr { display: inline-block; vertical-align: top; margin:0px -2px;}
	.scroll-left td { display: block; min-height: 1.25em; text-align: left; }

	/* sort out borders */
	.scroll-left th { border-bottom: 0; border-left: 0; }
	.scroll-left td { border-left: 0; border-right: 0; border-bottom: 0; }
	.scroll-left tbody tr { /*border-left: 1px solid #babcbf;*/ }
	.scroll-left th:last-child,
	.scroll-left td:last-child { border-bottom: 1px solid #babcbf; }


	/* Force table to not be like tables anymore */
	.break-table{
		background-color: transparent !important;  
	}
	.break-table, 
	.break-table thead, 
	.break-table tbody, 
	.break-table th, 
	.break-table td, 
	.break-table tr { 
		display: block; 
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	.break-table thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.break-table tr { border: 1px solid #ccc; margin-bottom: 10px; background-color: #ffffff;}

	.break-table td { 
		/* Behave  like a "row" */
		border: none !important;
		border-bottom: 1px solid #eee !important;  
		position: relative;
		padding-left: 35% !important; 
		white-space: normal;
		text-align:left;
	}

	.break-table td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 30%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
		color: #1a1a1a;
	}
	.break-table td:before { content: attr(data-title); }

	.css-table .th,
	.css-table .td{
		display:block;
		width: 100%;
	}
}
@media only screen and (max-width: 480px) {
	.hide-column .small{
		display: none;
	}
}