/***********************************
            Bootstrap.css
************************************/
/***********************************
            Main.css
***********************************/
#timeline-list-container {
    max-height: 570px;
    background: #e8eaf6;
    padding: 0 !important;
    border-left: 3px solid grey;
    border-right: 3px solid grey;
    overflow: auto;
}


#tm {
    max-height: 555px;
 background: #e8eaf6;
}

#panoa {
    max-height: 575px !important;

}
#panoa canvas{
    max-height: 100% !important;



}

.throb {
    max-height: 575px;

}

/*
.tl-category-list-container.tm , .tl-category-list-container.panoa,.tl-category-list-container.throb{
    margin-left: 10px;

}*/
#tl-category-footer {
    height: 30px;
    margin-top: 0px;
    background: rgba(3,1,1,.8);
    /*margin-bottom: 20px;
  
    box-shadow: 0 -5px 10px -5px #333;
    border-top: 1px solid #ffbb0d; */
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
.tl-timeline-container {
    /*float: left;*/
    /*width: 700px;*/
    /*border-left: 1px solid #B1B1B1;*/
    /*border-right: 5px solid #B1B1B1;*/
    min-width:300px;
    padding: 0px;
    /*    height: 575px;*/
    margin: 20px 0 !important;
    /*margin: 20px 20px 20px 0px;*/
    /*  -webkit-box-shadow: 0 0px 4px rgba(0, 0, 0, 0.3) ;
      -moz-box-shadow: 0 0px 4px rgba(0, 0, 0, 0.3) ;
      box-shadow: 0 0px 4px rgba(0, 0, 0, 0.3) ;
  
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;*/
    overflow: none;
    /*background: #862A1F;*/
}

#timeline-container #timeline-cat-list {
    border-radius: 0px !important;
}
#timeline-cat-list-heading {
    font-size: 1.2em;
    text-transform: uppercase;
    height: 90px;
    letter-spacing: 1px;
    color: #FFF;
    text-align: center;
    line-height: 30px;
    /* margin-bottom: 10px;
    border-bottom: 2px solid #ffbb0d;*/
    padding: 28px;
    margin-top: 19px;
    box-shadow: 0 5px 10px -5px #333;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background: #303030;
}
ul{
    padding-left: 0px !important;
    -webkit-padding-start: 0px !important;
}

#timeline-container #timeline {
    width: 100%;
    margin-top: 0px;
}

.category_item {
    /*   height: 38px;  margin-top: 8px;*/
    width: 100%;
    list-style: none;
    /*text-decoration: none;*/
    color: #000;
    /* background: #ebebeb;font-family: 'PT Sans', sans-serif !important;*/
    font-size: 12px;
    font-weight: bold;
    transition: color 300ms ease 0s;
    text-align: left;
}

.category_item:hover {
    color: #d26700;
    text-decoration: none;
    cursor: pointer;
    font-weight: bold;
}

.category_item .item-container {
    /*font-weight: bold; padding: 8px 10px;*/
    padding: 12px;
    color: #000;
    border-bottom: 1px dotted #a8b2e7;
    text-shadow: 0px 1px 2px #fff;
    font-size: 15px;
    line-height: 22px;
}

.category_item .item-container .tl-bubble {
    background: #E2E5F2;
}
.category_item .item-container:hover {
    background: #B5B7C2;
    color: #fff;
    text-shadow: 0 1px 2px #888;
}

.category_item .item-container .tl-count {
    float: right;
}

.category_item:active {
    color: #d26700;
    font-weight:bold;
    text-decoration: none;
}

.category_item:active .item-container {
    background: #DFDFDF;
    color: #000000;
    border-bottom: 1px solid #d3d3d3;
}

.category_item:active .item-container .tl-count {
    float: right;
}

.category_item.active {
    color: #d26700;
    text-decoration: none;
}

.category_item.active .item-container .tl-bubble {
    background: #6a73b6;
}
.category_item.active .item-container {
    background: #dfdfdf;
    color: #459E3C;
}

.category_item.active .item-container .tl-count {
    float: right;
}

.tl-bubble {
    width: 12px;
    height: 12px;
    border-radius: 12px;
    margin-right: 10px;
    background: rgba(145,68,0,0.26);
    float: left;
    margin-top: 6px;
}
.category_item.active .item-container .tl-bubble{
    /*background:rgba(0, 145, 23, 0.26);*/
}
.category_item .item-container:hover .tl-bubble{
    /*background:rgba(0, 145, 23, 0.26);*/
}
#list-timeline-group {
    /*border-radius: 5px;*/
    overflow: none;
    width:100%;
    min-width: 640px;
    padding: 0px !important;
    /*  -webkit-box-shadow: 0 0 25px 5px #BDBDBD;
      -moz-box-shadow: 0 0 25px 5px #BDBDBD;
      box-shadow: 0 0 25px 5px #BDBDBD;*/
}

