Arias Template

Joi Mar 07, 2013 3:45 pm

Mesaje : 1486

Credite : 7203

Warning : 0 Points

Reputatie : 57

Localizare : Bucuresti

Detinator Server : Da

Detinator Steam : Da

Previzualizare: Nu are
Autor: MDesign
Inspirata: Elegant Themes
Dificultate: 6/6

Cod:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>ARIAS TEMPLATE INDEX</title> <link href="http://elhxl.tk/fan.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://elhxl.tk/js/js/jquery.js"></script> <script type="text/javascript" src="http://elhxl.tk/js/js/carousel.js"></script> <script type="text/javascript" src="http://elhxl.tk/js/js/fancybox.js"></script> <script type="text/javascript" src="http://elhxl.tk/js/js/custom.js"></script> </head> <body><div id="wrapper"> <div id="logo"> <h1><img src="http://extreme-play.ro/images/p6wzv94ft5pfpn5eyco0.png" alt="custom logo" /></h1> </div> <ul id="nav"> <li><a href="#" class="homepage">Acasa</a></li> <li><a href="#" class="forum">Forum</a></li> <li><a href="#" class="portfolio">Portfoliu</a></li> <li><a href="ymsgr:sendIM?ymailutau" class="contact">Contact</a></li> </ul> <div id="contents"> <div id="main_slider"> <a href="#" class="buttons prev">left</a> <div class="viewport"> <ul class="overview"> <li> <a href="forum/index.html"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png"/></a><h2>FORUMUL TAU</h2><p>TEXTTESTTEXT AICI SCRI TEXTUL TAU SA NU UITI SA PASTREZI COPRIGHT !</a>. </li> <li> <img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png"/><h2>Forumul Tau</h2><p>TEXTESTETETETETESX</p> </li> </ul> </div> <a href="#" class="buttons next">right</a> </div> <div id="designer_info"> </br><a href="forum/index.html"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" /></a> <h2><a href="#">Forumul TAu</a></h2> <p>TEXTEST</br></p> <h3>TEXTEXTTEXT/h3> <h3>TEXTTEXTTEXT</h3> <p>TEXTTEXTTEXT</br> TEXTTEXTTEXT</br> TEXTTEXTTEXT;</br> TEXTTEXTTEXT</br> TEXTTEXTTEXT</br></p> </div> <div id="portofoliu"> <h2>Cu ce ne ocupam noi...</h2> <ul> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> <li><a class="grouped_elements" rel="group1" href="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" title="Lorem ipsum dolor sit amet"><img src="http://extreme-play.ro/images/ahzz3q8tmzmkc9txvmez.png" alt="works" width="100" height="100" /></a></li> </ul> </div> </div> <div id="social_icons"> <ul> <li><a href="#" class="twitter"></a></li> <li><a href="#" class="dribbble"></a></li> <li><a href="#" class="flickr"></a></li> <li><a href="#" class="facebook"></a></li> <li><a href="#" class="deviantart"></a></li> </ul> </div> </div> </body> <style type="text/css"> /* General - reset default */ * { margin: 0; padding: 0; } @font-face { font-family: 'TitilliumText14L400wt'; src: url('fonts/TitilliumText400wt.eot'); src: local('TitilliumText14L'), local('TitilliumText14L-400wt'), url('fonts/TitilliumText400wt.woff') format('woff'), url('fonts/TitilliumText400wt.ttf') format('truetype'), url('fonts/TitilliumText400wt.svg#TitilliumText14L-400wt') format('svg'); } a { text-decoration: underline; color: #1a1a1a; font-weight: bold; } img { border: none; } :focus{ outline: none; } a:hover { color: #000000; } h2, h3 { font-family: TitilliumText14L400wt, Helvetica, Arial, sans-serif; font-size: 9pt; font-family: TitilliumText14L400wt, Helvetica, Arial; } h2 { font-size: 20pt; margin-bottom: 18px; padding-top: 20px; } h3 { font-size: 13pt; margin-bottom: 13px; padding-top: 15px; } p { font-family: Helvetica, Arial, sans-serif; } /* Document */ body { background: #000 url(http://extreme-play.ro/images/227o4tf9piw8hjkifhpe.jpg); font-size: 9pt; line-height: 1.5em; } #wrapper { background-image: url(http://extreme-play.ro/images/omqp1eyjhbbeas2rowkj.png); background-repeat: no-repeat; width: 904px; height: 820px; margin: 0px auto; } /* Logo and navigation */ #logo { float: left; position: relative; z-index: 1; } #logo h1 { position: absolute; top: 132px; left: 50px; } ul#nav { padding: 249px 0px 0 139px; width: 68px; float: left; list-style: none; z-index:2; position: relative; } .homepage { display: block; width: 68px; height: 66px; background: url(http://extreme-play.ro/images/5kg0at182yuasq76bnj.gif) top; text-indent: -9999px; } .homepage:hover { background-position: bottom; } .forum { display: block; width: 68px; height: 66px; background: url(http://extreme-play.ro/images/olpit31upmrmqapgowo5.gif) top; margin-top: 8px; text-indent: -9999px; } .forum:hover { background-position: bottom; } .portfolio { display: block; width: 68px; height: 66px; background: url(http://extreme-play.ro/images/uc6emgj7omfikefxzm3.gif) top; margin-top: 17px; text-indent: -9999px; } .portfolio:hover { background-position: bottom } .contact { display: block; width: 68px; height: 66px; background: url(http://extreme-play.ro/images/4lempzmmi1g3yo3432.gif) top; margin-top: 11px; text-indent: -9999px; } .contact:hover { background-position: bottom } .tooltip { float: left; position: relative; top: -88px; right: -33px; z-index: 3; color: #eee; background: #333; padding: 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; font-family: TitilliumText14L400wt, Helvetica, Arial; font-size: 12pt; } /* Content wrapper */ #contents { width: 550px; height: 305px; text-shadow: 1px 1px 0px #c8ccd5; float: left; font-size: 9pt; font-family: TitilliumText14L400wt; margin: 250px 0 0 0px; overflow: hidden; } uu /* Main page with slider */ #main_slider { margin-left: 10px; } #main_slider .viewport { float: left; width: 440px; height: 320px; overflow: hidden; position: relative; padding: 20px 30px 0 0; } #main_slider .buttons { background: url(http://extreme-play.ro/images/gpotkcvpfdf1lsygvy0u.png) no-repeat 0 0; display: block; float: left; width: 19px; height: 24px; position: relative; text-indent: -9999px; top: 125px; left: 0; } #main_slider .next { background-position: 0 -24px; right: 0; } #main_slider .disable { visibility: hidden; } #main_slider .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 500px; left: 0; top: 0; } #main_slider .overview li { float: left; margin: 0 20px 0 0; padding: 1px; width: 500px; height: 320px; } #main_slider h2 { padding-top: 50px; } #main_slider p { width: 210px; float: left; } #main_slider img { float: left; margin-right: 15px; } .download { display: block; width: 184px; height: 26px; background: url(http://extreme-play.ro/images/2xw1jboi9qf18pry1.png) top; margin: 15px 0 10px 0; float: left; } .download:hover { background-position: bottom; } /* About page */ #designer_info { padding: 0 20px; display: none; } #designer_info img { float: left; position: relative; left: -8px; } #designer_info p { width: 500px; } /* Featured works */ #portofoliu { display: none; margin-left: 20px; } #portofoliu ul { margin: 10px; } #portofoliu ul li { display: inline; float: left; padding: 5px 7px; } #portofoliu ul li img { border: 2px solid #ddd; } #portofoliu ul li img:hover { border: 2px solid #f4f4f4; } /* Social icons */ #social_icons { float: right; position: relative; top: 130px; right:115px; } #social_icons ul li { float: left; margin: 0 12px; list-style: none; } #social_icons ul li a { display: block; width: 32px; height: 32px; } #social_icons ul li a:hover { background-position: 0px -32px; } .twitter { background: url(http://extreme-play.ro/images/bgnwgovg5q14qoaqvm9.jpg) no-repeat 0px 0px; } .dribbble { background: url(http://extreme-play.ro/images/iigoqop5n2rx96men2rw.jpg) no-repeat 0px 0px; } .flickr { background: url(http://extreme-play.ro/images/ua6tcp0ade1d4kll6vc.jpg) no-repeat 0px 0px; } .facebook { background: url(http://extreme-play.ro/images/4frej2j7yasgdpstq154.jpg) no-repeat 0px 0px; } .deviantart { background: url(http://extreme-play.ro/images/hs6w5rx2pz2k18h5le.jpg) no-repeat 0px 0px; } </style>