Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Skin Costa Rica

+3
victormenezes
Igor_Ruiz
El Sheldon
7 participantes

El Sheldon El Sheldon  • Qui 27 Jun 2013 - 14:26

Skin Costa Rica Empty Skin Costa Rica Qui 27 Jun 2013 - 14:26

Reputação da mensagem: 100% (1 votos)
Demo : [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Nome da skin: Skin Costa Rica

Fabricante: Web Design & El Sheldon

Adaptado por: El Sheldon

Versão do tema: PunBB

Download:

Comentários adicionais:
[guest]Overral_Header
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
 <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
 <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
 <meta http-equiv="content-script-type" content="text/javascript" />
 <meta http-equiv="content-style-type" content="text/css" />
 <!-- BEGIN switch_compat_meta -->
 <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
 <!-- END switch_compat_meta -->
 <!-- BEGIN switch_canonical_url -->
 <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
 <!-- END switch_canonical_url -->
 {META_FAVICO}
 {META}
 {META_FB_LIKE}
 <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
 {T_HEAD_STYLESHEET}
 {CSS}
 <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
 <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
 <script src="{JQUERY_PATH}" type="text/javascript"></script>
 <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>



 
  
  
 <!-- BEGIN switch_fb_login -->
 <script src="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
 <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
 <!-- END switch_fb_login -->

 <!-- BEGIN switch_ticker -->
 <link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />
 <script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
 <!-- END switch_ticker -->

 <!-- BEGIN switch_ticker_new -->
 <script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
 <script type="text/javascript">//<![CDATA[
 /* Definir le sens de direction en fonction du panneau admin */
 var tickerDirParam = "{switch_ticker.DIRECTION}";
 var slid_vert = false;
 var auto_dir = 'next';
 var h_perso = parseInt({switch_ticker.HEIGHT});

 switch( tickerDirParam )
 {
 case 'top' :
 slid_vert = true;
 break;

 case 'left':
 break;

 case 'bottom':
 slid_vert = true;
 auto_dir = 'prev';
 break;

 case 'right':
 auto_dir = 'prev';
 break;

 default:
 slid_vert = true;
 }

 $(document).ready(function() {

 var width_max = $('ul#fa_ticker_content').width();
 var width_item = Math.floor(width_max / {switch_ticker.SIZE});

 if (width_max > 0)
 {
 $('#fa_ticker_content').css('display','block');

 $('ul#fa_ticker_content li').css('float','left').css('list-style','none').width(width_item).find('img').each(function () {
 if ($(this).width() > width_item)
 {
 var ratio = $(this).width() / width_item;
 var new_height = Math.round($(this).height() / ratio);
 $(this).height(new_height).width(width_item);
 }
 });

 if (slid_vert)
 {
 var height_max = h_perso;

 $('ul#fa_ticker_content li').each( function () {
 if ($(this).height() > height_max)
 {
 height_max = $(this).height();
 }
 } );

 $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
 $('ul#fa_ticker_content li').height(height_max);
 }

 $('#fa_ticker_content').jcarousel({
 vertical: slid_vert,
 wrap: 'circular',
 auto: {switch_ticker.STOP_TIME},
 auto_direction: auto_dir,
 scroll: 1,
 size: {switch_ticker.SIZE},
 height_max: height_max,
 animation: {switch_ticker.SPEED}
 });
 }
 else
 {
 $('ul#fa_ticker_content li:not(:first)').css('display','none');
 $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
 }
 });
 //]]>
 </script>
 <!-- END switch_ticker_new -->

 <script type="text/javascript">
 //<![CDATA[
 $(document).ready(function(){
 <!-- BEGIN switch_enable_pm_popup -->
 pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
 if(pm != null) { pm.focus(); }
 <!-- END switch_enable_pm_popup -->
 <!-- BEGIN switch_report_popup -->
 report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
 if(report != null) { report.focus(); }
 <!-- END switch_report_popup -->
 <!-- BEGIN switch_ticker -->
 ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
 <!-- END switch_ticker -->
 });

 <!-- BEGIN switch_login_popup -->
 var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false;
 <!-- END switch_login_popup -->

 <!-- BEGIN switch_login_popup -->
 $(document).ready( function() {
 $(window).resize(function() {
 var windowWidth = document.documentElement.clientWidth;
 var popupWidth = $("#login_popup").width();
 var mypopup = $("#login_popup");

 $("#login_popup").css({
 "left": windowWidth/2 - popupWidth/2
 });
 });
 });
 <!-- END switch_login_popup -->
 //]]>
 </script>
 {GREETING_POPUP}
 <!-- BEGIN switch_ticker_new -->
 <style>
 .jcarousel-skin-tango .jcarousel-item {
 text-align:center;
 width: 10px;
 }

 .jcarousel-skin-tango .jcarousel-item-horizontal {
 margin-right: {switch_ticker.SPACING}px;
 }

 .jcarousel-skin-tango .jcarousel-item-vertical {
 margin-bottom: {switch_ticker.SPACING}px;
 }
 </style>
 <!-- END switch_ticker_new -->
 {HOSTING_JS}
 <!-- BEGIN google_analytics_code -->
 <script type="text/javascript">
 //<![CDATA[
 var _gaq = _gaq || [];
 _gaq.push(["_setAccount", "{G_ANALYTICS_ID}"]);
 _gaq.push(["_trackPageview"]);
 _gaq.push(['_trackPageLoadTime']);

 <!-- BEGIN google_analytics_code_bis -->
 _gaq.push(['b._setAccount', '{G_ANALYTICS_ID_BIS}']);
 _gaq.push(['b._trackPageview']);
 <!-- END google_analytics_code_bis -->

 (function() {
 var ga = document.createElement("script"); ga.type = "text/javascript"; ga.async = true;
 ga.src = ("https:" == document.location.protocol ? "https://ssl" : "http://www") + ".google-analytics.com/ga.js";
 var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ga, s);
 })();
 //]]>
 </script>
 <!-- END google_analytics_code -->
