@import '../../core/src/style/variables';

$col1: 35%;
$col2: 20%;
$col3: 20%;
$col4: 25%;

.flags-outerwrapper {
  width: 450px;
  margin: 20px auto 0;
}
table {
  width: 100%;
}
th {
  text-align: left;
  &:nth-child(1) {
    width: $col1;
  }
  &:nth-child(2) {
    width: $col2;
  }
  &:nth-child(3) {
    width: $col3;
  }
}
tr {
  &:nth-child(odd) {
    td {
      background-color: $lightergrey;
    }
  }

  & > td {
    border-top: 1px solid grey;
    padding: 15px 10px;
    &:nth-child(4) {
      text-align: right;
      .flagIcon {
        float: right;
        margin-left: 5px;
        cursor: pointer;
        &:hover {
          opacity: 1;
        }
      }
      span {
        cursor: pointer;
      }
    }
  }
}
.flagIcon {
  opacity: 0.5;
  width: 20px;
  height: 20px;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABOElEQVQ4T62VO07DQBCGDQjBbSjpkYAGIYFCBVfwAUAxfhwAhSpyAw00FjeBjiDSmYeoKAgFLcs3YVcsq01Ym4z0JdbMP783s+s48kVVVQtpmm7BWZZlA3jjegRDuIBOWZaLWj49kiRZx+Ae1B/UeZ7v6DZ/cOcufHqaJ4L+RCk1py1+guKhKw4F0562+Q4Sa01X5kJ/x5jNk7hzBU3B5ymO4yXZhE2foCX7Mru+k2wNq7wSw2un0KdwFAr6V6v3UQxfrITibK2OhxsYmA6t/o/ZG5K4sRIyh4OiKFZCoae2eh9mvyl8bPiKbZBfZw72rVtswTNey2aw/3702My9sZkJDLs+YSCn2uZ3YHrcdKXoe96/LxMIZJPsszWJGu2ubpse+hWwTdM5DLge8f0OcqNLmZf/FRBFX3sX8p2XnrnCAAAAAElFTkSuQmCC');
  &.flagOn {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABmElEQVQ4T5XVPUvDUBQG4PjRVgR/hZDBwaVaSJpAXUTEQYrWQUfxBzgJbq2KQ6fWwcVFVBycHCw4+AMcdBAVhWLtII5qEfED9T3hXrk9uUkM5aG95568+b41TNP0sVatbsjDDtxCC56gDvswA0ndtr4CGseBQn4iNGCKb68OOtBAn2/QBQSpQqcvEMUVpSmujbZAFEYh7pFxBS8wt5vrwuCaTUapwTGrNTNLmRQd3QSbiFLPlrN9OBq65idsbpYCt1gxzJdVslxxmQbgTZkjBzRxwYphyiKMntNTpS7d0+QjKwa5hB4RuKzUVa9BgWf2ut2P7yMx/oQhETYI76LOeYG6U56njemu4fchFEVYEs6B90sNatLdFHp3HS90MZNwN92ECCwqPTreTQl6bF7ACyX2mj2MMZ26rleaM9ILaXqwr9iE1ELQCL57IahHajoVJ/WfV+8DHljNBzuepiwvUISWeFMMVZnzFwj0KtGKE3eRqIB/+ZIwOQY3ojnMHeT59m0DSaxAk7ANtBI9A9112tEeFEDzF2Aav2C2dhxMiSR0AAAAAElFTkSuQmCC');
  }
  &.isLocalLocked {
    opacity: 1;
    cursor: pointer;
    &:hover {
      opacity: 0.9;
    }
  }
}

