.lection-forms{
	position: relative;
}

.lection-forms .block-tools{
	position: absolute;
    bottom: 0;
    height: 770px;
    box-shadow: 5px 5px 10px 0px #9e9a9a;
   	border-radius: 0.5rem;
}


.app-hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.lection-forms  .convas-block{
	min-height: 730px;
}


.lection-convas-section-list{
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 32px;
}

.lection-convas-section-item{
	margin: 0;
    padding: 0;
    list-style: none;
    text-transform: none;
}

.lection-convas-section-button {
    cursor: pointer;
    background: #ffffff;
    opacity: 0.2;
    border: 3px solid #939ea8;
    box-sizing: border-box;
    border-radius: 12px;
    padding: 8px 20px;
    transition: all 250ms linear;
}

.lection-convas-section-icon {
    width: 130px;
    height: 80px;
    stroke: #0a1c2d;
}

.convas-block{
   height: auto;
   margin-top: 32px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-top: 24px;
   width: 100%;
}
    
    .convas-block  textarea{
        font-family: 'RF Dewi Extended';
        outline: none;
        border: none;
        border-radius: 6px;
        padding: 5px 7px;
        resize: horizontal;
        -webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
        -moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
        box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
    }
    
    .lection-convas-section {
    	background: #ffffff;
    	border-radius: 0px 0.5rem 0.5rem 0.5rem;
    	padding: 22.8px;
	}
    
    .lection-convas-section{
        display: none;
    }
    
    .lection-convas-section.show{
        display: block;
    }
    
    .lection-convas-section.hide, .lection-convas-item.hide{
        display: none!important;
    }
    
    .edit-tools{
        background-color:  #565454;
        max-height: 0;
        transition: max-height 0.15s ease-out;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        justify-content: center;
    }
    
    .edit-tools.show{
        max-height: 500px;
        transition: max-height 0.25s ease-in;
        height: 100%;
    }
    
    .tools-2 {
        z-index: 11;
    }
    
    .tools-1-list {
        justify-content: start;
    }
    
    @media (max-height: 850px) {
      .tools-1-text {
        display: none;
      }
    }
    
    .appTitle{
        font-family: RF Dewi Extended;
        color: white;
        text-align: center;
        text-transform: uppercase;
        font-size: 20px;
        font-weight: 100;
        margin-bottom: 5px;
    }
    
    .textCont{
        background-color: #ffffff;
        padding: 5px 5px;
        border-radius: 12px;
        justify-content: center;
        align-items: center;
        display:flex;
        height:50px;
        cursor:pointer;
    }
    
    .textCont span{
        text-align:center;
        font-family: RF Dewi Extended;
    }
    
    .text-delim{
        width: 100%;
        background-color: #000000;
        height: 1px;
        border: none;
    }
    
    button[disabled]{
        pointer-events: none;
        filter: opacity(0.5);
    }
    
    
    .lection-convas-list{
        flex-wrap: wrap;
        display: flex;
    	gap: 2px;
    	padding: 0;
    	margin: 0;
    }
    
    .lection-convas-section-list-block {
    	align-items: end;
	}
    
    .lection-convas-section-list {
	    display: flex;
	    justify-content: space-between;
	    gap: 12px;
	    margin-top: 32px;
        padding: 0;
	}	
    
    
    .lection-convas-item {
    	width: 185px;
    	position: relative;
    	display: flex;
    	align-items: center;
	}
    
    .lection-convas-section-list-block{
        align-items: end;
        display: flex;
    	gap: 2px;
    }
    
    .lection-convas-section-list-add-icon {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    width: 15px;
	    height: 15px;
	    opacity: 1;
	    transform: translate(-50%, -50%);
	    transition: opacity 250ms linear;
	}
    
    .lection-convas-section-list-add{
    	position: relative;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    width: 50px;
	    height: 47px;
	    appearance: none;
	    border: none;
	    background: #ffffff;
	    border-radius: 8px 8px 0px 0px;
	    cursor: pointer;
	    border-top: 1px solid #dcdcdc;
	    border-left: 1px solid #dcdcdc;
	    border-right: 1px solid #dcdcdc;
	    transition: background 250ms linear;
        margin-right: 20px;
        min-width: 50px;
    }
    
    .lection-convas-section-list-add:hover {
    	background: #0a84ff;
	}
    
    .lection-convas-section-list-add:hover .lection-convas-section-list-add-icon {
    	opacity: 0;
	}
    
    .lection-convas-section-list-add:hover .lection-convas-section-list-add-icon2 {
    	opacity: 1;
	}
    
    .lection-convas-button{
    	position: relative;
	    cursor: pointer;
	    width: 100%;
	    appearance: none;
	    border: none;
	    background: #d0e0f5;
	    border-radius: 8px 8px 0px 0px;
	    padding: 16px 12px 16px 24px;
        height: 100%;
    }
    
    .lection-convas-button.active {
    	background: #ffffff;
	}
    
    .lection-convas-button-list {
	    position: absolute;
	    top: 50%;
	    right: 12px;
	    display: flex;
	    align-items: center;
	    opacity: 0;
	    gap: 2px;
	    transition: opacity 250ms linear;
	    transform: translateY(-50%);
	    list-style: none;
	    padding: 0;
	    margin: 0;
	}
	
	.lection-convas-button-list-item{
		list-style: none;
	}
	
	.lection-convas-button-list-item>div{
		width: 20px;
		height: 20px;
		display: flex;
    	justify-content: center;
    	align-items: center;
	}
	
	.lection-convas-item:hover .lection-convas-button-list {
	    opacity: 1;
	}	

	.lection-convas-edit {
	    cursor: pointer;
	    appearance: none;
	    border: none;
	    background: #bdc7d0;
	    border-radius: 3px;
	    transition: background 250ms linear;
	}
	
	.lection-convas-close {
	    cursor: pointer;
	    appearance: none;
	    border: none;
	    background: #bdc7d0;
	    border-radius: 3px;
	    transition: background 250ms linear;
	}
	
	.lection-convas-edit:hover, .lection-convas-close:hover {
    	background: #0a84ff;
	}
	    
    .lection-convas-icon {
    	width: 8px;
    	height: 8px;
	}
    
    .lection-convas-text {
	    font-style: normal;
	    font-weight: bold;
	    font-size: 12px;
	    line-height: 130%;
	    display: flex;
	    align-items: center;
	    text-align: center;
	    text-transform: uppercase;
	    color: #272727;
	    transition: color 250ms linear;
	    margin: 0;
	}
    
    .lection-convas-button-input {
	    display: none;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    transform: translate(-50%, -50%);
	    appearance: none;
	    border: none;
	    background: none;
	    padding-left: 24px;
	}
    
    .lection-convas-section-list-add-icon, .lection-convas-section-list-add-icon2{
        width: 30px;
        height: 30px;
    }
    
    .floatLabelCont{
        position: relative;
    }
    
    .floatLabelCont label{
        display: block;
        position: absolute;
        opacity: 0;
        top: 4px;
        left: 28px;
        font-family: RF Dewi Extended;
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
        line-height: 12px;
        color: rgba(120, 134, 147, 0.8);
    }
    
    .floatLabelCont .lection-convas-section-content{
        padding: 20px 28px;
    }
    
    .lection-convas-section-content:placeholder-shown + label {
      visibility: hidden;
      z-index: -1;
    }
 
    .lection-convas-section-content:not(:placeholder-shown) + label,
    .lection-convas-section-content:focus:not(:placeholder-shown) + label {
      visibility: visible;
      z-index: 1;
      opacity: 1;
    }
    
   .revers {
        justify-content: space-between;
        flex-direction: row-reverse;
    }