
/*--------------------------------------------------------------
# Custom.css
--------------------------------------------------------------*/

/*fixed top margin nav when logged in*/
.logged-in .navbar-fixed-top {
    top:32px;
}
@media screen and (max-width: 782px){
    .logged-in . navbar-fixed-top {
        top: 46px;
    }
}
@media screen and (max-width: 600px){
    .logged-in .navbar-fixed-top {
        top: 42px;
    }
}

body {
    position: relative;
}

section {
    padding-top: 120px;
    padding-bottom: 120px;
}

/*Global*/
.wrapper{
    margin: 0;
    padding: 0;
    height: auto;
    min-height: 90%;
}

img{
    max-width: 100%;
    height: auto;
}

body,
a,
p,
h1,
h2,
h3,
h4,
h5,
h6{
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
a { 
    color:rgba(102, 41, 140, 1);

}
a:focus {
    outline: 0;
    background-color: none;
    text-decoration: none;
    color: rgba(113, 33, 164, 1);
}
a:hover{
    color: rgba(113, 33, 164, 1);
    text-decoration: none;
}
p a:hover{
    font-size: 110%;
    line-height: 1;
}
a.circle-icon i:hover {
    font-size: 130%;
    line-height: 0;
}

p {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 400;
    font-size: 1.5em;
    /*    line-height: normal;*/
}

.small{
    font-size: 1.2em;
}

p.italic {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 400;
    font-style: italic;
}

p.bold {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 700;
}

p.bold_italic {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 700;
    font-style: italic;
}

h1 {
    font-family: "bookmania";
    font-size: 3em;
    font-weight: 300;
    font-style: italic;
    margin-top: 60px;
}

h2 {
    font-family: "bookmania";
    font-size: 2.5em;
    font-weight: 400;
    margin: 0;
}

h3 {
    font-family: "bookmania";
    font-size: 2.5em;
    font-style: italic;
    font-weight: 600;
    margin: 0;
}

h4 {
    font-family: "bookmania";
    font-size: 1.5em;
    font-style: italic;
    font-weight: 600;
    margin: 0;
}
h5 {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 400;
    font-size: 1.5em;
}
h6 {
    font-family: "akagi-pro" , sans-serif;
    font-weight: 400;
    font-size: 1.5em;
    text-transform: uppercase;
}

i{
    font-style: normal;
}
.icon-sm {
    font-size: 1.5em;
}

.icon-md {
    font-size: 2em;
}

.icon-lg {
    font-size: 2.3em;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    clear: both;
    text-align: center;
}
.right{
    text-align: right;
    right: 0;
    float: right;
}
.vertical-margins {
    margin-top: 30px;
    margin-bottom: 30px;
}
.vertical-center {
    transform: translateY(50%);
}
.circle {
    border-radius: 50%;
    width: 120px;
    height: 120px;
    text-align: center;
    padding-top: 45px;
    display: inline-block;
}
.circle-icon {
    border-radius: 50%;
    width: 42px;
    height: 42px;
    text-align: center;
    padding-top: 9px;
    display: inline-block;
}
.half-circle {
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    width: 120px;
    height: 100px;
    text-align: center;
    padding-top: 20px;
    display: block;
}
.img-max-size{
    max-width: 100%;
    height: auto;
}
.gray-img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.gray-img:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}


/*Twitter Bootstrap Button Styles*/
.btn-primary, .btn-primary:active {
    font-size: 1.3em;
    background: rgba(102, 41, 140, 1);
    border: none;
    border-radius: 0;
}
.btn-primary:hover{
    background: rgba(113, 33, 164, 1);
    border: none;
}
.btn-primary:active:hover{
    background: rgba(113, 33, 164, 1);
}
.btn:focus {
    outline: 0;
    background-color: rgba(113, 33, 164, 1);
    text-decoration: none;
}

/*Twitter Bootstrap Modals*/
.modal-content {
    border-radius: 0;
}
.modal-header{
    border-bottom: 0;
    background-color: rgba(102, 41, 140, 1);
}

/*Twitter Bootstrap Alerts*/
.alert{
    border-radius: 0;
}

/*swatches*/

.swatch-secondary {
    background-color: rgba(113, 33, 164, 1);
    /*    #7121a4*/
    /*    background-color: rgba(229, 22, 87, 1);*/
    /*#E51657*/
}

.swatch-primary {
    background-color: rgba(102, 41, 140, 1);
    /*    #66298c*/

    /*    background-color: rgba(127, 12, 48, 1);*/
    /*#7F0C30*/
}

.swatch-tertiary {
    background-color: rgba(252, 249, 220, 1);
    /*#fcf9dc*/
}