#list-container::-webkit-scrollbar {
    width: 3px;
    background-color: #e8e8e8;
}

#list-container::-webkit-scrollbar-thumb {
    background-color: #9e9e9e;
    border-radius: 5px;
}

#list-container::-webkit-scrollbar-thumb:hover {
    background-color: #9e9e9e;
    /*border:1px solid #333333;*/
}

#list-container::-webkit-scrollbar-thumb:active {
    background-color: #9e9e9e;
    border:1px solid #333333;
}

div.container h3 {
    cursor: pointer;
}

#map-canvas{
    height: 300px;
    width: 100%;
}

#tl-scale{
    background: url(../images/scale-black.png) repeat-x;
    height: 12px;
    width:100%;
    position: absolute;
    bottom: 0;
}
#tl-top-container{
    display:block;
    /*background:#FFFFF5;    height:575px; height:608px;*/
    width:100%;

}

.pano #tl-top-container {
    height: 446px;
}


#tl-bottom-container {
    display: block;
    width: 100%;
    height: 90px;
    overflow: hidden;
    z-index: 20;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    /*box-shadow: 0 5px 10px -5px #333;
    border-bottom: 2px solid #ffbb0d;*/
    position: relative;
    background: #303030;
}

#tl-bottom-content-draggable-container{
    display:block;
    /*background:#FFCDBD;*/
    position: absolute;
    /*background:rgba(253, 186, 99, 0.14);*/
    height:90px;
}
#tl-bottom-content-draggable{
    display:block;
    /*background:#D5F0FF;*/
    /*background:rgba(253, 186, 99, 0.14);*/
    /*  background: rgba(3, 1, 1, 0.63);*/
    height:90px;
}
#tl-bottom-content-draggable:hover{
    cursor: move;
}
#tl-bottom-content-draggable-items{
    display:block;
    /*background: rgba(3, 1, 1, 0.63);*/
    height:90px;
}
.tl-bottom-item-group{
    margin-top: 20px;
    float: left;
    width: 170px;
    height: 50px;
    /*margin-right: 15px;*/
    margin-left: 30px;
    border-radius:4px;
    cursor: pointer;
    /*background: url(../images/time-group.png);*/
    color: #FFF;
    /*  background-image: -webkit-gradient(
        linera,
        left top,
        left bottom,
        color-stop(0, #CC7701),
        color-stop(0, #FFE051),
        color-stop(1, #F59B1B),
        color-stop(1, #F59B1B),
        color-stop(1, #FFBA36)
        );
      background-image: -o-linera-gradient(bottom, #CC7701 0%, #FFE051 0%, #F59B1B 100%, #F59B1B 100%, #FFBA36 100%);
      background-image: -moz-linera-gradient(bottom, #CC7701 0%, #FFE051 0%, #F59B1B 100%, #F59B1B 100%, #FFBA36 100%);
      background-image: -webkit-linera-gradient(bottom, #CC7701 0%, #FFE051 0%, #F59B1B 100%, #F59B1B 100%, #FFBA36 100%);
      background-image: -ms-linera-gradient(bottom, #CC7701 0%, #FFE051 0%, #F59B1B 100%, #F59B1B 100%, #FFBA36 100%);
      background-image: linera-gradient(to bottom, #CC7701 0%, #FFE051 0%, #F59B1B 100%, #F59B1B 100%, #FFBA36 100%);*/


    /*  background-image: -webkit-gradient(
        linera,
        left top,
        left bottom,
        color-stop(0, #FFFFFF),
        color-stop(0, #C2C2C2),
        color-stop(1, #FFEACB),
        color-stop(1, #9C9C9C),
        color-stop(1, #949493)
        );
      background-image: -o-linera-gradient(bottom,#FFFFFF 0,#C2C2C2 0,#FFEACB 100%,#9C9C9C 100%,#949493 100%);
      background-image: -moz-linera-gradient(bottom,#FFFFFF 0,#C2C2C2 0,#FFEACB 100%,#9C9C9C 100%,#949493 100%);
      background-image: -webkit-linera-gradient(bottom,#FFFFFF 0,#C2C2C2 0,#FFEACB 100%,#9C9C9C 100%,#949493 100%);
      background-image: -ms-linera-gradient(bottom,#FFFFFF 0,#C2C2C2 0,#FFEACB 100%,#9C9C9C 100%,#949493 100%);
      background-image: linera-gradient(to bottom,#FFFFFF 0,#C2C2C2 0,#FFEACB 100%,#9C9C9C 100%,#949493 100%);*/
}
.tl-bottom-item-group:hover
{
    /*  -moz-box-shadow: 0 0 5px 5px #6F6F6F;
      -webkit-box-shadow: 0 0 5px 5px #6F6F6F;
      box-shadow: 0 0 5px 5px #6F6F6F;*/

    /*  -moz-box-shadow: 0 0 5px 5px #FFF;
      -webkit-box-shadow: 0 0 5px 5px #FFF;
      box-shadow: 0 0 5px 5px #FFF;*/
    /*background: url(../images/time-group-ad-selected.png);*/
}



