Technology News And Updates: September 2013

Facebook Touch is unofficial application for Window 8 But It allow user to simple, fast & comprehensive touch optimized experience of Facebook on their Windows 8 device. It features access to your news feed, view user profiles, chat with friends, view and compose messages, view events, view your notifications, view the list of friends, search people, groups and pages, and configure your settings.

Included Features in Facebook Touch:

Access to your news feed
View user profiles
Chat with friends
View and compose messages
View events
View your notifications
View the list of friends
Search people, groups and pages
Configure your settings
Live Tile (showing recent news feed items)

Enjoy Facebook touch application

Dashboard Design For Admin Panel

This template is usefull for admin panel dashboard included this dashboard all the tyape of function
Dashboard,Gallery,Setting,Widget,Archive,comment,plugin.

html code here:

    <div id="wrapper">
        <div id="content">
            <div class="c1">
                <div class="controls">
                    <nav class="links">
                        <ul>
                            <li><a href="#" class="ico1">Messages <span class="num">26</span></a></li>
                            <li><a href="#" class="ico2">Alerts <span class="num">5</span></a></li>
                            <li><a href="#" class="ico3">Documents <span class="num">3</span></a></li>
                        </ul>
                    </nav>
                    <div class="profile-box">
                        <span class="profile">
                            <a href="#" class="section">
                                <img class="image" src="images/img1.jpg" alt="image description" width="26" height="26" />
                                <span class="text-box">
                                    Welcome
                                    <strong class="name">Dhaval Thummar</strong>
                                </span>
                            </a>
                            <a href="#" class="opener">opener</a>
                        </span>
                        <a href="#" class="btn-on">On</a>
                    </div>
                </div>
                <div class="tabs">
                    <div id="tab-1" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-2" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-3" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-4" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-5" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-6" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-7" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                    <div id="tab-8" class="tab">
                        <article>
                            <div class="text-section">
                                <h1>Dashboard</h1>
                                <p>This is a quick overview of some features</p>
                            </div>
                            <ul class="states">
                                <li class="error">Error : This is an error placed text message.</li>
                                <li class="warning">Warning: This is a warning placed text message.</li>
                                <li class="succes">Succes : This is a succes placed text message.</li>
                            </ul>
                        </article>
                    </div>
                </div>
            </div>
        </div>
        <aside id="sidebar">
            <strong class="logo"><a href="#">lg</a></strong>
            <ul class="tabset buttons">
                <li class="active">
                    <a href="#tab-1" class="ico1"><span>Dashboard</span><em></em></a>
                    <span class="tooltip"><span>Dashboard</span></span>
                </li>
                <li>
                    <a href="#tab-2" class="ico2"><span>Gallery</span><em></em></a>
                    <span class="tooltip"><span>Gallery</span></span>
                </li>
                <li>
                    <a href="#tab-3" class="ico3"><span>Pages</span><em></em></a>
                    <span class="tooltip"><span>Pages</span></span>
                </li>
                <li>
                    <a href="#tab-4" class="ico4"><span>Widgets</span><em></em></a>
                    <span class="tooltip"><span>Widgets</span></span>
                </li>
                <li>
                    <a href="#tab-5" class="ico5"><span>Archive</span><em></em></a>
                    <span class="tooltip"><span>Archive</span></span>
                </li>
                <li>
                    <a href="#tab-6" class="ico6">
                        <span>Comments</span><em></em>
                    </a>
                    <span class="num">11</span>
                    <span class="tooltip"><span>Comments</span></span>
                </li>
                <li>
                    <a href="#tab-7" class="ico7"><span>Plug-in</span><em></em></a>
                    <span class="tooltip"><span>Plug-in</span></span>
                </li>
                <li>
                    <a href="#tab-8" class="ico8"><span>Settings</span><em></em></a>
                    <span class="tooltip"><span>Settings</span></span>
                </li>
            </ul>
            <span class="shadow"></span>
        </aside>
    </div>

CSS:

