/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #aaa;
  border-width: 1px 1px 0px 1px;
  background-color: #ddd;
  padding: 0px;
  margin:0px;
}

.tab_inner {
  background-color: #fc3;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: 10px solid transparent;
  border-width: 0px 1.5px 1px 0px;
  outline: none;
  cursor: pointer;
  padding: 10px 20px;
  transition: 0.3s;
  font-size: 15px;
  margin:0px;
  border-image: url(images/separator.png) 1 stretch;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ccc;
}

/* Create an active/current tablink class */
.tab .active {
  background-color: #fff;
  border: 1px solid #fff;  
  border-width: 0px 1.5px 1px 0px;
  border-image: url(images/separator.png) 1 stretch;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #aaa;
  border-top:none;
  word-wrap: break-word;
}

.tabcontent_dev {
  display: none;
  padding: 6px 18px;
  margin:0px;
  border: 1px solid #aaa;
  border-top:none;
  word-wrap: break-word;
}

/**
Portrait 1:1 and below (3/4, 2/3, 9/16, 9/19, etc)
Portrait 1:1 and below (0.75, 0.666, 0.5625, 0.479, etc)
**/
@media (max-aspect-ratio: 1/1)
{
    /* Style the buttons inside the tab */
    .tab button {
      background-color: inherit;
      float: left;
      border: 10px solid transparent;
      border-width: 0px 1.5px 1px 0px;
      outline: none;
      cursor: pointer;
      padding: 10px 10px;
      transition: 0.3s;
      font-size: 12px;
      margin:0px;
      border-image: url(images/separator.png) 1 stretch;
    }
}

/**
Landscape 1:1 and above (4/3, 3/2, 16/9, 19/9, etc)
Landscape 1:1 and above (1.33, 1.5, 1.777, 2.111, etc)
**/
@media (min-aspect-ratio: 1/1) /*and (max-aspect-ratio: 4/3) */
{
}