/*.tl-bottom-item-group-selected
{

    -moz-box-shadow: 0 0 5px 5px #6F6F6F;
    -webkit-box-shadow: 0 0 5px 5px #6F6F6F;
    box-shadow: 0 0 5px 5px #6F6F6F;

    -moz-box-shadow: 0 0 5px 5px #FFF;
    -webkit-box-shadow: 0 0 5px 5px #FFF;
    box-shadow: 0 0 5px 5px #FFF;
}*/
.tl-bottom-item-group.era-ad{
    background: url(../images/time-group-ad.png);
}
.tl-bottom-item-group.era-ad:hover, .era-ad.tl-bottom-item-group-selected {
    background: url(../images/time-group-ad-selected.png);
}
.tl-bottom-item-group.era-bc{
    background: url(../images/time-group-bc.png);
}
.tl-bottom-item-group.era-bc:hover, .era-bc.tl-bottom-item-group-selected {
    background: url(../images/time-group-bc-selected.png);
}
.tl-bottom-item-group .tl-bottom-item-thumb{
    float: left;
    height: 40px;
    width: 40px;
    margin-top:-4px;
}


.tl-bottom-item-period
{
    width:100%;
    text-align: center;
    display: block;
    margin:15px auto 0 auto;
    font-weight:bold;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    color: #FFF;
}

.tl-bottom-item-count
{
    display: block;
    position:absolute;
    margin-left:155px;
    margin-top:-45px;
    width:30px;
    height:30px;
    /*background:#000000;*/
    background: #B36161;
    border-radius: 50%;
    text-align:center;
    font-weight:bold;
    font-size:12px;

    line-height:29px;
    color:#FFFFFF;
    border: 2px solid #AAA;
    /*  background-image: -webkit-gradient(
        linera,
        left top,
        left bottom,
        color-stop(0.35, #47474A),
        color-stop(1, #1A1A19),
        color-stop(1, #2C2C2E)
        );
      background-image: -o-linera-gradient(bottom, #47474A 35%, #1A1A19 100%, #2C2C2E 100%);
      background-image: -moz-linera-gradient(bottom, #47474A 35%, #1A1A19 100%, #2C2C2E 100%);
      background-image: -webkit-linera-gradient(bottom, #47474A 35%, #1A1A19 100%, #2C2C2E 100%);
      background-image: -ms-linera-gradient(bottom, #47474A 35%, #1A1A19 100%, #2C2C2E 100%);
      background-image: linera-gradient(to bottom, #47474A 35%, #1A1A19 100%, #2C2C2E 100%);*/

}

#tl-slide-container {
    display: block;
    padding: 0px 0 1px;
    margin: 0 auto;
    overflow: hidden;
    /*    background: #E8EAF5;  height: 575px;   */
}

#3dobjects #tl-slide-container, #3dobjects #tl-top-container {
    height:88%; /*    height: auto !important; height:535px !important;*/
}


.tl-slide-item-group {
    display: block;
    margin: 0 auto;
    /*   height: 525px;   width: 95%;*/
    height: 100%;
    background: #E8EAF5;
    overflow: hidden;
    text-align: center;
}

.tl-slide-item-media {
    display: block;
    margin: 20px auto 0;
    /*  height: 100%;width: 600px;background: #fffff5;*/
    text-align: center;
}

