/* ------------------------- LANDSCAPE DESKTOP ------------------------- */
:root{
  --about_data_width     : 100%;
  --about_data_r_width   : 30%;
  --about_data_r_display : block;
  --about_links_display  : flex;
  --about_links_direction: row;
  --about_links_align    : flex-end;
  --about_cv_align       : flex-end;
  --padding-socials      : 10px;
  --about_socials_margin : 0px;
  --about_bg_w           : 80%;
  --about_bg_h           : auto;
  --about_bg_rot         : rotate(0deg) translate(-50%,-50%);
}
    /* ------------------------- PORTRAIT DESKTOP ------------------------- */
@media screen and (min-width: 1280px) and (min-height: 100.001vw){
  :root{
    --about_data_width     : 100%;
    --about_data_r_width   : 0%;
    --about_data_r_display : none;
    --about_links_display  : flex;
    --about_links_direction: column;
    --about_links_align    : flex-start;
    --about_cv_align       : flex-start;
    --padding-socials      : 10px;
    --about_socials_margin : 20px;
    --about_bg_w           : auto;
    --about_bg_h           : 80%;
    --about_bg_rot         : rotate(90deg) translate(-50%,-50%);
  }
}
    /* ------------------------- PORTRAIT MOBILE ------------------------- */
@media screen and (max-width: 1280px) and (min-height: 100.001vw){
  :root{
    --about_data_width     : 100%;
    --about_data_r_width   : 0%;
    --about_data_r_display : none;
    --about_links_display  : flex;
    --about_links_direction: column;
    --about_links_align    : flex-start;
    --about_cv_align       : flex-start;
    --padding-socials      : 3px;
    --about_socials_margin : 20px;
    --about_bg_w           : auto;
    --about_bg_h           : 80%;
    --about_bg_rot         : rotate(90deg) translate(-50%,-50%);
  }
}
    /* ------------------------- LANDSCAPE MOBILE ------------------------- */
@media screen and (max-width: 1280px) and (min-width: 100vh){
  :root{
    --about_data_width     : 100%;
    --about_data_r_width   : 30%;
    --about_data_r_display : block;
    --about_links_display  : flex;
    --about_links_direction: row;
    --about_links_align    : flex-end;
    --about_cv_align       : flex-end;
    --padding-socials      : 3px;
    --about_socials_margin : 0px;
  }
}


#about_data{
  display : block;
  position: relative;
  z-index : 1;
  width   : var(--about_data_width);
  height  : 100%;
}

#about_data_right{
  display : var(--about_data_r_display);
  position: relative;
  z-index : 1;
  width   : var(--about_data_r_width);
  height  : 100%;
}



#npxyz_pc23{
  display        : flex;
  flex-direction : row;
  align-items    : flex-start;
  justify-content: flex-start;
  padding        : var(--content-padding);
}


.about_links{
  display        : var(--about_links_display);
  flex-direction : var(--about_links_direction);
  align-items    : var(--about_links_align);
  justify-content: var(--about_links_align);
}


.about_socials{
  width          : 50%;
  height         : 100%;
  display        : flex;
  flex-direction : column;
  align-items    : flex-start;
  justify-content: flex-start;
  margin-bottom  : var(--about_socials_margin);
}

.about_cv{
  width          : 50%;
  height         : 100%;
  display        : flex;
  flex-direction : row;
  align-items    : flex-end;
  justify-content: var(--about_cv_align);
}



#about_bg_svg{
  position: absolute;
  z-index : 0;

  width : 100vh;
  height: auto;

  left :50%;
  top  :50%;

  transform: translate(-50%, -50%) rotate(90deg);

  
/* 
  transform: var(--about_bg_rot);
  left : calc(var(--about_bg_w) / 2);
  top  : calc(var(--about_bg_h) / 2); */
}

.socials_tag{
  margin-bottom: var(--padding-socials);
  font-size    : var(--text_norm);
}

.aboutsymb1{
  left: 35%;
}

.aboutsymb2{
  left: 80%;
}

#about_text{
  margin-bottom:20px;
}