.manager_wrap {padding-bottom: 20px;}

.hgdynoManager .ui-sortable-placeholder {
display: block; padding: 10px; height: 70px; background: #fff; border: dashed 2px #bbb; margin-bottom: 10px;
visibility:visible !important;
-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;	}

.hgdynoManager {width:100%; border-spacing: 0px 10px; margin-top: -10px;}
.hgdynoManager tr > td { padding: 10px; border: solid 1px #ccc; background: #f2f2f2 url(../images/hgdyno/bg.png);
-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
-webkit-box-shadow: inset 0 0 20px white, 0 2px 0px #CCC; -moz-box-shadow: inset 0 0 20px white, 0 2px 0px #CCC; box-shadow: inset 0 0 20px white, 0 2px 0px #CCC;}
.hgdynoManager tr > td.fromtemplate {background-color: #DFDFDF;}

.hgdynoManager tr > td:hover {border: solid 1px #aaa;}
.hgdynoManager tr.ui-sortable-helper > td {border: solid 1px #999; background: #eee url(../images/hgdyno/bg.png);
-webkit-box-shadow: inset 0 0 20px #ccc, 0 2px 0px #CCC, 0 0 20px rgba(0,0,0,0.3);
-moz-box-shadow: inset 0 0 20px #ccc, 0 2px 0px #CCC, 0 0 20px rgba(0,0,0,0.3);
box-shadow: inset 0 0 20px #ccc, 0 2px 0px #CCC, 0 0 20px rgba(0,0,0,0.3);}

.hgdynoManager tr > td .dynoitem {margin:15px 0;}
.hgdynoManager tr > td .underbuttons {margin: 15px 0 10px; border: 0; border-top: 1px solid #DADADA; border-bottom: 1px solid white;}

.hg_uikit_button,
.minimize_all {color: #666; text-shadow: 0px 1px 0px rgba(255,255,255,0.59); font-size: 12px; display: inline-block; position: relative; margin: 0px 1px 0px 1px; width: auto; height: auto; background-color: #ececec; padding: 6px 10px 6px 10px; outline: none; border: 1px solid #d8d8d8; border-bottom: 1px solid #ccc; border-radius: 3px; cursor: pointer; -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); -o-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57);}

.hg_uikit_button:hover {color: #888; text-shadow: 0px 1px 0px rgba(255,255,255,0.69); -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); -o-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75);}

.hg_uikit_button:active {color: #696969; text-shadow: 0px 1px 0px rgba(255,255,255,0.53); border: 1px solid #d2d2d2; border-bottom: 1px solid #d8d8d8; -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); -o-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20);}

.hgdynoManager .drag-dynoitem {background-image: url(../images/hgdyno/hgui.png); background-position: 0 -56px;
background-repeat: no-repeat; padding-left: 30px;}
.hgdynoManager .remove-dynoitem {background-image: url(../images/hgdyno/hgui.png); background-position: 0 0;
background-repeat: no-repeat; padding-left: 30px; }
.hgdynoManager .clone-dynoitem {background-image: url(../images/hgdyno/hgui.png); background-position: 0 -84px;
background-repeat: no-repeat; padding-left: 30px; }
.manager_wrap .addnew {background-image: url(../images/hgdyno/hgui.png); background-position: 0 -28px;
background-repeat: no-repeat; padding-left: 30px; }

.hgdynoManager label {min-width:130px; height: 20px; font-size: 11px; line-height: 20px;
float: left; clear: left; display: block; margin: 5px 0;}

.hgdynoManager .dynoitem .fld {margin:5px 0; padding: 5px;}
.hgdynoManager .dynoitem .fld:nth-child(even) {background: rgba(255, 255, 255, 0.44);}
.hgdynoManager .dynoitem .wrapper .hg_uikit_button {margin-left:5px;}

#slider_ma1nager .dynoitem input[type=text] {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; position: relative; margin: 0; padding: 5px; outline:none; color: #999; background: #ececec; border: 1px solid #d2d2d2; border-bottom: 1px solid #d8d8d8; }

.hgdynoManager .dynoitem input[type=text],
.hgdynoManager .dynoitem select,
.hgdynoManager tr > td .dynotitle > input[type=text]:focus {background: #fcfcfc; color: #505050; border: 1px solid #d2d2d2; border-bottom: 1px solid #d8d8d8; border-radius: 3px;  font-size:11px; margin: 1px 0; outline: 0 none; padding:6px 5px;
-webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07); -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07); -o-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07); box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07);}

.hgdynoManager .dynoitem input[type=text]:focus,
.hgdynoManager .dynoitem select:focus {border: 1px solid #999; border-bottom: 1px solid #989898; color: #666; background:#fff;}
.hgdynoManager .dynoitem select {padding:4px 5px 5px;}

.mediaField {position:relative;}
.mediaField .previewimg {position:absolute; background:#333; border:3px solid #888; border-radius:3px; padding:10px; margin-top:40px; text-align:center; width:200px; height:64px; z-index: 1;
box-shadow:3px 3px 10px rgba(0,0,0,0.3); display:none;}
.mediaField:hover .previewimg { display:block;}
.mediaField .previewimg:after {content:''; position:absolute; top:-13px; left:30px; border:5px solid transparent; border-bottom-color:#888; }
.mediaField .previewimg img {max-height:60px; max-width:180px;float: none;margin: 0;}

.dropdown_target {padding: 5px 3px; font-size:10px; vertical-align:top; margin:1px 0 0 3px; background: #FCFCFC; color: #999; border: 1px solid #D2D2D2; border-bottom: 1px solid #D8D8D8; border-radius: 3px;
-webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.58), inset 0px 0px 6px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07);
-o-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 0px 6px rgba(0,0,0,0.07);
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.58), inset 0px 0px 6px rgba(0, 0, 0, 0.07);
}

x.dynoitem {overflow:hidden;} 
.resize-dynoitem {float:right;}
.resize-dynoitem {background-image: url(../images/hgdyno/hgui.png); background-position: 0 -112px; background-repeat: no-repeat; padding-left: 30px; }
.hgdynoManager tr > td.minimized .resize-dynoitem { background-position: 0 -141px; }

.hgdynoManager tr > td .dynoitem {margin:15px 0; }
.hgdynoManager tr > td.minimized .dynoitem { -webkit-transition:max-height 150ms ease-out; -moz-transition:max-height 150ms ease-out; -o-transition:max-height 150ms ease-out; transition:max-height 150ms ease-out; max-height:40px; overflow:hidden;}
.hgdynoManager tr > td .dynoitem {margin:15px 0; max-height:1000px;} 
.hgdynoManager tr > td .fld.dynotitle {margin-top:0;}
.hgdynoManager tr > td .dynotitle > input[type=text] {background:none; border:1px solid transparent; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; color:#333; font-weight:bold; width:97%; cursor:pointer; font-size:14px;}
.hgdynoManager tr > td .dynotitle > input[type=text]:hover {color:#000;}
.hgdynoManager tr > td .dynotitle > input[type=text]:focus {cursor:text; font-weight: normal; text-align:left;}

.manager_head {margin: 15px 0;}
.manager_label {color:#000; display:block; margin-bottom:5px; line-height:1.7; font-size: 16px; font-weight: bold;}
.minimize_all {float:right;}

.hgdynoManager .browseField {display:inline-block;}


.hgdynoManager {border-collapse:separate;}
.hgdynoManager .clearfix {border-spacing: 0;;}
.manager_wrap {max-width: 700px;}

.videojs_fld > h4 {float:left; min-width: 145px; max-width: 250px; padding: 0 5px 0 0; height: 30px; font-size: 11px; line-height: 30px; margin: 0;}
.videojs_fld > label {float:left; margin-top: 5px !important; clear: none;}
.videojs_fld > input { position:absolute; left:-9999px; }
.hgdynoManager label.iostoggle { position: relative; display: block; width: 50px; height: 20px; cursor: pointer; border-radius: 2px; transition: 350ms; background: #ddd; min-width: 0; max-width: none; padding: 0; margin: 0;}
.hgdynoManager label.iostoggle::after { position: absolute; content:''; width: 16px; height: 16px; top: 2px; left: 2px; border-radius: 1px; background:#fff; transition: width 200ms ease-out, height 300ms 50ms ease-in, top 300ms 50ms ease-in, left 250ms 50ms ease-in, box-shadow 300ms ease-in; }
.hgdynoManager input:checked + label.iostoggle { background: #4c6; }
.hgdynoManager input:checked + label.iostoggle::after { top: 2px; left: 32px; background:#fff; }
.hgdynoManager .videojs_fld .video_options { -webkit-transition: max-height 150ms ease-out .3s; -moz-transition: max-height 150ms ease-out .3s; -ms-transition: max-height 150ms ease-out .3s; transition: max-height 150ms ease-out .3s; max-height: 0; overflow: hidden;}
.hgdynoManager input:checked ~ .video_options { max-height: 1000px; }
.hgdynoManager .video_options .inner-vo {margin: 5px; background: #FFF; border-radius: 3px; padding: 10px;}

.video_options div.label {float:left; min-width: 180px;line-height: 30px;}
.video_options .field-row {margin-bottom:5px;}
.modal_window {width: 500px; padding:20px; background: #FFF; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); border-radius: 2px;}