MarcosMattos

Publicado em 9 de abr.

	<div id="site_content">

 <div id="strapline">

<div class="menu-container">
 <ul class="menu clearfix">
 <li><a href="?id=inicial">Home</a></li>
 <li><a href="?id=novi">Novidades</a></li>
 <li><a href="#">Fifa Stars Cup</a>
 <!-- Nível 1 -->
 <!-- submenu -->
 <ul class="sub-menu clearfix">
 <li><a href="#">Regulamentos e Cronogramas</a></li>
 <li><a href="?id=galeria" >Galeria de imagens</a></li>
 <li><a href="#">Fifa Stars Cup 2015</a>
 <!-- Nível 2 -->
 <!-- submenu do submenu -->
 <ul class="sub-menu">
 <li><a href="#">Temporada 2015</a></li>
 <li><a href="#">Temporada 2014</a></li>
 <li><a href="#">Temporada 2014</a></li>
 </ul><!-- submenu do submenu -->
 </li>

 </ul><!-- submenu -->
 <li><a href="?id=parceiros">Parceiros</a></li>
 <li><a href="?id=sobre">Sobre a FCFDV</a></li>
 <li><a href="#">rank</a>
 <!-- Nível 1 -->
 <!-- submenu -->
 <ul class="sub-menu clearfix">
 <li><a href="#">Regulamentos e Cronogramas</a></li>
 <li><a href="?id=galeria" >Galeria de imagens</a></li>
 <li><a href="#">Fifa Stars Cup 2015</a>
 <!-- Nível 2 -->
 <!-- submenu do submenu -->
 <ul class="sub-menu">
 <li><a href="#">Temporada 2015</a></li>
 <li><a href="#">Temporada 2014</a></li>
 <li><a href="#">Temporada 2014</a></li>
 </ul><!-- submenu do submenu -->
 </li>

 </ul><!-- submenu -->

 </ul>
</ul>

 </ul>
</div>
 </div><!--close strapline-->

body,

.menu,
.sub-menu {
 margin: 0;
 padding: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 15px;
	z-index: 1000;
}

