.descr {
    color: #898576;
    font-size: 12px;
    line-height: 14px;
    opacity: 0;
    position: absolute;
    top: 28px;
    width: 150px;
    pointer-events: none;
    right: 0;
    text-align: right;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}

.item:hover .descr {
    opacity: 1;

}


.details {}

.it1 .descr,
.it4 .descr,
.it6 .descr {
    right: auto;
    left: 0;
    text-align: left;
}

/*

1st

*/

.item.it1 {
    top: 32px;
    left: 0px;
}

.item.it2 {
    right: 0px;
    top: 60px;
}

.item.it2 span {
    right: 100%;
    left: -200px;
}

.item.it2 span:after {
    right: auto;
    left: 0;
}

.item.it3 {
    right: 0px;
    top: 200px;
}

.item.it3 span {
    right: 100%;
    left: -190px;
}

.item.it3 span:after {
    right: auto;
    left: 0;
}

.item.it4 {
    top: 240px;
    left: 0px;
}


.item.it4 span {
    right: -150px;
}

.item.it5 {
    right: 0px;
    top: 420px;
}

.item.it5 span {
    right: 100%;
    left: -110px;
}

.item.it5 span:after {
    right: auto;
    left: 0;
}

.item.it6 {
    top: 530px;
    left: 0px;
}


.item.it6 span {
    right: -190px;
}


.item.it7 {
    right: 0px;
    top: 680px;
}

.item.it7 span {
    right: 100%;
    left: -176px;
}

.item.it7 span:after {
    right: auto;
    left: 0;
}


/*

2nd

*/

.second .item.it1 {
    top: 32px;
    left: 0px;
}

.second .item.it2 {
    right: 0px;
    top: 60px;
}

.second .item.it2 span {
    right: 100%;
    left: -195px;
}

.second .item.it2 span:after {
    right: auto;
    left: 0;
}

.second .item.it3 {
    right: 0px;
    top: 200px;
}

.second .item.it3 span {
    right: 100%;
    left: -190px;
}

.second .item.it3 span:after {
    right: auto;
    left: 0;
}

.second .item.it4 {
    top: 240px;
    left: 0px;
}


.second .item.it4 span {
    right: -170px;
}

.second .item.it5 {
    right: 0px;
    top: 420px;
}

.second .item.it5 span {
    right: 100%;
    left: -270px;
}

.second .item.it5 span:after {
    right: auto;
    left: 0;
}

.second .item.it6 {
    top: 530px;
    left: 0px;
}


.second .item.it6 span {
    right: -210px;
}



.second .item.it7 {
    right: 0px;
    top: 680px;
}

.second .item.it7 span {
    right: 100%;
    left: -176px;
}

.second .item.it7 span:after {
    right: auto;
    left: 0;
}


/*

3nd

*/

.third .item.it1 {
    top: 32px;
    left: 0px;
}

.third .item.it2 {
    right: 0px;
    top: 60px;
}

.third .item.it2 span {
    right: 100%;
    left: -190px;
}

.third .item.it2 span:after {
    right: auto;
    left: 0;
}

.third .item.it3 {
    right: 0px;
    top: 200px;
}

.third .item.it3 span {
    right: 100%;
    left: -190px;
}

.third .item.it3 span:after {
    right: auto;
    left: 0;
}

.third .item.it4 {
    top: 240px;
    left: 0px;
}


.third .item.it4 span {
    right: -210px;
}

.third .item.it5 {
    right: 0px;
    top: 420px;
}

.third .item.it5 span {
    right: 100%;
    left: -200px;
}

.third .item.it5 span:after {
    right: auto;
    left: 0;
}

.third .item.it6 {
    top: 530px;
    left: 0px;
}


.third .item.it6 span {
    right: -210px;
}



.third .item.it7 {
    right: 0px;
    top: 680px;
}

.third .item.it7 span {
    right: 100%;
    left: -246px;
}

.third .item.it7 span:after {
    right: auto;
    left: 0;
}

/*

4

*/

.four .item.it1 {
    top: 32px;
    left: 0px;
}

.four .item.it2 {
    right: 0px;
    top: 60px;
}

.four .item.it2 span {
    right: 100%;
    left: -190px;
}

.four .item.it2 span:after {
    right: auto;
    left: 0;
}

.four .item.it3 {
    right: 0px;
    top: 200px;
}

.four .item.it3 span {
    right: 100%;
    left: -300px;
}

.four .item.it3 span:after {
    right: auto;
    left: 0;
}

.four .item.it4 {
    top: 240px;
    left: 0px;
}


.four .item.it4 span {
    right: -270px;
}

.four .item.it5 {
    right: 0px;
    top: 420px;
}

.four .item.it5 span {
    right: 100%;
    left: -140px;
}

.four .item.it5 span:after {
    right: auto;
    left: 0;
}

.four .item.it6 {
    top: 530px;
    left: 0px;
}


.four .item.it6 span {
    right: -200px;
}



.four .item.it7 {
    right: 0px;
    top: 680px;
}