</head>

<body id="home">
 <!-- BEGIN hitskin_preview -->
 <div id="hitskin_preview" style="display: block;">
 <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
 <div class="content">
 <p>
 {hitskin_preview.L_THEME_SITE_PREVIEW}
 <br />
 <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
 </p>
 </div>
 </div>
 <!-- END hitskin_preview -->

 <!-- BEGIN switch_login_popup -->
 <div id="login_popup" class="module main">
 <div id="login_popup_title" class="main-head">
 <div class="h3">{SITENAME}</div>
 </div>
 <div class="main-content">
 {LOGIN_POPUP_MSG}
 <div id="login_popup_buttons">
 <form action="{S_LOGIN_ACTION}" method="get">
 <input type="submit" class="button2" value="{L_LOGIN}" />
 <input type="button" class="button2" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
 <input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}" />
 </form>
 </div>
 </div>
 </div>
 <!-- END switch_login_popup -->

<div id="outer"><div id="inner"><div id="deeper"><div id="wrapper1">
  
    <header id="masthead">
 <a href="http://www.buonthungpro.com/" class="logo" title="El Sheldon & Cintyng Costa Rica">
 <img src="http://i75.servimg.com/u/f75/18/24/28/08/logo_b10.png" alt="Quazar Mobile & Web Design Costa Rica"/>
 <span>Web Design Costa Rica</span>
 </a>
 <nav role="navigation">
 <ul>
 <li class="n-services"><a href="forum"><span>Principal<strong>Fórum</strong></span></a></li>
 <li class="n-portfolio"><a href="search"><span>Procurar<strong>Buscar</strong></span></a></li>
 <li class="n-team"><a href="memberlist"><span>Membros<b>Member</b></span></a></li>
 <li class="n-blog"><a href="profile?mode=editprofile"><span>Perfil <b>My</b></span></a></li>
                                 <!-- BEGIN switch_user_logged_in -->
 <li class="n-contact"><a href="privmsg?folder=inbox"><span>MP'S<b>Mensagens Privadadas</b></span></a></li>
                         <!-- END switch_user_logged_in -->
 <li class="n-quote"><a href="login?logout=1" class="quotebox"><span>Sair<b>Saindo</b></span></a></li>
                                 <!-- BEGIN switch_user_logged_out -->
                           <li class="n-quote"><a href="register" class="quotebox"><span>Registro <b>Quote</b></span></a></li>
                           <li class="n-quote"><a href="login" class="quotebox"><span>Entre <b>Quote</b></span></a></li>
                                 <!-- END switch_user_logged_out -->
 </ul>
 </nav>