.lockButton {
  width: 28px;
  height: 25px;
  cursor: pointer;
  opacity: 0.8;
  &:hover {
    opacity: 1;
  }
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAZCAYAAAAiwE4nAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAACXBIWXMAAAsRAAALEQF/ZF+RAAAAGXRFWHRTb2Z0d2FyZQBwYWludC5uZXQgNC4wLjE3M26fYwAAAmpJREFUSEutlstr1FAUxqP1QQUt9qXDDNaJufcMAwVl/AcUXbjWhSvXKi5cd+mfIHXdhVZ0RERL7UJEunAjFRREp52kUF9UqyhMoSq18TvXk1nM3HFuUj/4SHLOvb9z8rhJvM0q9ryeRaXOhUSP4M+h1qvYRpHWEwtBcESG/R9Fvt8H8JOIKLYZhdfRwGUZvjnhzLYA+tCAtW4wOCqXD7wulQYipU4g/liKbiwQnZFp2QXYaQbC63WiYxJuCg1tRROTMuYdLu9OSWUTILMMA/SGhNq0QrQbZ7hsxil1VsLpVdN6EKDfpvsgOClhq3D2V7o11lWYfMoU0/rX20KhV8JWhaVSxYwleiOh9KordUm6XpJQR8WVynaM+4nmVvlBk3A6odgY/AOX9ZmE/ikUrGHsWhVrNgkcR+C8s7W+gI4vsvl4LpfbZUAdxE9ssxgLk67Ldc7mYnGfoNyEjpP1ks2pCxLdsoIcHfr+sKDctEhUtYHqmuIH/fn49p798cti0JZPnL6g1ndsoKf5g/HVnn7jal+uLZ/4YxAMCcpNeNru2kAviofi8W1/C84MFdryifGeTFmQ6F4rJPHUQN4UnFfammenL6j1fRuIzZeSCz4f8a159ge8WwXlJiyLKRuIPdE7bArO5kaseTa/zAXlJkyaboWwsVya93B6sPM9fI+PrqDchEkzrZDEvDTYIWzLs/krLyg34ZtlfhUyemNpdHSvoNyEhT9uATkZ97/Bf26CctO8Uodxv9ZswG7GvGuCSSdMPIrlcRMd1wBawfE3HH/B/ifEluGv2P+OWIPz2M5hO/aqXN4hCAd53h/QgaHI/WAvsgAAAABJRU5ErkJggg==');

  &.isLocked {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAZCAYAAAAiwE4nAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAACXBIWXMAAAsRAAALEQF/ZF+RAAAAGXRFWHRTb2Z0d2FyZQBwYWludC5uZXQgNC4wLjE3M26fYwAAAnFJREFUSEutVktoFEEQXQQJKyjxLwQVdIXEEHSrd/0iCn5OejPgh92ZzYKKuB48eTIRPItHBUHxYiAkBBERJMGjYHII+F2Z7t0oSoghEbyIsuPr3sKD04s9Yx48Zqjqfm+qapqZlA0np/eki4G45Ekx5iv66Ev64il64SkxUKruXMvLFgelem6LL8UbX4nQRk/SrB/QAV7+f+h7u285qqqy8Gdf5fr0A5SnsxmvJsp4EGVySiwUq7SVtyWHX6MbbDanjTj8B6ffiTUwe22qlWKEw8lQaWTaMKc5I6bEFQ5H4Ae5PMwamO2vQiA2cTg+ipKONc3oZ+FTfjWHrUAHxs3agC5yKD4gco2rm+JQS2DOFbNWinscig9U9kCLoK1DHGqJkqTdvPY5h+IDZ+2xng1EbnOoJTyV34AqG+jKJIfioRDkjug2lWp02dcHXokL/6Jei6NSwUOer1QzbSzlBggM8vziE5WWX21fxVJuQGuGrGIuhOGZes9KlnID2jlsFXNhEkNsGrGJeQGFBx92hHvvrgtPTfVE8oaJKlQ0ahM7Mb4t7OxPG+6/vz6SN0xmKB7ZxHonu8Ou68uM4dHRzZG8YaKWKpxBmxh4aLAj7BxIh8UPWWs+6QyfWMVAPT9dYe9EtzWvDT21o52l3ICWPrWKgdmb7cbw+FjGmk9mKOmZTUy/pV1opzY8PLwxkjdMZqj/XSxioDY1lGTNL2qFToTh2equFSzlBmy8ExFyJLqz0B+mlrCUG7w6CWz+8beYC/HC3WKZeNAf1eZXg97j2/gVrZpHq/U/zgzuZ5r39A3333GdRfwl1l89NyGWsoQDUqnfeIH5tKARMyoAAAAASUVORK5CYII=');
  }
}