/* Laptop */
@media screen and (max-width: 1100px) {
  header {
    height:300px;
  }
  header nav ul li {
    margin:0 10px;
  }
}

@media screen and (max-width: 990px) {
  header nav ul {
    font-size:14px;
  }
  header nav ul.right > li {
    margin: 0 5px;
  }
}

/* Tablets */
@media screen and (max-width: 768px) {
  #mob-nav {
    display:block;
    position:absolute;
    top:0;
    line-height:56px;
    margin-left:2%;
    font-size:28px;
  }
  header nav .nav-holder{
    display:none;
    width:100%;
    overflow:auto;
    position:absolute;
    top:56px;
    margin:0;
    background:#fff;
  }
  header nav .nav-holder ul {
    width:100%;
    float: none;
    background:#fff;
    z-index:9;
    text-align:left;
    line-height:1.5;
    height:auto;
  }
  header nav .nav-holder ul.left {
    padding-top:30px;
  }
  header nav .nav-holder ul li {
    display:block;
    float:none;
    border-bottom:1px dotted #ddd;
  }
  header nav .nav-holder ul li i {
    display:block;
    position:absolute;
    top:0;right:0;
    cursor:pointer;
    background:#8d8d14;
    color:#fff;
    line-height:44px;
    width:44px;
    text-align:center;
  }
  header nav .nav-holder ul li.active i {
    transform:rotate(180deg);
  }
  header nav .nav-holder ul li.active {
    border-bottom-width:0;
  }
  header nav .nav-holder ul li.active ul li.active {
    border-width:1px;
  }
  header nav .nav-holder ul li a {
    display:block;
    padding:10px 0;
  }
  header nav .nav-holder ul li ul {
    display:none;
    min-width:100%;
    opacity:1;
    position:relative;
    top:0;
    height:auto;
    left:0;
    padding-top:0;
    text-transform:uppercase;
    font-size:14px;
  }
  header nav .nav-holder ul li.active ul {
    display:block;
  }
  header nav .nav-holder ul li ul li:last-child {
    border-width:0;
  }
  #article-index .index {
    width:100%;
    float:none;
  }
  footer .holder, #content {
    margin:0 2%;
  }
}

/* Phones */
@media screen and (max-width: 480px) {
  header {
    height:180px;
  }
  .grid-row {
    margin-bottom:0;
  }
  .col-md-4 {
    width:100%;
    margin-bottom:15px;
  }
  .col-md-6 {
    float:none;
    width:100%;
    margin-bottom:30px;
  }
  .col-md-12 p {
    max-width:100%;
  }
  footer .holder {
    height:120px;
  }
  footer #logo-footer {
    right:auto;
    left:50%;
    transform:translateX(-50%);
  }
  footer ul {
    display:none;
  }
}