</header><!-- /end .header -->
    
    <section id="featured">
    
 <article class="panel mediaSlide">
     <h2><b>Galaxy Troopers</b> <strong>think mobile.</strong> <span>Adaptado por El Sheldon.</span></h2>
        <a href="http://www.quazarwebdesign.com/innovate/mobile-web-design">Mobile Design Costa Rica</a>
     </article><!--.panel-->

     <article class="panel designSlide">
    
     <h1><b>Launching Creative</b> <strong>Web Design</strong> <span>& Mobile Solutions for all internet travelers</span></h1>
     <a href="http://www.quazarwebdesign.com/innovate/web-design">Launch Web Design</a>
    
     </article><!--.panel-->

    <article class="panel devSlide">
    
     <h2><b>Galaxy troopers</b> <strong>innovate</strong> <span>websites for the future. Let's change the world together.</span></h2>
        <a href="http://www.quazarwebdesign.com/innovate/web-development">Web Development</a>
        
     </article><!--.panel-->
      
     <article class="panel mobileSlide">
     <h2><b>Minds unite to</b> <strong>launch ideas</strong> <span>and shift how we interact with mobile devices.</span></h2>
        <a href="http://www.quazarwebdesign.com/launch">Launch Portfolio</a>    
     </article><!--.panel-->
    

    </section><!-- /end #featured -->
    
    

</div>
 <a id="top" name="top" accesskey="t"></a>

 <div class="minwidth_IE">
 <div class="layout_IE">
 <div class="container_IE">
                          <div id="outer-wrapper2">
 <div class="pun">
 <div id="pun-head">
 
 </div>

 <!-- BEGIN switch_ticker_new -->
 <div id="fa_ticker_block" style="padding-top:4px;">
 <div class="module main">
 <div class="main-content clearfix">
 <div id="fa_ticker_container">
 <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display: none;width: 100%;">
 <!-- BEGIN ticker_row -->
 <li>{switch_ticker.ticker_row.ELEMENT}</li>
 <!-- END ticker_row -->
 </ul>
 </div>
 </div>
 </div>
 </div>
 <!-- END switch_ticker_new -->

 <!-- BEGIN switch_ticker -->
 <div id="fa_ticker_block" style="padding-top:4px;">
 <div class="module main">
 <div class="main-content clearfix">
 <div id="fa_ticker_container">
 <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
 <div class="fa_ticker_content">
 <!-- BEGIN ticker_row -->
 <div>{switch_ticker.ticker_row.ELEMENT}</div>
 <!-- END ticker_row -->
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 <!-- END switch_ticker -->

 <div id="page-body">
 <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
 <div id="outer-wrapper">
 <div id="wrapper">
 <div id="container">
 <div id="content">
 
 <div id="main">
 <div id="main-content">

<!-- BEGIN html_validation -->
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
</body>
</html>
<!-- END html_validation -->

