@import url("reset.css");
 
    /* New HTML5 elements */
 
    article, aside, figure, footer, header, hgroup, nav, section { 
        display:block; 
    }
 
    /* -------- */
body {
    margin: 0;
    font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    font-size: 13px;
    line-height: 20px;
    color: #5F5E59;
    background: url(images/bg_body.jpg) left top repeat;
}
a:link, a:active, a:visited {
    color: #305F9B;
    text-decoration: none;
}
a:hover {
    color: #000;
    text-decoration: underline;
}
 
/* ID's */
 
header {
    background: url(images/bg_header.jpg) left top repeat-x;
    margin-bottom: 25px;
}
#block-twitter {
    width: 700px;
    height: 100px;
    position: relative;
    margin: 0 auto;
    padding: 20px 200px 0 0;
}
#block-title {
    width: 1000px;
    height: 150px;
    position: relative;
    margin: 0 auto;
    padding-top: 25px;
}

/* Portfolio */
    #block-title figure a.link-thumbs {
        width: 80px;
        height: 100px;
        display: block;
        float: left;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;    
        -khtml-border-radius: 8px;
        border-radius: 8px;
        -webkit-box-shadow: 1px 1px 2px #999;
        -box-box-shadow: 1px 1px 2px #999;
        -khtml-box-shadow: 1px 1px 2px #999;
        box-shadow: 1px 1px 2px #999;
        margin: 0 20px 20px 0;
        opacity: .6;
        -webkit-transition: opacity 0.4s ease-out;
        -webkit-transition: -webkit-transform 0.4s ease-out;
    }
    #block-title figure a.link-thumbs:hover {
        opacity: 1;
        -webkit-transform:rotate(-15deg);
    }
    #block-title figure a.link-thumbs:nth-child(2n) {
        margin-right: 0;
    }


#main-content {
    width: 900px;
    position: relative;
    margin: 0 auto;
}
footer {
    width: 850px;
    position: relative;
    margin: 0 auto;
    clear: both;
    padding: 30px 0;
    background: url(images/img_star.png) left top repeat-x;
}
 
/* -------- */
/* Text */
 
section#content_left {
    width: 450px;
    float: left;
    text-shadow: 0 1px 0 #FFF;
    padding-bottom: 40px;
}

section#content_center {
    width: 400px;
    float: right;
    padding-bottom: 40px;
}

section#content h3 {
    margin-bottom: 15px;
    color: #949691;
    font-size: 18px;
    font-weight: bold;
}
section#content p {
     margin-bottom: 15px;
}

section#content section.two-col {
    -moz-column-count: 2;
    -moz-column-gap: 40px;
    -webkit-column-count: 2;
    -webkit-column-gap: 40px;
    column-count: 2;
    column-gap: 40px;
    padding-bottom: 20px;
}
section#content section.two-col p {
    font-size: 20px;
    line-height: 28px;
}
ul#social-icons {
    border-top: 2px dashed #AAA19F;
    width: 180px;
    height: 55px;
    padding-top: 20px;
}
ul#social-icons li,
ul#social-icons li a {
    width: 60px;
    height: 55px;
    float: left;
    display: block;
    text-indent: -9000px;
}
ul#social-icons li a:link,
ul#social-icons li a:active,
ul#social-icons li a:visited{
    -webkit-transition: background 0.3s ease-out;
}
#social-icons li.bt-twitter a {
    background: url(images/social_icons.png) 2px top no-repeat;
}
#social-icons li.bt-twitter a:hover {
    background: url(images/social_icons.png) 2px -56px no-repeat;
}
#social-icons li.bt-facebook a {
    background: url(images/social_icons.png) -59px top no-repeat;
}
#social-icons li.bt-facebook a:hover {
    background: url(images/social_icons.png) -59px -58px no-repeat;
}
#social-icons li.bt-linkedin a {
    background: url(images/social_icons.png) -121px top no-repeat;
}
#social-icons li.bt-linkedin a:hover {
    background: url(images/social_icons.png) -121px -57px no-repeat;
}
 
/* -------- */
/* Portfolio */
 
    section#portfolio {
        width: 410px;
        float: right;
        padding-bottom: 40px;
    }
    #portfolio figure a.link-thumbs {
        width: 190px;
        height: 156px;
        display: block;
        float: left;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;    
        -khtml-border-radius: 8px;
        border-radius: 8px;
        -webkit-box-shadow: 1px 1px 2px #999;
        -box-box-shadow: 1px 1px 2px #999;
        -khtml-box-shadow: 1px 1px 2px #999;
        box-shadow: 1px 1px 2px #999;
        margin: 0 20px 20px 0;
        opacity: .6;
        -webkit-transition: opacity 0.4s ease-out;
        -webkit-transition: -webkit-transform 0.4s ease-out;
    }
    #portfolio figure a.link-thumbs:hover {
        opacity: 1;
        -webkit-transform:rotate(-15deg);
    }
    #portfolio figure a.link-thumbs:nth-child(2n) {
        margin-right: 0;
    }
 
    /* -------- */

/* Footer */
 
    footer p {
        font-size: 11px;
        line-height: 18px;
        background: url(images/logo_abduzeedo.png) right center no-repeat;
        text-shadow: 0 1px 0 #FFF;
    }
 
    /* -------- */

blockquote { 
    margin: 0 0 50px 0; padding: 0; 
} 
blockquote#one { 
    width: 300px; 
    background: #FFE4E1; 
    padding: 10px; 
    position: relative; 
} 
blockquote#one .arrow { 
    /* 吹き出しの部分 */
    width: 0; 
    height: 0; 
    line-height: 0; 
    border-top: 40px solid #FFE4E1;  
    border-left: 30px solid white; 
    border-rigyh: none; 
    position: absolute; 
    bottom: 60%; 
    left: -30px; 
} 

.wpframe {
background: #fff;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
padding: 8px;
-webkit-box-shadow: 1px 2px 1px #d1d1d1;
-moz-box-shadow: 1px 2px 1px #d1d1d1;
box-shadow: 1px 2px 1px #d1d1d1;
}