.my-article-2 {
    background-color: rgba(0,0,0,.7);
}
article.my-article {
    height: 90vh;
    background-color: #000000;
}

img {
    width: 100%;
}
.b-w{
    transition: 500ms;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    padding: 0px 3px;
}
.b-w:hover,
.b-w:active {
    -webkit-filter: none;
    filter: none;
}

div.row div.my-col {
    height: 85vh;
    padding: 20px;
}
div.scroll {
    overflow-y: scroll;
    scrollbar-color: dark;
}
div.my-col h2 {
    border-bottom: 2px white solid;
}
.content-footer p {
    text-align: center;
}

.my-button,
.my-article-button {
    position: absolute;
    bottom : 20px;
    right: 20px;
    font-size: 2.5em;
    transition: 1.5s;
}
.my-article-button:hover {
    color: red !important;
}

#lab {
    height: 90vh;
}
#contact{
    padding-top: 40px;
    overflow: visible;
}
.pd-20 {
    padding : 0px 20px;
}
.split {
    padding: 0px 20px;
}
#footer {
    padding: 0px 20px;
}
#arrow-down {
    font-size: 3em;
}
div.inner {
    width: 95%;
}

header.major h1 {
	-webkit-animation: my-slide-in-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: my-slide-in-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
header.major h1 span {
	-webkit-animation: my-slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: my-slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes my-slide-in-right {
    0%   {position: relative; left:200%;}
    100% {position: relative ;left:0%;}
}

@keyframes my-slide-in-left {
    0%   {position: relative; right:100%;}
    100% {position: relative ;right:0%;}
}

@keyframes my-slide-in-bottom {
    0% { position: relative; bottom: 0%;}
    100% { position: relative; bottom: 100%;}
}

header.major h2.animate {
    -webkit-animation: my-slide-in-bottom 1.5s cubic-bezier(0.25, 0.460, 0.450, 0.940) both;
    animation: my-slide-in-bottom 1.5s cubic-bezier(0.25, 0.460, 0.450, 0.940) both;
}

a.my-scroll,
a.my-scroll:hover,
a.my-article-button {
    text-decoration: none;
    border-bottom-color: transparent;
}

a.my-scroll img,
a.my-scroll:hover img {
    width: 50px;
}
a.my-scroll img {
    content: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%3Cstyle%3Eline%20%7B%20stroke%3A%20%23ffffff%3B%20stroke-width%3A%202px%3B%20%7D%3C%2Fstyle%3E%0A%20%3Cg%3E%0A%20%20%3Ctitle%3ELayer%201%3C%2Ftitle%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%2219.93669%22%20x2%3D%2216.01268%22%20y2%3D%2228.43669%22%20id%3D%22svg%5f2%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2228.59493%22%20x2%3D%2223.86077%22%20y2%3D%2220.09493%22%20id%3D%22svg%5f3%22%2F%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%2210.82278%22%20x2%3D%2216.01268%22%20y2%3D%2219.32278%22%20id%3D%22svg%5f4%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2219.48101%22%20x2%3D%2223.86077%22%20y2%3D%2210.98101%22%20id%3D%22svg%5f5%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2210.62027%22%20x2%3D%2223.86077%22%20y2%3D%222.12027%22%20id%3D%22svg%5f7%22%2F%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%221.96203%22%20x2%3D%2216.01268%22%20y2%3D%2210.46203%22%20id%3D%22svg%5f6%22%2F%3E%0A%20%3C%2Fg%3E%0A%3C%2Fsvg%3E");
    animation: hideshow 1.5s infinite alternate;
}
a.my-scroll:hover img {
    content: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%3Cstyle%3Eline%20%7B%20stroke%3A%20%23ff0000%3B%20stroke-width%3A%202px%3B%20%7D%3C%2Fstyle%3E%0A%20%3Cg%3E%0A%20%20%3Ctitle%3ELayer%201%3C%2Ftitle%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%2219.93669%22%20x2%3D%2216.01268%22%20y2%3D%2228.43669%22%20id%3D%22svg%5f2%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2228.59493%22%20x2%3D%2223.86077%22%20y2%3D%2220.09493%22%20id%3D%22svg%5f3%22%2F%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%2210.82278%22%20x2%3D%2216.01268%22%20y2%3D%2219.32278%22%20id%3D%22svg%5f4%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2219.48101%22%20x2%3D%2223.86077%22%20y2%3D%2210.98101%22%20id%3D%22svg%5f5%22%2F%3E%0A%20%20%3Cline%20x1%3D%2214.86077%22%20y1%3D%2210.62027%22%20x2%3D%2223.86077%22%20y2%3D%222.12027%22%20id%3D%22svg%5f7%22%2F%3E%0A%20%20%3Cline%20x1%3D%227.01268%22%20y1%3D%221.96203%22%20x2%3D%2216.01268%22%20y2%3D%2210.46203%22%20id%3D%22svg%5f6%22%2F%3E%0A%20%3C%2Fg%3E%0A%3C%2Fsvg%3E");
}

@keyframes hideshow {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

.article-description span{
    font-weight: bold;
}

.lab {
    background-size: cover ;
    background-position-x: 50%;
    background-position-y: 30%;
}