Helix

                                                                         

DOWNLOAD    DEMO-BLOG

Lineaments:

-Helix is 3 Column Blogger Templete ,

-It's Simple Blogger Template, with awesome  Layout . It's Free Template.

-Compatible with All Major Browsers

-Best for Personal Blog , For Travelers Blog

-Author Name given Inside Template   


---------------------------------------------------------------------------------------------------

 Body design code of template you can make changes in color , style font , width , hight


body {
    background: #fff;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
    display: block;
}
ol, ul {
    list-style: none;
}
table { /* tables still need 'cellspacing="0"' in the markup */
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    font-weight: normal;
    text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}
a:focus {
    outline: thin dotted;
}
a:hover,
a:active { /* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */
    outline: 0;
}
a img {
    border: 0;
}
 
Global
-----------------------------------------------

body,
button,
input,
select,
textarea {
    color: #888;
    font-family: Open sans,sans-serif;
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 1.5;
}

body{
    background:#fff;
}

/* Headings */
h1,h2,h3,h4,h5,h6 {
    clear: both;
    margin:0px 0px 10px 0px;
}
 

-----------------------------------------------------------------------------------------------

Header and social icon part 

#masthead{

    background: #EA5546;
    width: 180px;
    margin: 30px 10px 0px 50px;   
    position: fixed;
    z-index: 100;
    border-top:3px solid #E6473B;
}

.top{
   
}

.logo{
    margin: 0px 0px 0px 0px;
    padding: 20px 0px 15px 20px;
    font-family: Lato, sans-serif;
    background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLZGDsxlYgwU1WxbsepGADKMGQGvWiNetyyLwpccPG0K2pSPjDOuAAuvpKYLzZWbptGLe2IwUyJlZXxKEMF8sfyfjmtNK0SiRGiw00mNhLvx-Gnb1LXLevCyhUZkb15naTA3pK7WCdKpff/s0/edge.png) bottom repeat-x;
}

.logo h1{
    font-size:24px;
    text-transform: uppercase;
    margin: 5px 0px 0px 0px;
    padding: 0px;
    font-weight: 600;
    color: #fff;
}

.logo h1 a:link, .logo h1 a:visited{
    color: #fff;
}

.logo h2{
    font-size:14px;
    margin: 5px 0px 0px 0px;
    padding: 0px;
    font-weight: 400;
    color: #fff;
}

.social-links{
    padding: 5px 0px;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2K5i1WY4l-2rkq0bLTZ230XA0ShBddvtKa2jxca1hRLJtOxetlnKPJOMgdkqqM9LGJYGnFvlska_aXqUzBw8GxXGE-GC9095ZIBNP7lSLsHbSe_2E5Avd7K2ryGTor_9Z3459-HdmUDZp/s0/edger.png) top repeat-x;)
}

.social-links ul{
    margin: 0px;
    padding: 0px 0px 0px 20px;
}

.social-links ul li{
    height: 24px;
    width: 24px;
    float: left;
    list-style: none;
    margin: 10px 5px 10px 0px
}

.social-links ul li a{
    width: 24px;
    height: 24px;
    display: block;
}

#submenu ul {
   list-style-type: none;
   list-style: none;
   margin: 0;
   padding: 0;
}

li.twitter{
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmLpzzZads6gtdiUE_NM1EzzXxGGz8JbwlSvNsb59rJ_e3tZ4Ymuvpz0MA0QiKw8sDLbgpQOim81634YSUhmJfCBP0rih5oWWsEObCJaPI3UTXO-R4P9vrXVwJtAHOphzA-jJi5KIKymcW/s0/twitter.png);
}

li.facebook{
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZhxfk0oxH8pe21hCNwpTEkDaEfPQMqzr1OJPnKajlqb51ydgkDFmODxvcYgK8OsEk4YDQSYBSimROvaJGt9Fa3A1RVLwBNXLXuBUVGfydm2ZT-Kdj5CjdV5MzLCTSdaPDxzSkMxI-cuXO/s0/facebook.png);   
}

