.johnDynamicContentTemplate {

    display: flex;

    display: -webkit-flex;

}



.johnDynamicContentTemplate > div{

    flex: auto;

}

.johnDynamicContentAddNew {

    width: 100%;

    background-color: #FC0;



}

.johnDynamicContentAddNew span,

.johnDynamicContentAddNew form,

.johnDynamicContentAddNew select {

    display: inline-block;

    font-size: 11px;

}

.johnDynamicContentEditControl {

    font-size: 11px;

    line-height: normal;

    position: absolute;

    right: 0px;

    background-color: rgba(255,255,255,0.8);

    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(200,200,200,0.8) 100%);

    z-index: 99;

    padding: 2px 5px;

    opacity: 0.2;

}

.johnDynamicContentEditControl:hover{

    opacity: 1;

}



.johnDynamicContentEditControl .hidenInfos {

    display: none;

}



.johnDynamicContentEditControl:hover .hidenInfos {

    display: block;

}

.johnDynamicContentAddNew button,

.johnDynamicContentEditControl button {

    background-color: transparent;

    border: none;

    margin: 0;

    padding: 0!important;

}

.johnDynamicContentAddNew button img,

.johnDynamicContentEditControl button img{

    cursor: pointer;

    margin: 1px 2px;

}





 

.johnDynamicContentEditControl:hover .hidenInfos,

.johnDynamicContentEditControl:focus-within .hidenInfos {

    display: block;

}

 

.johnDynamicContentEditControl:hover,

.johnDynamicContentEditControl:focus-within {

    opacity: 1;

}
