*{
margin: 0;
padding: 0;}
body {
}
.middle{
color: #464646;
margin: 0 auto;
width: 960px;
overflow: hidden;
    font-family: 'Arial';
    font-weight: normal;
background: #fff;
padding-bottom: 50px;
padding-top: 28px;
}
.left{
    float: left;
    width: 400px;
}
.right{
    float: left;
    width: 560px;
}
.block_1{
    float: left;
    width: 560px;
}
.block_2{
    width: 512px;
    float: right;
}
.name{
    margin-top: -5px;
}
.name h1{
    color: #105bab;
    font-size: 31px;
    text-transform: uppercase;
    font-family: 'Tahoma';
    font-weight: normal;
}
.name p{
    font-size: 12px;
    text-transform: uppercase;
    font-family: 'Tahoma';
    font-weight: normal;
}
.zodiak_iq{
    padding-top: 28px;
}
.zodiak{
    height: 40px;
    width: 255px;
    float: left;
    border-right: 1px solid #105bab;
    line-height: 40px;
}
.zodiak_1{
    padding-top: 4px;
    padding-right: 10px;
    float: right;
    font-size: 18px;
}
.zodiak_2{
    float: right;
    font-size: 18px;
    padding-right: 24px;
}
.iq{
    height: 40px;
    width: 240px;
    float: left;
    line-height: 40px;
}
.iq_1{
    padding-top: 4px;
    padding-left: 25px;
    float: left;
    font-size: 18px;
}
.iq_2{
    float: left;
    font-size: 18px;
    padding-left: 10px;
}
.mail{
    height: 24px;
    margin-top: 87px;
}
.mail_1{
    width: 250px;
    margin: 0 auto;
    text-align: center;
}

.mail a{
    margin-left: 10px;
    line-height: 14px;
    border-bottom: 1px dashed #105bab;
    text-decoration: none;
    color: #105bab;
    font-size: 13px;
    vertical-align: top;
}
.social{
    float: right;
    width: 100%;
    height: 40px;
    margin-top: 26px;
}
.soc_1{
    margin-top: 15px;
    float: left;
    height: auto;
    width: 183px;
    border-bottom: 1px solid #bcbcbc;
}
.soc_3{
    margin-top: 15px;
    float: right;
    height: auto;
    width: 183px;
    border-bottom: 1px solid #bcbcbc;
}
.soc_2,{

    height: 32px;
    width: auto;
}
#soc_3_1{
    float: left;
    width: 32px;
    height: 32px;
    background: #bcbcbc;
    border-radius: 16px;
    margin-left: 15px;
}
#soc_3_2, #soc_3_3 {
    float: left;
    width: 32px;
    height: 32px;
    background: #bcbcbc;
    border-radius: 16px;
    margin-left: 10px;
}
.soc_2 img{
    margin-right: 3px;
}
.soc_2 img:last-child{
    margin-right: 0;
}

.graph{
    margin-top: 64px;
    float: left;
    width: 560px;
    overflow: hidden;
}
.graph_1{
    float: left;
    width: 126px;
    height: 280px;
}
.graph_2{
    width: 434px;
    float: right;
    height: 280px;
}
#container{
    height: 260px;
    width: 434px;
}
.heart{
    font-size: 18px;
    text-transform: uppercase;
    color: #105bab;
    margin-top: 5px;
    cursor: default;
}
.line_0{
    margin-top: 6px;
    width: 47px;
    height: 2000px;
    border-right: 1px solid #2976c9;
}
.indent {
    float: left;
    width: 560px;
    overflow: hidden;
}
.indent_0{
    height:16px;
}
.indent_1{
    float: left;
    width: 126px;
    height:30px;
}
.indent_1_1{
    float: left;
    width: 126px;
    height:11px;
}
.line{
    width: 47px;
    height: 100%;
    border-right: 1px solid #2976c9;
}
.text{
    float: left;
    width: 560px;

}
.text_l{
    width: 512px;
    float: right;
    border-left: 1px solid #2976c9;
}
.text_l p{
    padding-left: 77px;
    text-align: left;
    font-size: 13px;
}
.skills{
    float: left;
    width: 560px;
    overflow: hidden;
    margin-top: 25px;
}

