body {
    margin: 0;
}
@media screen and (min-width: 768px){
    .navbar {
        min-height: 40px;
    }
    .navbar-brand {
        padding-top: 0;
        padding-bottom: 0;        
        height: 50px;
        line-height: 50px;
    }
    .navbar-nav > li > a {
        font-size: 14px;
        padding-top: 15px;
        padding-bottom: 15px;
    }
}

/* 巨幕 */
.big {
    width: 100%;
    height: 600px;
    background: linear-gradient(45deg,#000 0%, #0094d9 35%, #5a3694 55%, #ee4d74 75%, rgb(19, 91, 245) 100%);
    background-size: 400%;
    background-position: 0% 100%;
    animation: gradient 7.5s ease-in-out infinite;
    color: #fff;
    text-align: center;
    /* background: url(../img/bgjg.jpg) no-repeat 50% 50%;  */
}
@keyframes gradient{
    0% {
        background-position: 0% 100%;
    }
    50% {
        background-position: 100% 0%;
    }
    100% {
        background-position: 0% 100%;        
    }
}
.big h1 {
    margin-top: 100px;
    font-size: 120px;
}
.big h1+p {
    font-size: 40px;
}
.big p:last-child {
    margin-top: 80px;
}
@media screen and (max-width:992px){
    .big{      
        padding: 90px 0 110px;
    }
    .big h1{
        font-size: 90px; 
    }
    .big h1+p{
        font-size: 24px;
    }
}
@media screen and (min-width:992px){
    .big h1{
        font-size: 120px;
    }
    .big h1+p{
        font-size: 30px;
    }
}

/* projects */
.header-projects {
    width: 70%;
    padding: 15px 0;
    border-radius: 50px;
    margin: 0 auto;
    margin-top: 60px;
    margin-bottom: 40px;    
    text-align: center;
    background-color: rgb(23, 201, 186); 
}
.header-projects h1 {
    font-size: 42px;
}
.projects .thumbnail {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    max-width: 310px;
    margin-bottom: 30px;
    border-radius: 0;
}
@media screen and (min-width:768px){
    .projects .thumbnail  {
        height: 360px;
    }
}
@media screen and (min-width:992px){
    .projects .thumbnail  {
        height: 352px;
    }
}
@media screen and (min-width:1200px){
    .projects .thumbnail  {
        height: 336px;
    }
}
.projects .thumbnail img {
    width: 100%;
    height: 150px;
}
.projects .thumbnail .caption {
    height: 200px;
    overflow-y: hidden;
    color: #555;
}
.projects .thumbnail .caption a:hover {
    text-decoration: none;
}

.bgg {
    width: 100%;
    background-color: rgb(190, 226, 215);
}

/* footer */
.footer {
    padding: 30px 0;
    border-top: 1px solid #e5e5e5;
    margin-top: 70px;
    color: #777; 
}
.about > div {
    height: 110px;
    margin-bottom: 10px;
}
.about h4 {
    font-size: 16px;
    color: #563d7c;
}
.about li a {
    color: #777;
}
.footer-bottom a {
    color: #777;
}
.footer-bottom li:first-child::after {
    content: "|";
    padding: 0 0 0 15px;
}