└── finding-peace ├── img ├── slogan-bg.jpg ├── whats-new.jpg ├── callout-bg.jpg ├── nav-link-bg.jpg ├── top-link-bg.jpg ├── slogan-bamboo.jpg └── nav-link-hover-bg.jpg ├── layout-two.html ├── index.html ├── layout-three.html └── style.css /finding-peace/img/slogan-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/slogan-bg.jpg -------------------------------------------------------------------------------- /finding-peace/img/whats-new.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/whats-new.jpg -------------------------------------------------------------------------------- /finding-peace/img/callout-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/callout-bg.jpg -------------------------------------------------------------------------------- /finding-peace/img/nav-link-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/nav-link-bg.jpg -------------------------------------------------------------------------------- /finding-peace/img/top-link-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/top-link-bg.jpg -------------------------------------------------------------------------------- /finding-peace/img/slogan-bamboo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/slogan-bamboo.jpg -------------------------------------------------------------------------------- /finding-peace/img/nav-link-hover-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SHANMATHI19/Ms_Azure/HEAD/finding-peace/img/nav-link-hover-bg.jpg -------------------------------------------------------------------------------- /finding-peace/layout-two.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Finding Peace One Column 5 | 6 | 7 | 8 | 9 | 15 | 16 |
17 |
18 |

What's New?

19 |

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam iaculis adipiscing mi. Nulla vulputate mi at lorem. Fusce tincidunt dui non lectus euismod faucibus.

20 |

Learn more…

21 |
22 | 23 |
24 | 25 | 38 | 39 |
40 |

Secondary Page With Full Width

41 |

December 07, 2006

42 |

Just a varient on the Design that could be used for secondary pages that need more room for content/copy.

43 |

Subject Title

44 |

December 05, 2006

45 |

Duis tincidunt leo eu urna. Proin auctor malesuada tellus. Praesent sit amet leo. Aenean vel augue. In hac habitasse platea dictumst. Sed pulvinar malesuada lectus. Fusce sit amet erat vitae nulla varius tempus. Praesent sed elit sed turpis dignissim malesuada. Sed a lectus. Sed ornare volutpat massa. Quisque nec neque vitae lacus ullamcorper dapibus. Phasellus et libero eget felis viverra viverra. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas vitae quam commodo dui vestibulum lobortis. Mauris luctus erat a risus.Learn more…

46 |
47 | 48 | 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /finding-peace/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Finding Peace 5 | 6 | 7 | 8 | 9 | 15 | 16 |
17 |

Finding Peace.

18 |

Searching for the balance between style and valid markup.

19 |
20 | 21 | 34 | 35 |
36 |
37 |

Taking Refuge In Simplicity.

38 |

I wanted to develop a theme that brings across a quiet, yet solid feel to it that could potentially be used for both commercial or personal web sites. I think i came pretty close to what I was looking for.

39 |

Learn more…

40 |
41 | 42 |
43 | 44 |
45 |

Never Underestimate The Open Source Community

46 |

December 07, 2006

47 |

The development of OpenDesigns.org by a dedicated group of open source Designers in such a short amount of time proves the value of openly sharing knowledge and experiance with others. I can honestly say that my own skills have been strengthened by being a part of the open source community.

48 |

If you take this Design and adapt it to your own needs with further improvements, please consider passing it along to the open source community so others can continue to share and learn.

49 |

A Word About The Design

50 |

December 05, 2006

51 |

The Finding Peace Design was built on a Windows machine with valid CSS and XHTML 1.0 Strict. It was tested in Windows for FF 2.0, IE 6.0 and with Mac OS X for Safari 1.3.

52 |

It's relased under the Creative Commons License so do what you want with it. Although you're not obligated to maintain a link back to me as the Designer, leaving it in place would be appreciated.

53 |
54 | 55 | 59 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /finding-peace/layout-three.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Finding Peace 2 Columns 5 | 6 | 7 | 8 | 9 | 15 | 16 |
17 |
18 |

What's New?

19 |

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam iaculis adipiscing mi. Nulla vulputate mi at lorem. Fusce tincidunt dui non lectus euismod faucibus.

20 |

Learn more…

21 |
22 | 23 |
24 | 25 | 38 | 39 |
40 | 48 | 49 |

Secondary Page With Sidebar

50 |

December 07, 2006

51 |

Another varient of the Design for secondary pages but with a right-floated side bar.

52 |

Subject Title