Index Body :
Código:
{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<div class="main">
 <!-- BEGIN message_admin_titre -->
 <div class="main-head">
 <h1 class="page-title">{message_admin_index.message_admin_titre.MES_TITRE}</h1>
 </div>
 <!-- END message_admin_titre -->

 <!-- BEGIN message_admin_txt -->
 <div id="pun-announcement">
 <p>{message_admin_index.message_admin_txt.MES_TXT}</p>
 </div>
 <!-- END message_admin_txt -->
</div>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<div class="main">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
 <div class="user_login_form main-box center">
 <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username" /></label>  
 <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password" /></label>  
 <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>  
 {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
 <!-- BEGIN switch_fb_connect -->
 <span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
 <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
 <!-- END switch_fb_connect -->
 </div>
</form>
</div>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}
<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
   <div class="main-head">
      <div class="page-title">
         <h2>Tình hình diễn đàn</h2>
      </div>
   </div>
   <div class="main-content">
      <div class="starsItem">
         <p class="starsTitle">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">Ai đang trực tuyến?</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->Ai đang trực tuyến?
            <!-- END switch_viewonline_nolink -->
         </p>
         <div class="rightStats">
            <div class="leftStats">
               <img src="http://i48.servimg.com/u/f48/16/58/89/73/user_s10.png" />
            </div>
            <p>{TOTAL_USERS_ONLINE}
               <br />{LOGGED_IN_USER_LIST} {L_ONLINE_USERS} {L_CONNECTED_MEMBERS}</p>
         </div>
      </div>
      <div class="starsItem">
         <p class="starsTitle">Sự kiện</p>
         <div class="rightStats">
            <div class="leftStats">
               <img src="http://i48.servimg.com/u/f48/16/58/89/73/openso10.png" />
            </div>
            <p>{NEWEST_USER}</p>
            <p>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
         </div>
      </div>
      <div class="starsItem">
         <p class="starsTitle">Thống kê</p>
         <div class="rightStats">
            <div class="leftStats">
               <img src="http://i48.servimg.com/u/f48/16/58/89/73/icon_s10.gif" />
            </div>
            <p>{RECORD_USERS}
               <br />{TOTAL_POSTS}
               <br />{TOTAL_USERS}</p>
         </div>
      </div>
      <!-- BEGIN switch_chatbox_activate -->
      <div class="starsItem">
         <!-- BEGIN switch_chatbox_popup -->
         <p id="chatbox_popup" class="starsTitle"></p>
         <script type="text/javascript">
            insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', 'Chatbox');
         </script>
         <!-- END switch_chatbox_popup -->
         <div class="rightStats">
            <div class="leftStats">
               <img src="http://i48.servimg.com/u/f48/16/58/89/73/it_and10.png" />
            </div>
            <p>{TOTAL_CHATTERS_ONLINE} :  {CHATTERS_LIST}</p>
         </div>
      </div>
      <!-- END switch_chatbox_activate -->
   </div>
</div>
<div class="main-box clearfix">
   <p align="center">{GROUP_LEGEND}</p>
</div>
<!-- END disable_viewonline -->
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
 <div class="user_login_form main-box center">
 <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username"/></label>  
 <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password"/></label>  
 <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>  
 {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
 <!-- BEGIN switch_fb_connect -->
 <span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
 <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
 <!-- END switch_fb_connect -->
 </div>
</form>
<!-- END switch_user_login_form_footer -->

{CHATBOX_BOTTOM}

<!-- BEGIN switch_legend -->
<ul id="pun-legend">
 <li>
 <img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /> {L_NEW_POSTS}
 <img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /> {L_NO_NEW_POSTS}
 <img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />&nbsp;{L_FORUM_LOCKED}
 </li>
</ul>
<!-- END switch_legend -->

{AUTO_DST}

<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
 appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
 status: true,
 cookie: true,
 xfbml: true,
 oauth: true
});
//]]>
</script>
<!-- END switch_fb_index_login -->
<style>
  /* [FMvi.Org] Thống kê tình hình diễn đàn*/