.tl-slide-item-media img{
    /*padding: 5px;*/
    /*background: #222;*/
    /*border: 1px solid #000;*/
    /*border-radius: 8px;*/
    height: 100%;
    /*width: 100%;*/
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.tl-slide-item-media img:hover{
    /*  width: 102%;
      -webkit-transition: .5s ease-in-out;
      -moz-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out;*/
}
.tl-slide-item-media:hover{
    cursor: pointer;
}
.tl-slide-item-text-group{
    display: block;
    /*float: left;*/
    /*max-width: 45%;*/
    /*height: 225px;*/
    overflow: hidden;
    /*padding:5px 30px 5px 0;*/
    /*text-align:justify;*/
}
.tl-slide-item-title{
    color: #000;
    font-size: 18px;
    font-weight: bold;
    /*text-align: left;*/
    text-align: center;
    margin: 5px 0;
}
.tl-slide-item-date{
    color: #C43700;
    font-size: 15px;
    font-weight: normal;
    margin: 6px 0;
}
.tl-slide-item-description{
    color: #423F3E;
    font-size: 14px;
    font-weight: normal;
    padding:5px 30px;
}
#tl-slide-details{
    width: 100%;
}
#tl-slide-details div{
    text-align: left;
    /*font-size: 20px;*/
}
.tl-slide-arrow{
    /*display: none;*/
    z-index: 999;
    height:64px;
    width: 64px;
    cursor: pointer;
    transform: translateY(-50%);
    top: 270px;
}
@media (max-width: 770.98px) {
    /*  #tl-slide-container {
        height: auto !important;
        max-height: 520px !important;
      } */

    /*  .tl-slide-item-text-group{
          max-height: 530px;
        overflow: auto;
       
    }*/



}
@media (max-width: 767.98px){
    .tl-slide-arrow{
        top: 38%;
    }

    .tl-slide-item-text-group{
        height: 560px;
        overflow: auto;

    }
}
@media (max-width: 499px){
    .tl-slide-arrow{
        top: 40%;
    }

    #timeline-list-container {
        height: 100%;
        overflow:auto;

    }
    /*#tl-top-container {
      max-height: 500px;
    }
    .tl-timeline-container {
      width: 100%;
      min-width: 100px; 
       max-height: 530px;
    }*/



}
#tl-left-arrow{
    /*background: url(../images/arrow_left.png);*/
    /*background: url(../images/prev-time.png);*/
    /*background: url(../images/arrow-left-bc.png);*/
    background: url(../images/nav-arrow-left.png);
    background-repeat: no-repeat;
    position: absolute;
    /*top: 140px;*/
    left: 10px;
}
#tl-left-arrow:hover{

    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
#tl-right-arrow{
    /*background: url(../images/arrow_right.png);*/
    /*background: url(../images/next-time.png);*/
    /*background: url(../images/arrow-right-add.png);*/
    background: url(../images/nav-arrow-right.png);
    background-repeat: no-repeat;
    position: absolute;
    /*top: 140px;*/
    right: 10px;
}
#tl-right-arrow:hover{

    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

#tl-slide-upper-heading {
    width:100%;
    height:25px;
}
#tl-slide-upper-heading-span {
    width:300px;
    /*width: 100%;*/
    height:25px;
    margin:0 auto;
    color:#000000;
    text-align:center;
    font-weight:bold;
    line-height: 25px;
    /*background: #F7D3AC;*/
    /*background: rgba(247, 211, 172, 0.5);*/
    background: #fbe3e0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    display:block;
}

#popup-image-container, #popup-details-container {
    float: left !important;
    box-sizing: border-box;
}
#popup-details-container{
    margin-left: 20px;
}
#details-popup-container{
    box-sizing: border-box;
    padding: 2px;
}

/* Toast: hidden by default */
/* centred, responsive toast */
#tl-toast-message{
    display:none;
    position:absolute;             /* or fixed if you want it viewport‑pinned */
    left:50%;                      /* centre point */
    bottom:15px;
    transform:translateX(-50%);    /* pull back half its own width */

    min-width:150px;
    max-width:calc(100vw - 40px);  /* never overflow phones */
    padding:5px 5px;
    line-height:26px;

    border:2px solid #890000;
    background:#fff;
    color:#890000;
    font-weight:bold;
    border-radius:15px;
    text-align:center;
    z-index:10771;
    box-sizing:border-box;
}


#tl-div-count-heading {
    height: 30px;
    width: auto;
    text-align: center;
    background: rgba(3,1,1,0.8);
    padding: 5px;
    /*margin-top: 7px;  
    box-shadow: 0 -5px 10px -5px #333;
    border-top: 1px solid #ffbb0d; */
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
#tl-slide-count{
    float: right;
    display: block;
    padding: 0 20px;
    float: left;
    text-align: left;
    height: 20px;
    color: #E06F43;
    line-height: 20px;
    font-weight: normal;
    font-size: 14px;
}
#tl-slide-heading{
    display: block;
    width: auto;
    padding: 0 20px;
    margin: 0 auto;
    text-align: center;
    height: 20px;
    color: #FFF;
    line-height: 20px;
    font-weight: normal;
    font-size: 14px;
}

