اضافة ازرار ويب تحميل ومعاينة بشكل احترافي

/* -- BUTTON --*/.button{t;list-styfloat:lefle:none;:center;width: 10text-align0%;margin:5px 0;e:14px;clpadding:0;font-sizear:both;}utton ul {.bton li{dmargin:0;padding:0}.butisplay:inline;margin:0;padding:0:}demo {border: none;border-radiu.s2px;padding: 8px 18px !important; background: #E55E48; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);transition: background-color .4s ease-out 0s;}.download {border: none;border-radius:2px;padding: 8px 18px !important; background: #4d79a0; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);transition: background-color .4s ease-out 0s;}.demo:hover { background: #454242;text-decoration:none }.download:hover { background: #454242;text-decoration:none }Neue, Arial, sans-serif; padding:6px 11px; color:#555; text-shadow:0 1px 0 #fff; background:#f2f2f2; background:linear-gradient(#fff, #f9f9f9, #f0f0f0);; border:1px solid #d9d9d9; border-color:#d9d9d9 #d6d6d6 #d1d1d1;border-radius:4px;box-shadow:0 1px 2px #eaeaea, inset 0 1px 0 #fbfbfb;margin-right:10px;}a.smallbutton, a:visited.smallbutton {color:#999; text-shadow:0 1px 0 #fff;text-decoration:none}.smallbutton a:hover{.smallbutton { display:inline-block; text-decoration:none; outline:none; cursor:pointer; font:normal 12px/1em Helveticacolor:#353535; text-decoration:none}{ color:#555; background:#efefef; background:linear-gradient(#fff, #f9f9f9, #e9e9e9);border-color:#ccc;box-shadow:0 1px 2px #e0e0e0, inset 0 1px 0 #fbfbfb;}.smallbutton:hover,.smallbutton:focus.smallbutton:active { position:relative; top:1px; color:#555; background:#efefef; background:linear-gradient(#fff, #eaeaea, #f4f4f4);border-color:#c6c6c6;box-shadow:0 1px 0 #fff, inset 0 0 5px #ddd;}

.button { text-align: center; width: 100%; margin: 10px 0; padding: 0; font-size: 14px; color: #fff; margin-left: 0em !important; }  .button li { display: inline-block; margin: 10px 0; padding: 0; }  .demo { border-radius: 3px; padding: 8px 12px; background: #e74c3c; color: #fff !important; text-shadow: 0 0 1px #222; transition: background-color 1s 0s ease-out; }  .demo:before { content: "\f06e"; font-family: FontAwesome; font-weight: normal; padding: 8px; background: rgba(0,0,0,.2); margin-left: -12px; margin-right: 6px; border-radius: 3px 0 0 3px; font-size: 16px; }  .download { border-radius: 3px; padding: 8px 12px; background: #3498db; color: #fff !important; text-shadow: 0 0 1px #222; transition: background-color 1s 0s ease-out; }  .download:before { content: "\f019"; font-family: FontAwesome; font-weight: normal; padding: 8px; background: rgba(0,0,0,.2); margin-left: -12px; margin-right: 6px; border-radius: 3px 0 0 3px; font-size: 16px; }  .demo:hover, .download:hover { background: rgba(0,0,0,.6); text-shadow: 0 0 1px #222; color: #fff; }  #redirect { display: none; position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimrzNOQSRPodKfht1UeXlGCnI_PALcWc1rvzoQ8xe1Cnhq-YG8nm9CQvR_dLPzIPErgxXtJ86JMYWHcD1vyXVMpJcZRxWpXkPDC4KxdTKyF80VxCUkJobBSAgleWvxrN4vTcZlItXXgQw/s200/load6.gif) 50% 30% no-repeat rgba(44, 62, 80, 0.9); z-index: 9999; text-align: center; }

<div style="text-align: center;"><ul class="button"><li><a class="demo" http://ha1web.blogspot.com/" target="_blank">Demo</a></li><li><a class="download" http://ha1web.blogspot.com/" target="_blank">Download</a></li></ul></div><div class="clear"></div>