.four .item.it7 span {
    right: 100%;
    left: -226px;
}

.four .item.it7 span:after {
    right: auto;
    left: 0;
}


/*

5

*/

.five .item.it1 {
    top: 32px;
    left: 0px;
}

.five .item.it2 {
    right: 0px;
    top: 60px;
}

.five .item.it2 span {
    right: 100%;
    left: -190px;
}

.five .item.it2 span:after {
    right: auto;
    left: 0;
}

.five .item.it3 {
    right: 0px;
    top: 200px;
}

.five .item.it3 span {
    right: 100%;
    left: -250px;
}

.five .item.it3 span:after {
    right: auto;
    left: 0;
}

.five .item.it4 {
    top: 240px;
    left: 0px;
}


.five .item.it4 span {
    right: -130px;
}

.five .item.it5 {
    right: 0px;
    top: 420px;
}

.five .item.it5 span {
    right: 100%;
    left: -110px;
}

.five .item.it5 span:after {
    right: auto;
    left: 0;
}

.five .item.it6 {
    top: 530px;
    left: 0px;
}


.five .item.it6 span {
    right: -200px;
}



.five .item.it7 {
    right: 0px;
    top: 680px;
}

.five .item.it7 span {
    right: 100%;
    left: -186px;
}

.five .item.it7 span:after {
    right: auto;
    left: 0;
}



/*

6

*/

.six .item.it1 {
    top: 32px;
    left: 0px;
}

.six .item.it2 {
    right: 0px;
    top: 60px;
}

.six .item.it2 span {
    right: 100%;
    left: -190px;
}

.six .item.it2 span:after {
    right: auto;
    left: 0;
}

.six .item.it3 {
    right: 0px;
    top: 200px;
}

.six .item.it3 span {
    right: 100%;
    left: -250px;
}

.six .item.it3 span:after {
    right: auto;
    left: 0;
}

.six .item.it4 {
    top: 240px;
    left: 0px;
}


.six .item.it4 span {
    right: -130px;
}

.six .item.it5 {
    right: 0px;
    top: 420px;
}

.six .item.it5 span {
    right: 100%;
    left: -120px;
}

.six .item.it5 span:after {
    right: auto;
    left: 0;
}

.six .item.it6 {
    top: 530px;
    left: 0px;
}


.six .item.it6 span {
    right: -200px;
}



.six .item.it7 {
    right: 0px;
    top: 680px;
}

.six .item.it7 span {
    right: 100%;
    left: -156px;
}

.six .item.it7 span:after {
    right: auto;
    left: 0;
}



/*

7

*/

.seven .item.it1 {
    top: 32px;
    left: 0px;
}

.seven .item.it2 {
    right: 0px;
    top: 60px;
}

.seven .item.it2 span {
    right: 100%;
    left: -120px;
}

.seven .item.it2 span:after {
    right: auto;
    left: 0;
}

.seven .item.it3 {
    right: 0px;
    top: 200px;
}

.seven .item.it3 span {
    right: 100%;
    left: -200px;
}

.seven .item.it3 span:after {
    right: auto;
    left: 0;
}

.seven .item.it4 {
    top: 240px;
    left: 0px;
}


.seven .item.it4 span {
    right: -150px;
}

.seven .item.it5 {
    right: 0px;
    top: 420px;
}

.seven .item.it5 span {
    right: 100%;
    left: -350px;
}

.seven .item.it5 span:after {
    right: auto;
    left: 0;
}

.seven .item.it6 {
    top: 530px;
    left: 0px;
}


.seven .item.it6 span {
    right: -200px;
}



.seven .item.it7 {
    right: 0px;
    top: 680px;
}

.seven .item.it7 span {
    right: 100%;
    left: -156px;
}

.seven .item.it7 span:after {
    right: auto;
    left: 0;
}



/*

8

*/

.eight .item.it1 {
    top: 32px;
    left: 0px;
}

.eight .item.it2 {
    right: 0px;
    top: 60px;
}

.eight .item.it2 span {
    right: 100%;
    left: -120px;
}

.eight .item.it2 span:after {
    right: auto;
    left: 0;
}

.eight .item.it3 {
    right: 0px;
    top: 200px;
}

.eight .item.it3 span {
    right: 100%;
    left: -160px;
}

.eight .item.it3 span:after {
    right: auto;
    left: 0;
}

.eight .item.it4 {
    top: 240px;
    left: 0px;
}


.eight .item.it4 span {
    right: -200px;
}

.eight .item.it5 {
    right: 0px;
    top: 420px;
}

.eight .item.it5 span {
    right: 100%;
    left: -300px;
}

.eight .item.it5 span:after {
    right: auto;
    left: 0;
}

.eight .item.it6 {
    top: 530px;
    left: 0px;
}


.eight .item.it6 span {
    right: -200px;
}



.eight .item.it7 {
    right: 0px;
    top: 680px;
}

.eight .item.it7 span {
    right: 100%;
    left: -156px;
}

.eight .item.it7 span:after {
    right: auto;
    left: 0;
}




/*

9

*/

