﻿
body {
    max-width: 1000px;
    margin: 0 auto;
    background: url("../img/back03.jpg");
}

#container {
    margin: 20px auto;
    padding: 5px;
    overflow: hidden;
    background: url("../img/egg_shell.png");
    border-radius: 15px;
    -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.75);
-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.75);
box-shadow: 0 1px 5px rgba(0,0,0,0.75);
 behavior: url(/kasuga_temp/common/PIE.htc);
}

.box {
    margin: 5px;
    padding: 10px;
    float: left;
    position: relative;
    border-radius: 10px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5);
box-shadow: 0 1px 2px rgba(0,0,0,0.5);
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 92%, #eeeeee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(92%,#ffffff), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 92%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 92%,#eeeeee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 92%,#eeeeee 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 92%,#eeeeee 100%); /* W3C */

 behavior: url(/kasuga_temp/common/PIE.htc);
}

.col1 { width: 560px;
    border: 5px solid #3fa9f5;
    border-radius: 10px; }
.col2 { width: 360px;
    border: 5px solid #7ac943;
    border-radius: 10px; }
.col2 { width: 360px;
    border: 5px solid #7ac943;
    border-radius: 10px; }
.col3 { width: 160px;
    border: 5px solid #ff931e;
    border-radius: 10px; }
.col4 { width: 760px;
    border: 5px solid #3fa9f5;
    border-radius: 10px; }
.col5 { width: 360px;
    border: 5px solid #ff931e;
    border-radius: 10px; }
.col6 { width: 560px;
    border: 5px solid #ff931e;
    border-radius: 10px; }

.transitions-enabled.masonry,
.transitions-enabled.masonry .masonry-brick {
    -webkit-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    transition-duration: 0.7s;
}
.transitions-enabled.masonry {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}
.transitions-enabled.masonry  .masonry-brick {
    -webkit-transition-property: left, right, top;
    -moz-transition-property: left, right, top;
    -o-transition-property: left, right, top;
    transition-property: left, right, top;
}

@media only screen and (min-width:541px) and (max-width:820px) {
    body {
        width: 610px;
    }
}

@media only screen and (max-width:540px) {
    body {
        padding: 0 5px;
    }
    #container{
        width: auto !important;
        padding: 0 1.8%;
        overflow: hidden;
    }
    .box{
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        margin: 5px 0;
        overflow: hidden;
    }

.col1 { width: 100%; }
.col2 { width: 100%; }
.col3 { width: 100%; }
.col4 { width: 100%; }
}