/*==================================================

    Project: TIME AND SPACE DIED YESTERDAY
    Version: 1.0
    Last change: 13/11/18
    Author : Agile Leaf UI/UX TEAM

    /**
    * Table of Contents :
   *1.0 Main container css
        *1.1 .Main container h3 css
        *1.2 .Main container a css
    *2.0 Page repository-main css
        *2.1 .repository-main-container
        *2.2 .main-heading h4
        *2.3 .repository-main-container a
        *2.4 .main-content
        *2.5 #main-content
        *2.5 .main-content p
    *3.0 Page repository-1a css
        *3.1.repository-1a-container
            *3.1.main-heading
            *3.2.main-heading h4
            *3.3.repository-1a-container a
            *3.4#tags
            *3.5#text-content {
            *3.6.main-overlay-content
            *3.7.main-overlay-content img
            *3.8.main-overlay-content p
            *3.9.overlay-text-content
            *3.10.overlay-text-content p
            *3.11.right-image
            *3.12 #right-image
            *3.13 #second-image
            *3.14.second-image
            *3.15.second-image img
            *3.16.second-image img.top:hover
            *3.17#thrid-image
            *3.18.third-image
            *3.19.third-image img
            *3.20.third-image img.top:hover
            *3.21#bottom-video
            *3.22.bottom-video{
            *3.23#bottom-number
            *3.24.bottom-number
            *3.25.bottom-number span
            *3.26.bottom-number span.active
            *3.27#bottom-arrows
            *3.28.bottom-arrows
            *3.29.bottom-arrows img
            *3.30.bottom-arrows img.top:hover
            *3.31.bottom-arrows img.gray

    *4.0 Page repository-1a css
    *5.0 responsive css

==================================================*/
/*
    ==============================================================
     Main container css
    ==============================================================
*/

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600');

.no-padding {
    padding: 0px !important;
}
#main-page{
    animation-delay: 2s;
}
.main-container {
    display: flex;
    width: 100vw;
    height: 100vh;
    align-items: center;
    justify-content: center;
}

.main-container h3 {

    font-weight: 600;
    font-size: 19px;
    padding-top: 0px;
    width: 100%;
    margin-top: 0px;
    font-family: 'Arial';
    text-align: center;
    padding-left: 10px;
}

.main-container h3 a {
    color: #fff;
    text-decoration: none;
}
.main-container h3 span:nth-of-type(1) {
    margin-right: 19px;
    letter-spacing: 20px;
}
.main-container h3 span:nth-of-type(2) {
    margin-right: 27px;
    letter-spacing: 20px;
}
.main-container h3 span:nth-of-type(3) {
    margin-right: 22px;
    letter-spacing: 20px;
}
.main-container h3 span:nth-of-type(4) {
    margin-right: 22px;
    letter-spacing: 20px;
}
.main-container h3 span:nth-of-type(5) {
    margin-right: 0px;
    letter-spacing: 20px;
}
img{
    cursor:context-menu;
}

/*
 *  STYLE 8
 */


/*
    ==============================================================
     Page repository-1a css
    ==============================================================
*/
.repository-main-container {
    background-image: url("./assets/background.jpg");
    background-position: 0px 0px;
    background-repeat: no-repeat;
    animation-delay: 1s;
    margin-top: 0px;
}

.main-heading {
    background-color: rgba(225, 225, 225, .9);
    display: flex;
    align-items: center;
    justify-content: center;
}

.main-heading h4 {
    margin-bottom: 0px;
    font-size: 19px;
    font-weight: 	600;
}
.main-heading h4 span:nth-of-type(1) {
    letter-spacing: 20px;

    padding-left: 10px;
}
.main-heading h4 span:nth-of-type(2){
    letter-spacing: 20px;
    margin-left:23px ;
}
.main-heading h4 span:nth-of-type(3){
    letter-spacing: 20px;
    margin-left: 32px;
}
.main-heading h4 span:nth-of-type(4){
    letter-spacing: 20px;
    margin-left: 26px;
}
.main-heading h4 span:nth-of-type(5){
    letter-spacing: 20px;
    margin-left: 13px;
}
.repository-main-container a {
    text-decoration: none;
}