.clearfix:after{

 content: '.';
 display: block;
 clear: both;
 height: 0;
 line-height: 0;
 font-size: 0;
 visibility: hidden;
 overflow: hidden;
}
.menu,
.sub-menu {
 list-style: none;
	z-index: 1000;
}
.sub-menu {
background-color:#F7D358;
background: -moz-linear-gradient(#676767, #F7D358);
background: -o-linear-gradient(#676767, #F7D358);
background: -webkit-linear-gradient(#676767, #F7D358);
color:#ffffff;
-moz-box-shadow:0 3px 10px 0 #CCC;
-webkit-box-shadow:0 3px 10px 0 #ffffff;
text-shadow:0px 0px 5px #000000;

 z-index: 1000;
}

.menu a {

 text-decoration: none;
 display: block;
 padding: 10px;
 font-family: sans-serif;
 font-size: 14px;
 text-transform: uppercase;
 font-weight: 700;
 z-index: 1000;
}

.menu li {

 z-index: 1000;
}

.menu > li {

 float: left;
}

.menu > li:hover {

background-color:#F7D358;
background: -moz-linear-gradient(#676767, #F7D358);
background: -o-linear-gradient(#676767, #F7D358);
background: -webkit-linear-gradient(#676767, #F7D358);
color:#ffffff;
-moz-box-shadow:0 3px 10px 0 #CCC;
-webkit-box-shadow:0 3px 10px 0 #ffffff;
text-shadow:0px 0px 5px #000000;
 z-index: 1000;
}

.menu li:hover > .sub-menu {

 display: block;
 z-index: 1000;
}
.sub-menu {
 display: none;
 position: absolute;
 min-width: 250px
 z-index: 1000;
}

.sub-menu li:hover {

background-color:#F7D358;
background: -moz-linear-gradient(#676767, #F7D358);
background: -o-linear-gradient(#676767, #F7D358);
background: -webkit-linear-gradient(#676767, #F7D358);
color:#ffffff;
-moz-box-shadow:0 3px 10px 0 #CCC;
-webkit-box-shadow:0 3px 10px 0 #ffffff;
text-shadow:0px 0px 5px #000000;
 z-index: 1000;
}

.sub-menu .sub-menu {

 top: 0;
 left: 100%;
 z-index: 1000;
}

@font-face {

 font-family: PacificoRegular;
 src: url('../fonts/Pacifico-webfont.eot');
 src: local("PacificoRegular"), url('../fonts/Pacifico-webfont.ttf');
}

html
{ height: 100%;}

{ margin: 0;
 padding: 0;}

body

{ font: normal 80% Arial, Helvetica, sans-serif;
 color: #000;
}

/ tell the browser to render HTML 5 elements as block /
article, aside, figure, footer, header, hgroup, nav, section {

 display:block;
}

{ padding: 0 0 10px 0;
 color: #FFF;
 text-shadow: 1px 1px #000;
 line-height: 1.7em;
 font-size: 100% }

img
{ border: 0;}

h1, h2, h3, h4, h5, h6

{ font: normal 175% 'PacificoRegular', Arial, sans-serif;
 color: #000000;
 text-shadow: 0px -1px 0px #000;
 letter-spacing: -1px;
 margin: 0 0 10px 0;}

h2
{ font: normal 165% Arial, Helvetica, sans-serif;}

h3
{ font: normal 130% Arial, Helvetica, sans-serif;}

h4, h5, h6

{ margin: 0;
 padding: 0 0 0px 0;
 font: normal 150% Arial, Helvetica, sans-serif;
 color: #FFF;
 line-height: 1.5em;}

h5, h6

{ font: normal 95% Arial, Helvetica, sans-serif;
 color: #888;
 padding-bottom: 15px;}

span

{ color: #676767;
 text-shadow: 0px -1px 0px #1D1D1D;}

a, a:hover

{ color: #FFF;
 background: transparent;
 font-weight: bold;
 outline: none;
 text-decoration: underline;}

a:hover
{ text-decoration: none;}

{ margin: 2px 0 22px 30px;
 line-height: 1.7em;
 font-style: normal;
 font-size: 100%;}

ol
{ margin: 8px 0 22px 20px;}

ol li
{ margin: 0 0 11px 0;}

#main, header, #banner, #menubar, #site_content, footer, #content_grey, nav

{ margin-left: auto;
 margin-right: auto;
 margin-top: auto;
}

#main
{ padding-bottom: 30px;
 background: transparent url(../images/background.jpg) no-repeat; background-position: top; }

header
{ height: 120px;}

nav
{ height: 50px;}

#menubar
{ width: 940px;
 height: 50px;
 text-align: center;
 margin: 0 auto;
 background: #F7D358;
 background: -moz-linear-gradient(#676767, #F7D358);
 background: -o-linear-gradient(#676767, #F7D358);
 background: -webkit-linear-gradient(#676767, #F7D358);
 border-radius: 0px 0px 15px 15px;
 -moz-border-radius: 0px 0px 15px 15px;
 -webkit-border: 0px 0px 15px 15px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}

 #espaco
 {
 display:block;
 }

#strapline
{ width: 940px;
 height: 100px;
 padding-bottom: 20px;
 text-align: center;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #F7D358);
 background: -o-linear-gradient(#676767, #F7D358);
 background: -webkit-linear-gradient(#676767, #F7D358);}

#welcome_slogan
{ width: 940px;
 float: none;
 height: 170px;
 margin: 0;}

#welcome_slogan H3

{ font: normal 125% 'PacificoRegular', Arial, sans-serif;
 letter-spacing: -2px;
 text-shadow: 0px -1px 0px #ffffff;
 color: #ffffff;}

ul#nav
{ margin:0;}

ul#nav li

{ padding: 0 0 0 0px;
 list-style: none;
 margin: 2px 0 0 0;
 display: inline;
 background: transparent;}

ul#nav li a

{ float: left;
 height: 24px;
 margin: 8px 0 0 20px;
 text-shadow: 0px -1px 0px #000;
 padding: 0px 20px 10px 20px;
 background: transparent;
 border-radius: 7px 7px 7px 7px;
 -moz-border-radius: 7px 7px 7px 7px;
 -webkit-border: 7px 7px 7px 7px;
 text-align: center;
 color: #FFF;
 text-decoration: none;}

ul#nav li.current a

{ color: #FFF;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #1D1D1D);
 background: -o-linear-gradient(#676767, #1D1D1D);
 background: -webkit-linear-gradient(#676767, #1D1D1D);
 text-shadow: none;}

ul#nav li:hover a

{ color: #FFF;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #1D1D1D);
 background: -o-linear-gradient(#676767, #1D1D1D);
 background: -webkit-linear-gradient(#676767, #1D1D1D);
 text-shadow: none;}

#site_content
{ width: 940px;
 overflow: hidden;
 margin-bottom: 30px;
 background: transparent url(../images/transparent.png) repeat;
 border-radius: 15px 15px 15px 15px;
 -moz-border-radius: 15px 15px 15px 15px;
 -webkit-border: 15px 15px 15px 15px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}

.sidebar_container
{ float: right;
 margin: 20px 10px 0 10px;
 width: 210px;
 color: #000000;
 padding: 0;}

.sidebar
{ float: left;
 width: 190px;
 padding-left: 10px;
 margin-bottom: 10px;}

.sidebar_item
{ font: normal 100% Arial, Helvetica;
 width: 190px;}

.sidebar h2

{ padding: 5px 0 0 0;
 font: normal 140% 'PacificoRegular', Arial;
 height: 30px;}

#content
{ width: 680px;
 margin: 0 0 20px 20px;
 float: left;}

.content_item
{ width: 680px;
 margin-top: 20px;
 margin-bottom: 20px;}

.content_container
{ width: 330px;
 margin: 20px 10px 0 0;
 float: left;}

footer

{ width: 940px;
 height: 50px;
 padding-top: 25px;
 padding-bottom: 20px;
 font-weight: bold;
 text-align: center;
 text-shadow: 1px 1px #000;
 color: #FFF;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #1D1D1D);
 background: -o-linear-gradient(#676767, #1D1D1D);
 background: -webkit-linear-gradient(#676767, #1D1D1D);
 border-radius: 15px 15px 15px 15px;
 -moz-border-radius: 15px 15px 15px 15px;
 -webkit-border: 15px 15px 15px 15px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}

footer a, footer a:hover

{ text-shadow: 1px 1px #FFF;
 color: #1D1D1D;
 text-decoration: none;
 padding-bottom: 20px;}

footer a:hover
{ text-decoration: underline;}

footer a, footer a:hover

{ text-shadow: 1px 1px #000;
 color: #FFF;
 text-decoration: none;}

footer a:hover
{ text-decoration: underline;}

.readmore a

{ color: #FFF;
 text-shadow: 1px 1px #004C8C;}

 .button_small
{ font: normal 110% Arial, Helvetica, sans-serif;
 height: 15px;
 width: 88px;
 padding: 5px 2px 7px 2px;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #1D1D1D);
 background: -o-linear-gradient(#676767, #1D1D1D);
 background: -webkit-linear-gradient(#676767, #1D1D1D);
 border-radius: 15px 15px 15px 15px;
 -moz-border-radius: 15px 15px 15px 15px;
 -webkit-border: 15px 15px 15px 15px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;}

.button_small a

{ color: #FFF;
 padding-left: 5px;
 text-shadow: 1px 1px #000;}

.form_settings

{ margin: 15px 0 0 0;}

.form_settings p
{ padding: 0 0 4px 0;}

.form_settings span

{ float: left;
 width: 280px;
 text-align: left;
 text-shadow: none;
 color: #FFF;
 text-shadow: 1px 1px #000;}

.form_settings input, .form_settings textarea

{ padding: 2px;
 width: 299px;
 font: 100% arial;
 border: 1px solid #E5E5DB;
 background: #FFF;
 color: #47433F;}

.form_settings input[type="checkbox"]

{ padding: 2px 0;
 width: 15px;
 font: 100% arial;
 border: 0;
 background: #FFF;
 color: #47433F;
 margin: 28px 0;}

.form_settings .submit

{ font: 100% arial;
 border: 1px solid;
 width: 99px;
 margin: 0 0 0 206px;
 height: 26px;
 padding: 2px 0 3px 0;
 cursor: pointer;
 background: #1D1D1D;
 background: -moz-linear-gradient(#676767, #1D1D1D);
 background: -o-linear-gradient(#676767, #1D1D1D);
 background: -webkit-linear-gradient(#676767, #1D1D1D);
 color: #FFF;}

.slideshow
{ width: 680px;
 height: 250px;
 margin-left: 20px;
 -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
 -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;
 box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px;}

/ styling for the slideshow on the homepage /
ul.slideshow {

 list-style: none;
 width: 680px;
 height: 250px;
 overflow: hidden;
 position: relative;
 margin: 20px 0 0 0;}

ul.slideshow li {

 position: absolute;
 margin: 0;
 padding: 0;
 left: 0;
 right: 0;}

ul.slideshow li.show {
z-index: 500;}

ul img {
border: none;}

#slideshow-caption {
 width: 680px;
 height: 38px;
 position: absolute;
 bottom: 0;
 left: 0;
 z-index: 500;}

#slideshow-caption .slideshow-caption-container {

 padding: 10px 25px 10px 25px;
 background: transparent url(../images/transparent.png) repeat;
 z-index: 1000;}

#slideshow-caption p {

 padding: 0;
 font: normal 130% arial, sans-serif;
 color: #000000;
 text-shadow: 1px 1px #000;}

Discussão (5)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Carregando comentários...