/* ————————————————
 # Colors Variables
————————————————————————*/
@background: #fff;
@side-element: #090d18;
@navigation: #222;
@link-color: #808080;
@emphasize: #63c9e9;
@lessen: #666;

@brand-google: #dd4b39;
@brand-facebook: #3b5998;
@brand-twitter: #55acee;
@brand-slideshare:#0275B1;

/* ————————————————
 # Global
————————————————————————*/
html, html a {
  -webkit-font-smoothing: antialiased !important;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
}
body {
  font-family: 'Open Sans', sans-serif;
  font-size:14px;
}

img {
  max-width: 100%;
  height:auto;
}

/* ————————————————
 # Typography
————————————————————————*/
a {
  -webkit-transition:color 200ms ease-out;
  transition:color 200ms ease-out;
  color:@link-color;
  &:hover {
    color: darken(@link-color, 20%);
    text-decoration: none;
  }
}

p {
  line-height: 2;
}

hr {
  margin: 1rem 0 2.4rem;
  padding: 0;
  border: 0;
  height: 5px;
  background: #000;
  clear:both;
}

.hentry a {
  color: @link-color;
  border-bottom:1px solid #808080;
  text-decoration: none;
  &:hover {
    color: darken(@link-color, 20%);
    text-decoration:none;
    border-bottom: 0 none;
  }
}

blockquote {
  margin:40px 0;
  border-left: 3px solid @emphasize;
  p {
    line-height: 1.8;
    font-style: italic;
  }
}

/* ————————————————
 # Navigation
————————————————————————*/
#main-nav{
  margin:0;
  padding:0 10px 0 0;
  ul {

    li {
      margin:0 0 0 20px;

      a {
        font-size: 16px;
        padding:39px 0;
        color: @navigation;
        background: transparent;
        &:after {
          content:" ";
          display: block;
          height: 1px;
          background:#000;
          width: 0%;
          margin:3px auto 0;
          transition: width 200ms ease-out;
          -webkit-transition: width 200ms ease-out;
        }

        &:hover {
          &:after{
            width:100%;
          }
        }

      }
    }
    li.active a {
      color:@lessen;
    }

    .dropdown-menu {

      li {
        margin:0;
        a {
          padding:3px 20px;
        }
      }
    }

  }

  .navbar-toggle {
    margin-right: 0;
    .icon-bar {
      background:@navigation;
    }
  }

  .navbar-brand {
    font-size: 16px;
    padding: 42px 0 0;
    margin:0;
    height: auto;
    line-height: 1;
  }

}

/* ————————————————
 # Header
————————————————————————*/
#main-header {
  line-height: 100px;
  vertical-align: middle;
}

#banner {
  display:table;
  height:460px;
  overflow: hidden;
  width:100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  .inner{
    display:table-cell;
    vertical-align: middle;
  }
  h1 {
    color:#222;
    font-size:48px;
    margin:0;

    span {
      display: block;
      font-size: 32px;
      margin:10px 0 0;
    }
  }
}


/* ————————————————
 # Index page
————————————————————————*/
.home {
  #welcome-msg {
    margin:60px 0;
    font-size: 28px;
    line-height: 1.5;
    text-align: center;
  }

  .speaker{
    margin:0 0 30px;
    a {
      display:block;

      figure {
        overflow: hidden;
      }
      img {
        -webkit-filter: grayscale(1);
        filter: grayscale(1);
        -webkit-transition:all 150ms ease-out;
        transition:all 150ms ease-out;
        -webkit-transform: rotate(8deg) scale(1.3);
         transform: rotate(8deg) scale(1.3);
      }

      span.name {
        font-size:18px;
        padding:5px 0 0;
        color:#222;
        display: block;
        border-top:5px solid @emphasize;
      }

      &:hover {
        text-decoration: none;

        img {
          -webkit-filter: grayscale(0);
          filter: grayscale(0);
          -webkit-transform: rotate(0) scale(1);
          transform: rotate(0) scale(1);
        }
      }
    }
  }

  #main-sidebar {
    margin-top:60px;
    text-align: center;
  }

}
/* ————————————————
 # Single post & Page
————————————————————————*/

#main-content .hentry{
  padding:60px 0 0;

  h2:nth-child(1) {
    margin:0 0 60px;
    font-size: 28px;
    line-height: 1.5;
    text-align: center;
  }

  .date {
    margin:40px 0 0;
    color:@lessen;
    &:first-letter{
      text-transform: uppercase;
    }
  }

}

/* ————————————————
 # Press Releases
————————————————————————*/
.page-template-tpl-press #main-content {

  #press-releases {

    .section-title {

    }

    .hentry {
      padding:0;
      margin:0 0 40px;

      .date {
        display: block;
        color:@lessen;
        margin:20px 0 5px;

        &:first-letter{
          text-transform: uppercase;
        }
      }

    }

  }

}