/*.tl-bottom-nav{
  z-index: 999;
  height:26px;
  width: 26px;
  cursor: pointer;
}

.tl-bottom-nav-right{
  background: url(../images/nav-bottom-arrow-right.png);
  background-repeat: no-repeat;
  position: absolute;
  top: 32px;
  right: 5px;
}
.tl-bottom-nav-left{
  background: url(../images/nav-bottom-arrow-left.png);
  background-repeat: no-repeat;
  position: absolute;
  top: 32px;
  left: 5px;
}*/

.scrollbar {
    /*  margin: 18px 0 1px;background: #cba69f;*/
    height: 5px;
    line-height: 0;

}
.category_item.active .item-container {
    background: #a8b2e7;
    color: #000000;
}
#timeline-catlistheading {
    font-size: 1.2em;
    text-transform: uppercase;
    height: 90px;
    letter-spacing: 1px;
    color: #FFF;
    text-align: center;
    line-height: 30px;
    padding: 15px;
    margin-top: 20px;
    box-shadow: 0 5px 10px -5px #333;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background: #303030;
}
.timeline-catlistheading {
    font-size: 1.2em;
    text-transform: uppercase;
    height: 90px;
    letter-spacing: 1px;
    color: #FFF;
    text-align: center;
    line-height: 30px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}


@media (max-width: 767.98px) {
    #tl-left-arrow ,#tl-right-arrow {
        width: 45px;
    }

    #tl-left-arrow {
        background-position: left center;
        left: 0px;
    }

    #tl-right-arrow {
        background-position: right center;
        right: 0px;
    }
    .tl-timeline-container {
        min-width:100px;
        /*    height: 300px;*/
    }
    /*#tl-top-container {
      height: auto;
    }*/

    #list-timeline-group {
        min-width: 180px !important;
        width: 100% !important;
    }

    /*  .tl-slide-item-group {
        height: auto !important;
    
      }
    #timeline-list-container {
      height: 250px !important;
      overflow-y: auto;
    
    }#model canvas {
            max-width: 100% !important;
            height: 100% !important;
            max-height:500px;
        }
        
        @media (max-width: 767.98px) {
      #model canvas {
        max-width: 100% !important;
        height: 500px !important;
        max-height: 500px;
      }
    }*/


    #timeline-catlistheading {
        padding: 5px;
        margin-top: 10px;

    }
    /*.3dobj>canvas{
          max-height: 230px !important;
     max-width: 100% !important;
        
    }
      .tl-slide-item-media {
        height: 250px !important;
        max-width: 100% !important;
      }*/
    #timeline-cat-list-heading {
        font-size: 1.2em;
        height: 50px !important;
        padding: 11px !important;
        margin-top: 20px;
    }

    #list-timeline-group {
        min-width: 140px;
    }

    .tl-slide-item-media img {
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
    }

    /*  #tl-slide-container {
        height: auto !important;max-height: 420px !important;
      }*/
}


/*.3dobj>canvas{
      max-height: 230px !important;
 max-width: 100% !important;
    
}
  .tl-slide-item-media {
    height: 250px !important;
    max-width: 100% !important;
  }*/
#timeline-cat-list-heading {
    font-size: 1.2em;
    height: 50px !important;
    padding: 11px !important;
    margin-top: 20px;
}

#list-timeline-group {
    min-width: 140px;

}

.tl-slide-item-media img {
    height: 98% !important;
    max-width: 74% !important;
}

/*  #tl-slide-container {
    height: auto !important;
  }*/


/*#timeline-catlistheading {   
     padding: 5px; 
    margin-top: 10px;  
}*/

#tl-slide-container,
#tl-slide-container .3dobj,
#tl-slide-container #model {
    height: 100%;
}

#3dobjects #tl-slide-container canvas {
    max-width: 100% !important;
    min-height: 497px;
    /*  max-height: 505px; max-height: 655px;height: auto !important;*/
    display: block;
    margin: 0 auto;
}
.record-counter {
    font-size: 0.9rem;
    color: #555;

    padding: 2px 10px;
    border-radius: 5px;
    display: inline-block;

    margin: 5px 0;
}