.wrapper {
  max-width: 860px;
  margin: 0 auto;
}
.story-box.testimonials {
  padding-top: 30px;
  padding-bottom: 150px;
}
.story-titlebox {
  padding-bottom: 20px;
  padding-top: 10px;
}
.story-box {
  height: auto;
}
.story-box {
  margin-top: 0;
  background-image: url(../img/userhero-bannerv2.jpg);
  background-position: bottom center;
  background-size: cover;
}
.otion-butbox {
  margin-top: -120px; 
}
.brand-tab {
  margin-bottom: 2rem;
}
.brand-tab li.current a {
  background-color: #fff;
  border: 1px solid #c0c6cf;
  color: #4c5768;

}
.brand-tab li {
  display: inline-block;
  vertical-align: top;
  width: 180px;
  height: 50px;
  font-size: 1rem;
  line-height: 50px;
  background-color: #f2f4f5;
  margin: 0 9px;
}
.brand-tab li a {
  display: block;
}
@media (max-width: 520px) {
  .brand-tab li {
    width: 100px;
    margin: 0 2px;
  }
}
@media (max-width: 320px) {
  .brand-tab li {
    font-size: .85rem;
    width: 80px;
    margin: 0 2px;
  }
}
@media (max-width: 800px) {
  main .container {
    padding-right: 30px;
    padding-left: 30px;
  }
}
#conference-timeline .timeline-article p {
  font-size: 1rem;
}
#conference-timeline .timeline-article {
  margin: 0;
  height: auto;
  padding-top: 10px;
  padding-bottom: 20px;
}
.otion-butbox .shape-text h5 {
  margin-bottom: 20px
}
#conference-timeline .conference-timeline-content {
  padding-top: 30px;
}
.otion-butbox .shape-text h5 {
  margin-top: 1rem;
}
.story-wrap {
  margin-top:0px;
  background-image: url(../img/userhero-bannerv1.jpg);
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  
  height: auto;
}
.otion-butbox .behavior-wrap {
  height: auto;
  padding-bottom: 8rem;
  background-position: left bottom;
  background-size: contain;
}
.otion-butbox .story-wrap {
  height: auto;
  padding-bottom: 10rem;
}
.container shape-text {

}
.otion-butbox .shape-text .behavior-text {
  margin-top: 180px;
}
.modal__details {
  background-size: contain;
  background-repeat: no-repeat;
}
.behavior .modal__details {
  height: auto!important;
}
.behavior .modal-box {
  position: relative;
}
.behavior .modal-box .link-2 {
  position: absolute;
  right: 0;
  top: 0;
}
.behavior-text .right ul li {
  padding: 0;
}
.behavior-text .right ul li a {
  display: block;
  padding: 14px 25px;
}
.behavior.modal-container {
  background-color: rgba(255,255,255,.75);
}
@media (max-width: 767px) {
  #conference-timeline .conference-timeline-content {
    padding-top: 20px;
    padding-bottom: 30px;
  }
  
  main {
    padding-bottom: 0;
  }
  .story-box.testimonials {
    padding-bottom: 90px;
  }
  .otion-butbox .shape-text {
    width: 100%;
    padding: 0
  }
  .history-wrap  {
    padding: 0
  }
  .shape-inner, .shape-outer {
    width: 90px;
    height: 90px;
    margin-bottom: 0;
  }
  .otion-butbox .container {
    padding-right: 0;
    padding-left: 0;
  }
  .otion-butbox .btn-story, .otion-butbox .btn-history, .otion-butbox .btn-behavior {
    padding: 10px .5rem;
  }
  .otion-butbox .btn-story span, .otion-butbox .btn-history span, .otion-butbox .btn-behavior span {
    font-size: .85rem;
  }
  .otion-butbox {
    margin-top: -50px;
  }
  .otion-butbox .story-wrap{
    margin: 0;
  }
  .otion-butbox {
    margin-bottom: 0;
  }
  .otion-butbox .shape-text .behavior-text {
    margin-top: 150px;
  }
  .behavior-text .left h5 {
    font-size: 1.5rem;
  }
  .behavior-text .left {
    padding: 0 3% 0 10%;
    width: 60%;
  }
  .behavior-text .right {
    width: 40%;
  }
  .behavior-text .right ul li a{
    font-size: .8rem;
    padding: 12px;
  }
}
@media (max-width: 320px) {
  .shape-inner, .shape-outer {
    width: 80px;
    height: 80px;
    margin-bottom: 0;
  }
  .otion-butbox .btn-story, .otion-butbox .btn-history, .otion-butbox .btn-behavior {
    padding: 10px .1rem;
  }
}
@media (max-width: 480px) {
  #conference-timeline .gg-sen {
    display: none;
  }
  details {
    margin-bottom: 2.5rem;
  }
  #conference-timeline .timeline-article.lg {
    height: 90px;
  }
  #conference-timeline .timeline-article.xlg {
    height: 110px;
  }
  #conference-timeline .timeline-article p {
    font-size: .875rem;
  }
  .timeline-article .content-left, .timeline-article .content-right {
    width: auto;
  }
  #conference-timeline .conference-center-line {
    left: 10.5%;
  }
  .timeline-article:nth-child(odd) {
  }
  .timeline-article {
    position: relative;
  }
  .timeline-article .meta-date {
    left: 3%;
  }
  .timeline-article .content-left-right span, .timeline-article .content-right-left span {
    width: 56px;
  }
  .timeline-article .content-right-left {
    display: inline-block;
  }
  .timeline-article .content-left-right, .timeline-article .content-right-left {
    margin-left: 0;
    float: left;
    position: relative;
    z-index: 2;
    width: 60px;
  }
  
  .timeline-article .content-left-right {
    /* display: none; */
  }
  .timeline-article .content-left, .timeline-article .content-right {
    position: absolute;
    left: 73px;
  }
  .timeline-article .content-left-right span, .timeline-article .content-right-left span {
    font-size: 1rem;
    padding: 0 12px;
    height: auto;
    
  }
  .timeline-article:nth-child(even) .content-left-container {
    display: none;
  }
  .timeline-article .content-left-container, .timeline-article .content-right-container {
    max-width: none;
  }
  .timeline-article .content-left-right span.senn {
    background-color: #fff;
  }
  .timeline-article .content-right-left span.senn {
    display: none;
  }
  .otion-butbox .behavior-wrap {
    padding-bottom: 5rem;
  }
}