.main-content {
    /*background: rgba(225, 225, 225, .9);*/
    /*padding: 31px 124px 31px 130px;*/
    /*margin: 30px 162px 30px 160px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    height: 683px;
}

#main-content {
    animation-delay: 2s;
}
@-webkit-keyframes fadeIn {
    0% {
        opacity:1;
    }
    25% {
        opacity:0;
    }
    92% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
.main-content p {
    font-size: 12px;
    font-weight: 500;
    line-height: 21px;
    letter-spacing: .7px;
}

/*
    ==============================================================
     Page repository-1a css
    ==============================================================
*/
.repository-1a-container {
    background-image: url("./assets/background.jpg");
    background-position: 0 0px;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    width: auto;
    animation-delay: 1s;
}

.repository-1a-container a {
    text-decoration: none;
}

#tags {
    animation-delay: 3s;
}
#tags-1a {
    animation-delay: 3s;
}
#tags-2a {
    animation-delay: 3s;
}


#text-content {
    animation-delay: 3s;
}

.main-overlay-content {
    position: relative;
    padding: 0px 0px;
    margin: 0px 0px;
}
.main-overlay-content {
    height: 768px;
}
.main-overlay-content img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.main-overlay-content img.tags-line {
    position: absolute;
    bottom: 23px;
    right: 2px;
    z-index: 0;
}

.main-overlay-content p {
    font-size: 16px;
    font-weight: 400;
}

.overlay-text-content {
    background: rgba(255, 255, 255, 0.83);
    /*padding: 9px 9px 9px 9px;*/
    position: absolute;
    bottom: 43px;
    right: 21px;
    width: 234px;
    height: 332px;
    overflow-y: scroll;
    z-index: 1;
    text-align: left;
    animation-delay: 8s;
}

#repository-1a .overlay-text-content{
    animation-delay: 13s;
}
.overlay-text-content p {
    font-size: 12px;
    font-weight: 500;
    color: #fb0000;
    margin-bottom: 0px;
    word-spacing: 0.5px;
    line-height: 19px;
    letter-spacing: 0px;
    font-family: "Open Sans";
    padding: 5px 9px 5px 9px;
}

.right-image {
    position: absolute;
    top: 146px;
    right: 21px;
    width: 250px;
    height: 187px;
}
#repository-1a #right-image {
    animation-delay:9s;
}
#right-image {
    animation-delay: 4s;
}
#repository-1a #second-image{
    animation-delay:10s;
}
#second-image {
    animation-delay: 5s;

}

.second-image {
    position: absolute;
    position: absolute;
    top: 36px;
    right: 351px;
    width: 249px;
    height: 188px;
}
#repository-2g .second-image {
    position: absolute;
    top: 3px;
    right: 361px;
    width: 276px;
    height: 231px;
}

#repository-1a .second-image img {
    position: absolute;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

#repository-1a .second-image img.top:hover {
    opacity: 0;
}
#repository-1a #third-image {
    animation-delay:11s;
}
#third-image {
    animation-delay: 6s;
}

.third-image {
    position: absolute;
    top: 77px;
    left: 69px;
    width: 250px;
    height: 189px;
}
#repository-2g .third-image {
    position: absolute;
    top: 50px;
    left: 33px;
    width: 278px;
    height: 206px;
}

.third-image img {
    position: absolute;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.third-image img.top:hover {
    opacity: 0;
}
#repository-1a #bottom-video {
    animation-delay:12s;
}
#bottom-video {
    animation-delay: 7s;
}

.bottom-video {
    position: absolute;
    bottom: 117px;
    left: 21px;
    width: 250px;
    height: 140px;
}
#repository-2b .bottom-video {
    width: 274px;
    height: 207px;
}
#repository-2c .bottom-video {
    width: 274px;
    height: 207px;
}
#repository-2d .bottom-video {
    width: 274px;
    height: 207px;
}
#repository-2e .bottom-video {
    width: 274px;
    height: 207px;
}
#repository-2g .bottom-video {
    width: 275px;
    height: 210px;
}
#repository-1a #bottom-number{
    animation-delay: 10s;
}
#bottom-number {
    animation-delay: 8s;
}

