@import url('../../css/font.css');

html {
  -webkit-user-select: none;
}

#inappBlocksGuide {
  background: #f7f6ee;
  margin-top: 102px;
  margin-bottom: 100px;
}

#inappBlocksGuide .block-category-header {
  color: white;
  text-transform: uppercase;
  padding-left: calc(var(--vh-unit) * (2.47));
  padding-top: calc(var(--vh-unit) * (1.64));
  padding-bottom: calc(var(--vh-unit) * (1.64));
  margin-left: calc(var(--vh-unit) * (15.95));

  margin-top: calc(var(--vh-unit) * (9.87));

  width: calc(var(--vh-unit) * (46.18));
  font-size: calc(var(--vh-unit) * (2.75));
}

#inappBlocksGuide .content-container {
  padding-bottom: 200px;
}

#inappBlocksGuide .block-description-table {
  margin-left: calc(var(--vh-unit) * (15.95));
}

#inappBlocksGuide .block-description-table td {
  vertical-align: top;
  padding-left: 20px;
  padding-bottom: 20px;
}

#inappBlocksGuide #yellow-block-category-header {
  background-color: #f4e025;
}

#inappBlocksGuide #blue-block-category-header {
  background-color: #4a8ce3;
}

#inappBlocksGuide #purple-block-category-header {
  background-color: #cd7cd1;
}

#inappBlocksGuide #green-block-category-header {
  background-color: #48cc7e;
}

#inappBlocksGuide #orange-block-category-header {
  background-color: #ffb254;
}

#inappBlocksGuide #red-block-category-header {
  background-color: #ea2424;
}

#inappBlocksGuide .block-category-header-line {
  margin-left: calc(var(--vh-unit) * (15.95));
  margin-right: calc(var(--vh-unit) * (15.95));
  height: calc(var(--vh-unit) * (0.33));
}

#inappBlocksGuide #yellow-block-category-header-line {
  background-color: #f4e025;
}

#inappBlocksGuide #blue-block-category-header-line {
  background-color: #4a8ce3;
}

#inappBlocksGuide #purple-block-category-header-line {
  background-color: #cd7cd1;
}

#inappBlocksGuide #green-block-category-header-line {
  background-color: #48cc7e;
}

#inappBlocksGuide #orange-block-category-header-line {
  background-color: #ffb254;
}

#inappBlocksGuide #red-block-category-header-line {
  background-color: #ea2424;
}

/*
#inappBlocksGuide  .block-wrapper {
    margin-top: calc(var(--vh-unit) * (2.96));
    margin-left: calc(var(--vh-unit) * (15.95));
    margin-right: calc(var(--vh-unit) * (15.95));
    height: calc(var(--vh-unit) * (23.03));
    color: #808080;
    margin-bottom: calc(var(--vh-unit) * (3.29));
}


#inappBlocksGuide .block-wrapper-left{
    float: left;
    width: 40%;
    padding-bottom: calc(var(--vh-unit) * (1.64));
}

#inappBlocksGuide .block-wrapper-right {
    float: right;
    width: 40%;
    padding-bottom: calc(var(--vh-unit) * (1.64));
}

#inappBlocksGuide .block-image-wrapper {
    float: left;
}
*/

#inappBlocksGuide .block-title {
  font-size: calc(var(--vh-unit) * (2.5));
  border-bottom: 1px solid #bfbfbf;
  padding-bottom: calc(var(--vh-unit) * (0.99));
  margin-top: 20px;
  margin-right: 20px;
}

#inappBlocksGuide .block-image {
  margin-top: calc(var(--vh-unit) * (3.29));
  margin-left: calc(var(--vh-unit) * (1.64));
  width: calc(var(--vh-unit) * (12.34));
}

#inappBlocksGuide .block-image-repeat {
  margin-top: calc(var(--vh-unit) * (3.29));
  margin-left: calc(var(--vh-unit) * (1.64));
  width: calc(var(--vh-unit) * (23.03));
}

#inappBlocksGuide .block-description {
  margin-top: calc(var(--vh-unit) * (3.29));
  width: calc(var(--vh-unit) * (34.54));
  font-size: calc(var(--vh-unit) * (2.3));
  color: #6f6f6e;
  line-height: calc(var(--vh-unit) * (3.62));
}

#inappBlocksGuide .block-description-repeat {
  margin-top: calc(var(--vh-unit) * (3.29));
  width: calc(var(--vh-unit) * (23.85));
  font-size: calc(var(--vh-unit) * (2.3));
  line-height: calc(var(--vh-unit) * (3.62));
  color: #6f6f6e;
}
