.unselectable {
    /* For Opera and <= IE9, we need to add unselectable="on" attribute onto each element */
    /* Check this site for more details: http://help.dottoro.com/lhwdpnva.php */
    -moz-user-select: none; /* These user-select properties are inheritable, used to prevent text selection */
    -webkit-user-select: none;
    -ms-user-select: none; /* From IE10 only */
    user-select: none; /* Not valid CSS yet, as of July 2012 */

    -webkit-user-drag: none; /* Prevents dragging of images/divs etc */
    user-drag: none;
}

input.no-border {
	background: none;
	border: none;
	outline: none;
	box-sizing: border-box;
}

/* override /camera/view top_menu */
.selection_laver {
	z-index: 1000;
}

/* override /camera/view video_player */

.dt_media .player {
	width: 862px;
	height: 485px;
	box-sizing: border-box;
	margin-bottom: 5px;
}

.m_location .zoom-thumb {
	width: 187px;
	height: 104px;
}



.action:hover {
	cursor: pointer;
}

.move:hover {
	cursor: move;
}

.hide {
	display: none;
}

.no-select {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.player.fullscreen {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
/* zoom bar */

div.zoom_bar .zoom_bar_inactive {
	background: #bde2f9;
	height: 100%;
}

.dt_media .cvr-thumbs-container {
	width: 952px;
	height: 168px;
	top: 380px;
	background: rgba(0,0,0,0.7);
	position: absolute;
	z-index: 950;
}

.dt_media .cvr-thumbs-container .main-thumb {
	position: absolute;
	z-index: 1050;
	left: 50%;
}
.dt_media .cvr-thumbs-container .inner {
	position: relative;
}

.dt_media .cvr-thumbs-container .main-thumb .image {
	width: 160px;
	height: 90px;
	margin-top: 12px;
	border: 3px solid white;
	z-index: 1000;
	margin-left: -50%;
	background-color: gray;
}
.image.index0 {
	background-position: 800px 0;
}
.image.index1 {
	background-position: 640px 0;
}
.image.index2 {
	background-position: 480px 0;
}
.image.index3 {
	background-position: 320px 0;
}
.image.index4 {
	background-position: 160px 0;
}
.image.index5 {
	background-position: 800px 90px;
}
.image.index6 {
	background-position: 640px 90px;
}
.image.index7 {
	background-position: 380px 90px;
}
.image.index8 {
	background-position: 320px 90px;
}
.image.index9 {
	background-position: 160px 90px;
}

.dt_media .cvr-thumbs-container .thumbs-container {
	overflow: hidden;
	top: 27px;
	position: absolute;
	width: 952px;
}

.dt_media .cvr-thumbs-container .thumbs {
	width: 1360px;
	margin-left: -136px;
}
.dt_media .cvr-thumbs-container .thumbs .image {
	width: 136px;
	height: 68px;
	border: 1px solid white;
	float: left;
	background-color: gray;
}

/* .m_location, .media_zoom {
	z-index: 1000;
}
 */

.m_location .selected {
	position: absolute;
	top: 0;
	left: 0;
	cursor: move;
	z-index: 1100;
}

.timebar .control {
	position: absolute;
	outline: none;
	border: none;
}

.timebar .find_cursor {
	position: relative
}

.timebar .find_cursor span {
	font-family: Arial;
	font-size: 9px;
	color: #ff0000;
	top: 19px;
	position: absolute;
	text-align: center;
	width: 44px;
	letter-spacing: -1px;
}

.timebar .wrap_control_prev {
	position: absolute;
	top: 17px;
	left: 3%;
}

.timebar .prev {
	background: url(/resources/images/icon_timebar_left.png) no-repeat;
	left: 14px;
	width: 17px;
	height: 28px;
}

.timebar .find_cursor.left {
	width: 60px;
	height: 32px;
	background: url(/resources/images/bg_time_cursor_ptL.png);
	top: -2px;
	left: 19px;
}

.timebar .wrap_control_next {
	position: absolute;
	top: 17px;
	left: 108%;
}

.timebar .next {
	background: url(/resources/images/icon_timebar_right.png) no-repeat;
	left: -35px;
	width: 17px;
	height: 28px;
}

.timebar .find_cursor.right {
	width: 60px;
	height: 32px;
	background: url(/resources/images/bg_time_cursor_pt.png);
	top: -2px;
	left: -78px;
}

.timebar .thumbnail-container {

	background-image: url("/resources/images/bg_thum_view_line.png");
	position: absolute;
}

.timebar .thumbnail-container .image {
	width: 160px;
	height: 90px;
	margin-top: 7px;
	margin-left: 9px;
}

.timebar .thumbnail-container div.time {
	text-align: center;
	color: #666666;
	margin-top: 10px;
	font-size: 12px;
}

.timebar .timeline_description {
	position: absolute;
	left: 0px;
	top: 88px;
	width: 100%;
}

.timebar .timezone {
	font-size: 11px;
	color: #999999;
	float: left;
	margin-left: 12px;
}

.timebar .description {
	font-size: 11px;
	color: #999999;
	float: right;
}

.timebar .description div {
	display: inline-block;
	width: 25px;
	height: 10px;
	box-sizing: border-box;
}

.timebar .description .rec {
	background: #bde2f9;
	border: 1px solid #86aebc;
}

.timebar .description .motion {
	background: #2d92d3;
}

.timebar .description .audio {
	background: #18b57b;
}

.timebar .description li {
	display: inline-block;
	margin-right: 10px;
}

.wrap_pop_cm_st {
	top:0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	z-index: 1050;
}

.outer_pop_cm_st {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -238px;
	z-index: 800;
}

.outer_pop_cm_st_noti {
	top: 150px;
}

.outer_pop_cm_st_pay_cloud {
	top: 250px;
}

.pop_cm_st {
	position: relative;
	left: -50%;
	z-index: 1150;
	top: -40px;
}

.pop_mc_st {
	position: relative;
	left: -50%;
	z-index: 1150;
}

/* override /sigup */

.m_right_mem div.terms_mem textarea {
	resize: none;
}

#controlNdTimeLine {margin-top: -40px; position: relative;}

/* Full Screen */
:-webkit-full-screen { width: 100%; height:100%; padding: 0; }
:-webkit-full-screen #player { width: 100%; height: 100%; border: none; position: relative;}
:-webkit-full-screen #controlNdTimeLine { margin-top: -159px;}
:-webkit-full-screen #controlNdTimeLine.new_control {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top:-128px;
}
:-webkit-full-screen .nofullscreen { display: none; }
:-webkit-full-screen .dt_media { width: 100%; height: 100%; padding: 0; }
:-webkit-full-screen .media_control_outer{ top:100%; text-align:center !important; margin-top: -162px !important; }
:-webkit-full-screen .media_control {}
:-webkit-full-screen .media_control.no-cloud { top: -60px !important; display: inline-block;  }
:-webkit-full-screen .dt_media .m_location { top: -215px !important; }
:-webkit-full-screen .timebar_outer { position: absolute; left: 0; top: 100%; }
:-webkit-full-screen .timebar { position: absolute; top: -90px; background: rgba(255, 255, 255, 0.8); }
:-webkit-full-screen .timebar_area { margin-left: 0 !important; margin-right: 0 !important; }
:-webkit-full-screen .timebar .wrap_control_prev { top: 44px; }
:-webkit-full-screen .timebar .wrap_control_next { top: 44px; }
:-webkit-full-screen .timebar .prev { left: 10px; }
:-webkit-full-screen .timebar .next { left: -25px; }
:-webkit-full-screen .timebar .find_cursor.left { margin-top:3px;}
:-webkit-full-screen .timebar .find_cursor.right { margin-top:3px;}

:-moz-full-screen { width: 100%; height: 100%; padding: 0; }
:-moz-full-screen #player { width: 100%; height: 100%; border: none; position: relative;}
:-moz-full-screen #controlNdTimeLine { margin-top: -159px;}
:-moz-full-screen #controlNdTimeLine.new_control {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top:-128px;
}
:-moz-full-screen .nofullscreen { display: none; }
:-moz-full-screen .dt_media { width: 100%; height: 100%; padding: 0; }
:-moz-full-screen .media_control_outer{ top:100%; text-align:center !important; margin-top: -175px !important;}
:-moz-full-screen .media_control {}
:-moz-full-screen .media_control.no-cloud { top: -60px !important; display: inline-block;  }
:-moz-full-screen .dt_media .m_location { top: -215px !important; }
:-moz-full-screen .timebar_outer { position: absolute; left: 0; top: 100%; }
:-moz-full-screen .timebar { position: absolute; top: -90px; background: rgba(255, 255, 255, 0.8); }
:-moz-full-screen .timebar_area { margin-left: 0 !important; margin-right: 0 !important; }
:-moz-full-screen .timebar .wrap_control_prev { top: 44px; }
:-moz-full-screen .timebar .wrap_control_next { top: 44px; }
:-moz-full-screen .timebar .prev { left: 10px; background: url(/resources/images/icon_fs_timebar_left.png) no-repeat; }
:-moz-full-screen .timebar .next { left: -25px; background: url(/resources/images/icon_fs_timebar_right.png) no-repeat; }
:-moz-full-screen .timebar .find_cursor.left { background: url(/resources/images/bg_fs_time_cursor_ptL.png); width:60px; }
:-moz-full-screen .timebar .find_cursor.right { background: url(/resources/images/bg_fs_time_cursor_ptR.png);  width:60px;}