.skills_1{
    float: left;
    height: 70px;
}
.skills_2{
    width: 434px;
    float: right;
    overflow: hidden;
}
#rating_0{
    height: 25px;
    overflow: hidden;
}
#rating_0_1{
    width: 310px;
    float: right;
    height: 23px;
}
#rating_0_1 p{
    font-size: 13px;
    padding-top: 5px;
}
.anim, .anim_2, .anim_3, .anim_4, .anim_5{
    width:96px;
    height:32px;
    text-align:center;
}
/*-----------------------------*/
.anim_heart img{
    width: 32px;
    height: 32px;
    -webkit-animation-name: anim_heart;
        -moz-animation-name: anim_heart;
             animation-name: anim_heart;
    -webkit-animation-duration: 0.7s;
        -moz-animation-duration: 0.7s;
             animation-duration: 0.7s;
    -webkit-animation-timing-function: linear;
        -moz-animation-timing-function: linear;
            animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
            animation-play-state: running;
}
.anim_heart img:hover{
    -webkit-animation-play-state: paused;
         -moz-animation-play-state: paused;
            animation-play-state: paused;
}
@-webkit-keyframes anim_heart {
    0% {
        -webkit-transform: scale3d(1, 1, 1) ;
    }
    100%{
        -webkit-transform: scale3d(0.9, 0.9, 1);
    }
}
@-moz-keyframes anim_heart {
    0% {
        -moz-transform: scale3d(1, 1, 1) ;
    }
    100%{
        -moz-transform: scale3d(0.9, 0.9, 1);
    }
}
@keyframes anim_heart {
    0% {
        transform: scale3d(1, 1, 1) ;
    }
    100%{
        transform: scale3d(0.9, 0.9, 1);
    }
}
/*-----------------------------*/
.anim_cogwheel img{
    width: 32px;
    height: 32px;
    -webkit-animation-name: anim_cogwheel;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
        -moz-animation-name: anim_cogwheel;
        -moz-animation-duration: 5s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        -moz-animation-play-state: running;
            animation-name: anim_cogwheel;
            animation-duration: 5s;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-play-state: running;
}
.anim_cogwheel img:hover{
    -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
            animation-play-state: paused;
}
@-webkit-keyframes anim_cogwheel {
     0% {
         -webkit-transform: rotate(0deg);
     }
     100%{
         -webkit-transform: rotate(360deg);
     }
 }

        @-moz-keyframes anim_cogwheel {
            0% {
                -moz-transform: rotate(0deg);
            }
            100%{
                -moz-transform: rotate(360deg);
            }
        }

                @keyframes anim_cogwheel {
                    0% {
                        transform: rotate(0deg);
                    }
                    100%{
                        transform: rotate(360deg);
                    }
                }
/*-----------------------------*/
.anim_books img{
    width: 32px;
    height: 32px;
    -webkit-animation-name: anim_books;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
        -moz-animation-name: anim_books;
        -moz-animation-duration: 5s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        -moz-animation-play-state: running;
            animation-name: anim_books;
            animation-duration: 5s;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-play-state: running;
}
.anim_books img:hover{
    -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
            animation-play-state: paused;
}
@-webkit-keyframes anim_books {
    0% {

    }
50%{
    -webkit-transform: rotateY(150deg);
}
    75%{
        -webkit-transform: rotateY(150deg);
    }
    100%{
        -webkit-transform: rotateY(-150deg);
    }
}

    @-moz-keyframes anim_books {
        0% {

        }
        50%{
            -moz-transform: rotateY(150deg);
        }
        75%{
            -moz-transform: rotateY(150deg);
        }
        100%{
            -moz-transform: rotateY(-150deg);
        }
    }

        @keyframes anim_books {
            0% {

            }
            50%{
                transform: rotateY(150deg);
            }
            75%{
                transform: rotateY(150deg);
            }
            100%{
                transform: rotateY(-150deg);
            }
        }
/*-----------------------------*/
.anim_films img{
    width: 32px;
    height: 32px;
    -webkit-animation-name: anim_films;
    -webkit-animation-duration: 3.6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
        -moz-animation-name: anim_films;
        -moz-animation-duration: 3.6s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        -moz-animation-play-state: running;
            animation-name: anim_films;
            animation-duration: 3.6s;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-play-state: running;
}
.anim_films img:hover{
    -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
            animation-play-state: paused;
}
@-webkit-keyframes anim_films {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);;
    }
}
@-moz-keyframes anim_films {
    0% {
        -moz-transform: scale3d(1, 1, 1);
    }

    30% {
        -moz-transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -moz-transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -moz-transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -moz-transform: scale3d(.95, 1.05, 1);
    }

    75% {
        -moz-transform: scale3d(1.05, .95, 1);
    }

    100% {
        -moz-transform: scale3d(1, 1, 1);
    }
}