.swatch-black {
    background-color: rgba(0, 0, 0, 1);
}

.swatch-white {
    background-color: rgba(255, 255, 255, 1);
}

.swatch-gray {
    background-color: rgba(38, 52, 54, 1);
    /*#263436*/
}
.swatch-light-gray {
    background-color: rgba(239, 239, 239, 1);
    /*#efefef*/
}
.txt-secondary {
    color: rgba(113, 33, 164, 1);
    /*    #7121a4*/
}

.txt-primary {
    color: rgba(102, 41, 140, 1);
    /*    #66298c*/
}

.txt-tertiary {
    color: rgba(252, 249, 220, 1);
    /*#fcf9dc*/
}

.txt-black {
    color: rgba(0, 0, 0, 1);
}

.txt-white {
    color: rgba(255, 255, 255, 1);
}
.txt-light-gray {
    color: rgba(239, 239, 239, 1);
}
.txt-gray {
    color: rgba(38, 52, 54, 1);
    /*#263436*/
}

.ghost-secondary {
    border: 2px solid rgba(113, 33, 164, 1);
}
.ghost-primary {
    border: 2px solid rgba(102, 41, 140, 1);
}

.ghost-tertiary {
    border: 2px solid rgba(252, 249, 220, 1);
}

.ghost-black {
    border: 2px solid rgba(0, 0, 0, 1);
}

.ghost-white {
    border: 2px solid rgba(255, 255, 255, 1);
}

.ghost-gray {
    border: 2px solid rgba(38, 52, 54, 1);
}
ghost-light-gray {
    border: 2px solid rgba(239, 239, 239, 1);
}

/*nav*/
.navbar-default .navbar-toggle{
    border: none; 
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
    background: none; 
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: rgba(102, 41, 140, 1);
}
.navbar-default {
    background-color: rgba(255, 255, 255, 0);
    color: rgba(0, 0, 0, 1);
    border-bottom: none;
}

.navbar-header {
    margin-top: 6px;
}

.navbar-default .navbar-brand {
    font-family: "akagi-pro", sans-serif;
    font-weight: 400;
    font-style: italic;
    font-size: 2em;
    color: #66298c;
}

.navbar-brand {
    padding-left: 2em;
    display: none;
}

#navlinks {
    padding-right: 4em;
}

#navlinks > ul > li{
    font-family: "akagi-pro" , sans-serif;
    font-weight: 400;
    font-size: 1.2em;
    color: rgba(38, 52, 54, 1);
    /*#263436*/
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    background-color: #66298c;
    color: rgba(255, 255, 255, 1);
    line-height: 1.6em;
    pointer-events: none;
}


#hero {
    min-height: 400px;
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/symphony.png');
    color: rgb(0,0,0,1);
    padding-top: 120px;
    padding-bottom: 0;
    margin-bottom: 0;
}

#about {
    padding-top: 60px;

}
#profile-pic {
    max-width: 100%;
    width: 200px;
    height: 200px;
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/profimg.png') no-repeat;
    background-size: contain;
    display: inline-block;
}
#profile-pic:hover{
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/profimghover.png') no-repeat;
    background-size: contain;
}

#tools-graph {
    border-top: 3px rgba(252, 252, 252, .5) solid;
}

#tools-graph p {
    text-align: right;
    padding-right: 20px;
    color: rgba(38, 52, 54, 1);
}

.bar-graph {
    min-height: 30px;
    background: rgba(38, 52, 54, 1);
    height: 30px;
    width: 5px;
    display: inline-block;
    text-align: right;
    font-size: 1.5em;
    font-family: 'akagi-pro', sans-serif;
}

#pixate-graph, #sketch-graph, #origami-graph {
    background: rgba(38, 52, 54, 1);
}

.tools-img{
    max-height: 2em;
    width: auto;
    margin-left: 20px;
}
#wordsofwisdom{
    min-height: 600px;
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/meetingfooter.jpg') 0 0 fixed;
    background-size: cover;
    background-position: center center;
    padding: 0;
}

#wordsofwisdom #collabcontainer {
    background: rgba(102, 41, 140, .7);
    height: 400px;
    margin: 0;
    padding: 0 60px 0 60px;
    opacity: 0;
    display: flex;
    align-items: center;
    text-align: center;
}
#collab {
    display: none;
}
#wordsofwisdom p span{
    display: table-cell;
    vertical-align: middle;
    height: inherit;
}