:-ms-fullscreen { width: 100% !important; height: 100%; padding: 0; }
:-ms-fullscreen #player { width: 100%; height: 100%; border: none; position: relative;}
:-ms-fullscreen #controlNdTimeLine { margin-top: -159px;}
:-ms-fullscreen #controlNdTimeLine.new_control {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top:-128px;
}
:-ms-fullscreen .nofullscreen { display: none; }
:-ms-fullscreen .dt_media { width: 100%; height: 100%; padding: 0; }
:-ms-fullscreen .media_control_outer{ }
:-ms-fullscreen .media_control { top: -155px !important; display: inline-block;  }
:-ms-fullscreen .media_control.no-cloud { top: -60px !important; display: inline-block;  }
:-ms-fullscreen .dt_media .m_location { top: -212px !important; }
:-ms-fullscreen .timebar_outer { position: absolute; left: 0; top: 100%; }
:-ms-fullscreen .timebar { position: absolute; top: -90px; background: rgba(0, 0, 0, 0.5); }
:-ms-fullscreen .timebar_area { margin-left: 0 !important; margin-right: 0 !important; }
:-ms-fullscreen .timebar .wrap_control_prev { top: 44px; }
:-ms-fullscreen .timebar .wrap_control_next { top: 44px; }
:-ms-fullscreen .timebar .prev { left: 10px; background: url(/resources/images/icon_fs_timebar_left.png) no-repeat; }
:-ms-fullscreen .timebar .next { left: -25px; background: url(/resources/images/icon_fs_timebar_right.png) no-repeat; }
:-ms-fullscreen .timebar .find_cursor.left { background: url(/resources/images/bg_fs_time_cursor_ptL.png);  width:60px;}
:-ms-fullscreen .timebar .find_cursor.right { background: url(/resources/images/bg_fs_time_cursor_ptR.png);  }

