/* general colors */
.youtube1 {color:red; }
a {color:orange;}
body {background:#121212; color:#fff;}
button { background:transparent; color:#fff; }
input, textarea, .post_input_container { background:#fff; border:1px solid #e6e6e6 !important; color:#666; }
.mybutton  {
	background:linear-gradient(to bottom, #7892c2 5%, #476e9e 100%);
	background-color:#7892c2;
	border-radius:21px;
	border:1px solid #4e6096;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:11px;
	padding:1px 4px;
	text-decoration:none;
	text-shadow:0px 1px 1px #283966;
}
.mybutton:hover {
	background:linear-gradient(to bottom, #476e9e 5%, #7892c2 100%);
	background-color:#476e9e;
}
.mybutton:active {
	position:relative;
	top:1px;
}
/* Watan */
.login_button {border-radius: 25px; background:	#3aafa9; color:#fff; }
.reg_button {border-radius: 25px; background:#2b7a78; color:#fff;  }
.guest_button {border-radius: 25px; background:	#17252a; color:#fff;  animation: shadow-pulse 1s infinite;}
@keyframes shadow-pulse
{
     0% {
          box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
     }
     100% {
          box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
     }
}


.post_content {
	
    width: 96% !important;
    border-style: solid ;
	border: 1px;
	border-color: black ;
	padding: 14px;
    overflow: visible;
    margin: 15px;
    position: relative;
    background: rgba(0, 0, 0, 0.4);
    border-radius: .4em;
}
.post_content:after {
	content: '';
	    border-style: solid ;
	border-color: black ;
	position: absolute;
	top: 0;
	left: 10%;
	width: 0;
	height: 0;
	border: 12px dashed transparent;
	border-bottom-color: rgba(0, 0, 0, 0.4);
	border-top: 0;
	border-left: 0;
	margin-left: -16px;
	margin-top: -12px; }
/* login box */
.not_member { background:#333; color:#fff; }
.status_icon {
    overflow: visible!important;
}
/* cookie box */
.cookie_wrap { background:#222; color:#fff; }

/* back mains colors */
.back_theme { background:#007399; color:#fff; }
.back_dark { background:#263c44; color:#fff; }
.back_med { background:#ededed; color:#666; }
.back_lite { background:#f3f3f3; color:#666; }
.back_xlite { background:#fff; color:#666; }

/* button colors */
.theme_btn { background:#007399; color:#fff; }
.default_btn { background:#1c5a77; color:#fff; }
.dark_selected { background:#1c5a77; color:#fff; }
.ok_btn { background:#74b20e; color:#fff; }
.warn_btn { background:orange; color:#fff; }
.delete_btn { background:#cc0000; color:#fff; }
.sub_btn { background:#888; color:#fff; }

/* input option background colors */
.input_wrap { background:#ededed; }
.input_item { color:#15739e; }

/* background colors */
.top_background { background:#17252a; color:#fff; }
.background_header,  .chat_footer, .panel_top, .modal_top { background:#87d6d645;
-webkit-box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48); 
box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48);

 color:#fff; }
 .chat_head { background:#87d6d645;
-webkit-box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48); 
box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48);

 color:#f5f4e3; }
 .emo_head {background:#17252a; border-bottom:1px solid #355559;
-webkit-box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48); 
box-shadow: inset 0px 0px 12px -5px rgba(255,255,255,0.48); }
.background_box { background:#fff; color:#666;}

/* modal */
.modal_menu, .tab_menu { background:#2e434d;
-webkit-box-shadow: inset 0px 0px 50px 5px #000000; 
box-shadow: inset 0px 0px 50px 5px #000000;
 }
.modal_selected, .tab_selected { background:#248591;
animation: shadow-pulse 1s infinite;}
@keyframes shadow-pulse
{
     0% {
          box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
     }
     100% {
          box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
     }
}

.modal_back { background-color:rgba(0,0,0,0.6); }

/*panel selected */
.panel_selected {  background:#3aafa9;
-webkit-box-shadow: inset 0px 0px 50px -15px #000000; 
box-shadow: inset 0px 0px 50px -15px #000000; }

/* reg menu */
.reg_menu { color:#666; }
.reg_selected {  background:#1c5a77; color:#fff; 
animation: shadow-pulse 1s infinite;}
@keyframes shadow-pulse
{
     0% {
          box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
     }
     100% {
          box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
     }
}

/* menu icon */
.page_menu_icon, .sub_menu_icon, .menui { color:#03add8; }

/* outside menu */
.sub_menu_item, .fmenu_item, .avitem { border-bottom:1px solid #ededed; background:#fff; color:#666;  }
.sub_menu_item:hover, .sub_menu_item:hover > .sub_menu_icon, .fmenu_item:hover, .avitem:hover { background:#ededed; color:#666 !important; }

/* inside menu */
.elem_in, .aclist, .status_option, .left_drop_item, .page_drop_item { background:#111; color:#888; border-bottom:1px solid #222; }
.elem_in:hover, .aclist:hover, .status_option:hover, .left_drop_item:hover, .page_drop_item:hover { background:#000; color:#fff; }

/* page menu */
.page_menu_wrapper { background:#191919; }
.page_menu_item { border-bottom:1px solid #222; }
.page_menu_item:hover, .page_menu_item:hover > .page_menu_icon { background:#222; color:#fff; }
.page_selected { color:#03add8 !important; }

/* text error colors */
.error  { color:red; }
.success { color:#74b20e; }
.warn { color:orange; }

/* logs color private and main chat */
.log2 { background:#f8f8f8; }
.target_private {color:#228dff; border-style: solid;border-width: 1px;}
.hunter_private {color:#236b67; border-style: solid; border-width: 1px;}

/* text color  & date */
.sub_text, .date, .listing_text, .docu_description  { color:#888; }
.sub_dark { color:#aaa; }
.input_text, .logs_date, .pdate, .ptdate, .cclear, .cdate { color:#ccc; }
.theme_color { color:#007399;}
.liked  { background:#333; color:#fff; }
.default_color { color:#333; }
.user_count  { color:#666;}
.my_notice { color:#fff; background:#324747; padding:2px 5px; display:inline-block; line-height:1em; margin-top:1px; border-radius:8px; font-weight:normal;
	-webkit-animation: text-blur-out 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse forwards;
	        animation: text-blur-out 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse forwards;
}
@-webkit-keyframes text-blur-out {
  0% {
    -webkit-filter: blur(0.01);
            filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
            filter: blur(12px) opacity(0%);
  }
}
@keyframes text-blur-out {
  0% {
    -webkit-filter: blur(0.01);
            filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
            filter: blur(12px) opacity(0%);
  }
}
td.classname { background-color: red; }
.shadow_text { text-shadow:1px 1px #000; }
.system_text { background:#ededed; color:#666; }
.bustate { color:#737374; text-shadow:1px 3px 5px #000000; }

/* notification colors */
.bnotify { background:red; color:#fff;

 }

/* elements */ 
.element_color, .player_options, .page_element, #private_box, .chat_side_panel, #side_menu, .modal_in { background:#17252a; color:#fff; }
.background_chat { background:#191919; }
.chat_panel { background:#17252a; }

/* shadow */
.add_shadow, .page_element, #private_box, .page_menu_wrapper, .chat_side_panel, #side_menu, .sub_menu { box-shadow:0 0 0px 1px #000; }

/* no view elements */
.noview { background:#292929; }

/* borders css */
.border_right, #chat_left { border-right:1px solid #222; }
.border_left, #chat_right { border-left:1px solid #222; }
.label_line,.border_bottom , .listing_element, .listing_half_element, .post_element, .list_element, .listing_reg, .left_list, .user_item, .user_item_custom, .box_title  { border-bottom:1px solid #355559; }
.panel_bar { background:#000000; border-bottom:1px solid #355559;
 }
 .user_item  {
    background:#182e32;
    margin-bottom: 3px;
    border: 1px solid balck;
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    border-left: solid #246c68;
    border-left-width: 4px;
	border-right-width: 0px;
 }

.border_top  { border-top:1px solid #222; }
.full_border { border:1px solid #222; }

/* list element */
.sub_list_item { background:#121a1e; color:#fff; }
.sub_half_item,  .ulist_item,  .sub_list { background:#141c1c; color:#fff; }
.reply_item {     width: 96% !important;
    padding: 14px;
    overflow: visible;
    margin: 15px;
    position: relative;
    background: rgba(0, 0, 0, 0.4);
border-radius: .4em;}
.sub_list_item:hover, .sub_half_item:hover, .ulist_item:hover { background:#000; }

/* slider */
.boom_slider .ui-widget-content { background: #333; }
.boom_slider .ui-state-default { background: #ccc !important; }
.boom_slider .ui-state-active { background: #ccc !important; }
.boom_slider .ui-slider-range { background:#666; }

/* select box color */
.selectboxit-list, .selectboxit-btn { background-color: #f2f2f2; color:#666;  border:1px solid #e6e6e6 !important; } /* background of select box */
.selectboxit-list .selectboxit-focus .selectboxit-option-anchor { background-color: #ededed; color:#666; } /* color of sub menu hover */
.selectboxit-default-arrow { border-top: 4px solid #666; }
.selectboxit-btn.selectboxit-enabled:hover, .selectboxit-btn.selectboxit-enabled:focus, .selectboxit-btn.selectboxit-enabled:active { background:#f2f2f2; color:#666; } /* background selected hover */
.selectboxit-options { background:#fff; border:1px solid #ccc; } /* background color of the options */
.selectboxit-list .selectboxit-option-anchor { color:#666; } /* color of sub menu item */

/* user color and special user color */
.offline { opacity:0.4; }
.user { color:#666; }
.chat_system { color:#999; }

/* list icon colors */
.boy { border-color:#03add8; }
.girl { border-color:#ff99ff;}
.nosex { border-color:#ccc; }

/* file music and upload */
.file_color, .file_color a { background:#007399; color:#fff; }
.audio_color { background:#333; color:#fff; }
.song_title { background:#444; color:#fff; }
.audio_progress { background:#fff; }
.audio_ball { background:#007399; }

/* warning box */
.boom_warning { color:#fff2cc; background:#664d00; border:1px solid #997300; }
.boom_error { background:#800000; color:#ffcccc;; border:1px solid #b30000; }
.boom_success { color:#c6ecc6; background:#206020; border:1px solid #2d862d; }
.boom_neutral { color:#ccf2ff; background:#007399; border:1px solid #0099cc; }

/* admin box */
.sp_box { background:#333; color:#fff; }
.sp_icon { background:#03add8; color:#fff; }

/* special log */

.topic_log { background:#d9f2e6; color:#0d261a; }
.seen { background:#ffe6f2; color:#330019; }

/* custom */
.background_header { border-bottom:1px solid #262626;  }
#input_table, #message_input { background:#ededed; overflow:hidden; }
.modal_in { border:1px solid #17252a; }

/* animation by test*/
@keyframes animate-bg {
	from {
		background-position: 0 0;
	}

	to {
		background-position: -80px 0;
	}
}
@keyframes neon2 {
  from {
    text-shadow: 0 0 2px #444, 0 0 5px #444, 0 0 10px #444,  0 0 10px #228dff, 0 0 20px #228dff, 0 0 30px #228dff, 0 0 39px #228dff, 0 0 10px #228dff;
  }
  to {
    text-shadow: 0 0 1px #444, 0 0 4px #444, 0 0 6px #444, 0 0 40px #228DFF, 0 0 8px #228DFF, 0 0 13px #228DFF, 0 0 14px #228DFF, 0 0 15px #228DFF;
  }
}
@keyframes neon3 {
  from {
    text-shadow: 0 0 2px #444, 0 0 5px #444, 0 0 10px #444,  0 0 10px #FF2323, 0 0 20px #FF2323, 0 0 30px #FF2323, 0 0 39px #FF2323, 0 0 10px #FF2323;
  }
  to {
    text-shadow: 0 0 1px #444, 0 0 4px #444, 0 0 6px #444, 0 0 40px #FF2323, 0 0 8px #FF2323, 0 0 13px #FF2323, 0 0 14px #FF2323, 0 0 15px #FF2323;
  }
}



.animated, #notify_private, .chat_message,.ch_logs.bcolor1 .small_modal_in, .large_modal_in,#private_box,#main_emoticon,.ico_vip, .my_mood {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

#notify_private {
  -webkit-animation-iteration-count: 20;
  animation-iteration-count: 20;
}


.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce, #notify_private {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}



@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}


@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeftBig,#main_emoticon {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight,#private_box, .small_modal_in, .large_modal_in {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}



.rotateIn,.ico_vip {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}