Bottone con i css

[cousti]

Salve, vorrei creare un bottone uguale a:
questo
con i css.
Per farlo, ho deciso di creare dei div uno dentro l'altro, di diversi colori e via via più piccoli, e di centrarli.
Il mio lavoro è stato:

div#bottone {
 position:relative; 
 width:300px; 
 height:250px; 
 background:#f95000; 
 color: rgb(227,227,228); 
 }  

div#botton {
position:relative; 
 width:298px; 
 height:248px; 
 background: rgb(235,236,237); 
 color: rgb(235,236,237); 
left:50%;
    top:50%;
    margin-left:-149px;
    margin-top:-124px;
 }  
div#botto {
position:absolute; 
 width:297px; 
 height:247px; 
 background: rgb(235,236,237); 
 color: rgb(248,249,250); 
left:50%;
    top:50%;
    margin-left:-149px;
    margin-top:-124px;
 }  
div#bott {
position:absolute; 
 width:293px; 
 height:243px; 
 background: rgb(235,236,237); 
 color: rgb(235,236,237); 
left:50%;
    top:50%;
    margin-left:-149px;
    margin-top:-124px
 } 
div#bot {
position:absolute; 
 width:292px; 
 height:242px; 
 background:#f95000; 
 color: rgb(221,222,223); 
left:50%;
    top:50%;
    margin-left:-149px;
    margin-top:-124px
 }

E poi, in html:

<div id="content">
<div id="bottone">
<div id="botton"></div>
<div id="botto"></div>
<div id="bott"></div>
<div id="bot"></div>

</div>
</div>

Solo che.. non si vede niente

Grazie a chiunque mi aiuterà,

Buone feste.