.button_example{
border:1px solid #d7dada; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 5px 30px; text-decoration:none; display:inline-block;text-shadow: 0px 0px 0 rgba(0,0,0,0.3);font-weight:bold; color: #808080;
 background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}

.button_example:hover{
 border:1px solid #bfc4c4;
 background-color: #d9dddd; background-image: -webkit-gradient(linear, left top, left bottom, from(#d9dddd), to(#c6c3c3));
 background-image: -webkit-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -moz-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -ms-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -o-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: linear-gradient(to bottom, #d9dddd, #c6c3c3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d9dddd, endColorstr=#c6c3c3);
}

body{
	color: #f5f5f5;
	font-family: "Helvetica Neue", Helvetica, "Microsoft Yahei", sans-serif;
	font-size: 14px;
	line-height: 1.42857;
	background-repeat:no-repeat;
	background-size:cover;
	word-break: break-all;
}
.formobile{
	font-size: 16px;
}
.default-color{
	color: #f5f5f5
}

textarea, button, input { outline: none; }

.navbar{
	background: #000000;
	border: 0;
}
.navbar .search-container{
	background: #fff;
	border: 1px solid #323232;
	border-radius: 5px;
	padding: 5px;
}
.navbar .search-container input,.navbar .search-container button,.navbar .search-container .input-group-addon{
	border: none;
	color: #e4e4e4;
	background: #4f6592;
}
.navbar .search-container input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #c9c9c9;
}
.navbar .search-container input::-moz-placeholder { /* Firefox 19+ */
  color: #c9c9c9;
}
.navbar .search-container input:-ms-input-placeholder { /* IE 10+ */
  color: #c9c9c9;
}
.navbar .search-container input:-moz-placeholder { /* Firefox 18- */
  color: #c9c9c9;
}
.navbar .mobile-search-container button{
	border: none;
	/*color: #c9c9c9;*/
	font-size:20px;
	background: #000000;
	margin: 2px 10px 2px 0;
}
.navbar .upload-button{
	border: 2px solid #e1356e;
	background: #111111;
	padding: 4px 29px;
	margin: 9px;
}
.navbar .upload-button:hover{
	background: #e1356e;
}
.navbar-inverse .navbar-nav > li > a{
	color: #fff;
}
.navbar .navbar-right a {
	transition: all 0.4s ease;
	background: #4f6592;
}
.navbar .navbar-right a:hover {
	background: linear-gradient(to right,#e1356e,#f2995d,#e1356e);
	background-size: 1000% 1000%;
	animation: gradient 4s ease infinite;
}

.home-header{
	font-size: 18px;
	font-weight: bold;
}
.home-header-line {
    content: "";
    /*position: absolute;*/
    top: 35%;
    left: 110px;
    width: 100%;
    border-bottom: 2px solid #86173c;
}
.home-header .more{
	color: #fff;
	float: right;
	padding-right: 15px;
}
.home-section-head{
	position: relative;
	padding: 10px 15px 32px 15px;
}
#searchOnTop{
	display: none;
}

@keyframes  gradient {
	50% {
	background-position: 100% 0;
	}
}

#mySidenav {
	height: 100%;
	width: 242px;
	margin-left: -242px;
	position: fixed;
	z-index: 1030;
	top: 0;
	left: 0;
	background-color: #1c1c1c;
	overflow-x: hidden;
	transition: 0.5s;
	margin-top: 50px;
	padding-bottom: 50px;
	padding-top: 14px;
}
#mySidenav a.active{
	color: #fff;
	background: #e1356e;
	background: linear-gradient(to right, #e1356e , #f2995d);
}
#mySidenav a {
	padding: 8px 2px 8px 30px;
	text-decoration: none;
	font-size: 16px;
	color: grey;
	display: block;
	transition: 0.3s;
}
#mySidenav a img{
	height: 25px;
	margin-right: 35px; 
	vertical-align: middle;
	-webkit-filter: opacity(.5) drop-shadow(0 0 0 grey);
	filter: opacity(.5) drop-shadow(0 0 0 grey);
}
#mySidenav a svg{
    overflow: hidden;
    height: 25px;
    margin-right: 35px;
    vertical-align: middle;
    width: 25px;
}
#mySidenav a svg path{
    fill: grey;
}
#mySidenav a svg polygon{
    fill: grey;
}
#mySidenav a svg rect{
    fill: grey;
}

#mySidenav a:hover {
	color: #f1f1f1;
	background: #e1356e;
	background: linear-gradient(to right, #e1356e , #f2995d);
}
#mySidenav a:hover i {
	color: #f1f1f1 !important;
}
#mySidenav a:hover img{
	-webkit-filter: opacity(1) drop-shadow(0 0 0 grey);
	filter: opacity(1) drop-shadow(0 0 0 grey);
}

#mySidenav a:hover svg path{
    fill: #f1f1f1;
}
#mySidenav a:hover svg polygon{
    fill: #f1f1f1;
}
#mySidenav a:hover svg rect{
    fill: #f1f1f1;
}

#mySidenav a.active svg path{
    fill: #f1f1f1;
}
#mySidenav a.active svg polygon{
    fill: #f1f1f1;
}
#mySidenav a.active svg rect{
    fill: #f1f1f1;
}