header, footer, article, section, hgroup, nav, figure, aside {display: block;}
figure {
    margin:0;
    padding:0;
}
html {height:100%;}
body {
    margin:0;
    font:12px/15px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    color:#8a8a8a;
    min-width:1000px;
    background:#fff;
    height:100%;
}
img {border-style:none;}
a {
    color:#8a8a8a;
    text-decoration:underline;
}
a:hover {text-decoration:none;}
input,
textarea,
select {
    font:100% arial,sans-serif;
    vertical-align:middle;
    color:#8a8a8a;
}
form,fieldset{
    margin:0;
    padding:0;
    border:none;
}
#wrapper {
    position:relative;
    min-height:100%;
    overflow:hidden;
    background:url(../images/bg-wrapper.png) repeat-y;
}
#content {
    float:left;
    width:100%;
}
.c1 {margin:0 0 0 77px;}
.controls {
    height:1%;
    overflow:hidden;
    padding:26px 13px 0 34px;
    background:url(../images/bg-controls.png);
}
.links {float:left;}
.links ul {
    list-style:none;
    margin:0;
    padding:0;
    float:left;
}
.links li {
    float:left;
    margin:0 3px 0 0;
    position:relative;
}
.links a {
    float:left;
    border:1px solid #dde2e8;
    background:#fff;
    -webkit-border-radius: 1px 1px 0 0;
    -moz-border-radius: 1px 1px 0 0;
    border-radius: 1px 1px 0 0;
    color:#1f252a;
    font-size:13px;
    line-height:15px;
    height:28px;
    text-decoration:none;
    padding:9px 19px 0 35px;
}
.links a:hover {text-decoration:underline;}
.links .num {
    position:absolute;
    right:-3px;
    top:-8px;
    color:#fff;
    font:bold 10px/18px Arial, Helvetica, sans-serif;
    width:20px;
    height:20px;
    background: #4c95cd;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRjOTVjZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzYzc4YmEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #4c95cd 0%, #3c78ba 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c95cd), color-stop(100%,#3c78ba));
    background: -webkit-linear-gradient(top, #4c95cd 0%,#3c78ba 100%);
    background: -o-linear-gradient(top, #4c95cd 0%,#3c78ba 100%);
    background: -ms-linear-gradient(top, #4c95cd 0%,#3c78ba 100%);
    background: linear-gradient(to bottom, #4c95cd 0%,#3c78ba 100%);
    text-align:center;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}
.links .ico1 {background:#fff url(../images/sprite.png) no-repeat 14px -445px;}
.links .ico2 {background:#fff url(../images/sprite.png) no-repeat 13px -528px;}
.links .ico3 {background:#fff url(../images/sprite.png) no-repeat 11px -637px;}
.profile-box {float:right;}
.btn-on {
    background:url(../images/sprite.png) no-repeat -230px -5px;
    width:35px;
    height:39px;
    overflow:hidden;
    text-indent:-9999px;
    float:left;
    margin:0 0 0 7px;
}
.profile-box .profile {
    float:left;
    border:1px solid #dde2e8;
    background:#fff;
    -webkit-border-radius: 1px 1px 0 0;
    -moz-border-radius: 1px 1px 0 0;
    border-radius: 1px 1px 0 0;
    height:37px;
}
.profile-box .profile .image {
    float:left;
    margin:1px 12px 0 0;
}
.profile-box a {text-decoration:none;}
.profile-box .text-box {
    float:left;
    overflow:hidden;
    color:#a0a0a0;
    font-size:10px;
    line-height:12px;
}
.profile-box .section {
    padding:4px 33px 0 7px;
    float:left;
}
.profile-box a.section {cursor:pointer;}
.profile-box .name {
    display:block;
    font-size:12px;
    line-height:15px;
    color:#4f5f6f;
    font-weight:normal;
}
.profile-box .opener {
    float:left;
    background:url(../images/sprite.png) no-repeat -39px -58px;
    width:32px;
    height:37px;
    overflow:hidden;
    text-indent:-9999px;
    border-left:1px solid #dde2e8;
}
.tabs {border-top:1px solid #fff;}
.tabs .text-section {
    background:#f9f9f9;
    padding:19px 0 8px 36px;
    margin:0 0 1px;
}
.tabs h1 {
    font-size:18px;
    line-height:20px;
    margin:0 0 8px;
    color:#2b333b;
}
.tabs p {margin:0 0 10px;}
.states {
    list-style:none;
    margin:0;
    padding:0;
}
.states li {
    vertical-align:top;
    margin:0 0 1px;
    padding:9px 5px 12px 55px;
}
.states .error {
    background:#ffdede url(../images/sprite.png) no-repeat 17px -712px;
    color:#be0000;
}
.states .warning {
    color:#dc6200;
    background:#fff6de url(../images/sprite.png) no-repeat 18px -975px;
}
.states .succes {
    color:#3f5a04;
    background:#dfedc0 url(../images/sprite.png) no-repeat 15px -841px;
}
#sidebar {
    float:left;
    margin:0 0 0 -100%;
    width:75px;
    padding:18px 1px 0;
}
#sidebar .shadow {
    background:url(../images/bg-shadow.png) no-repeat;
    width:5px;
    height:9999px;
    overflow:hidden;
    text-indent:-9999px;
    position:absolute;
    left:72px;
    top:0;
}
.logo {
    background:url(../images/sprite.png) no-repeat -53px 0;
    width:36px;
    height:44px;
    overflow:hidden;
    text-indent:-9999px;
    display:block;
    margin:0 auto 23px;
    position:relative;
    left:1px;
}
.logo a {
    display:block;
    height:100%;
}
.buttons {
    list-style:none;
    margin:0;
    padding:0;
    position:relative;
    z-index:2;
    font:bold 11px/13px Arial, Helvetica, sans-serif;
}
.buttons li {
    vertical-align:top;
    margin:0 0 1px;
    position:relative;
}
.buttons a {
    vertical-align:top;
    background: #616a78;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYxNmE3OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzNDNkNGIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #616a78 0%, #343d4b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#616a78), color-stop(100%,#343d4b));
    background: -webkit-linear-gradient(top, #616a78 0%,#343d4b 100%);
    background: -o-linear-gradient(top, #616a78 0%,#343d4b 100%);
    background: -ms-linear-gradient(top, #616a78 0%,#343d4b 100%);
    background: linear-gradient(to bottom, #616a78 0%,#343d4b 100%);
    width:75px;
    height:40px;
    display:block;
    overflow:hidden;
    cursor:pointer;
}
.buttons li.active a {
    background:url(../images/sprite.png) no-repeat -113px -2px;
    margin:0 -21px 0 0;
    padding:0 21px 0 0;
}
.buttons li.active a em {top:40px;}
.buttons a span {
    overflow:hidden;
    text-indent:-9999px;
    display:block;
    width:20px;
    height:20px;
    margin:11px auto 0;
    background:url(../images/sprite.png) no-repeat 9999px 0;
}
.buttons em {
    position:absolute;
    right:0;
    top:0;
    background:url(../images/bg-shadow.png) repeat-y;
    width:4px;
    height:100%;
    overflow:hidden;
    text-indent:-9999px;
}
.buttons .ico1 span {
    width:19px;
    height:18px;
    background-position:0 0;
}
.buttons .active .ico1 span {background-position:0 -23px;}
.buttons .ico2 span {
    height:19px;
    background-position:-1px -47px;
}
.buttons .active .ico2 span {background-position:-2px -73px;}
.buttons .ico3 span {background-position:-2px -97px;}
.buttons .active .ico3 span {background-position:-2px -126px;}
.buttons .ico4 span {background-position:-2px -153px;}
.buttons .active .ico4 span {background-position:-2px -178px;}
.buttons .ico5 span {background-position:-1px -206px;}
.buttons .active .ico5 span {background-position:-2px -232px;}
.buttons .ico6 span {background-position:-2px -262px;}
.buttons .active .ico6 span {background-position:-3px -291px;}
.buttons .ico7 span {background-position:-4px -321px;}
.buttons .active .ico7 span {background-position:-4px -352px;}
.buttons .ico8 span {background-position:-4px -380px;}
.buttons .active .ico8 span {background-position:-4px -415px;}
.buttons li:hover .tooltip {display:block;}
.buttons .tooltip {
    position:absolute;
    left:61px;
    top:9px;
    color:#3b414d;
    padding:0 6px 0 0;
    background:url(../images/sprite.png) no-repeat 100% -95px;
    height:24px;
    display:none;
    white-space:nowrap;
}
.buttons .tooltip span {
    height:20px;
    float:left;
    padding:4px 3px 0 10px;
    background:url(../images/sprite.png) no-repeat -39px -125px;
}
.buttons .num {
    display:block;
    text-align:center;
    color:#fff;
    background: #950707;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk1MDcwNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2MTAyMDIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #950707 0%, #610202 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#950707), color-stop(100%,#610202));
    background: -webkit-linear-gradient(top, #950707 0%,#610202 100%);
    background: -o-linear-gradient(top, #950707 0%,#610202 100%);
    background: -ms-linear-gradient(top, #950707 0%,#610202 100%);
    background: linear-gradient(to bottom, #950707 0%,#610202 100%);
    border-top:2px solid #b01919;
}

Technology News And Updates

Sunday, 29 September 2013

Mallika Sherawat Wants To Marry Narendra Modi ?

Narendra Modi's Mega Rally In Delhi

Mobile Blog Money

Friday, 20 September 2013

Ramlila Trailer Deepika & Ranveer Singh

Salmankhan live performance on BIG BOSS Stage

Sanjay to do lungi dance in jail

Krish 3 Official Trailer

Thursday, 19 September 2013

Do pal Ka interval

Narendra Modi Speech Triggers Political Fight

Tuesday, 17 September 2013

How To Make Money Fom Your Website?

Make Money From Home_Use Mobile

Love Story

Motion Graphic Presentation In Office or Company

Monday, 16 September 2013

Analyze Your Facebook Profile

What made Big B furious! By @_NAMO

How to make money using mobile

Windows Reseller Hostings

Friday, 13 September 2013

SCENA DEL CRIMINE TRAILER_

Dhoom3 Now coming on this december

How To define localhost on testing server

Narendra Modi The King Of India

CGR Tailer's : THE Coorodos

Friday, 6 September 2013

Download Facebook Touch Application For Windows8

Included Features in Facebook Touch:

Thursday, 5 September 2013

Awasome Dashboard Design In html

Dashboard Design For Admin Panel

html code here: