@charset "utf-8";

#mk {
    border: 1px solid #CCC;
    border-radius: 5px;
    padding: 20px 10px;
    background: #777;
    position: relative;
    display:none;
    max-height: 500px;
    overflow-y: auto;
}
#mk_content{
	height:100px;
	width:100%;
	resize: none;
}
#wr_content_json{
	display:none !important;
}
/*************************************************
**   MKV
**************************************************/
#mk_top {
    border: 1px solid #DDD;
    margin-bottom: 10px;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}
#mk_top .mkh_open_btn{
	cursor:pointer;
    width: 100px;
    line-height: 60px;
    text-align: center;
    border-right: 1px solid #DDD;
    font-weight: bold;
    color: white;
    background: #428bca;
}
#mk_top .mkh_open_btn {
  -webkit-animation: BLINK_BTN 1s infinite;  /* Safari 4+ */
  -moz-animation: BLINK_BTN 1s infinite;  /* Fx 5+ */
  -o-animation: BLINK_BTN 1s infinite;  /* Opera 12+ */
  animation: BLINK_BTN 1s infinite;  /* IE 10+, Fx 29+ */
}
@-webkit-keyframes BLINK_BTN {
  0% {
    background-color: #e50000;
  }
  50% {
    background-color: #428bca;
  }
  100% {
    background-color: #e50000;
  }
}

#mk_top .mkh_open_btn:hover{
    background: #5e9cd2;
}
#mk_top .mkh_open_btn:active{
    background: #3d7bb1;
}
#mk_top .descr{
    position: absolute;
    left: 100px;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 10px;
    overflow: auto;
}

#mk_references{
    margin-top: 10px;
    background: #EEE;
    border: 1px solid #DDD;
    border-radius: 5px;
    overflow: hidden;
    padding-bottom: 5p;
}
#mk_references .name{
    padding: 10px;
    font-weight: bold;
}
#mk_references a{
    padding: 5px 30px;
    display: block;
    background: white;
    border-top: 1px solid #DDD;
}

#mk_references a:active{background: #ffe1e7;}

/*************************************************
**   GROUP
**************************************************/
#mk .grouplist>*{
	margin-bottom:5px;
}
#mk .grouplist .group {
    background: #CCC;
    border-radius: 7px;
}
/* title */
#mk .grouplist .group .title{
	cursor: pointer;
	position:relative;
	background: white;
	border-radius: 7px 7px 0 0;
	overflow: hidden;
}
#mk .grouplist .group .title>*{
    display:inline-block;
    vertical-align:middle;
    margin: 0;
}
#mk .grouplist .group .title .groupname{
    padding: 4px;
    position: absolute;
    right: 80px;
    left: 40px;
}
#mk .grouplist .group .title .groupname .name{
    padding: 5px 10px;
    width: 100%;
    border: none;
    background: none;
}
#mk .grouplist .group .title .groupbtn{width: 40px;height: 40px;text-align: center;}
#mk .grouplist .group .title .groupbtn .fa{font-size: 23px;line-height: 40px;}


/* item list */
#mk .grouplist .group .itemlist{
	padding: 10px;
}
#mk .grouplist .group .itemlist>*{
	margin-bottom:5px;
}


/*************************************************
**   ITEM
**************************************************/
#mk .group .item{
    background: #EEE;
    border: 1px solid #aaa;
    border-radius: 7px;
    position: relative;
    height: 55px;
    overflow: hidden;
}

#mk .group .item>* 
{
	display:inline-block;
	vertical-align:middle;
	position: absolute;
}

#mk .group .item .thumb{
    width: 40px;
    height: 40px;
    border: 0;
    background: 0;
    float: left;
    margin: 6px;
    margin-left: 10px;
}
#mk .group .item .thumb img{
	width:100%;
	height:100%;
}
#mk .group .item .name{
    position: absolute;
    left: 57px;
    top: 6px;
    bottom: 7px;
    padding: 9px;
    width: 185px;
}
#mk .group .item .recipes{
    position: absolute;
    left: 250px;
    top: 3px;
    bottom: 3px;
    right: 7px;
    background: white;
    border: 1px solid #CCC;
    padding: 2px;
    overflow-y: auto;
    overflow-x: auto;
}
#mk .group .item .recipes .rItem{display: inline-block;background: #EEE;vertical-align: top;padding: 0px 5px;line-height: 18px;border: 1px solid #CCC;border-radius: 3px;}
#mk .group .item .recipes .rItem .rThumb{width: 15px;height: 15px;display: inline-block;vertical-align: middle;margin: 0;padding: 0;}
#mk .group .item .recipes .rItem .rName{display: inline-block;vertical-align: middle;line-height: 12px;font-size: 12px;margin: 0;padding: 0;}


/*************************************************
**   Config
**************************************************/
#mk .fixedbg {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);z-index: 1000;}
#mk .fixedbg .fixedwdw {
    background: white;
    border: 1px solid #777;
    border-radius: 10px;
    overflow: hidden;
    max-width: 700px;
    margin: 0 auto;
    margin-top: 100px;
}
#mk .fixedbg .fixedwdw .title {position: relative;border-bottom: 1px solid #BBB;}
#mk .fixedbg .fixedwdw .title>*{
	display:inline-block;
	vertical-align:middle;
	margin: 10px;
}
#mk .fixedbg .fixedwdw .title .thumb {
    width: 30px;
    height: 30px;
}
#mk .fixedbg .fixedwdw .title .thumb img {
    width: 100%;
    height: 100%;
}
#mk .fixedbg .fixedwdw .title .name {
}
#mk .fixedbg .fixedwdw .title .removeBtn {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 56px;
    background: white;
    border-left: 1px solid #CCC;
    cursor: pointer;
    margin: 0;
    text-align: center;
}
#mk .fixedbg .fixedwdw .title .removeBtn .fa{
    font-size: 32px;
    line-height: 46px;
}
#mk .fixedbg .fixedwdw .title .removeBtn:hover { background:#EEE}
#mk .fixedbg .fixedwdw .title .removeBtn:active { background:#CCC}

/**lines*/
#mk .fixedbg .fixedwdw .line {
    border-bottom: 1px solid #DDD;
}
#mk .fixedbg .fixedwdw .line .linename {
    position: absolute;
    width: 90px;
    line-height: 40px;
    text-align: right;
}
#mk .fixedbg .fixedwdw .line .linevalue {margin-left: 100px;margin-right: 20px;position: relative;height: 40px;}
#mk .fixedbg .fixedwdw .line input[type=text] {
    width: 100%;
    margin: 6px;
    border: 1px solid #DDD;
}