@charset "utf-8";
/* CSS Document */






















.arb-how-it-works{ margin-top: 15px; }
.arb-how-it-works h4{ margin: 20px 0 25px 0; }
.arb-how-it-works .graph{
    position: relative;
    width: 100%;
    height: 280px;
}
.arb-how-it-works .graph>div{
    position: absolute;
    top:0;
    left:0;
    right: 0;
    bottom: 0;
}
.arb-how-it-works .graph>div>.cntainer{
    position: relative;
}

.arb-how-it-works .graph .arrows{
    padding-left: 56px;
}
.arb-how-it-works .graph .arrows .arrow{
    width: 126px;
    height: 200px;
    float:left;
}
.arb-how-it-works .graph .arrows .arrow.ar-down.ar-gray{background: url('../img/articles/dolgi/icon-how-arrow-gray.png') center center no-repeat;}
.arb-how-it-works .graph .arrows .arrow.ar-down.ar-color{background: url('../img/articles/dolgi/icon-how-arrow-color.png') center center no-repeat;}
.arb-how-it-works .graph .arrows .arrow.ar-up.ar-gray{background: url('../img/articles/dolgi/icon-how-arrow-gray-up.png') center center no-repeat;}
.arb-how-it-works .graph .arrows .arrow.ar-up.ar-color{background: url('../img/articles/dolgi/icon-how-arrow-color-up.png') center center no-repeat;}

.arb-how-it-works .graph .info{
    margin-left: -12px;
    width: 670px;
}
.arb-how-it-works .graph .info .txt{
    position: relative;
    float: left;
    width: 111px;
    height: 246px;
    text-align: center;
}
.arb-how-it-works .graph .info .txt.txt-up{}
.arb-how-it-works .graph .info .txt.txt-down{padding-top: 128px;}

.arb-how-it-works .graph .info .txt .full h5,
.arb-how-it-works .graph .info .txt .cap{
    text-align: center;
    color: #00609b;
    font-size: 14px;
    font-weight: normal;
    font-family: open_sanssemibold;
    text-shadow:  0px 0px 4px white;
    margin: 0;
    text-transform: none;
}
.arb-how-it-works .graph .info .txt .full{
    position: absolute;
    width: 208px;
    height: auto;
    padding: 10px 25px;
    background: #f0f0f0;
    -webkit-box-shadow: 2px 5px 15px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    2px 5px 15px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         2px 5px 15px 0px rgba(50, 50, 50, 0.75);
    z-index: 15;
    display: none;
}
.arb-how-it-works .graph .info .txt.txt-up .full{
    top: 71px;
    left: -49px;
}
.arb-how-it-works .graph .info .txt.txt-down .full{
    top: 199px;
    left: -49px;
}

.arb-how-it-works .graph .info .txt .full p{
    text-align: left;
}
.arb-how-it-works .graph .info .txt .circle{
    display: inline-block;
}
.arb-how-it-works .graph .info .txt .circle .outer{
    width: 75px;
    height: 75px;
    border: #cb9530 solid 3px;
    padding: 4px;
    //border-radius: 38px; 
    background: white;
    transition: all 0.2s 0.2s ease-in-out;
}





.arb-how-it-works .graph .info .txt .circle .outer>.inner{
    width: 60px;
    height: 60px;
    background-color: #128128;
    background-position: center center;
    background-repeat: no-repeat;
    //border-radius: 30px; 
    transition: all 0.2s 0.2s ease-in-out;
}












.arb-how-it-works .graph .info .txt:hover .circle .outer{border-color: #00609b;}
.arb-how-it-works .graph .info .txt:hover .circle .outer>.inner{background-color: #cb9530;}
.arb-how-it-works .graph .info .txt .circle .icon-1{ background-image: url('../img/articles/arbitrage/icon-how-01.png'); }
.arb-how-it-works .graph .info .txt .circle .icon-2{ background-image: url('../img/articles/arbitrage/icon-how-02.png'); }
.arb-how-it-works .graph .info .txt .circle .icon-3{ background-image: url('../img/articles/arbitrage/icon-how-03.png'); }
.arb-how-it-works .graph .info .txt .circle .icon-4{ background-image: url('../img/articles/arbitrage/icon-how-04.png'); }
.arb-how-it-works .graph .info .txt .circle .icon-5{ background-image: url('../img/articles/arbitrage/icon-how-05.png'); }
.arb-how-it-works .graph .info .txt .circle .icon-6{ background-image: url('../img/articles/arbitrage/icon-how-06.html'); }