@keyframes anim_films {
    0% {
        transform: scale3d(1, 1, 1);
    }

    30% {
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        transform: scale3d(.95, 1.05, 1);
    }

    75% {
        transform: scale3d(1.05, .95, 1);
    }

    100% {
        transform: scale3d(1, 1, 1);
    }
}

/*-----------------------------*/
.anim_jokes img{
    width: 32px;
    height: 32px;
    -webkit-animation-name: anim_jokes;
    -webkit-animation-duration: 4.5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
        -moz-animation-name: anim_jokes;
        -moz-animation-duration: 4.5s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        -moz-animation-play-state: running;
            animation-name: anim_jokes;
            animation-duration: 4.5s;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-play-state: running;
}
.anim_jokes img:hover{
    -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
           animation-play-state: paused;
}

@-webkit-keyframes anim_jokes{
    0% {
        -webkit-transform: translate3d(0, 0, 0);
    }

     25% {
    -webkit-transform: translate3d(32px, 0, 0) rotate(360deg);
    }
    50 {
        -webkit-transform: translate3d(-32px, 0, 0) rotate(-360deg);
    }
     75%{
        -webkit-transform: translate3d(-32px, 0, 0) rotate(-360deg);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
    }
}
@-moz-keyframes anim_jokes{
    0% {
        -moz-transform: translate3d(0, 0, 0);
    }

    25% {
        -moz-transform: translate3d(32px, 0, 0) rotate(360deg);

    }
50{
    -moz-transform: translate3d(-32px, 0, 0) rotate(-360deg);
}
75%{
    -moz-transform: translate3d(-32px, 0, 0) rotate(-360deg);
}

100% {
    -moz-transform: translate3d(0, 0, 0);
}
}
@keyframes anim_jokes{
    0% {
        transform: translate3d(0, 0, 0);
    }

    25% {
         transform: translate3d(32px, 0, 0) rotate(360deg);

    }
    50{
        transform: translate3d(-32px, 0, 0) rotate(-360deg);
    }
    75%{
        transform: translate3d(-32px, 0, 0) rotate(-360deg);
}

    100% {
         transform: translate3d(0, 0, 0);
}
}
/*-----------------------------*/
.book{
    float: left;
    width: 560px;
    margin-top: 30px;
    overflow: hidden;

}
.book_1{
    float: left;
    height: 70px;
}
.book_2{
    width: 434px;
    float: right;
}
.book_2 p{
    font-size: 13px;
}
.book_3{
    padding: 20px 0;
}
.book_4 {
    width: 434px;
    float: right;

}
.book_4 img{
    margin-right: 19px; margin-bottom: 19px;
}
.book_4 img:last-child{
    margin-right: 0;
}
.line_2 {
    width: 47px;
    position:absolute;
    top: 0;
    bottom: 0;
    border-right: 1px solid #2976c9;
}
.film{
    float: left;
    width: 560px;
    margin-top: 20px;
    overflow: hidden;

}
.film_1{
    margin-bottom: 6px;
    float: left;
    height: 70px;
}
.film_2{
    width: 434px;
    float: right;
}
.film_2 p{
    font-size: 13px;
}
.film_3{
    padding: 20px 0;
    width: 434px;
    float: right;
  }

 .jokes{
     float: left;
     width: 560px;
     margin-top: 25px;
     overflow: hidden;

 }
.jokes_1{
    float: left;
    height: 70px;
    margin-bottom: 6px;
}
.jokes_2{
    width: 434px;
    float: right;
}
.jokes_2 p:first-child{
    font-size: 13px;
    border-bottom: 1px solid #bcbcbc;
    padding-top: 0;
    padding-bottom: 15px;
}
.jokes_2 p{
    font-size: 13px;
    border-bottom: 1px solid #bcbcbc;
    padding-top: 15px;
    padding-bottom: 15px;
}
.jokes_2 p:last-child{
    font-size: 13px;
    border-bottom: none;
    padding-top: 15px;
    padding-bottom: 0;
}
#boo{
    width:65px;height:100px;
}