.LeftMenuLogo { background-color: white; padding: 16px; z-index: 100; -webkit-transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; -o-transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; background-color: white; width: 350px; height: 450px; position: absolute; top: 22%; left: calc(50% - 175px); text-align: center; -webkit-box-shadow: 0px 5px 11px 15px rgba(34, 60, 80, 0.31); -moz-box-shadow: 0px 5px 11px 15px rgba(34, 60, 80, 0.31); box-shadow: 0px 5px 11px 15px rgba(34, 60, 80, 0.31); }

    .LeftMenuLogo .close_btn_logo { position: absolute; right: 26px; top: 8px; width: 16px; height: 16px; cursor: pointer; }

        .LeftMenuLogo .close_btn_logo::after { content: ''; position: absolute; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 2px; border-radius: 1px; top: 50%; left: 50%; -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%); transform: translate(50%, 50%); background-color: #3c5ec4; }

        .LeftMenuLogo .close_btn_logo::after { -webkit-transform: translate(50%, 50%) rotate(45deg); -ms-transform: translate(50%, 50%) rotate(45deg); transform: translate(50%, 50%) rotate(45deg); }

        .LeftMenuLogo .close_btn_logo::before { content: ''; position: absolute; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 2px; border-radius: 1px; top: 50%; left: 50%; -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%); transform: translate(50%, 50%); background-color: #3c5ec4; }

        .LeftMenuLogo .close_btn_logo::before { -webkit-transform: translate(50%, 50%) rotate(-45deg); -ms-transform: translate(50%, 50%) rotate(-45deg); transform: translate(50%, 50%) rotate(-45deg); }

    .LeftMenuLogo.closed { opacity: 0; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); z-index: -1; }

    .LeftMenuLogo .btnSaveLogo, .LeftMenuLogo .btnReset { cursor: pointer; z-index: 2000; position: relative; padding: 14px 24px; font-size: 16px; line-height: 1; font-weight: 400; background-color: #3c5ec4; text-align: center; display: inline-block; color: #FFFFFF; border: 2px solid transparent; -webkit-transition: 400ms ease-out color, 400ms ease-out background-color, 400ms ease-out border-color; -o-transition: 400ms ease-out color, 400ms ease-out background-color, 400ms ease-out border-color; transition: 400ms ease-out color, 400ms ease-out background-color, 400ms ease-out border-color; border-radius: 4px; display: inline-block; }

        .LeftMenuLogo .btnSaveLogo:hover, .LeftMenuLogo .btnReset:hover { text-decoration: none; color: #3c5ec4; background-color: white; border-color: #3c5ec4; }

.crop-wrapper {  background-color: rgba(255,255,255,1); position: relative; width: 316px; height: 316px; overflow: hidden; margin: 26px auto; }

    .crop-wrapper.closed { display: none; }

    .crop-wrapper .resize-container {  position: relative; display: inline-block; cursor: move; margin: 0 auto; text-align: center;  }

    .crop-wrapper .resize-container-ontop {  position: absolute; cursor: move; background-color: rgba(5,255,5,0); z-index: 1000; width: 100%; height: 100%; }

    .crop-wrapper .resize-container img {  display: block; }

    .crop-wrapper .resize-container:hover img, .crop-wrapper .resize-container:active img {  outline: 2px dashed rgba(0,0,0,.9); }

.resize-handle-ne, .resize-handle-se, .resize-handle-nw, .resize-handle-sw { position: absolute; display: block; width: 10px; height: 10px; background: rgba(0,0,0,.9); z-index: 999; }

.crop-wrapper .resize-container .resize-handle-nw { top: -5px; left: -5px; cursor: nw-resize; }

.crop-wrapper .resize-container .resize-handle-sw { bottom: -5px; left: -5px; cursor: sw-resize; }

.crop-wrapper .resize-container .resize-handle-ne { top: -5px; right: -5px; cursor: ne-resize; }

.crop-wrapper .resize-container .resize-handle-se { bottom: -5px; right: -5px; cursor: se-resize; }

.crop-wrapper .overlay-before {  position: absolute; z-index: 999; width: 316px; height: 316px; box-sizing: content-box; }

    .crop-wrapper .overlay-before .overlay-inner {  position: absolute; top: 25%; right: 25%; bottom: 25%; left: 25%; border-radius: 5%; -webkit-box-shadow: 0 0 0 600px rgba(0, 0, 0, .5); box-shadow: 0 0 0 600px rgba(0, 0, 0, .5); }

    .crop-wrapper .overlay-before:before { top: 0; margin-left: -2px; margin-top: -40px; }

    .crop-wrapper .overlay-before:after { bottom: 0; margin-left: -2px; margin-bottom: -40px; }

    .crop-wrapper .overlay-before .overlay-inner:before { left: 0; margin-left: -40px; margin-top: -2px; }

    .crop-wrapper .overlay-before .overlay-inner:after { right: 0; margin-right: -40px; margin-top: -2px; }