53 |

December 05, 2006

54 |

Duis tincidunt leo eu urna. Proin auctor malesuada tellus. Praesent sit amet leo. Aenean vel augue. In hac habitasse platea dictumst. Sed pulvinar malesuada lectus. Fusce sit amet erat vitae nulla varius tempus. Praesent sed elit sed turpis dignissim malesuada. Sed a lectus. Sed ornare volutpat massa. Quisque nec neque vitae lacus ullamcorper dapibus. Phasellus et libero eget felis viverra viverra. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas vitae quam commodo dui vestibulum lobortis. Mauris luctus erat a risus.Learn more…

55 |
56 | 57 | 61 | 62 | 63 | 64 | -------------------------------------------------------------------------------- /finding-peace/style.css: -------------------------------------------------------------------------------- 1 | /* 2 | Template: Finding Peace 3 | Designer: Rayk Web Design (http://www.raykDesign.net) 4 | Date: December 2006 5 | */ 6 | 7 | /* General Styles */ 8 | body { 9 | margin:0; 10 | padding:0; 11 | background-color:#ffffff; 12 | font-family:Verdana, Arial, Helvetica, sans-serif; 13 | font-size:1em; 14 | color:#000000; 15 | } 16 | 17 | a { 18 | color:#B9400B; 19 | text-decoration:underline; 20 | } 21 | 22 | a:hover { 23 | color:#999999; 24 | text-decoration:none; 25 | } 26 | 27 | a:visted { 28 | color:#B9400B; 29 | text-decoration:underline; 30 | } 31 | 32 | /* Top Links */ 33 | #toplinks { 34 | margin:0; 35 | padding:0; 36 | height:25px; 37 | background-color:#3F3F3F; 38 | background-image:url(img/top-link-bg.jpg); 39 | background-repeat:repeat-x; 40 | } 41 | 42 | #toplinksnav { 43 | margin:0 auto; 44 | padding:0 1em 0 0; 45 | width:780px; 46 | text-align:right; 47 | } 48 | 49 | #toplinksnav p { 50 | margin:0; 51 | padding:0; 52 | font-size:.7em; 53 | color:#cccccc; 54 | line-height:25px; 55 | } 56 | 57 | #toplinksnav a { 58 | color:#ffffff; 59 | text-decoration:none; 60 | } 61 | 62 | #toplinksnav a:hover { 63 | color:#B3CC8A; 64 | text-decoration:none; 65 | } 66 | 67 | #toplinksnav a:visted { 68 | color:#ffffff; 69 | text-decoration:none; 70 | } 71 | 72 | /* Slogan Area */ 73 | #slogan { 74 | position:relative; 75 | margin:0; 76 | padding:0; 77 | height:310px; 78 | line-height:310px; 79 | background-color:#3F3F3F; 80 | background-image:url(img/slogan-bg.jpg); 81 | background-repeat:repeat-x; 82 | } 83 | 84 | .sloganfloat { 85 | float:left; 86 | margin:0; 87 | padding:0; 88 | border:none; 89 | } 90 | 91 | #slogan h1 { 92 | position:relative; 93 | margin:0 12% 0 0; 94 | padding:0; 95 | text-align:right; 96 | font-family:Arial, Helvetica, sans-serif; 97 | color:#ABB49B; 98 | } 99 | 100 | #slogan p { 101 | margin:-285px 12% -25px 0; 102 | padding:0; 103 | text-align:right; 104 | font-size:.8em; 105 | letter-spacing:.1em; 106 | color:#5C5C5C; 107 | } 108 | 109 | /* Navbar */ 110 | #navbar { 111 | margin:0; 112 | padding:0; 113 | height:50px; 114 | background-color:#3F3F3F; 115 | background-image:url(img/nav-link-bg.jpg); 116 | background-repeat:repeat-x; 117 | } 118 | 119 | #navbarblock { 120 | margin:0 auto; 121 | padding:0; 122 | width:780px; 123 | line-height:50px; 124 | font-size:.95em; 125 | text-align:center; 126 | } 127 | 128 | #navbarblock ul { 129 | margin:0 .7em 0 .7em; 130 | padding:0; 131 | display:inline; 132 | list-style-type:none; 133 | text-align:center; 134 | } 135 | 136 | #navbarblock ul li { 137 | display:inline; 138 | position:relative; 139 | } 140 | 141 | #navbarblock a { 142 | color:#ffffff; 143 | text-decoration:none; 144 | padding:16px 20px 15px 20px; 145 | } 146 | 147 | #navbarblock a.now { 148 | color:#CDBEE6; 149 | text-decoration:none; 150 | } 151 | 152 | #navbarblock a:hover { 153 | color:#eeeeee; 154 | text-decoration:none; 155 | background-image:url(img/nav-link-hover-bg.jpg); 156 | background-repeat:repeat-x; 157 | background-position:top; 158 | } 159 | 160 | #navbarblock a:visted { 161 | color:#ffffff; 162 | text-decoration:none; 163 | } 164 | 165 | 166 | /* Call Out Area */ 167 | #callout { 168 | margin:0; 169 | padding:0; 170 | height:143px; 171 | background-color:#A5C274; 172 | background-image:url(img/callout-bg.jpg); 173 | background-repeat:repeat-x; 174 | } 175 | 176 | #calloutblock { 177 | position:relative; 178 | margin:0 auto; 179 | padding:5px; 180 | width:770px; 181 | font-size:.9em; 182 | text-align:left; 183 | } 184 | 185 | #calloutblock h2 { 186 | margin:.5em 0 -.1em 0; 187 | color:#323232; 188 | font-family:Georgia, "Times New Roman", Times, serif; 189 | font-size:1.5em; 190 | font-weight:lighter; 191 | } 192 | 193 | #calloutblock p { 194 | margin:.3em 0 0 0; 195 | color:#ffffff; 196 | font-size:.8em; 197 | } 198 | 199 | .calloutfloat { 200 | float:left; 201 | position:relative; 202 | margin:13px 15px 0 0; 203 | padding:0; 204 | border:none; 205 | height:104px; 206 | } 207 | 208 | #calloutblock a { 209 | color:#323232; 210 | text-decoration:underline; 211 | } 212 | 213 | #calloutblock a:hover { 214 | color:#616161; 215 | text-decoration:none; 216 | } 217 | 218 | #calloutblock a:visted { 219 | color:#323232; 220 | text-decoration:underline; 221 | } 222 | 223 | /* Text Area */ 224 | #textarea { 225 | position:relative; 226 | margin:0 auto; 227 | padding:5px; 228 | width:770px; 229 | font-size:.9em; 230 | text-align:left; 231 | } 232 | 233 | #textarea h2 { 234 | margin:.5em 0 -.5em 0 !important; 235 | margin:.5em 0 -.9em 0; 236 | color:#B9400B; 237 | font-family:Georgia, "Times New Roman", Times, serif; 238 | font-size:1.5em; 239 | font-weight:lighter; 240 | } 241 | 242 | #textarea p { 243 | font-size:.9em; 244 | } 245 | 246 | #textarea .date { 247 | margin-bottom:-1em; 248 | font-size:.7em; 249 | color:#828181; 250 | text-transform:uppercase; 251 | } 252 | 253 | /* Side Bar */ 254 | #sidebar { 255 | float:right; 256 | position:relative; 257 | margin:0 0 0 5px; 258 | padding:5px 5px 5px 10px; 259 | width:240px; 260 | background-color:#ffffff; 261 | border-left:1px solid #D6C4A4; 262 | } 263 | 264 | #textarea h3 { 265 | margin:.5em 0 -.5em 0 !important; 266 | margin:.5em 0 -.9em 0; 267 | color:#988056; 268 | font-family:Georgia, "Times New Roman", Times, serif; 269 | font-size:1em; 270 | } 271 | 272 | #sidebar p { 273 | font-family:Arial, Helvetica, sans-serif; 274 | font-size:.8em; 275 | color:#B59A6A; 276 | } 277 | 278 | /* footer area */ 279 | #footer { 280 | position:relative; 281 | margin:0 auto; 282 | margin-top:15px; 283 | padding:5px 5px 15px 5px; 284 | width:770px; 285 | color:#999999; 286 | text-align:center; 287 | clear:both; 288 | } 289 | 290 | #footer p { 291 | font-size:.7em; 292 | } 293 | 294 | #footer a { 295 | color:#DC9F85; 296 | text-decoration:underline; 297 | } 298 | 299 | #footer a:hover { 300 | color:#cccccc; 301 | text-decoration:none; 302 | } 303 | 304 | #footer a:visted { 305 | color:#DC9F85; 306 | text-decoration:underline; 307 | } --------------------------------------------------------------------------------