Как центрировать блок по центру?

   .tabs { 
display: flex; 
min-width: 980px; 
min-height: 93px; 
border-bottom: 4px solid #E7E7E7; 
/*background-color: black;*/ 
margin-top: 156px; 
} 
 
.tabOne { 
min-height: 43px; 
min-width: 170px; 
} 
 
.tabTwo { 
min-width: 258px; 
min-height: 43px; 
} 
 
.tabTree { 
min-width: 268px; 
min-height: 43px; 
} 
 
.circle { 
width: 43px; 
height: 43px; 
background: #5F5F5F; 
-moz-border-radius: 50px; 
-webkit-border-radius: 50px; 
border-radius: 50px; 
} 
 
.circle2 { 
width: 43px; 
height: 43px; 
background: #5F5F5F; 
-moz-border-radius: 50px; 
-webkit-border-radius: 50px; 
border-radius: 50px; 
} 
 
.circle3 { 
width: 43px; 
height: 43px; 
background: #5F5F5F; 
-moz-border-radius: 50px; 
-webkit-border-radius: 50px; 
border-radius: 50px; 
} 
 
.circle:hover { 
background-color: #ADD136; 
} 
 
.circle2:hover { 
background-color: #ADD136; 
} 
 
.circle3:hover { 
background-color: #ADD136; 
} 
 
.one { 
color: white; 
text-align: center; 
font-size: 20px; 
padding-top: 10px; 
} 
 
.two { 
color: white; 
text-align: center; 
font-size: 20px; 
padding-top: 10px; 
} 
 
.tree { 
color: white; 
text-align: center; 
font-size: 20px; 
padding-top: 10px; 
}

 <div class="tabs" > 
        <!-- tabOne --> 
            <div class="tabOne" > 
                <div class="circle" > 
                    <p class="one" >1</p> 
                </div> 
            </div> 
        <!-- /tabOne --> 
 
        <!-- tabTwo --> 
            <div class="tabTwo" > 
                <div class="circle2" > 
                    <p class="two" >2</p> 
                </div> 
            </div> 
        <!-- /tabTwo --> 
 
        <!-- tabTree --> 
            <div class="tabTree" > 
                <div class="circle3" > 
                    <p class="tree" >3</p> 
                </div> 
            </div> 
        <!-- /tabTree --> 
 
        </div>