<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html>
<head>
<title>Registro de Horas</title>
<link rel="icon" href="images/hoja.gif" type="image/x-icon"/>
<link rel="shortcut icon" href="images/hoja.gif" type="image/x-icon"/>
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" href="css/jquery.tweet.css"> <!-- el css es opcional -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script><!-- incluimos a jquery -->
<!--<script language="javascript" src="js/jquery.tweet.js" type="text/javascript"></script> incluimos al plugin -->
<!--<script type='text/javascript'>
$(document).ready(function(){
$(".tweet").tweet({ // aca es donde se le indica donde poner los tweets, le pondremos un div vacio con clase .tweets
username: "", // el usuario
avatar_size: 32, // Ponle 0 si no quieres avatares
count: 5, // Numero de tweets
loading_text: "Cargando..."
});
});
</script>-->
</head>
<body>
<!--start container-->
<div id="container">
<!--start header-->
<header>
<!--start logo-->
<a href="#" id="logo"><img src="images/log.gif" width="400" height="150" alt="logo"/></a>
<!--end logo-->
<!--start menu-->
<nav>
<ul>
<li><a href="index.html" class="current">Inicio</a></li>
<li><a href="cargahoras.html">Carga de horas</a></li>
<li><a href="#">espacio1</a></li>
<li><a href="#">espacio2</a></li>
<li><a href="#">Contacto</a></li>
</ul>
</nav>
<!--end menu-->
<!--end header-->
</header>
<!--start intro-->
<div id="intro">
<img src="images/banner1.png" alt="banner">
</div>
<!--end intro-->
<header class="group_bannner_left">
<hgroup>
<h1>Carga de Horas</h1>
<h2>Para tener un mejor control, carga las horas de tus proyectos, mantenciones, reuniones u otros.
</h2>
</hgroup>
<div class="button black"><a href="cargahoras.html">Haz click aqui y carga tus horas</a></div>
</header>
<!--start holder-->
<div class="holder_content">
<aside class="group2">
<h3>Noticias</h3>
<article class="holder_news">
<h4>Noticia 1<br>
<span>17.08.2015</span></h4>
<p>texto noticia 1
</p>
</article>
<article class="holder_news">
<h4>Noticia 2<br>
<span>17.08.2015</span></h4>
<p>texto Noticia 2
</p>
</article>
<article>
<param name="fps" value="18">
<param name="a1" value="12500">
<param name="pixd" value="29">
<param name="pixangle" value="5">
<param name="radius" value="26">
<param name="roty" value="-4">
<param name="rotx" value="0">
<param name="rotz" value="0.401">
<param name="irotx" value="0">
<param name="iroty" value="0">
<param name="irotz" value="00">
<param name="style" value="1">
<param name="color" value="#0000000">
<param name="bgcolor" value="#FFFFFFF">
<param name="12hour" value="0">
</applet>
</article>
</aside>
<section class="group1">
<h3>Paginas de Interes</h3>
<p>
<table>
<tr>
<td><a href="http://manzano2.unab.cl:9099/" ><img src="images/unabbanner.png" width="150" height="150" alt="UNABBANNER"/></a></td>
<td><a href="http://inb.unab.cl:9099/" ><img src="images/unabprod.jpg" width="150" height="150" alt="UNABPROD"/></a></td>
<td><a href="https://www.grupopayroll.com/AutoservicioRRHH/loginap.aspx?ReturnUrl=%2fAutoservicioRRHH%2fmenuap.aspx" ><img src="images/payroll.gif" width="150" height="150" alt="Payroll"/></a></td>
<td><a href="https://frontline.nfpondemand.com/MRcgi/MRentrancePage.pl" ><img src="footprints.gif" width="150" height="150" alt="FootPrints"/></a></td>
</tr>
<tr style="text-align:center;">
<td>UNAB BANNER</td>
<td>UNAB BANNER PROD</td>
<td>PAYROLL</td>
<td>FOOTPRINTS</td>
</tr>
</table>
</p>
</section>
</div>
<!--end holder-->
</div>
<!--end container-->
<!--start footer-->
<footer>
<div class="container">
<div id="FooterTwo"> 2015, Santiago Chile </div>
<div id="FooterTree"> SERVICIOS ANDINOS </div>
</div>
</footer>
<!--end footer-->
</body>
</html>
/**************************************************
Reset
***************************************************/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, ol, ul, li, form, label, legend, caption, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section, summary {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
iframe{
border:none;
}
ol, ul {
list-style: none;
}
a img {border:none}
aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block}
/**************************************************
Global styles
***************************************************/
html, body {
width:100%;
height:100%;
}
html, body{
font-family:Georgia, "Times New Roman", Times, serif;
font-size: 13px;
color: black;
margin:0 0 1px;
line-height: 1.5;
background-image:url(../images/bg1.png);
background-position:left top;
background-repeat:repeat;
}
p {
margin-bottom:7px;
}
a, p a {
text-decoration:none;
}
a:hover {
text-decoration:underline;
}
h1, h2, h3, h4, h5, h6 {
font-family:Georgia, "Times New Roman", Times, serif;
font-weight: normal;
position:relative;
}
h1{
font-size: 35px;
line-height:1.6;
color:black;
text-transform:capitalize;
text-align:left;
margin-left:40px;
border-bottom:1px dotted black;
}
h1 span{
line-height:1.7px;
color:black;
font-size:14px;
text-transform:none;
display:block;
}
h2{
font-size: 18px;
line-height:1.7;
color:black;
text-align:left;
width:350px;
padding-top:8px;
margin-left:40px;
}
h3{
font-size: 28px;
line-height:1.6;
color:black;
text-transform:none;
text-align:left;
background-color:transparent;
padding-top:12px;
margin-bottom:9px;
border-bottom:1px dotted black;
}
h3 span{
font-size: 12px;
color: black;
text-transform:capitalize;
height:24px;
margin-top:15px;
text-align:left;
display:block;
}
h4{
font-size: 18px;
line-height:1.7;
color:black;
text-align:left;
width:350px;
padding-top:8px;
margin-bottom:12px;
}
h4 span{
font-weight:bold;
font-size:15px;
font-family:Georgia, "Times New Roman", Times, serif;
background-color:#2B90FF;
padding:8px;
color: #fff;
margin-left:20px;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
}
/***************************************************
Main containers
***************************************************/
#container, #container_left, #container_right{
position: relative;
width:100%;
}
#container{
position:relative;
width:980px;
margin:0 auto;
text-align:left;
background-color:white;
padding:15px;
overflow: hidden;
-moz-box-shadow: 0 0 5px 5px #D8D8D8;
-webkit-box-shadow: 0 0 5px 5px #D8D8D8;
box-shadow: 0 0 5px 5px #D8D8D8;
}
.group1 {
float: left;
width: 613px;
position: relative;
background:white;
padding:15px;
margin-bottom:10px;
}
.group2 {
float: right;
width: 277px;
position: relative;
background:white;
padding:15px;
margin-bottom:10px;
margin-left:30px;
}
.group3 {
float: left;
width: 613px;
position: relative;
background:white;
padding:15px;
margin-top:-28px;
}
.group_bannner_left {
width: 380px;
position: absolute;
top:146px;
left:50px;
background:transparent;
margin-top:50px;
}
header{
position: relative;
float:left;
width: 100%;
height:100px;
}
/**************************************************
INTRO
***************************************************/
#intro{
width: 960px;
position: relative;
float: left;
height:318px;
padding:10px;
background:#EAEAEA;
margin-top:17px;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
}
/***************************************************
HOLDERS
***************************************************/
.holder_content {
position: relative;
float: left;
width: 100%;
margin-bottom:8px;
background:white;
}
.holder_content_separator{
margin-bottom:20px;
}
/***************************************************
GALLERY
***************************************************/
a.photo_hover3{
position:relative;
float: right;
margin:5px 13px 8px 0;
padding: 8px;
}
a.photo_hover3{ background-color:white;
border: 1px solid #E1E1E1;
}
a.photo_hover3:hover {
border: 1px dotted #66CCFF;
background-color:#C7EDFF;
opacity:0.9;
z-index:1000;
}
a.photo_hover2{
position:relative;
float: left;
margin:5px 13px 8px 0;
padding: 8px;
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
}
a.photo_hover2{ background-color:white;
border: 1px solid #E1E1E1;
}
a.photo_hover2:hover {
border: 1px solid #E1E1E1;
}
/***************************************************
GALLERY
***************************************************/
.holder_gallery {
width:610px;
float:left;
margin-right:10px;
padding:0;
}
.holder_gallery a.photo_hover {left:42px}
.holder_gallery h3 { clear:left}
.holder_gallery a.name{
font-size:12px;
text-align:left;
position:relative;
margin-top:15px;
display:block;
clear:left;
line-height:15px;
}
.holder_gallery a.name1{
font-size:12px;
position:relative;
display:inline;
text-align:left;
top:20px;
left:0;
}
.holder_gallery a.description{
font-size:12px;
float:left;
position:relative;
margin-right:5px;
padding-top:7px;
color:gray;
width:300px;
display:inline;
}
/**************************************************
FOOTER
***************************************************/
footer{
position:relative;
height:90px;
clear:both;
width:100%;
margin-bottom:18px;
background-color:black;
}
#FooterOne, #FooterTwo, #FooterTree {
position: absolute;
}
#FooterTwo{
position: absolute;
right: 225px;
top:26px;
color:white;
}
#FooterTree{
position: absolute;
left: 225px;
top:26px;
color:white;
}
.container{
width:980px;
margin:0 auto;
background-color:#33CC99;
}
/***************************************************
MENU
***************************************************/
nav{
position:absolute;
width:580px;
top:25px;
right:0;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
background:black;
}
nav ul li{
float: left;
margin-left:16px;
line-height:normal;
}
nav ul li a{
font-size: 19.4px;
font-family:Georgia, "Times New Roman", Times, serif;
color: white;
text-transform:capitalize;
font-weight:normal;
display:block; /* IE6, IE7 line height fix */
padding-bottom:8px;
padding-top:15px;
background-color:transparent;
margin-top:0px;
margin-right:6px;
text-decoration:none;
}
nav ul li a:hover{
color: white;
text-decoration:underline;
}
nav ul li a.current{
background-color:#2B90FF;
padding:15px;
}
.content_menu{
float: left;
width: 274px;
margin-top:-10px;
margin-bottom:15px;
}
.content_menu ul{
margin: 0px;
padding: 0px;
float: none;
}
.content_menu ul li{
float: none;
padding-bottom: 16px;
}
.content_menu ul li a{
font-size:14px;
line-height:normal;
color:#33CC99;
text-align:left;
text-decoration:none;
background-image:url(../images/circle.png);
background-position:left;
background-repeat: no-repeat;
padding-left:20px;
}
.content_menu ul li a:hover{color:#33CC99;}
/***************************************************
SPECIFIC
***************************************************/
#logo{
position:relative;
float:left;
top:10px;
left:0px;
width:250px;
height:160px;
}
.clearing{
clear: both;
display: inline;
width: 100%;
height: 0;
overflow:hidden;
}
.readmore{
font-weight:bold;
font-size:15px;
font-family:Georgia, "Times New Roman", Times, serif;
color:#333333;
}
.readmore a {
color:#333333;
}
.holder_news {
width:274px;
float:left;
border-bottom:1px dotted black;
margin-bottom:10px;
padding-bottom:12px;
}
.button {
display: inline-block;
zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
*display: inline;
vertical-align: baseline;
margin: 8px 41px;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 16px/100% Georgia, "Times New Roman", Times, serif;
padding: .5em 2em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
text-decoration: none;
}
.button:active {
position: relative;
top: 1px;
}
.black {
color: #d7d7d7;
border: solid 1px #333;
background: #333;
background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
background: -moz-linear-gradient(top, #666, #000);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}
.black:hover {
background: #000;
background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
background: -moz-linear-gradient(top, #444, #000);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}
.black a {
color: #ffffff;
}
