@charset "UTF-8";
/*================================
 pagenavi.css
=================================*/


/* PageNavi
-------------------------------- */

/* PageNavi
-------------------------------- */

.navigation{
width:100%;
display:block;
overflow:hidden;
padding:150px 10px 120px;
text-align:center;
font-size:1.4em;
margin-top: -60px;
background-color: #020001;
}

.wp-pagenavi{
display:block;
overflow:hidden;
width:900px;
margin:0 auto;
}

.wp-pagenavi a{
display:inline-block;
width:40px;
height:40px;
vertical-align: top;
font-size:18px;
font-weight: normal;
color:#111;
line-height:36px;
text-align: center;
padding:0;
margin:4px!important;
background-color:#fff;
border:1px solid #ccc;
transition: 0.2s;
}

.wp-pagenavi a:hover{
color:#fff;
background-color:#231816;
text-decoration: none;
}

.wp-pagenavi span.current{
display:inline-block;
width:40px;
height:40px;
vertical-align: top;
font-size:18px;
font-weight: normal;
color:#fff;
line-height:36px;
text-align: center;
background: linear-gradient( 155deg, #0E549A, #16296E 50%, #6B2E67 80% );
border:1px solid #000!important;
padding:0;
margin:4px;
}

.wp-pagenavi a, .wp-pagenavi span {
    padding: 0!important;
}

/* single
-------------------------------- */

.single_navigation{
overflow: hidden;
display:block;
position:relative;
}

    #works-graphic-single .single_navigation{
    padding:100px 0 80px;
    }
    #works-logo-single .single_navigation{
    padding:50px 0 80px;
    background-color: #040000;
    border-bottom: 1px solid #555354;
    }

.single_navigation ul{
overflow: hidden;
display:block;
width: 1100px;
height: 60px;
margin: 0 auto;
position:relative;
text-align:center;
}


.single_navigation ul li{
display:block;
}

.single_navigation ul li a{
display: block;
height: 60px;
position: absolute;
top:0;
line-height: 60px;
color:#fff;
background-color: #30363A;
}

.single_navigation ul li a:hover{
opacity: 0.77;
}

.single_navigation ul li.prev a{
    width: 200px;
    left: 0;
    text-align: left;
    text-indent: 60px;
}

.single_navigation ul li.back a {
    width:360px;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    background: linear-gradient( 136deg, #0585CE, #0585CE 20%, #16296E 50%, #16296E 60%, #6B2E67 80% );
}

.single_navigation ul li.next a {
    width: 200px;
    right: 0;
    text-align: left;
    text-indent: 24px;
}

.single_navigation ul li.prev a::before {
    background: url(../img/works/page_prev_arrow.png) no-repeat center center;
    display: block;
    width:20px;
    height: 20px;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 18px;
    margin: auto;
}
.single_navigation ul li.next a::before {
    background: url(../img/works/page_next_arrow.png) no-repeat center center;
    display: block;
    width:20px;
    height: 20px;
    content: "";
   position: absolute;
    top: 0;
    bottom: 0;
    right: 18px;
    margin: auto;
}