@font-face {
    font-family: "robotothin";
    src: url("fonts/robotothin/Roboto-Thin-webfont.woff") format("woff");
    /* font-weight: normal;
    font-style: normal; */
  }
  
  @font-face {
    font-family: "antonio";
    src: url("fonts/antonio/Antonio-Light.ttf") format("truetype");
    /* font-weight: normal;
    font-style: normal; */
  }
  
  @font-face {
    font-family: "wireone";
    src: url("fonts/wireone/WireOne.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
  }
  
  html {
    overflow: hidden;
  
    -webkit-touch-callout: none !important;
  
    -webkit-user-select: none !important;
    user-select: none !important;
  }
  
  body {
    -webkit-touch-callout: none !important;
  
    -webkit-user-select: none !important;
    user-select: none !important;
  
    border: 0px solid red;
    /* position: relative; */
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    touch-action: none;
    overflow: hidden;
    height: 100dvh;
    /* background:  #E7E7E8; */
    background-color: #ffffff;
    user-select: none;
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
  
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  
    /* max-height: 100vh; 
  overflow-y: auto;   */
  }
  
  #puzzf_overlay_block_ph {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.3;
    z-index: 110;
    cursor: pointer;
  }
  
  #puzzf_header_ph {
    position: relative;
    /* padding:8px; */
    /* height: 62px; */
    /* background-color: #3E67BE; */
    /* background-color: #93979A; */
    /* background-color: #ececec; */
  
    /* color: white; */
    color: rgb(58, 58, 58);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 0.9em;
    /* text-indent: 5px; */
    letter-spacing: 0.05em;
    z-index: 3;
  
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  /* ===========puzzf_info========= */
  .puzzf_info {
    /* font-family: "Compita", sans-serif; */
    font-family: "Arial", sans-serif;
    font-weight: normal;
    text-align: center;
    padding: 10px 20px 10px 20px;
    /* background-color: #fde8d3; */
    margin-bottom: 0.55rem;
    border-top: 1px solid black;
  }
  
  .puzzf_info-title {
    /* font-family: "Helvetica", sans-serif; */
    font-family: "Arial", sans-serif;
    font-weight: bold;
    font-size: 1.2rem;
    margin-bottom: 0.9rem;
  }
  .puzzf_info-text {
    font-size: 0.98rem;
    margin-bottom: 1.6rem;
    max-width: 17.125rem;
    margin-left: auto;
    margin-right: auto;
  }
  .puzzf_info-link {
    display: block;
    font-size: 0.8rem;
    color: black;
    margin-bottom: 0.3rem;
  }
  
  /* =============================== */
  
  #puzzf_hr_img_wrp {
    width: 80%;
    height: 100%;
  }
  
  .puzzf_authors {
    display: block;
    position: relative;
    padding: 0;
    width: 90%;
    height: 22px;
    /* color:white; */
    color: rgb(58, 58, 58);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.5em;
    line-height: 1.8em;
    letter-spacing: 0.05em;
    z-index: 3000;
  }
  
  .puzzf_img_menu_icon {
    position: absolute;
    top: 0;
    right: 0;
    height: 100.2%;
    cursor: pointer;
  }
  
  #puzzf_games_menu {
    position: relative;
    top: 1px;
    z-index: 1000;
    display: none;
    background: #3b6cbf;
    /* pointer-events: none; */
    /* touch-action: none; */
  }
  
  #puzzf_menu_item_lnk {
    height: 60px;
  }
  
  .puzzf_menu_items {
    float: none;
    /* height:63px; */
    /* height:33.33%; */
    background: #3b6cbf;
    width: 100%;
    border-bottom: 1px solid white;
  
    /* -webkit-transform: skew(0deg);
    -moz-transform: skew(0deg);
    -o-transform: skew(0deg); */
  }
  
  #puzzf_menu_item {
    height: 60px; /* ! высота каждого пункта меню - скошенной части - уменьшил - выступало */
  }
  
  .puzzf_menu_icon {
    width: 60px;
    height: 60px;
  }
  
  .puzzf_menu_items_title {
    position: absolute;
    float: left;
    width: 100%;
    padding-left: 30px;
    padding-top: 30px;
    /* margin-bottom: 0.4vh; */
    outline: 0px yellow solid;
    font-family: "Archivo Black", sans-serif;
    font-size: 13px;
    /* font-weight: bold; */
    text-transform: uppercase;
    text-align: center;
    color: white;
  
    width: 50%;
    /* padding-left:15px; */
  }
  
  #puzzf_playfield_wrp_ph {
    width: 100%;
    background: white;
  }
  
  #puzzf_playfield_ph {
    /* margin:10px auto; */
    position: relative;
    /* width:305px; */
    /* height:230px; */
    /* font-size: 26px; */
    border: 0px solid grey;
    /* color: grey; */
    /* text-align: center; */
    /* padding:15px; */
    background: white;
    /* border-radius: 15px; */
    cursor: pointer;
  }
  
  #puzzf_playfield_background {
    width: 100%;
  }
  
  /* #puzzf_author_blk_ph{
    width:96%;
    margin:0px auto;
    height:30px;
  } */
  
  #puzzf_task_blk_ph {
    position: relative;
    width: 100%;
    background: white;
    /* outline:1px solid black; */
  }
  
  #puzzf_task_text {
    /* float:left; */
    /* width:70%; */
    font-size: 13.5px;
    /* word-wrap: break-word; */
  }
  
  .puzzf_task_img_blk {
    /* position: absolute; */
    width: 25%;
    float: right;
  }
  
  #puzzf_you_win_ph {
    position: absolute;
    background-color: white;
    color: black;
    font-size: 24px;
    text-align: center;
    cursor: pointer;
  }
  
  @media only screen and (max-width: 360px) {
  }
  
  @media only screen and (max-width: 375px) {
  }
  
  @media only screen and (max-width: 320px) {
    #puzzf_header_ph {
      position: relative;
      /* padding:8px; */
      /* height: 62px; */
      /* background-color: #3E67BE; */
      background-color: #ececec;
      /* background-color: red; */
      /* color: white; */
      color: rgb(58, 58, 58);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 1.3em;
      font-weight: bold;
      line-height: 1em;
      /* text-indent: 0px; */
      letter-spacing: 0.05em;
      z-index: 3;
  
      display: flex;
      justify-content: center;
      align-items: center;
    }
  
    #puzzf_task_text {
      font-size: 12.5px;
    }
  }
  
  .puzzf_triangles {
    background-color: rgb(132, 233, 146);
    border: 0px solid black;
    cursor: pointer;
    opacity: 0;
  }
  
  #puzzf_overlay_block_ph {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.3;
    z-index: 110;
    cursor: pointer;
  }
  
  #puzzf_you_win_ph {
    position: absolute;
    display: none;
    background-color: white;
    font-size: 60px;
    color: red;
    font-weight: bold;
    padding: 6px 6px 10px 6px;
    margin: 0;
    border-radius: 10px;
    text-align: center;
    transform: translate(-50%, 0);
    z-index: 1000;
    overflow: hidden;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
    /* cursor: pointer; */
  }
  
  /* html drag adn drop */
  
  .selected {
    opacity: 0.6;
  }
  
  .hide {
    display: none;
  }
  
  .hovered {
    background-color: red;
  }
  
  #puzzf_part_1,
  #puzzf_part_2,
  #puzzf_part_3,
  #puzzf_part_4,
  #puzzf_part_5,
  #puzzf_part_6,
  #puzzf_part_7,
  #puzzf_part_8,
  #puzzf_part_9 {
    clip-path: polygon(
      0 0,
      53% 0,
      100% 62%,
      100% 71%,
      78% 100%,
      74% 100%,
      52% 71.8%,
      50% 71.5%,
      48% 71.8%,
      26% 100%,
      22% 100%,
      0 71%,
      0 62%,
      47.5% 0,
      53% 0
    );
  }
  
  .puzzf_img_hover_darken {
    -webkit-filter: brightness(100%);
    width: 100%;
  }
  
  .puzzf_img_hover_darken:hover {
    -webkit-filter: brightness(80%);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
  }
  
  .puzzf_borders {
    width: 100%;
  }
  
  #puzzf_border_1,
  #puzzf_border_2,
  #puzzf_border_3,
  #puzzf_border_4,
  #puzzf_border_5,
  #puzzf_border_6,
  #puzzf_border_7,
  #puzzf_border_8,
  #puzzf_border_9 {
    clip-path: polygon(
      0 0,
      53% 0,
      100% 62%,
      100% 71%,
      78% 100%,
      74% 100%,
      52% 71.8%,
      50% 71.5%,
      48% 71.8%,
      26% 100%,
      22% 100%,
      0 71%,
      0 62%,
      47.5% 0,
      53% 0
    );
  }
  
  #puzzf_restart_button_for_ph {
    position: absolute;
    z-index: 100;
    background: #c5c6c6;
    right: 0;
  }
  
  #puzzf_mask {
    position: relative;
    /* background-image:url('');
    background-size:cover;
    background-position: center;
    height: 200px; 
    width: 150px; */
    /* outline: 0px solid #bbb; */
  
    overflow: hidden;
    /* object-fit: cover; */
  }
  
  /* =====================puzzf_mask-text=========== */
  
  .puzzf_mask-text {
    font-family: "Arial", sans-serif;
    font-size: 0.8rem;
    margin-bottom: 0.2rem;
  }
  
  /* =============================================== */
  
  #puzzf_image {
    position: relative;
    /* border:10px solid red; */
    /* left:0;
    top:0; */
    /* object-fit: cover; */
    /* width:100%;
    height:100%; */
    /* border:20px solid blue; */
  
    /* pointer-events: none; */
  
    /* -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none; */
  
    -webkit-touch-callout: none !important;
  
    -webkit-user-select: none !important;
    user-select: none !important;
  }
  
  #canvas_1,
  #canvas_2,
  #canvas_3,
  #canvas_4 {
    /* height: 100px;
    width: 100px; */
    /* margin-left:10px; */
    /* border: 0.5px solid black; */
    /* outline: 0px solid  #FA9500; */
    /* background-color: rgb(0, 0, 0); */
    /* background-color:#93979A; */
    background-color: #e3e3e3;
    /* background-color:white; */
  }
  
  /* #canvas_4{
    background-color:white;
    border:0.5px solid #E3E3E3;
  } */
  
  #puzzf_canvases_row {
    /* display:flex;
    justify-content: center;
    align-items:center; */
  }
  /* ============puzzf_text_row=========== */
  
  #puzzf_text_row {
    position: relative;
    top: -18.15px;
    touch-action: none;
    min-height: 30px;
    border-bottom: 1px solid black;
  }
  
  .puzzf_left_text {
    padding-bottom: 13px;
    font-size: 0.98rem;
  }
  .puzzf_left_text--bold {
    font-weight: bold;
  }
  
  #puzzf_links_blk {
    position: absolute;
    bottom: 186px;
    right: 0;
    padding-bottom: 7px;
    padding-right: 16px;
    position: absolute;
    display: flex;
    justify-content: center;
    gap: 12px;
  }
  /* ========================================== */
  
  /* ================puzzf_upload_portrait_btn================ */
  .puzzf_upload_portrait_btn {
    background-color: #feb45b;
  }
  .puzzf_upload_portrait_btn:active {
    background-color: #fba236;
  }
  .puzzf_save_image_key_btn {
    background-color: #feb45b;
  }
  .puzzf_save_image_key_btn:active {
    background-color: #fba236;
  }
  /* ========================================================= */
  
  #puzzf_img_system_width {
    /* display:none; */
    position: absolute;
  
    left: 300px;
    top: 0px;
    z-index: 10000000000;
    outline: 1px solid red;
    height: 25px;
    width: 70px;
  
    display: none;
  }
  
  #puzzf_img_system_height {
    position: absolute;
  
    left: 300px;
    top: 25px;
    z-index: 10000000000;
    outline: 1px solid red;
    height: 25px;
    width: 70px;
  
    display: none;
  }
  
  .puzzf_canvases {
    float: left;
  }
  
  .puzzf_title_header {
    /* color:black; */
    color: rgb(58, 58, 58);
  }
  
  .puzzf_canvas_wrps {
    position: relative;
    z-index: 10;
  }
  
  #puzzf_hr_logo_img {
    z-index: 5;
  }
  
  #puzzf_disable_loading_page {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .puzzf_antonio_font {
    /* font-family: 'robotothin', sans-serif; */
    font-family: "antonio", sans-serif;
    /* font-family: 'wireone', sans-serif; */
  }
  
  .flip {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    /* border: 1px solid black; */
    /* height: 150px; */
    position: absolute;
    transform-origin: 50% 50% 0px;
    transition: all 0.5s;
    /* width: 300px;     */
  }
  
  #puzzf_mask {
    transform: rotateY(0deg);
  }
  
  #puzzf_backside_blk_1 {
    transform: rotateY(180deg);
  }
  #puzzf_backside_blk_2 {
    transform: rotateY(180deg);
  }
  
  #puzzf_right_col_6_large_divs_wrp {
    transform: rotateY(180deg);
  }
  
  .flip-puzzf-mask {
    -webkit-transform: rotateY(0deg) !important;
    transform: rotateY(0deg) !important;
  }
  
  .flip-puzzf-backside-blk {
    -webkit-transform: rotateY(180deg) !important;
    transform: rotateY(180deg) !important;
  }
  /* .zindex-top{
    z-index:0;
  } */
  /* .opacity-class {
  
    opacity:1;
    
  } */
  
  /* ! info btn */
  
  #puzzf_info_btn_wrp {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
    opacity: 0.5;
  
    z-index: 200;
    cursor: pointer;
    display: none;
  }
  
  #puzzf_info_btn_letter_blk {
    position: absolute;
    /* top:30%; */
    /* bottom:0; */
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    background: transparent;
  }
  
  #puzzf_info_btn_letter {
    position: relative;
    top: 8%;
    /* left:6% */
  }
  
  /* ! info blk */
  #puzzf_info_blk {
    position: absolute;
    left: 0;
  
    background: white;
    color: black;
    display: none;
  
    background: #ececec;
    color: black;
  }
  
  #puzzf_info_blk_close_btn {
    position: absolute;
  
    background: black;
    color: white;
  }
  
  .puzzf_3_links {
    color: #717172;
    text-decoration: none;
  }
  
  /* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
  
  @media only screen and (min-width: 460px) {
    .puzzf_right_col_nums {
      display: none;
    }
  
    .puzzf_6_large_divs_in_right_column {
      /* border:2px solid black; */
      /* visibility: hidden;
    transition: visibility 2s, linear; */
      /* display:none; */
      /* box-shadow: 2px 2px 5px 0.5px rgba(0, 0, 0, 0.5); */
  
      /* animation-duration: 0.5s;
    animation-name: slidein;
    animation-iteration-count: 1;
    animation-timing-function: ease-in-out;
    animation-direction: alternate;
    animation-delay: 0s; */
    }
  
    /* @keyframes slidein {
  
      0% {box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.1);}
  
  
      50%{box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5);}
  
     100%{box-shadow: 2px 2px 5px 0.5px rgba(0, 0, 0, 0.5);}
  
  } */
  
    #puzzf_disable_loading_page {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  
    #puzzf_playfield_background_branches {
      width: 100%;
    }
  
    /* #puzzf_playfield_background_christmas_tree{
                              
                                } */
  
    .puzzf_triangles {
      background-color: rgb(132, 233, 146);
      border: 0px solid black;
      cursor: pointer;
      opacity: 0;
    }
  
    /* .puzzf_triangles:hover{
                                  background-color: rgb(250, 0, 0);
                                  border:0px solid black;
                                  opacity:1;
                                } */
  
    #puzzf_you_win_dt {
      position: absolute;
      background-color: white;
      color: black;
      font-size: 24px;
      text-align: center;
    }
  
    #puzzf_overlay_block_dt {
      display: none;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: black;
      opacity: 0.3;
      z-index: 110;
      cursor: pointer;
    }
  
    #puzzf_you_win_dt {
      position: absolute;
      display: none;
      background-color: white;
      font-size: 60px;
      color: red;
      font-weight: bold;
      padding: 6px 6px 10px 6px;
      margin: 0;
      border-radius: 10px;
      text-align: center;
      transform: translate(-50%, 0);
      z-index: 1000;
      overflow: hidden;
      box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
      /* cursor: pointer; */
    }
  
    #puzzf_restart_button_for_dt {
      position: relative;
      top: 0px;
      right: 0;
      width: 70px;
      height: 70px;
      border-radius: 5px;
      background-color: #c5c6c6;
      z-index: 4;
      cursor: pointer;
    }
  
    #puzzf_restart_button_for_dt > #chc_restart_img {
      width: 65px;
    }
  
    #puzzf_header_dt {
      position: relative;
      width: 100%;
      /* height:80px; */
      background: rgb(180, 178, 178);
    }
  
    #puzzf_playfield_wrp_dt {
      width: 100%;
      height: 100vh;
      display: flex;
      background: rgb(255, 255, 255);
      /* align-items: center; */
      justify-content: center;
    }
  
    #puzzf_center_right_dt {
      width: 28%;
  
      border: 0px solid black;
    }
  
    #puzzf_center_dt {
      float: left;
      /* width:50%; */
      height: 100vh;
      background: rgb(214, 208, 201);
    }
  
    #puzzf_right_dt {
      float: left;
      width: 35%;
      height: 100vh;
      background: rgb(255, 255, 255);
    }
    #puzzf_4_canvases_wrp {
      width: max-content;
      margin: auto;
    }
  
    #puzzf_playfield_dt {
      outline: 0px solid red;
      /* width: 33%; */
      width: auto;
    }
  
    #puzzf_task_blk_dt {
      width: 100%;
      height: 100vh;
      background: #a0b6c5;
    }
  
    .puzzf_center_block {
      background: white;
      padding-left: 25px;
      padding-right: 25px;
    }
  
    .puzzf_header_dt {
      position: relative;
      /* text-align: left; */
      /* padding: 10px; */
      /* font-size: 30px; */
      font-weight: bold;
      /* line-height: 1.5em; */
  
      /* padding-bottom:17px; */
      color: white;
      /* background-color: #3E67BE; */
      background-color: #ececec;
      font-family: Arial, Helvetica, sans-serif;
    }
  
    .puzzf_header_title_dt {
      position: relative;
      /* top:-8px; */
      /* margin-left:10px; */
    }
  
    .puzzf_img_menu_icon {
      position: absolute;
      top: 0;
      right: 0;
      /* width:47.5px; */
      height: 100.2%;
      cursor: pointer;
    }
  
    .puzzf_desktop_authors {
      position: relative;
      /* top:-3px; */
      /* margin-left: 12px; */
      font-family: Arial, Helvetica, sans-serif;
      /* font-size: 14px; */
      /* line-height: 0.1em; */
    }
  
    #puzzf_games_menu {
      position: relative;
      top: 1px;
      z-index: 1000;
      display: none;
      background: #3b6cbf;
      /* pointer-events: none; */
      /* touch-action: none; */
    }
  
    #puzzf_menu_item_lnk {
      height: 60px;
    }
  
    .puzzf_menu_items {
      float: none;
      /* height:63px; */
      /* height:33.33%; */
      background: #3b6cbf;
      width: 100%;
      border-bottom: 1px solid white;
  
      /* -webkit-transform: skew(0deg);
                                -moz-transform: skew(0deg);
                                -o-transform: skew(0deg); */
    }
  
    #puzzf_menu_item {
      height: 60px; /* ! высота каждого пункта меню - скошенной части - уменьшил - выступало */
    }
  
    .puzzf_menu_icon {
      width: 60px;
      height: 60px;
    }
  
    .puzzf_menu_items_title {
      position: absolute;
      float: left;
      width: 100%;
      padding-left: 30px;
      padding-top: 30px;
      /* margin-bottom: 0.4vh; */
      outline: 0px yellow solid;
      font-family: "Archivo Black", sans-serif;
      font-size: 13px;
      /* font-weight: bold; */
      text-transform: uppercase;
      text-align: center;
      color: white;
  
      width: 50%;
      /* padding-left:15px; */
    }
  
    .puzzf_dt_description {
      background-color: #e0ebff;
      padding: 0 10px 0 10px;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 18px;
      font-weight: 300;
      line-height: 1.2em;
      /* text-indent: 5px; */
      font-family: Arial, Helvetica, sans-serif;
    }
  
    .puzzf_description_p {
      padding-top: 10px;
      text-indent: 0em;
      margin-left: 10px;
      margin-right: 10px;
    }
  
    .puzzf_img_letter {
      float: left;
      width: 60px;
      height: 60px;
      margin-right: 10px;
    }
  
    .puzzf_name_another_game_under_description {
      margin-left: 10px;
    }
  
    .puzzf_up_icon_blk {
      position: absolute;
      bottom: 0;
      right: 0;
      border-top-left-radius: 5px;
      /* border:1px solid red; */
      /* z-index: 2; */
      cursor: pointer;
      /* background:#3B6CBF; */
    }
  
    .puzzf_up_icon {
      width: 70%;
      height: 70%;
      margin: 12% 15%;
  
      /* object-fit: cover; */
    }
  
    #puzzf_restart_button_for_dt > #puzzf_restart_img {
      width: 65px;
    }
  
    #puzzf_mask {
      position: relative;
      /* background-image:url('');
        background-size:cover;
        background-position: center; */
      height: 200px;
      width: 150px;
      border: 1px solid #bbb;
      /* overflow: hidden; */
      /* object-fit: cover; */
    }
  
    #puzzf_image {
      position: relative;
      /* left:0;
        top:0; */
      /* width:100%;
        height:100%;
        object-fit: cover; */
    }
  
    /* #canvas_1, #canvas_2, #canvas_3, #canvas_4{
        width:50%;
        outline:1px solid black;
     
      } */
  
    #puzzf_email {
      color: #717171;
      background-color: #e3e3e3;
      border: none;
    }
  
    .puzzf_orange_color_and_align {
      color: #898989;
      /* text-align:center; */
    }
  
    #puzzf_link_log_problems {
      color: #fa9500;
    }
  
    .puzzf_antonio_font {
      /* font-family: 'robotothin', sans-serif; */
      font-family: "antonio", sans-serif;
      /* font-family: 'wireone', sans-serif; */
    }
  
    #puzzf_get_code_btn:hover {
      /* background-color: #000; */
      -webkit-filter: brightness(80%);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
  
      /* border:1px solid red; */
    }
  
    #puzzf_generate_btn:hover {
      /* background-color: #000; */
      -webkit-filter: brightness(80%);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
  
      /* border:1px solid red; */
    }
  
    #puzzf_change_image_btn:hover {
      -webkit-filter: brightness(80%);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
  
      /* background-color:#787676; */
    }
  
    #puzzf_upload_image_btn:hover {
      -webkit-filter: brightness(80%);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
  
      /* background-color:#787676; */
    }
  
    #puzzf_send_to_email_btn:hover {
      -webkit-filter: brightness(80%);
      -webkit-transition: all 0.5s ease;
      -moz-transition: all 0.5s ease;
      -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
      transition: all 0.5s ease;
    }
  
    /* #h:hover{
      background: #000;
     } */
  }
  /* ============09.12.23-chv========= */
  #js_html_content_from_ajax_image {
    height: 100%;
  }