#collaborate{
    position: relative;
}
#location{
    min-height: 600px;
    background: -webkit-linear-gradient(rgba(239, 239, 239, 1) 2%, white 6%); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgba(239, 239, 239, 1) 2%, white 6%); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgba(239, 239, 239, 1) 2%, white 6%); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgba(239, 239, 239, 1) 2%, white 6%); /* Standard syntax */

}
#locationTxt{
    display: none;
}
#map {
    max-width: 100%;
    max-height: 100%;
    /*                min-width: 360px;*/
    min-height: 300px;
}
#world {
    position: relative;
    left: -200%;
    width: 120px;
    height: auto;
}


#process {
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/workstation3.jpg') 0 0 repeat fixed;   
    background-size: auto; 
    background-position: top;
}

#work article div div.work-body{
    margin-top: 90px;
    margin-bottom: 20px;
}

.work-body div{
    margin-bottom: 20px;

}
.work-post{
    height: 240px;
    display: flex;
    flex-direction: column-reverse;
    align-content: flex-end;
    width: 100%;
    /*    background: url('../img/') center / cover;*/
    background: url('/home/wp-content/themes/wuxiodesigns/assets/img/cecillec.jpg');
    background-position: 100% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    opacity: 0;
}
.work-label {
    color: rgba(255,255,255,1);
    background: rgba(38, 52, 54, .7);
    padding: 10px 10px 10px 10px;
}

.work-post:hover {
    -webkit-filter: sepia(50%);
    filter: sepia(50%);
    outline: 3px solid rgba(252, 249, 220, 1);  
    cursor: pointer;
}

.post-image img{
    max-width: 100%;
    height: auto;
}

/*Plus Icon on Hover*/
.work-post:hover::after {
    display: block;
    content: "+";
    font-size: 1.5em;
    color: rgba(255,255,255,1);
    background: rgba(38, 52, 54, 1);
    text-align: center;
    font-weight: 700;

    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -18px;
    margin-left: -18px;
    transform-origin: 10%;

    border-radius: 50%;
    width: 36px;
    height: 36px;

}


.work-label h5 {
    padding: 0;
    margin: 0;
}


/*work.html*/

#pagelink-home {
    padding: .15em;
}

/*contact modal style, contact form 7*/

.form-group {
    margin-bottom: 0;
}



/*bouncy animation*/

.animation-target {
    /*
    -webkit-animation: animation 1000ms linear both;
    animation: animation 1000ms linear both;
    */
}

/* Generated with Bounce.js. Edit at http://goo.gl/MqCcKR */

