﻿/*
 * Copyright (C) 2015 Roberto Asano Junior
 * The use, modification or distribution of this program without permission
 * is prohibted and subject to legal enforcement and punishment.
 */
* {
    margin: 0;
    padding:0;
    border:0;
}
body {
    background-image: url("../images/background.png");
    background-repeat: no-repeat;
    background-color: white;
} 
.cabeca{
    position:absolute;
    left:0px;
    top:0px;
    padding-top:10px;
    clear:both;
    width: 1000px;
    font-family: "arial";
    text-align: center;
    z-index:10;
}
.explicacao{
    position:absolute;
    left:0px;
    top:40px;
    margin-left:50px;
    padding-right:100px;
    padding-top:10px;
    clear:both;
    max-width: 1000px;
    width:100%;
    font-family: "arial";
    font-size: 24px;
    text-align: left;
    z-index:10;    
}
#aflu1{
    position:absolute;
    left:81px;
    top:162px;
    float:left;
    width: 120px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    color:navy;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}
#aflu2{
    position:absolute;
    left:392px;
    top:225px;
    float:left;
    width: 120px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    color:navy;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}
#aflu3{
    position:absolute;
    left:705px;
    top:286px;
    float:left;
    width: 120px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    color:navy;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}
#u1m1{ 
    position:absolute;
    left:238px;
    top:201px;
    max-height:20px;
    float:left;
    z-index: 10;   
} 
#u2m1{ 
    position:absolute;
    left:545px;
    top:257px;
    max-height:20px;
    float:left;
    z-index: 10;   
} 
#u3m1{ 
    position:absolute;
    left:859px;
    top:322px;
    max-height:20px;
    float:left;
    z-index: 10;   
} 
#u1m2{ 
    position:absolute;
    left:238px;
    top:241px;
    max-height:20px;
    float:left;
    z-index: 8;   
} 
#u2m2{ 
    position:absolute;
    left:545px;
    top:297px;
    max-height:20px;
    float:left;
    z-index: 8;   
} 
#u3m2{ 
    position:absolute;
    left:859px;
    top:362px;
    max-height:20px;
    float:left;
    z-index: 8;   
} 
#u1m3{ 
    position:absolute;
    left:238px;
    top:281px;
    float:left;
    z-index: 6;   
} 
#u2m3{ 
    position:absolute;
    left:545px;
    top:337px;
    max-height:20px;
    float:left;
    z-index: 6;   
} 
#u3m3{ 
    position:absolute;
    left:859px;
    top:402px;
    float:left;
    z-index: 6;   
} 
.inputnumber {
   width: 50px;
   text-align: center;
   font-family: "arial";
   font-size: 20px;
}
#r1m1{ 
    position:absolute;
    left:93px;
    top:263px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}  
#r2m1{ 
    position:absolute;
    left:400px;
    top:328px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}  
#r3m1{ 
    position:absolute;
    left:714px;
    top:385px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}  
#r1m2{ 
    position:absolute;
    left:93px;
    top:303px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 8;
} 
#r2m2{ 
    position:absolute;
    left:400px;
    top:368px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 8;
} 
#r3m2{ 
    position:absolute;
    left:714px;
    top:425px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 8;
}  
#r1m3{ 
    position:absolute;
    left:93px;
    top:343px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 6;
}  
#r2m3{ 
    position:absolute;
    left:400px;
    top:408px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 6;
}  
#r3m3{ 
    position:absolute;
    left:714px;
    top:465px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 6;
} 
#tm1{ 
    position:absolute;
    left:231px;
    top:594px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
}  
#tm2{ 
    position:absolute;
    left:231px;
    top:634px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 8;
} 
#tm3{ 
    position:absolute;
    left:231px;
    top:674px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 6;
} 
#dm1{ 
    position:absolute;
    left:851px;
    top:588px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
} 
#dm2{ 
    position:absolute;
    left:851px;
    top:628px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 8;
} 
#dm3{ 
    position:absolute;
    left:851px;
    top:668px;
    float:left;
    width: 50px;
    text-align: center;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 6;
} 
#resultado{ 
    position:absolute;
    left:65px;
    top:804px;
    float:left;
    width: 200px;
    text-align: right;
    font-family: "arial";
    font-size: 24px;
    text-shadow: 8px 8px 20px #cccccc;
    z-index: 10;
} 
#botao{
    position:absolute;
    left:0px;
    top:880px;
    clear:both;
    max-width: 1000px;
    width:100%;
    font-family: "arial";
    text-align: center;
    font-size: 24px; 
    z-index:10;
}
.formabt{
    position:absolute;
    background: #cccccc;
    left:400px;
    top:20px;
    padding-top: 10px;
    height: 40px;
    width: 150px;
    box-shadow: 5px 5px 10px #888888;
    border-radius:10px;
    font-family: "arial";
    text-align: center;
    font-size: 24px;    
}
#rodape1{
    position:absolute;
    left:0px;
    top:1010px;
    clear:both;
    max-width: 1000px;
    width:100%;
    margin:auto;
    font-family: "arial";
    text-align: center;
    z-index:10;
}
#usuario{
    position:absolute;
    left:0px;
    top:1010px;
    clear:both;
    max-width: 1000px;
    width:100%;
    margin:20px;
    font-family: "arial";
    font-size: 24px;
    text-align: left;
    z-index:10;
}
#f5nome { 
    background-color: #eeeeee;
    border: 10px;    
    padding-left: 5px;
    width: 700px;
    text-align: left;
    font-family: "arial";
    font-size: 24px;
    z-index: 10;
}
#f5ra { 
    background-color: #eeeeee;
    border: 10px;
    padding-left: 5px;
    width: 180px;
    text-align: left;
    font-family: "arial";
    font-size: 24px;
    z-index: 10;
}
/* Formatação dos resultados */
#graficos{
    position:absolute;
    left:0px;
    top:1150px;
    clear:both;
    max-width: 1000px;
    width:100%;
    margin:auto;
    font-size: 24px;
    font-family: "arial";
}
#chart1{
    position:absolute;
    left:200px;
    top:0px;
    clear:both;
    width:650px;
    height: 550px;
    font-family: "arial";
    z-index:8;
}
#chart2{
    position:absolute;
    left:200px;
    top:600px;
    clear:both;
    width:650px;
    height: 550px;
    font-family: "arial";
    z-index:8;
}
#canvas1{
    position:absolute;
    left:248px;
    top:100px;
    clear:both;
    width:500px;
    height: 400px;
    z-index:10;
}
#canvas2{
    position:absolute;
    left:248px;
    top:700px;
    clear:both;
    width:500px;
    height: 400px;
    z-index:10;
}
#rodape2{
    position:absolute;
    left:0px;
    top:2310px;
    clear:both;
    max-width: 1000px;
    width:100%;
    margin:auto;
    font-family: "arial";
    text-align: center;
    z-index:10;
}
#avaliacao{
    position:absolute;
    left:40px;
    top:2340px;
    clear:both;
    max-width: 960px;
    width:100%;
    margin:auto;
    font-family: "arial";
    text-align: left;
    z-index:10;
}