li.gplus{
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyKm-EIpw66ijSbrLhnuA9qU9aHLQph427ie88rmelQ5fQanp-jP-Y5MZZep-NAk-3YEI-w3IDPW-21QCyIXMkLjhnR1xpPBsDqjFjs__UmlMEl1ui218oLfvye9KwnRWy-GkQ11s8ybcg/s0/gplus.png);   
}

li.feed{
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixsVI8J-QSEatRxlaEB033DQ5pahpQzpdZ4yMe7r1Ej05foGTTHxvOtjbB_sdtGjLsN2lAbEjomtb1X7q5NG6VW90gOw4jEu0s-3e1PyvwvsaHw_Bh9XtOoxpe345AfUJIWFuy1JWjK2x3/s0/feed.png);   
}
li.in{
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIItgHIsfvKldk5Ozox1l7BZokeyMJEc23jkdHMrcf-1J18TSnzQDcikJ2i3DZDAaP4gRaujkfH1R5pkfBuQifAKtdBUgl0KH4GRggomuVVJi_9nGvONmMw11LSKNc5nkAnI2NYD_F7U3m/s0/in.png);   
}

/* Searchform */
#searchform #s{
    background:#fff;
    border: 1px solid #ddd;
    color: #777;
    width:220px!important;
    padding: 10px 10px;
    font-size: 13px;
    margin: 10px 0px 30px 0px;
    border-radius: 0;
}

------------------------------------------------------------------------------------------------

Menu design , you can make changes in style 

 Menu */

#submenu {
    padding:10px 0px;
    margin: 0px 0px;
    background: #fff;
    }
   
#submenu > ul {
    width: 180px;
    float:left;
    list-style: none;
    margin: 0 ;
    padding: 0 0px;
    font-size: 12px;
    }
   
#submenu > ul > li {
    border-bottom: 1px solid #f2f2f2;
    list-style: none;    margin: 0;
    padding: 0;
    color: #222;
    font-weight:700;
    text-transform: uppercase;
    }
   
#submenu > ul > li:last-child{
    border: none;
}   

#submenu li{
    list-style: none;
}
   
#submenu li a {
    color: #444;
    display: block;
    margin: 0;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    position: relative;
    font-weight:bold;
    }

#submenu li a:hover, #submenu li a:active, #submenu .current_page_item a  {
    color: #F7584A;
    }
   
#submenu li a.sf-with-ul {
    padding-right: 10px;
    }

-----------------------------------------------------------------------------------------

Sub menu part

#submenu li ul li a, #submenu li ul li a:link, #submenu li ul li a:visited,

#submenu li ul li ul li a, #submenu li ul li ul li a:link, #submenu li ul li ul li a:visited,
#submenu li ul li ul li ul li a, #submenu li ul li ul li ul li a:link, #submenu li ul li ul li ul li a:visited {
    color:#58535F;
    width: 148px;
    margin: 0;
    padding: 10px 10px;
    border-top:1px solid #f4f4f4;
    position: relative;
    font-weight:400;
    }
   
#submenu ul li ul li:first-child a,#submenu ul li ul li ul li:first-child a,#submenu ul li ul li ul li ul li:first-child a  {
    border-top:none;
}

   
#submenu li ul li a:hover ,#submenu li ul li ul li a:hover ,#submenu li ul li ul li ul li a:hover {
    color: #4d4854;
    background: #fff;
    }

#submenu li ul {
    font-size: 10px;
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    width: 170px;
    margin: -41px 0px 0px 170px;
    padding: 5px 5px;
    background:#fcfcfc;
    }

#submenu li ul a {
    width: 150px;
    }

#submenu li ul a:hover, #submenu li ul a:active {
    }

#submenu li ul ul {
    margin: -40px 0 0 175px;
    }

#submenu li:hover ul ul, #submenu li:hover ul ul ul, #submenu li.sfHover ul ul, #submenu li.sfHover ul ul ul {
    left: -999em;
    }

#submenu li:hover ul, #submenu li li:hover ul, #submenu li li li:hover ul, #submenu li.sfHover ul, #submenu li li.sfHover ul, #submenu li li li.sfHover ul {
    left: auto;
    }

#submenu li:hover, #submenu li.sfHover {
    position: static;
    }