.leftStats{float:left;margin-left:-71px;vertical-align:middle;width:60px}
.rightStats{min-height: 50px;border-left:2px solid #CFC9C9;padding-left:10px;width:858px;margin:5px 10px 5px 70px}
  .starsTitle{background-color:#BFBFBF;border:1px solid #989898;color:#F8FF04;font-family:Comic Sans MS;font-variant:small-caps;font-weight:700;text-shadow:1px 1px 1px #000;padding:5px}</style>
[/guest]


Última edição por El Sheldon em Qui 27 Jun 2013 - 14:28, editado 1 vez(es)

El Sheldon El Sheldon  • Qui 27 Jun 2013 - 14:27

Skin Costa Rica Empty Re: Skin Costa Rica Qui 27 Jun 2013 - 14:27

Reputação da mensagem: 100% (1 votos)
CSS
[guest]
Código:
/*Skin rip by El Sheldon*/

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body {
 margin: 0; font-size: 13px; background-image: url(http://www.quazarwebdesign.com/gfx/visual/dpattern.jpg);
}
body, button, input, select, textarea {

 color: #aaa; font-family: sans-serif;

}

/* -- OLD MOBILES -- */
.logo span {font-size: 1.5em; color: #fff; display: block;}
.panel {display: none;}
/* -- OLD MOBILES -- */

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a { color: #6BDFFF; text-decoration: none; outline: none; }
/*a:visited { color: #6BDFFF; }*/
a:hover { color: #fff; }
a:focus { outline: none; }
a:hover, a:active { outline: none; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: 300; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: default; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; 1.5625}
td { vertical-align: top; }


/* CSS DEFAULT RESET */
* { margin: 0; padding: 0; }
hr { display: none; }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-weight: inherit;
 font-style: inherit;
 font-family: inherit;
 vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
 outline: 0;
}
ol, ul {
 list-style: none;
}
table {
 border-collapse: separate;
 border-spacing: 0;
}
caption, th, td {
 text-align: left;
 font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
 content: "";
}
blockquote, q {
 quotes: "" "";
}
b {color: #66DFFF}


/*-------------------------------------------
  GLOBAL STYLES
 -------------------------------------------*/
h1, h2,h3,h4,h5,h6,dl dt {font-family: 'Open Sans', Arial, helvetica, sans-serif; font-weight: 800; color: #fff}


#wrapper {width: 100%; max-width: 960px; margin: 0 auto;}
p {line-height: 1.6em;}
.lang {display: none;}



/*-------------------------------------------    
    HELPERS
-------------------------------------------*/
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/*-------------------------------------------    
    PRINT STYLES
-------------------------------------------*/
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}







body {
 font-family: 'Open Sans', Arial, helvetica, sans-serif;
}

/*-------------------------------------------    
  HEADER
-------------------------------------------*/
header .logo {
 display: block; position: absolute; top: 0; z-index: 999;
 -webkit-transition: padding-top .1s ease-in-out;
 -moz-transition: padding-top .1s ease-in-out;
 -0-transition: padding-top .1s ease-in-out;
 transition: padding-top .1s ease-in-out;
}
header .logo:hover, header .on {padding-top: 50px;}
header .logo img {display: block; margin: 0 auto; width: 230px}
header .logo b {display: none; }
header .logo span {display: block; text-align: center; text-transform: uppercase; font-size: 11px; color: #6CDFFF}






/*-------------------------------------------    
   HOME - SERVICES
-------------------------------------------*/
#services p {padding: 0 .5em; margin: 0 0 15px 0}
#services h2 {font-size: 1.1em; color: #fff; margin: 0 0 18px; font-weight: 300; }
#services h2 strong {color: #6AE1FF}
#services h2 a {color: #fff;}

body#home .serv-icon {
 width: 93px; height: 93px;
}

.serv-icon {
 width: 93px; height: 93px;
 background:none; float: left;
}

.serv-icon a {

 display: block; height: 75px; width: 75px; text-indent: -999em;
 margin: 7px auto 0 auto;
 background: url(http://www.quazarwebdesign.com/gfx/visual/icons.png) no-repeat; padding: 0;
 -webkit-transition: background-position .2s ease-in;
 -moz-transition: background-position .2s ease-in;
 -o-transition: background-position .2s ease-in;
 transition: background-position .2s ease-in;
 
}
.serv-icon .icon-web-design {background-position: 0 0;}
.serv-icon .icon-web-design:hover {background-position: 0 -75px;}

.serv-icon .icon-web-dev {background-position: -76px 0;}
.serv-icon .icon-web-dev:hover {background-position: -76px -75px;}

.serv-icon .icon-mobile {background-position: -150px 2px;}
.serv-icon .icon-mobile:hover {background-position: -150px -73px;}

.serv-icon .icon-multi {background-position: -225px 3px;}
.serv-icon .icon-multi:hover {background-position: -225px -72px;}

.serv-icon .icon-cms {background-position: -300px 3px;}
.serv-icon .icon-cms:hover {background-position: -300px -72px;}

.serv-icon .icon-seo {background-position: -375px 3px;}
.serv-icon .icon-seo:hover {background-position: -375px -72px;}

.serv-icon .icon-stats {background-position: -450px 3px;}
.serv-icon .icon-stats:hover {background-position: -450px -72px;}

.serv-icon .icon-ecommerce {background-position: -525px 3px;}
.serv-icon .icon-ecommerce:hover {background-position: -525px -72px;}

.serv-cta {
 font-size: 10px;
 background: url(http://www.quazarwebdesign.com/gfx/visual/cta-arrow.png) no-repeat 0 50%; text-transform: uppercase;
 padding: 0 0 0 15px; letter-spacing: 1px;
}



/*-------------------------------------------    
  HOME TABS
-------------------------------------------*/
#tab-container {width: 100%; margin: 0; min-height: 320px; border: 1px; padding: 0;}

aside .tabs {width: 53.125%; position: absolute; top: 0; right: 0;}
aside .tabs li {display: block; float: left; width: 30.1960784%;}
aside .tabs li a {
 font-weight: 400;
 display: block; height: 147px; width: 100%;
 text-align: center; text-transform: uppercase;
 color: #fff; font-size: 1.1em;
 -webkit-transition: background-position .3s ease-in-out;
 -moz-transition: background-position .3s ease-in-out;
 -o-transition: background-position .3s ease-in-out;
 transition: background-position .3s ease-in-out;
}
aside .tabs li a:hover, aside .tabs li.on a {background-position: 50% 0;}
aside .tabs li a img {padding: 12px 0 0 0; margin: 0}
aside .tabs li a span {display: block;}
aside .tabs li a span b {display: block; clear: both;}








/*-------------------------------------------    
  FOOTER NAVIGATION
-------------------------------------------*/
#foot-nav dt {margin: 0 0 15px 0; font-size: 16px; font-weight: 400}
#foot-nav dd {margin: 0 0 7px 0;}

#foot-nav dd a {
 -webkit-transition: all .2s ease-in-out;
 -moz-transition: all .2s ease-in-out;
 -o-transition: all .2s ease-in-out;
 transition: all .2s ease-in-out;
}
#foot-nav dd a:hover {padding: 0 0 0 10px;}

/*-------------------------------------------    
   FOOTER
-------------------------------------------*/
#footwrap {width: 100%; max-width: 960px; margin: 0 auto;}
footer p {margin: 0 0 15px}

.social li {display: inline-block; float: left; width: 36px; height: 30px;}
.social li a {
 display: block; text-indent: -999em; width: 100%; height: 100%;
 background: url(http://www.quazarwebdesign.com/gfx/visual/social.png) no-repeat; opacity: 0.6;
 
 -webkit-transition: opacity .2s ease-in;
 -moz-transition: opacity .2s ease-in;
 -o-transition: opacity .2s ease-in;
 transition: opacity .2s ease-in;
}
.social li a:hover {opacity: 1.0;}
.social .twitter a {background-position: 0 -60px;}
.social .facebook a {background-position: 0 -90px;}
.social .rss a {background-position: 0 -30px;}


body#contact footer h2 {display: none;}



/*-------------------------------------------    
  TOP NAVIGATION
-------------------------------------------*/
nav {width: 100%; height: 190px; position: absolute; top: 0; left: 0; z-index: 99}
nav ul {width: 100%; height: 100%; position: relative;}
nav ul li {
 width: 120px; height: 100%; position: absolute; top: 0; cursor: pointer;
 -webkit-transition: background-position .3s ease-in-out;
 -moz-transition: background-position .3s ease-in-out;
 -o-transition: background-position .3s ease-in-out;
 transition: background-position .3s ease-in-out;
}
nav ul li a {
 line-height: 1.1em;
 display: block; width: 100%; height: 100%; text-align: center; color: #fff;
 font-size: 1.2em; text-transform: uppercase;
 font-weight: 300;
}


nav ul li a strong, nav ul li a b {display: block; font-size: 0.7em; letter-spacing: 1px; color: #6BDFFF; font-weight: 300}
nav ul li a span {display: block; padding: 95px 0 0 0;
 -webkit-transition: background-position .3s ease-in-out .2s;
 -moz-transition: background-position .3s ease-in-out .2s;
 -o-transition: background-position .3s ease-in-out .2s;
 transition: background-position .3s ease-in-out .2s;
}








/*-------------------------------------------    
   PRIMARY
-------------------------------------------*/
body#home #outer {background: url(http://www.quazarwebdesign.com/gfx/visual/field1.jpg) repeat-x 50% 0}
body#home #inner {background: url(http://www.quazarwebdesign.com/gfx/visual/field2.jpg) repeat-x 50% 154px}

body.expand #outer {
 
 -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,.5);
 -moz-box-shadow: 5px 5px 10px rgba(0,0,0,.5);
 -o-box-shadow: 5px 5px 10px rgba(0,0,0,.5);
 box-shadow: 5px 5px 10px rgba(0,0,0,.5);
 
}

/*-------------------------------------------    
   HEADER
-------------------------------------------*/
header#masthead {height: 160px; position: relative;}
header .logo {
 width: 260px; left: 50%;
 margin-left: -130px;
 background: url(http://www.quazarwebdesign.com/gfx/visual/logo-ribbon.png) no-repeat 50% 100%;
 padding: 10px 0 70px 0;
}
header .logo span {letter-spacing: 1px; text-align: center; padding: 0 0 0 8px}


/*-------------------------------------------    
   INSIDE CONTAINER
-------------------------------------------*/
#outer { background: url(http://www.quazarwebdesign.com/gfx/visual/inside-field1.jpg) repeat-x 50% 0 }
body#serv #primary {
 height: 820px;
}
body.expand header#masthead {height: 157px;}
body.expand #inner {
 background: url(http://www.quazarwebdesign.com/gfx/visual/home-midfield.jpg) repeat-x 50% 200%; border-bottom: 1px solid #015F92;
}

body#serv.prepare #primary {height: 940px;}
body.prepare #inner {
 background-position: 50% 157%;
}


/*-------------------------------------------    
   TROOPERS
-------------------------------------------*/
body#team #inner {
 background: url(http://www.quazarwebdesign.com/gfx/visual/team_midfield.jpg) repeat-x 50% 100%; border-bottom: 1px solid #015F92;
}
body#team .shine {
 width: 100%; height: 970px;
 background: none;
}




/*-------------------------------------------    
   HOME - TABS
-------------------------------------------*/
aside .tabs li a {
 background: url(http://www.quazarwebdesign.com/gfx/visual/tab-ribbon.png) no-repeat;
 background-position: 50% -147px;
}
aside .tabs li a span b {font-size: .8em}


/*-------------------------------------------    
  TOP NAVIGATION
-------------------------------------------*/
nav ul li {
 width: 120px;
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -190px;
}

nav ul li a span {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-icons.png) no-repeat 0 -15px;
}

nav ul .n-services {left: 0;}
nav ul .n-portfolio {left: 120px;}
nav ul .n-team {left: 240px;}
nav ul .n-blog {right: 240px;}
nav ul .n-contact {right: 120px;}
nav ul .n-quote {right: 0;}

nav ul .n-services a span {background-position: 0 -15px;}
nav ul .n-portfolio a span {background-position: 0 -145px;}
nav ul .n-team a span {background-position: 0 -275px;}
nav ul .n-blog a span {background-position: 0 -405px;}
nav ul .n-contact a span {background-position: 0 -530px;}
nav ul .n-quote a span {background-position: 0 -663px;}

nav ul li:hover  {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
nav ul .n-services:hover span {background-position: -120px -15px;}
nav ul .n-portfolio:hover span {background-position: -120px -145px;}
nav ul .n-team:hover span {background-position: -120px -275px;}
nav ul .n-blog:hover span {background-position: -120px -405px;}
nav ul .n-contact:hover span {background-position: -120px -530px;}
nav ul .n-quote:hover span {background-position: -120px -663px;}


/*-------------------------------------------    
  ACTIVE MENU ITEMS
-------------------------------------------*/
body#serv nav ul .n-services {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#serv nav ul .n-services span {background-position: -120px -15px;}

/*-- FOLIO --*/
body#launch nav ul .n-portfolio {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#launch nav ul .n-portfolio span {background-position: -120px -145px;}

/*-- TEAM --*/
body#team nav ul .n-team {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#team nav ul .n-team span {background-position: -120px -275px;}

/*-- JOURNEY --*/
body#blog nav ul .n-blog {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#blog nav ul .n-blog span {background-position: -120px -405px;}

/*-- CONTACT --*/
body#contact nav ul .n-contact {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#contact nav ul .n-contact span {background-position: -120px -530px;}

/*-- QUOTE --*/
body#quote nav ul .n-quote {
 background: url(http://www.quazarwebdesign.com/gfx/visual/nav-ribbon.png) no-repeat;
 background-position: 50% -5px;
}
body#quote nav ul .n-quote span {background-position: -120px -663px;}



/*-------------------------------------------    
  PREFOOTER
-------------------------------------------*/
#prefooter article {width: 64.5833333%; float: left; margin: 0 1.0416667%}
#prefooter aside {width: 31.25%; float: right; margin: 0 1.0416667%}


/*-------------------------------------------    
  FOOTER NAVIGATION
-------------------------------------------*/
#foot-nav {
 width: 68.75%;
 float: left;
 height: 150px;
}
#foot-nav dl {
 width: 31.25%;
 margin: 0 1%;
 float: left;
}

footer {
 width: 30.2083333%;
 float: right;
 font-size: 11px; color: #999;
 position: relative;
}
footer h2 {margin: 0 0 15px 0}
footer h2 .cta {
 margin: 0; font-size: 16px; background: none;
 /* -- RADIUS -- */
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 -o-border-radius: 0;
 border-radius: 0;
 
 /* -- SHADOW -- */
 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 -o-box-shadow: none;
 
 text-align: left;
 text-transform: none; padding: 0; line-height: 16px;

}
footer h2 .cta:hover {
 padding: 0; background: none; border: none;
 /* -- SHADOW -- */
 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 -o-box-shadow: none;
}






.pun {
line-height: 130%;
margin: 0 auto;
min-width: 768px;
margin-top: 110px;
width: 99%;
}

  #outer-wrapper2{background: #fff url(http://1.bp.blogspot.com/-RKeA7RtDhGQ/UTXCF1U1UjI/AAAAAAAACZk/OQPyswqU2nM/s1600/menu-overlay.png) no-repeat center top;width:930px;text-align:left;font:12px Arial;margin:0 auto;padding:10px;border:1px solid #333;-moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin-top:10px;-moz-box-shadow:0 0 40px #000;-webkit-box-shadow:0 0 5px #000;-goog-ms-box-shadow:0 0 40px #000;box-shadow:0 0 40px #000}


.main .main-foot, .main .main-head {
background-image: url(http://www.quazarwebdesign.com/gfx/visual/dpattern.jpg);
-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
text-align: center;
}
[/guest]

El Sheldon El Sheldon  • Qui 27 Jun 2013 - 14:29

Skin Costa Rica Empty Re: Skin Costa Rica Qui 27 Jun 2013 - 14:29

Reputação da mensagem: 100% (1 votos)
So dando mais um recado , desculpa pelo trial post.

Não traduzi tudo.

Igor_Ruiz Igor_Ruiz  • Qui 27 Jun 2013 - 14:41

Skin Costa Rica Empty Re: Skin Costa Rica Qui 27 Jun 2013 - 14:41

Legal, esta sem bug igual na demo ?

El Sheldon El Sheldon  • Qui 27 Jun 2013 - 14:42

Skin Costa Rica Empty Re: Skin Costa Rica Qui 27 Jun 2013 - 14:42

Acho que está , não sei e mais provável que não.

victormenezes victormenezes  • Dom 7 Jul 2013 - 16:52

Skin Costa Rica Empty Re: Skin Costa Rica Dom 7 Jul 2013 - 16:52

loko!

IonutzD IonutzD  • Qua 14 maio 2014 - 15:16

Skin Costa Rica Empty Re: Skin Costa Rica Qua 14 maio 2014 - 15:16

gracias  for the theme

Anonymous Convidado  • Qui 8 Jan 2015 - 6:28

Skin Costa Rica Empty Re: Skin Costa Rica Qui 8 Jan 2015 - 6:28

thaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaanks

Zeek Zeek  • Sex 15 Abr 2016 - 8:09

Skin Costa Rica Empty Re: Skin Costa Rica Sex 15 Abr 2016 - 8:09

Muito Boa!!!!!!!!!!!!

Chave4 Chave4  • Sex 15 Abr 2016 - 10:36

Skin Costa Rica Empty Re: Skin Costa Rica Sex 15 Abr 2016 - 10:36

Obrigado por Compartilhar muito foda mesmo !

GodNaru GodNaru  • Seg 25 Abr 2016 - 9:37

Skin Costa Rica Empty Re: Skin Costa Rica Seg 25 Abr 2016 - 9:37

Muito bom! Queria usar esse pro meu fórum, mas preciso mudar fotos, umas cores e talz e não sei fazer isso ;-;

Conteúdo patrocinado  • 

Skin Costa Rica Empty Re: Skin Costa Rica

Permissões neste sub-fórum
Não podes responder a tópicos