.bottom-number {
    position: absolute;
    bottom: 40px;
    left: 21px;
    width: 119px;
    height: 48px;
}

.bottom-number a {
    color: #000;
    font-size: 40px;
    font-weight: bold;
    margin-right: 18px;
    font-family: arial;
}
/*.bottom-number a:hover{*/
/*color:#fd0002;*/
/*}*/

#repository-1a .bottom-number a.active {
    color:#fd0002;
}
#repository-1a .bottom-number a.active:hover {
    color:#fd0002;
}
#repository-1a .bottom-number a:hover{
    color:#fd0002;
}
#repository-1b .bottom-number a.active {
    color:#fd0002;
    cursor: context-menu;
}
#repository-1b .bottom-number a:hover{
    color:#fd0002;
}
#repository-1b .bottom-number a.no-hover:hover{
    color: #000;
    cursor: context-menu;
}
a.no-hover:hover{
    color: #000;
    cursor: context-menu;
}
#repository-2a .bottom-number a.active {
    color:#fd0002;
}
#repository-2a .bottom-number a:hover{
    color:#fd0002;
}
#repository-2b .bottom-number a.active {
    color:#fd0002;
}
#repository-2b .bottom-number a:hover{
    color:#fd0002;
}
#repository-2c .bottom-number a.active {
    color:#fd0002;
}
#repository-2c .bottom-number a:hover{
    color:#fd0002;
}
#repository-2d .bottom-number a.active {
    color:#fd0002;
}
#repository-2d .bottom-number a:hover{
    color:#fd0002;
}
#repository-2e .bottom-number a.active {
    color:#fd0002;
}
#repository-2e .bottom-number a:hover{
    color:#fd0002;
}
#repository-2g .bottom-number a.active {
    color:#fd0002;
}
#repository-2g .bottom-number a:hover{
    color:#fd0002;
}
#repository-2f .bottom-number a.active {
    color:#fd0002;
}
#repository-2f .bottom-number a:hover{
    color:#fd0002;
}
#repository-1a #bottom-arrows{
    animation-delay: 10s;
}
#bottom-arrows {
    animation-delay: 9s;
}

.bottom-arrows {
    position: absolute;
    bottom: 33px;
    left: 235px;
}

.bottom-arrows img {
    width: 50px;
    height: 50px;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.bottom-arrows img.top:hover {
    opacity: 0;
    cursor: pointer;
}

.bottom-arrows img.gray {
    left: -40px;
}

/*
    ==============================================================
     Page repository-1b css
    ==============================================================
*/

.main-overlay-content-1b img {
    position: absolute;
    bottom: 0px;
    right: -16px;
    width: 100%;
    height: 100%;
}

#text-content-1b {
    animation-delay: 1s;
}

#right-image-1b {
    animation-delay: 13s;
}

.right-image-1b {
    position: absolute;
    top: 136px;
    right: 3px;
    width: 297px;
    height: 198px;
}

#tags-lines {
    animation-delay: 3s;
}

#second-image-1b {
    animation-delay: 14s;

}

.second-image-1b {
    position: absolute;
    top: 35px;
    right: 353px;
    width: 251px;
    height: 188px;
}

.second-image-1b img {
    position: absolute;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.second-image-1b img.top:hover {
    opacity: 0;
}

#third-image-1b {
    animation-delay: 15s;
}

.third-image-1b {
    position: absolute;
    top: 76px;
    left: 68px;
    width: 249px;
    height: 187px;
}

.third-image-1b img {
    position: absolute;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.third-image-1b img.top:hover {
    opacity: 0;
    cursor: pointer;
}

#bottom-video-1b {
    animation-delay: 16s;
}

