.polaroid {
    width:150px;
    box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    text-align:center;
    display:inline-block;
    background-color:#FFF;
}

.url_container {
    height: 500px;padding-top: 20px;padding-left: 10px;
}

.container {
    padding:10px;
}
/*文字卡片*/
.card {
    width:250px;
    box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    text-align:center;
    display:inline-block;
    background-color:#FFF;
}
.header {
    background-color:#87CEFA;
    height: 100px;
    color:white;
    padding:10px;
    font-size:40px;
}
.container {
    padding:10px;
}
/*投影卡片*/

#boxshadow {
    position:relative;
    -moz-box-shadow:1px 2px 4px rgba(0,0,0,0.5);
    -webkit-box-shadow:1px 2px 4px rgba(0,0,0,.5);
    box-shadow:1px 2px 4px rgba(0,0,0,.5);
    padding:10px;
    background:white;
    width:400px;
}
/* Make the image fit the box */
#boxshadow img {
    width:100%;
}
#boxshadow::after {
    content:'';
    position:absolute;
    z-index:-1;
    /* hide shadow behind image */
    -webkit-box-shadow:0 5px 30px rgba(0,0,0,0.3);
    -moz-box-shadow:0 5px 30px rgba(0,0,0,0.3);
    box-shadow:0 5px 30px rgba(0,0,0,0.3);
    width:80%;
    left:10%;
    /* one half of the remaining 30% */
    height:100px;
    bottom:0;
}

div img {
    cursor: pointer;
    transition: all 0.8s;
    background-color: #87CEFA;
}

div img:hover {
    transform: scale(1.3);
}

a:hover{
    color:  #4682B4;
}