/* event list */

.event_list li.event_list_tit_s_bg div.event_list_dt_line div.color_point { padding:4px; margin-left:11px; margin-top:20px; }
.event_col_sel div.color_pix_sel div.color_pix { float:left; margin-right:5px; border:1px solid #aaa;}
.event_list_dt_media .image {
	display: inline-block;
	width: 109px;
	height: 59px;
	background-size: 550px 120px;
}

/* zone */
.zone_edit {
	display: none;
}
.zone_list:hover .zone_edit {
	display: block;
}
.zone_list svg {
	vertical-align: middle;
	margin-right: 1px;
}

/* Clip */
.pop_mc_mv_st {
	position: relative;
	left: -50%;
	z-index: 1150;
}

.clip_edit {
	display: none;
}

.make_list:hover .clip_edit {
	display: block;
}

.clip-player {
	width: 536px;
	height: 352px;
	border-top:2px solid #1d1d1d;
	border-left:2px solid #1d1d1d;
	border-right:2px solid #1d1d1d;
	border-bottom:1px solid #1d1d1d;
	margin-bottom:-4px;
}

.clip_calendar {
	float: right;
	margin-right: 15px;
}

.clip_date_input {
	float: left;
	margin-left: 15px;
	width: 100px;
}

/* Modal Dialog */

.modal_dialog {
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	position: fixed;
	z-index: 10500 ;
}

.modal_dialog .dialog_outer {
	position: absolute;
	top: 30%;
	left: 50%;
}

.modal_dialog .pop_mc_st {
	position: relative;
	top: -50%;
	left: -50%;
}

/* full sreen mode timeline toggle area */
.camdtl_view .player_area .toggle_area{position:absolute;top:0;left:0;right:0;bottom:0;}

/* full screen mode timebar toggle animation */
.cam_info.toggle_on {
	-webkit-transition: top 0.5s ease;
	transition: top 0.5s ease;
	top : 1px;
}

/* full screen mode timebar toggle animation */
.cam_info.toggle_off {
	-webkit-transition: top 0.5s ease;
	transition: top 0.5s ease;
	top : -47px;
}

/* full screen mode timeline toggle animation */
#controlNdTimeLine.toggle_on {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top : -140px;
}

/* full screen mode timelinie toggle animation */
#controlNdTimeLine.toggle_off {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top : 0px;
}

#controlNdTimeLine.hidePlayControlFull {
	-webkit-transition: margin-top 0.5s ease;
	transition: margin-top 0.5s ease;
	margin-top:-40px!important;
}

.gallery_on {
	-webkit-transition: margin-right 0.5s ease;
	transition: margin-right 0.5s ease;
	margin-right: 0px;
}

.gallery_off {
	-webkit-transition: margin-right 0.5s ease;
	transition: margin-right 0.5s ease;
	margin-right : -152px;
}

@media only screen and (max-width:1280px) {
	.buy_cam_btn {
		right: 55px;
		top: 16px;
	}
}

.clip_fade {
  opacity: 0;
}

.clip_fade-add-active {
  -webkit-animation: 1.5s opacity-bright-animation;
  animation: 1.5s opacity-bright-animation;
}

.thum_move_hint.fade_out-add {
  -webkit-animation: 2s opacity-bright-animation;
  animation: 2s opacity-bright-animation;
}

.thum_move_hint_share.fade_out-add {
  -webkit-animation: 2s opacity-bright-animation;
  animation: 2s opacity-bright-animation;
}

@keyframes opacity-bright-animation {
from { opacity:1; }
to { opacity:0; }
}