.bottom-video-1b {
    position: absolute;
    bottom: 116px;
    left: 17px;
    width: 250px;
    height: 140px;
}
.bottom-video-1b img{
    cursor: pointer;
}

#bottom-number-1b {
    animation-delay: 17s;
}

.bottom-number-1b {
    position: absolute;
    bottom: -100px;
    left: -25px;
    width: 250px;
    height: 140px;
}

.bottom-number-1b span {
    color: #000;
    font-size: 40px;
    font-weight: bold;
    margin-right: 10px;
}

.bottom-number-1b span.active {
    color:#fd0002;
}

#bottom-arrows-1b {
    animation-delay: 18s;
}
.back-anchor{
    position: absolute;
    left: -92px;
    bottom: 0px;
}
.bottom-arrows-1b {
    position: absolute;
    bottom: -61px;
    left: 242px;
    /* width: 40px; */
    /* height: 1px; */
}

.bottom-arrows-1b img {
    position: absolute;
    bottom: 94px;
    right: 0px;
    width: 50px;
    height: 50px;
    left: 45px;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.bottom-arrows-1b img.top:hover {
    opacity: 0;
}

.bottom-arrows-1b img.gray {
    left: 0px;
}
#repository-1b .overlay-text-content{
    animation-delay:17s;
}
/*
    ==============================================================
     Page repository-2a css
    ==============================================================
*/

#repository-2a .right-image, #repository-2b .right-image, #repository-2c .right-image, #repository-2d .right-image, #repository-2e .right-image, #repository-2f .right-image, #repository-2g .right-image {
    position: absolute;
    top: 24PX;
    right: 21px;
    width: 290px;
    height: 285px;
}

#repository-2a #right-image {
    animation-delay: 4s;
}

#repository-2a #second-image {
    animation-delay: 5s;

}

#repository-2a .second-image,
#repository-2b .second-image,
#repository-2c .second-image,
#repository-2d .second-image,
#repository-2e .second-image,
#repository-2f .second-image,
#repository-2g .second-image {

    position: absolute;

    top: 35px;

    right: 351px;

    width: 250px;

    height: 188px;
}

#repository-2a #third-image {
    animation-delay: 6s;
}

#repository-2a .third-image,
#repository-2b .third-image,
#repository-2c .third-image,
#repository-2d .third-image,
#repository-2e .third-image,
#repository-2f .third-image,
#repository-2g .third-image {
    position: absolute;
    top: 77px;
    left: 69px;
    width: 251px;
    height: 188px;
}

#repository-2a #bottom-video {
    animation-delay: 7s;
}

#repository-2a .bottom-video,
#repository-2b .bottom-video,
#repository-2c .bottom-video,
#repository-2d .bottom-video,
#repository-2e .bottom-video,
#repository-2f .bottom-video,
#repository-2g .bottom-video {
    position: absolute;
    bottom: 117px;
    left: 18px;
    width: 250px;
    height: 188px;
}

/*
    ==============================================================
     Page repository-2f css
    ==============================================================
*/


#repository-2f audio, #repository-3a audio{
    opacity: 0;
    visibility: hidden;
    display: none;
}
.tooltip .arrow{
    display: none;
}
/*
*/
#repository-2f .third-image img {
    position: absolute;
    left: 0;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

#repository-2f .third-image img.top:hover {
    opacity: 0;
}
/*
    ==============================================================
     Page repository-3a css
    ==============================================================
*/
#repository-3a .overlay-text-content{
    animation-delay: 8s;
}
#repository-3a .overlay-text-content p {
    line-height: 19px;
}
#repository-3a .right-image {
    top: 25px;
    right: 21px;
    width: 290px;
    height: 285px;
}

#repository-3a #right-image {
    animation-delay: 4s;
}

#repository-3a .second-image {
    top: 37px;
    right: 351px;
    width: 251px;
    height: 167px;
    -webkit-animation-delay: 5s;
    -moz-animation-delay: 5s;
    -o-animation-delay: 5s;
    animation-delay: 5s;
}
#slideshow img{
    position: absolute;
    top: 10em;
    left: 0;
    width: 100%;
}
#repository-3a .second-image img, #repository-3a .third-image img, #repository-3a .bottom-video img {
    position: relative;
}