/* ————————————————
 # Full program & Single program
————————————————————————*/
#list-program {
  padding:60px 0 0;

  .day {
    margin:0 0 60px;

    .program-day {

      margin:0;

      span {
        display:block;
        font-size:60%;
        margin:15px 0 0;
        color:@lessen;
      }
      &:first-letter{
        text-transform: uppercase;
      }
    }

    .program-item {
      margin:0 0 40px;

      .program-hour {
        color:@emphasize;
      }

      a {
        color:@navigation;
        &:hover {
          text-decoration: underline;
        }
      }
      p{
        color:@lessen;
      }

    }

  }
}

.single-program #main-content .program {

  .day {
    margin:0;
    &:first-letter {
      text-transform: uppercase;
    }
  }

  .time {
    margin:10px 0 60px;
    color:@emphasize;
    text-align:center;
  }

}

/* ————————————————
 # Speakers & Single speaker
————————————————————————*/
#list-speakers{
  padding:60px 0;

  .speaker{
    margin:0 0 30px;
    a {
      display:block;

      figure {
        overflow: hidden;
      }
      img {
        -webkit-filter: grayscale(1);
        filter: grayscale(1);
        -webkit-transition:all 150ms ease-out;
        transition:all 150ms ease-out;
        -webkit-transform: rotate(8deg) scale(1.3);
	       transform: rotate(8deg) scale(1.3);
      }

      span.name {
        font-size:18px;
        padding:5px 0 0;
        color:#222;
        display: block;
        border-top:5px solid @emphasize;
      }

      &:hover {
        text-decoration: none;

        img {
          -webkit-filter: grayscale(0);
          filter: grayscale(0);
          -webkit-transform: rotate(0) scale(1);
	        transform: rotate(0) scale(1);
        }

      }
    }
  }
}

.single-speakers #main-content .hentry {

  .wp-post-image {
    margin:9px 0 0;
  }

  h2:nth-child(1){
    margin:0 0 10px;
    text-align: left;
  }
}

/* ————————————————
 # Exhibitors
————————————————————————*/
.page-template-tpl-exhibitors #main-content {
  #exhibitors {
    margin:60px 0 0;

    .exhibitor{
      margin:0 0 30px;
      a {
        display:block;

        figure {
          overflow: hidden;
        }
        img {
          -webkit-filter: grayscale(1);
          filter: grayscale(1);
          -webkit-transition:all 150ms ease-out;
          transition:all 150ms ease-out;
          -webkit-transform: rotate(8deg) scale(1.3);
  	       transform: rotate(8deg) scale(1.3);
        }

        span.name {
          font-size:18px;
          padding:5px 0 0;
          color:#222;
          display: block;
          border-top:5px solid @emphasize;
        }

        &:hover {
          text-decoration: none;

          img {
            -webkit-filter: grayscale(0);
            filter: grayscale(0);
            -webkit-transform: rotate(0) scale(1);
  	        transform: rotate(0) scale(1);
          }

        }
      }
    }
  }
}


/* ————————————————
 # 404 Error Page
————————————————————————*/
body.error404 {

  .search-form{
    margin:30px 0 0;
  }

}

/* ————————————————
 # Search Page & search form
————————————————————————*/
body.search-results {
  .hentry{margin:0 0 10px;}
  #page-content{padding:0 0 20px;}
}

form.search-form{
  .form-group{width:80%;
    input{width:100%;padding:12px 10px;display:inline-block;height:auto}
  }
  .btn{width:18%;}
}
/* ————————————————
 # Footer
————————————————————————*/
#main-footer{
  color: #fff;
  background-color: #090d18;
  padding:50px 0;
  margin:60px 0 0;

  #site-name {
    a {
      color:#fff;
      font-size:16px;
    }
    span {
      color:#8c8c8c;
    }
  }

  #footer-nav ul{
    list-style: none;
    margin:0;
    padding:0;
    float: right;

    li {
      display:inline-block;
      margin:0 10px 0;

      a {
        color:#fff;
        border-bottom:1px solid #fff;
        font-size:18px;
        &:hover{
          text-decoration:none;
          border-bottom: 0 none;
        }
      }
    }
  }

  #credits{
    margin:40px -15px 0;
    color:#666;
    font-size:12px;

    a {
      color:#666;
      text-decoration: underline;
      &:hover{
        color:#fff;
      }
    }
  }

}


/* ————————————————
 # Media queries
————————————————————————*/
@media screen and (min-width: 768px) and (max-width: 1200px) {

}


@media screen and (max-width: 768px) {

  #main-header {
    line-height:1;
    vertical-align:initial;

    #main-nav ul {
      li {
        margin:0;
        a {
          padding:15px 0;
          &:hover {
            color:@lessen;
          }
          &:after {
            display:none;
          }
        }
      }
    }

    .navbar-brand {
      padding:17px 0 0;
    }
  }

  #banner {
    height:250px;
  }

  #main-footer {

    .site-name {
      margin:0 0 20px;
      text-align:center;
    }

    .copyright {
      text-align:center;
      display:block;
    }

    .credits {
      text-align:center;
      display:block;
      float: none !important;
    }

    #footer-nav {
      ul {
        float:none;
        li {
          display:block;
          text-align:center;
          margin:0 0 10px;
        }
      }
    }

  }


}