@-webkit-keyframes animation { 
    0% { -webkit-transform: matrix3d(0.25, 0, 0, 0, 0, 0.25, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.25, 0, 0, 0, 0, 0.25, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.4% { -webkit-transform: matrix3d(0.463, 0, 0, 0, 0, 0.463, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.463, 0, 0, 0, 0, 0.463, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.7% { -webkit-transform: matrix3d(0.58, 0, 0, 0, 0, 0.58, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.58, 0, 0, 0, 0, 0.58, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.81% { -webkit-transform: matrix3d(0.785, 0, 0, 0, 0, 0.785, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.785, 0, 0, 0, 0, 0.785, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.41% { -webkit-transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    10.21% { -webkit-transform: matrix3d(1.081, 0, 0, 0, 0, 1.081, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.081, 0, 0, 0, 0, 1.081, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.61% { -webkit-transform: matrix3d(1.238, 0, 0, 0, 0, 1.238, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.238, 0, 0, 0, 0, 1.238, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    14.11% { -webkit-transform: matrix3d(1.247, 0, 0, 0, 0, 1.247, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.247, 0, 0, 0, 0, 1.247, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.52% { -webkit-transform: matrix3d(1.236, 0, 0, 0, 0, 1.236, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.236, 0, 0, 0, 0, 1.236, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.72% { -webkit-transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    21.32% { -webkit-transform: matrix3d(1.136, 0, 0, 0, 0, 1.136, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.136, 0, 0, 0, 0, 1.136, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    24.32% { -webkit-transform: matrix3d(1.054, 0, 0, 0, 0, 1.054, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.054, 0, 0, 0, 0, 1.054, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { -webkit-transform: matrix3d(0.978, 0, 0, 0, 0, 0.978, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.978, 0, 0, 0, 0, 0.978, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.93% { -webkit-transform: matrix3d(0.972, 0, 0, 0, 0, 0.972, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.972, 0, 0, 0, 0, 0.972, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    35.54% { -webkit-transform: matrix3d(0.971, 0, 0, 0, 0, 0.971, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.971, 0, 0, 0, 0, 0.971, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    36.74% { -webkit-transform: matrix3d(0.975, 0, 0, 0, 0, 0.975, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.975, 0, 0, 0, 0, 0.975, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    41.04% { -webkit-transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    44.44% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    52.15% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    59.86% { -webkit-transform: matrix3d(0.998, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.998, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    63.26% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    75.28% { -webkit-transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    85.49% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    90.69% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}

@keyframes animation { 
    0% { -webkit-transform: matrix3d(0.25, 0, 0, 0, 0, 0.25, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.25, 0, 0, 0, 0, 0.25, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.4% { -webkit-transform: matrix3d(0.463, 0, 0, 0, 0, 0.463, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.463, 0, 0, 0, 0, 0.463, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.7% { -webkit-transform: matrix3d(0.58, 0, 0, 0, 0, 0.58, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.58, 0, 0, 0, 0, 0.58, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.81% { -webkit-transform: matrix3d(0.785, 0, 0, 0, 0, 0.785, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.785, 0, 0, 0, 0, 0.785, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.41% { -webkit-transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.021, 0, 0, 0, 0, 1.021, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    10.21% { -webkit-transform: matrix3d(1.081, 0, 0, 0, 0, 1.081, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.081, 0, 0, 0, 0, 1.081, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.61% { -webkit-transform: matrix3d(1.238, 0, 0, 0, 0, 1.238, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.238, 0, 0, 0, 0, 1.238, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    14.11% { -webkit-transform: matrix3d(1.247, 0, 0, 0, 0, 1.247, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.247, 0, 0, 0, 0, 1.247, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.52% { -webkit-transform: matrix3d(1.236, 0, 0, 0, 0, 1.236, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.236, 0, 0, 0, 0, 1.236, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.72% { -webkit-transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.21, 0, 0, 0, 0, 1.21, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    21.32% { -webkit-transform: matrix3d(1.136, 0, 0, 0, 0, 1.136, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.136, 0, 0, 0, 0, 1.136, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    24.32% { -webkit-transform: matrix3d(1.054, 0, 0, 0, 0, 1.054, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.054, 0, 0, 0, 0, 1.054, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { -webkit-transform: matrix3d(0.978, 0, 0, 0, 0, 0.978, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.978, 0, 0, 0, 0, 0.978, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.93% { -webkit-transform: matrix3d(0.972, 0, 0, 0, 0, 0.972, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.972, 0, 0, 0, 0, 0.972, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    35.54% { -webkit-transform: matrix3d(0.971, 0, 0, 0, 0, 0.971, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.971, 0, 0, 0, 0, 0.971, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    36.74% { -webkit-transform: matrix3d(0.975, 0, 0, 0, 0, 0.975, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.975, 0, 0, 0, 0, 0.975, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    41.04% { -webkit-transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.991, 0, 0, 0, 0, 0.991, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    44.44% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    52.15% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    59.86% { -webkit-transform: matrix3d(0.998, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.998, 0, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    63.26% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    75.28% { -webkit-transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.002, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    85.49% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    90.69% { -webkit-transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.999, 0, 0, 0, 0, 0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}


/*smack animation*/

.animation-smack-target {
    -webkit-animation: animationsmack 750ms linear both;
    animation: animationsmack 750ms linear both;
}

/* Generated with Bounce.js. Edit at http://goo.gl/s353Gf */

@-webkit-keyframes animationsmack { 
    0% { -webkit-transform: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.2% { -webkit-transform: matrix3d(1.655, 0.472, 0, 0, 0.31, 1.655, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.655, 0.472, 0, 0, 0.31, 1.655, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.5% { -webkit-transform: matrix3d(1.515, 0.509, 0, 0, 0.333, 1.515, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.515, 0.509, 0, 0, 0.333, 1.515, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.41% { -webkit-transform: matrix3d(1.327, 0.478, 0, 0, 0.312, 1.327, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.327, 0.478, 0, 0, 0.312, 1.327, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.01% { -webkit-transform: matrix3d(1.12, 0.367, 0, 0, 0.24, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.12, 0.367, 0, 0, 0.24, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    12.71% { -webkit-transform: matrix3d(0.936, 0.212, 0, 0, 0.14, 0.936, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.936, 0.212, 0, 0, 0.14, 0.936, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.51% { -webkit-transform: matrix3d(0.913, 0.185, 0, 0, 0.123, 0.913, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.913, 0.185, 0, 0, 0.123, 0.913, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.92% { -webkit-transform: matrix3d(0.861, 0.079, 0, 0, 0.053, 0.861, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.861, 0.079, 0, 0, 0.053, 0.861, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.92% { -webkit-transform: matrix3d(0.863, 0.063, 0, 0, 0.042, 0.863, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.863, 0.063, 0, 0, 0.042, 0.863, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { -webkit-transform: matrix3d(0.925, -0.001, 0, 0, -0.001, 0.925, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.925, -0.001, 0, 0, -0.001, 0.925, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { -webkit-transform: matrix3d(0.968, -0.014, 0, 0, -0.01, 0.968, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.968, -0.014, 0, 0, -0.01, 0.968, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    31.43% { -webkit-transform: matrix3d(0.988, -0.016, 0, 0, -0.011, 0.988, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.988, -0.016, 0, 0, -0.011, 0.988, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    34.63% { -webkit-transform: matrix3d(1.006, -0.015, 0, 0, -0.01, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.006, -0.015, 0, 0, -0.01, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    40.14% { -webkit-transform: matrix3d(1.015, -0.008, 0, 0, -0.005, 1.015, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.015, -0.008, 0, 0, -0.005, 1.015, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    56.46% { -webkit-transform: matrix3d(1, 0.001, 0, 0, 0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0.001, 0, 0, 0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    62.36% { -webkit-transform: matrix3d(0.998, 0.001, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.998, 0.001, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    81.48% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    84.68% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}

@keyframes animationsmack { 
    0% { -webkit-transform: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    3.2% { -webkit-transform: matrix3d(1.655, 0.472, 0, 0, 0.31, 1.655, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.655, 0.472, 0, 0, 0.31, 1.655, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    4.5% { -webkit-transform: matrix3d(1.515, 0.509, 0, 0, 0.333, 1.515, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.515, 0.509, 0, 0, 0.333, 1.515, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    6.41% { -webkit-transform: matrix3d(1.327, 0.478, 0, 0, 0.312, 1.327, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.327, 0.478, 0, 0, 0.312, 1.327, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    9.01% { -webkit-transform: matrix3d(1.12, 0.367, 0, 0, 0.24, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.12, 0.367, 0, 0, 0.24, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    12.71% { -webkit-transform: matrix3d(0.936, 0.212, 0, 0, 0.14, 0.936, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.936, 0.212, 0, 0, 0.14, 0.936, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    13.51% { -webkit-transform: matrix3d(0.913, 0.185, 0, 0, 0.123, 0.913, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.913, 0.185, 0, 0, 0.123, 0.913, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    17.92% { -webkit-transform: matrix3d(0.861, 0.079, 0, 0, 0.053, 0.861, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.861, 0.079, 0, 0, 0.053, 0.861, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    18.92% { -webkit-transform: matrix3d(0.863, 0.063, 0, 0, 0.042, 0.863, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.863, 0.063, 0, 0, 0.042, 0.863, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    25.23% { -webkit-transform: matrix3d(0.925, -0.001, 0, 0, -0.001, 0.925, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.925, -0.001, 0, 0, -0.001, 0.925, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    29.03% { -webkit-transform: matrix3d(0.968, -0.014, 0, 0, -0.01, 0.968, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.968, -0.014, 0, 0, -0.01, 0.968, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    31.43% { -webkit-transform: matrix3d(0.988, -0.016, 0, 0, -0.011, 0.988, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.988, -0.016, 0, 0, -0.011, 0.988, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    34.63% { -webkit-transform: matrix3d(1.006, -0.015, 0, 0, -0.01, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.006, -0.015, 0, 0, -0.01, 1.006, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    40.14% { -webkit-transform: matrix3d(1.015, -0.008, 0, 0, -0.005, 1.015, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1.015, -0.008, 0, 0, -0.005, 1.015, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    56.46% { -webkit-transform: matrix3d(1, 0.001, 0, 0, 0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0.001, 0, 0, 0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    62.36% { -webkit-transform: matrix3d(0.998, 0.001, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.998, 0.001, 0, 0, 0, 0.998, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    81.48% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    84.68% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
    100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}


#navlinks ul li#navlink-contact a.navi .entypo-mail {
    
    -webkit-animation: animation 1000ms linear both ;
    animation: animation 1000ms linear both ;
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
} 
#navlinks ul li#navlink-contact a.navi .entypo-mail:hover {
    
    -webkit-animation-play-state: running;
    animation-play-state: running;
} 



/*media queries*/
@media screen and (max-width : 970px){
    #hero {
        /*        background-size: cover;*/
    }
    #sitetitle {
        font-size: 6em !important;
    }

}
@media screen and (max-width : 770px){
    #profile-pic {
        width: 128px;
        height: 128px;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }
    #tools-graph h3, #tools-graph span.circle{
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .tool-name{
        display: none;
    }
    .work-post {
        opacity: 1;
        background-size: auto;
    }
}