.carousel-fade .carousel-item {
    opacity: 0;
    transition-duration: 2s;
    transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
    opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
    opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
    transform: translateX(0);
    transform: translate3d(0, 0, 0);
}

#repository-3a .third-image {
    position: absolute;
    top: 77px;
    left: 68px;
    width: 250px;
    height: 187px;
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    animation-delay: 6s
}


#repository-3a .bottom-video {
    position: absolute;
    bottom: 138px;
    left: 21px;
    width: 250px;
    height: 190px;
    -webkit-animation-delay: 7s;
    -moz-animation-delay: 7s;
    -o-animation-delay: 7s;
    animation-delay: 7s;
}

#repository-3a .bottom-video .slider {
    max-width: 251px;
    height: 190px;
    position: relative;
}

#repository-3a .custom-tooltip6 {
    left: 374px;
    position: relative;
    top: 501px;
    color:#fd0002;
    font-size: 10px;
    border: 2px solid transparent;
    padding: 8px;
    z-index: 60;
}
#repository-3a .custom-tooltip6::before {
    border: 3px solid #fd0002;
    padding: 8px;
}
#repository-3a .custom-tooltip6:hover{
    border: 2px solid transparent;
    padding: 8px;
    cursor: context-menu;
}
#repository-3a .bottom-number a.active {
    color:#fd0002;
}
#repository-3a .bottom-number a.active:hover {
    color:#fd0002;
    cursor: context-menu;
}
#repository-3a .bottom-number a:hover {
    color:#fd0002;
}
#repository-3a #bottom-number {
    animation-delay: 6s;
}


/*tooltip*/
.tooltip{
    z-index: 1;
    animation-delay: 5s;

}
.tooltip-inner{

    padding:1px;
    color:#fd0002;
    text-align:left;
    font-weight:700;
    background: rgba(225,225,225, .8);
    width: auto;
    height: 32px;
    border-radius: 0px;
    margin-left: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: static;
    z-index: 1;
    animation-delay: 5s;

}
.tooltip.show {

    opacity: .9;
    padding: 0px;

}
#custom-tooltip1, #custom-tooltip2, #custom-tooltip3, #custom-tooltip4, #custom-tooltip5, #custom-tooltip6,#custom-tooltip7{
    visibility: visible;
    transition: .5ms all ease;
    transition-delay: 3.2s;
    -webkit-animation-name: dropHeader;
    -moz-animation-name: dropHeader;
    -o-animation-name: dropHeader;
    animation-name: dropHeader;
    animation-delay: 3.2s;



}
@keyframes dropHeader {
    0%   { opacity: 0; }
    99%   { opacity: 0; }
    100% { opacity: 1; }
}

@-webkit-keyframes dropHeader {
    0%   { opacity: 0; }
    99%   { opacity: 0; }
    100% { opacity: 1; }
}
.tooltip-inner p{
    margin-bottom: 0px;
    font-size: 14px;
    line-height: 18px;

}
.custom-tooltip1{
    left: 290px;
    position: relative;
    top: 352px;
    color:#fd0002;
    padding: 8px;
    animation-delay: 1s;
    border: 3px solid transparent;
    font-size: 10px;
    z-index: 10;
}
#repository-2e .custom-tooltip1::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2e .custom-tooltip1{
    left: 279px;

}
#repository-2e .custom-tooltip2{
    left: 312px;

}
#repository-2e .custom-tooltip1:hover{
    border: 3px solid transparent;
    padding: 8px;

}
.custom-tooltip1:hover, .custom-tooltip2:hover, .custom-tooltip3:hover, .custom-tooltip4:hover, .custom-tooltip5:hover, .custom-tooltip6:hover, .custom-tooltip7:hover{
    border: 3px solid #fd0002;
    padding: 8px;
}
.custom-tooltip2{
    left: 324px;
    position: relative;
    top: 393px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 20;
}
#repository-2a .custom-tooltip2::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2a .custom-tooltip2:hover{
    border: 3px solid transparent;
    padding: 8px;

}
#repository-2g .custom-tooltip2, #repository-2d .custom-tooltip2,  #repository-2c .custom-tooltip2, #repository-2f .custom-tooltip2, #repository-2b .custom-tooltip2{
    left: 333px;
}
#repository-2g .custom-tooltip3{
    left: 311px;
}
#repository-2d .custom-tooltip3 {
    left: 320px;
}
#repository-2c .custom-tooltip3, #repository-2f .custom-tooltip3, #repository-2b .custom-tooltip3 {
    left: 321px;
}
.custom-tooltip3{
    left: 298px;
    position: relative;
    top: 421px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 30;
}
#repository-2g .custom-tooltip3::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2g .custom-tooltip3:hover{
    border: 3px solid transparent;
    padding: 8px;

}