.nine .item.it1 {
    top: 32px;
    left: 0px;
}

.nine .item.it2 {
    right: 0px;
    top: 60px;
}

.nine .item.it2 span {
    right: 100%;
    left: -266px;
}

.nine .item.it2 span:after {
    right: auto;
    left: 0;
}

.nine .item.it3 {
    right: 0px;
    top: 200px;
}

.nine .item.it3 span {
    right: 100%;
    left: -175px;
}

.nine .item.it3 span:after {
    right: auto;
    left: 0;
}

.nine .item.it4 {
    top: 240px;
    left: 0px;
}


.nine .item.it4 span {
    right: -240px;
}

.nine .item.it5 {
    right: 0px;
    top: 420px;
}

.nine .item.it5 span {
    right: 100%;
    left: -270px;
}

.nine .item.it5 span:after {
    right: auto;
    left: 0;
}

.nine .item.it6 {
    top: 530px;
    left: 0px;
}


.nine .item.it6 span {
    right: -230px;
}



.nine .item.it7 {
    right: 0px;
    top: 680px;
}

.nine .item.it7 span {
    right: 100%;
    left: -190px;
}

.nine .item.it7 span:after {
    right: auto;
    left: 0;
}



/*

10

*/

.ten .item.it1 {
    top: 32px;
    left: 0px;
}

.ten .item.it2 {
    right: 0px;
    top: 60px;
}

.ten .item.it2 span {
    right: 100%;
    left: -268px;
}

.ten .item.it2 span:after {
    right: auto;
    left: 0;
}

.ten .item.it3 {
    right: 0px;
    top: 200px;
}

.ten .item.it3 span {
    right: 100%;
    left: -265px;
}

.ten .item.it3 span:after {
    right: auto;
    left: 0;
}

.ten .item.it4 {
    top: 240px;
    left: 0px;
}


.ten .item.it4 span {
    right: -290px;
}

.ten .item.it5 {
    right: 0px;
    top: 420px;
}

.ten .item.it5 span {
    right: 100%;
    left: -200px;
}

.ten .item.it5 span:after {
    right: auto;
    left: 0;
}

.ten .item.it6 {
    top: 530px;
    left: 0px;
}


.ten .item.it6 span {
    right: -190px;
}



.ten .item.it7 {
    right: 0px;
    top: 680px;
}

.ten .item.it7 span {
    right: 100%;
    left: -180px;
}

.ten .item.it7 span:after {
    right: auto;
    left: 0;
}


/*

11

*/

.eleven .item.it1 {
    top: 32px;
    left: 0px;
}

.eleven .item.it2 {
    right: 0px;
    top: 60px;
}

.eleven .item.it2 span {
    right: 100%;
    left: -248px;
}

.eleven .item.it2 span:after {
    right: auto;
    left: 0;
}

.eleven .item.it3 {
    right: 0px;
    top: 200px;
}

.eleven .item.it3 span {
    right: 100%;
    left: -265px;
}

.eleven .item.it3 span:after {
    right: auto;
    left: 0;
}

.eleven .item.it4 {
    top: 240px;
    left: 0px;
}


.eleven .item.it4 span {
    right: -330px;
}

.eleven .item.it5 {
    right: 0px;
    top: 420px;
}

.eleven .item.it5 span {
    right: 100%;
    left: -150px;
}

.eleven .item.it5 span:after {
    right: auto;
    left: 0;
}

.eleven .item.it6 {
    top: 530px;
    left: 0px;
}


.eleven .item.it6 span {
    right: -190px;
}



.eleven .item.it7 {
    right: 0px;
    top: 680px;
}

.eleven .item.it7 span {
    right: 100%;
    left: -150px;
}

.eleven .item.it7 span:after {
    right: auto;
    left: 0;
}


/*

12

*/

.twelve .item.it1 {
    top: 32px;
    left: 0px;
}

.twelve .item.it2 {
    right: 0px;
    top: 60px;
}

.twelve .item.it2 span {
    right: 100%;
    left: -225px;
}

.twelve .item.it2 span:after {
    right: auto;
    left: 0;
}

.twelve .item.it3 {
    right: 0px;
    top: 200px;
}

.twelve .item.it3 span {
    right: 100%;
    left: -265px;
}

.twelve .item.it3 span:after {
    right: auto;
    left: 0;
}

.twelve .item.it4 {
    top: 240px;
    left: 0px;
}


.twelve .item.it4 span {
    right: -130px;
}

.twelve .item.it5 {
    right: 0px;
    top: 420px;
}

.twelve .item.it5 span {
    right: 100%;
    left: -110px;
}

.twelve .item.it5 span:after {
    right: auto;
    left: 0;
}

.twelve .item.it6 {
    top: 530px;
    left: 0px;
}


.twelve .item.it6 span {
    right: -190px;
}



.twelve .item.it7 {
    right: 0px;
    top: 680px;
}

.twelve .item.it7 span {
    right: 100%;
    left: -160px;
}

.twelve .item.it7 span:after {
    right: auto;
    left: 0;
}