#mySidenav hr, #inbox-modal hr{
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #5f142d;
	margin: 1em 0;
	padding: 0; 
}
#right_stand_fw{
	height: 600px;
    width: 160px;
    position: fixed;
    z-index: 1030;
    right: 20px;
    top: 70px;
}
@media    only screen and (min-width: 1580px) {
	#right_stand_fw{
		display: block;
	}
}
@media  only screen and (max-width: 1580px) {
	#right_stand_fw{
		display: none;
	}
}
@media    only screen and (min-width: 1200px) {
	 .formobile{ display:none; }
	 .forweb{ display:block;background: #024e41;}
	 body{
		background: linear-gradient(357deg, #000000a8 0%, #26af96 50%, #114e3f 100%);
	    background-attachment: fixed;
	}
}
@media  only screen and (max-width: 1200px) {
	body.modal-open {
	  position: fixed;
	}
	 .formobile{ display:block; }
	 .forweb{ display:none;background: #e1356e;}
	 body{
	background: #000;
	}
}
.nopadding {
	 padding: 0 !important;
	 margin: 0 !important;
}


@media (min-width: 992px){
	.col-md-2-4 {
		width: 20%;
	}
}
#video .MacPlayer{
    height:504px !important;
}
@media  only screen and (max-width: 999px){
    #video .MacPlayer{
        height:250px !important;
    }
	.MacPlayer,#playleft>div {
		height:250px !important;
	}
}
.video-element{
	margin-bottom: 12px; 
}
.video-element .video-title{
	color: #dcdcdc;
	font-size: 15px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.video-element .video-view,.video-element .video-publish{
	color: #f1dada;
	font-size: 13px;
}
.video-element .video-publish{
	float: right;
}
.video-element .bookmarker{
	right: 0;
	padding: 5px;
	position: absolute;
	z-index: 1;
	cursor: pointer;
	margin: 0 15px;
}
.video-duration{
	position: absolute;
    right: 19px;
    bottom: 57px;
    padding: 3px;
    background: #00000099;
    border-radius: 5px;
    font-size: 11px;
    color: #ccc;
}

.side-menu-btn{
	background: none;
	border: 2px solid #a2a2a2;
	width: 150px;
	padding: 5px 0;
	margin: 15px;
}

button.verifyphone{
	position: absolute;
	right: 0;
	padding: 6px 10px;
	font-size: 12px;
	border: 0px;
	color: #fff;
	z-index: 10;
}
.suggest-list{
	position: absolute;
    width: 640px;
    background: #000;
    padding: 10px;
    overflow-y: scroll;
    height: 100%;
    min-height: 200px;
}
.suggest-list li{
	list-style-type:none;
	float: left;
    padding-right: 10px;
}

.mobile-profile-col{
	line-height: 50px;
	border-bottom: 1px solid #5e001f;
	padding: 0 20px;
}

.mobile-profile-col-right{
	float: right;
	color: #a3a3a3;
}

		.tags-list h4{
			padding: 10px;
		}
		.tags-list ul{
			   padding: 0 10px;
		}
		.tags-list li{
			padding: 2px;
			background: #ff236d;
			border: 1px solid #ff236d;
			border-radius: 5px;
			margin: 3px 5px;
			list-style-type: none;
			float: left;
		}
		.tags-list li a{
			color: #fff;
			text-decoration: none;
		}
		.tags-list li:hover{
			background: transparent;
		}

	.suggest-list li{
		margin: 3px 5px;
		background: #ff236d;
		border-radius: 5px;
		border: 1px solid #ff236d;
		padding: 2px;
	}
	.suggest-list li a{
		color: #fff;
		padding: 3px 5px;
		text-decoration: none;
	}
	.suggest-list li:hover{
		background: transparent;
	}

	.fa.fa-pencil{
	}
	.fa-pencil:before {
		content: "" !important;
		background: url(../static/image/pen.png);
		width: 16px;
		height: 16px;
		display: block;
	}

		.tags-list h4{
			padding: 10px;
		}
		.tags-list ul{
			   padding: 0 10px;
		}
		.tags-list li{
			padding: 2px;
			background: #ff236d;
			border: 1px solid #ff236d;
			border-radius: 5px;
			margin: 3px 5px;
			list-style-type: none;
			float: left;
		}
		.tags-list li a{
			color: #fff;
			text-decoration: none;
		}
		.tags-list li:hover{
			background: transparent;
		}

		.select2-selection--single {border: none !important;}
		.select2-selection__rendered { background-color: #232323; }
		.select2-selection__rendered span { color: #fff; }
		.select2-search { background-color: #232323; color: #fff; }
		.select2-results { background-color: #232323; color: #fff; }
		#mySidenav a.active i{color: #fff !important;}

.home-section-head{
	position: relative;
	padding: 10px 15px;
}
.cate-icon{
  -webkit-filter: opacity(.5) drop-shadow(0 0 0 #ff236d);
  filter: opacity(.5) drop-shadow(0 0 0 #ff236d);
  vertical-align: bottom;
}
.home-header{
	font-weight: bold;
}


.friendlink a {
    width: 9.7%;
    float: left;
    border-radius: 3px;
    line-height: 30px;
    height: 30px;
    text-align: center;
    font-size: 17px;
    color: #fff;
    display: inline-block;
    background-color: #686868;
    margin: 1px;
    transition-duration: .3s;
}
.friendlink a:hover{
	color: #de215f;
}
@media screen and (max-width: 768px) {
.friendlink a {
    width: 24%;
    float: left;
    border-radius: 3px;
    line-height: 30px;
    height: 30px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    display: inline-block;
    background-color: #686868;
    margin: 1px;
    transition-duration: .3s;
}
}