.custom-tooltip4{
    left: 289px;
    position: relative;
    top: 420px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 40;
}
#repository-2d .custom-tooltip4{
    left: 300px;
}
#repository-2c .custom-tooltip4, #repository-2f .custom-tooltip4, #repository-2b .custom-tooltip4{
    left: 312px;
}
#repository-2d .custom-tooltip4::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2d .custom-tooltip4:hover{
    border: 3px solid transparent;
    padding: 8px;

}
.custom-tooltip5{
    left: 169px;
    position: relative;
    top: 471px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 50;
}
#repository-2b .custom-tooltip5::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2b .custom-tooltip5{
    left: 182px;
}
#repository-2b .custom-tooltip5::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2c .custom-tooltip5, #repository-2f .custom-tooltip5{
    left: 191px;
}
.custom-tooltip6{
    left: 193px;
    position: relative;
    top: 472px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 60;
}
#repository-2c .custom-tooltip6::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2c .custom-tooltip6:hover{
    border: 3px solid transparent;
    padding: 8px;

}
#repository-2c .custom-tooltip6{
    left: 204px;
}
#repository-2f .custom-tooltip6{
    left: 213px;
}
.custom-tooltip7{
    left: 128px;
    position: relative;
    top: 498px;
    color:#fd0002;
    font-size: 10px;
    border: 3px solid transparent;
    padding: 8px;
    z-index: 70;
}
a:hover {

    color:#fd0002;
    text-decoration: none;

}
#repository-2f .custom-tooltip7::before{
    border: 3px solid #fd0002;
    padding: 8px;

}
#repository-2f .custom-tooltip7:hover{
    border: 3px solid transparent;
    padding: 8px;

}
#repository-2f .custom-tooltip7{
    left: 140px;
}
/*RESPONSIVE CSS*/
/*
Extra small devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap because it is "mobile first"
*/


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    #repository{
        margin-top: 0px;
    }
    .main-content {
        /* background: rgba(225, 225, 225, .9); */
        /* padding: 31px 124px 31px 130px; */
        /* margin: 30px 162px 30px 160px; */

        margin-top: 1rem;
        padding: 2rem;
        height: auto;
    }
    .vertical {
        display: table-cell;
        vertical-align: middle;
        height: 100vh;
    }
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
    #repository {
        margin-top: 0px;
    }

    .main-content {
        /* background: rgba(225, 225, 225, .9); */
        /* padding: 31px 124px 31px 130px; */
        /* margin: 30px 162px 30px 160px; */

        margin-top: 0px;
        padding: 32px 32px 32px 27px;
        height: auto;
    }

    .vertical {
        display: table-cell;
        vertical-align: middle;
        height: 100vh;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #repository{ margin-top: 0px;}
    .container-fluid {
        width: 1000px!important;
        height: 764px;

    }
    .vertical{


        display: block;
        align-items: center;
        margin: 0 auto;
    }

}


@media only screen and (min-width:1500px){
    /* styles for browsers larger than 1600px; */
    .repository-main-container {
        margin-top: 2%;
        margin-bottom:  2%;
    }
    .vertical{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
}