﻿.motherbar a, .motherbar a:hover, .motherbar a:active 
{
text-decoration:none;
color:#0000FF;
}

a, a:hover, a:active 
{
text-decoration:none;
color:#FFFFFF;
}

.combos option.impar { 
background-color:white;
}
.combos option.par { 
	background-color:lightgrey;
}

#topmenu {
	/* background-image:url(images/background.png); 
	background-repeat:repeat-x; 
	background-color:#009999; */
}

#topheader {
	background-color:#FFFFFF;
}

.reflexo:hover
{-webkit-box-reflect:
  below -1px 
-webkit-gradient(linear, left top, left bottom, from(transparent), 
  color-stop(0.3, transparent), 
  to(rgba(255, 255, 255, 0.5)));
color:#FF0000;
}

.posit
{
width:62px;
height:62px;
position: absolute;
border:0px;
}

/*
.posit:hover{	
background-color: #FF0000; 
opacity: 0.5;
-webkit-box-shadow: 1px 1px 20px #FFFFFF;
   -moz-box-shadow: 1px 1px 20px #FFFFFF;
        box-shadow: 1px 1px 20px #FFFFFF;
}
*/

.bar{display:none; position:absolute;}
/*.bar{display:none; height:4px; background-color:red; position:absolute; z-index:1; border:1px solid black; width: 60px;}*/

.bar-show{display:block !important;}

.progress{height: 4px; position: relative; background-color: limegreen;}

.buildingtitle{background-color:#006666; font-family: 'Segoe UI Light'; text-align: center; margin-top: -40px; border: 1px solid white; width: 124px; margin-left: -32px; padding: 0px 3px 3px 3px; cursor:pointer;}
.buildingtitletext:nth-child(1){font-size:11px;}
.buildingtitletext:nth-child(2){font-size:9px;}

.highlight{
background-color: #00FF00; 
opacity: 0.5;
-webkit-box-shadow: 1px 1px 20px #FFFFFF;
   -moz-box-shadow: 1px 1px 20px #FFFFFF;
        box-shadow: 1px 1px 20px #FFFFFF;
}

.highlight_blue{
background-color: #0000FF; 
opacity: 0.5;
-webkit-box-shadow: 1px 1px 20px #FFFFFF;
   -moz-box-shadow: 1px 1px 20px #FFFFFF;
        box-shadow: 1px 1px 20px #FFFFFF;
}

.highlight_yellow{
background-color: #FFFF00; 
opacity: 0.5;
-webkit-box-shadow: 1px 1px 20px #FFFFFF;
   -moz-box-shadow: 1px 1px 20px #FFFFFF;
        box-shadow: 1px 1px 20px #FFFFFF;
}

/*
input, textarea{
	background-image:url(../images/text_bg.jpg);
	background-repeat:repeat-x;
	border:2px solid #BBBBBB;
} */

input[type="button"],input[type="submit"]{
	/* font-family:'SansationRegular',helvetica,arial; */
	font-size:14;
	color:#666666;
	font-weight:bold;
}

input[type="submit"]:hover{
	color:#000000;
}
/* Classes genéricas para fontes. Usar:
 Padrão, Cor, tamanho */

.button {
	float: left; 
	color:#FFFFFF; 
	background-color:#333333; 
	text-align:center; 
	cursor:pointer;
	-webkit-box-shadow: 2px 2px 2px #333333;
	-moz-box-shadow: 2px 2px 2px #333333;
}

.button:hover {
	-webkit-box-shadow: 1px 1px 1px #000000;
	-moz-box-shadow: 1px 1px 1px #000000;
}
 
/* Padrões */
.table_modern{
	border-collapse:collapse;
    width:100%;
}

.table_modern tr{
	height: 40px;
}

.table_modern thead{
	vertical-align:bottom;
	text-align:left;
}

.table_modern td{
	border-top: 1px solid #EDEDED;
}

.standard
{
text-decoration: none;  
/* font-family:'SansationRegular',helvetica,arial; */
font-family:'MuliRegular',helvetica,arial;
font-size-adjust:0.5;
font-size:20px;
}

/*tipos*/
.neutral
{
color:#999999; 
}

.neutral:hover
{
color:#666666; 
}

.action
{
color:#009900; 
}

.action:hover
{
color:#006600; 
}

.special{font-family: 'Segoe UI Light'; font-size: 30px; margin-right: 15px; cursor:pointer;}

.static
{
color:#000000;
}
.static:hover
{
color:#FF0000;
}

/*tamanho*/
.small{
	font-size:10px;
}
.mini{
	font-size:14px;
}
.medium{
	font-size:15px;
}
.big{
	font-size:30px;
}
.superbig{
	font-size:40px;
}

.extrabig{
	font-size:50px;
}

.link, .link:hover{
	color:blue;
}
.link:hover{
	text-decoration:underline;
}

.pagetitle
{
font-size:40px;
font-weight:bold;
}

.names
{
text-decoration: none;  
font-family: 'MuliRegular',helvetica,arial;
color:#000000; 
font-size: 15px;
}

.names:hover 
{
color:#FF0000; 
}

.companynames
{
text-decoration: none;  
font-family:helvetica,arial;
color:#000000; 
font-weight:bold;
}

.productnames{color:#FFFFFF; font-size: 13px; line-height: 2; font-weight: normal;}

.pagetitles
{
text-decoration: none;  
font-family:helvetica,arial;
color:#000000; 
font-weight:bold;
font-size:40px;
}

.standardbold
{
font-weight:bold;
}

.standardsmallbold
{
text-decoration: none;  
font-family:helvetica,arial;
color:#000000; 
font-weight:bold;
font-size:10px;
}


.companynames:hover 
{
text-decoration: none;  
font-family:helvetica,arial;
color:#0000FF; 
font-weight:bold;
}

@keyframes lefty {
  0% {background-position: left;}
  50% {background-position: right;}
  100% {background-position: left;}
}

/*
.inf {
text-decoration: none;  
font-family:'MuliRegular',helvetica,arial;
text-align:center;
border-width:2px;
border-style:dotted;
font-size:20px;
float:left;
width:100%
}*/

.inf{
    position: relative;
    min-height: 40px;
    margin-bottom: 15px;
    text-align: center;
    font-family: Segoe UI;
    color: white;
    font-size: 28px;
}

.badnews {
	background-color:#E33A34;
}

.goodnews{
	background-color:#009900;
}

img.avatar
{
width:90px;
height:90px;
}

img.avatarsmall
{
width:50px;
height:50px;
}

img.company
{
width:100px;
height:100px;
}

.health
{
position:absolute;
font-size:20px;
font-family:helvetica,arial;
top:0;
left:0;
}

.healthbold
{
position:absolute;
font-size:20px;
font-family:helvetica,arial;
font-weight: bold;
top:0;
left:0;
}

.language{
	position:absolute;
	top:10px;
	right:10px;
}

/* Medals */

.metalOuter{width: 116px; height: 116px; display: table-cell; vertical-align: middle; text-align: center; padding: 4px; border-radius: 100%;}
.metalInner{width: 100px; height: 100px; display: table-cell; vertical-align: middle; text-align: center; padding: 8px; border-radius: 100%;}
.medalContent{width: 100px; text-align:center; height: 100px;border-radius: 100%;vertical-align: middle;display: table-cell;font-size: 50px;font-family: Segoe UI;}
.medalGlow{width: 74px;  text-align: center;  height: 51px;  border-radius: 100%;  /* vertical-align: middle; */  display: table-cell;  /* font-size: 50px; */  /* font-family: 'MuliRegular'; */  background: linear-gradient(180deg, white, transparent);  color: white;position: absolute;margin: -74px 0px 0px 13px;z-index: 5;opacity: .8;}
.medalLabel{width: 140px;  text-align: center; background-color: black; height: 17px; font-size: 13px; color: white; position: absolute; margin-left: -20px; border: 1px solid silver; box-shadow: 4px 4px 4px silver; border-radius: 4px;}
.counter{width: 30px;  text-align: center;  background-color: black;  height: 17px;  font-size: 13px;  color: white;  position: absolute;    border: 1px solid silver;  box-shadow: 4px 4px 4px silver;  border-radius: 4px;    margin: -94px 90px;}

.titanium{background-color: silver; background: linear-gradient(180deg, white, silver);}
.innertitanium{background-color: silver; background: linear-gradient(0deg, white, silver);}
.iron{background-color: silver; background: linear-gradient(180deg, darkgray, black);}
.inneriron{background-color: silver; background: linear-gradient(0deg, darkgray, black);}
.gold{background-color: silver; background: linear-gradient(180deg, gold, goldenrod);}
.innergold{background-color: silver; background: linear-gradient(0deg, gold, goldenrod);}
.silver{background-color: silver; background: linear-gradient(180deg, silver, #555);}
.innersilver{background-color: silver; background: linear-gradient(0deg, silver, #555);}

/* Achievement */
.achievement{width: 548px; float: left; margin: 10px;}
.achievement_name{float: left; color: white; margin: 6px 0 0 6px; position: relative; width: 200px;}
.milestone{float: right;  color: white; margin: 6px 6px 0 0; width: 150px; text-align: right;}
.achievement_bar_content{margin: 6px; position: relative; float: left; width: 367px; height: 20px;}
.achievement_bar_value{margin: 0px; width: 20%; font-size: 16px; color: white;}

.alert{background-color:white; width: calc(100% - 10px); min-height: 60px; margin: 5px !important;}
#alerts{width: 700px; overflow-y: scroll; background-color: #066; margin: 5px; height: calc(100vh - 130px); position: fixed; left: -705px; transition: left 0.1s ease; top:70px;} 
.alertsvisible{left:0vw !important; transition: left 0.1s ease;}

.alertmessage{float: left; width:100%;}
.alertheader{float: left; font-weight: bold;}
.alertdate{float: right;}
.alerticon{width: 50px; background-color: #009999; height: 50px; float: left; position: relative; margin:5px;}
.commentText{width:calc(100% - 70px);}

/* Divs */
.standard_div{
	float:left;
	margin: 5px 4px 5px 4px;
	background:#FFFFFF;
	border:1px solid #CCCCCC;
}
/*
.standard_nest{
	position: relative;
	margin: 0px auto 0px auto;
	padding:10px;
	background:#FFFFFF;
	border:2px solid #CCCCCC;
	width:936px; 
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
}
*/
.standard_nest{position: relative; margin: 0px auto 0px auto; width:1166px; overflow:visible;}

.standard_div, .default_shadow{
	/*-webkit-box-shadow: 5px 5px 5px #666666;
	-moz-box-shadow: 5px 5px 5px #666666;*/
    
	-webkit-box-shadow: 2px 2px 2px #333333;
	-moz-box-shadow: 2px 2px 2px #333333;	
	
	-webkit-transition: -webkit-box-shadow 0.1s linear;
	-moz-transition: -moz-box-shadow 0.1s linear;
}

.dark_shadow{
	-webkit-box-shadow: 2px 2px 2px #333333;
	-moz-box-shadow: 2px 2px 2px #333333;
}

.standard_div, .round{
	border-radius:3px;
}

.leftround{
	border-radius:3px 0px 0px 3px;
}

.topround{
	border-radius:3px 3px 0px 0px;
}


.standard_div:hover, .default_shadow:hover{
	/*-webkit-box-shadow: 2px 2px 5px #222222;
	-moz-box-shadow: 2px 2px 5px #222222;
	-webkit-box-shadow: 1px 1px 1px #333333;
	-moz-box-shadow: 1px 1px 1px #333333;*/
}

.standard_innerdiv{
	margin: 5px 5px 5px 5px;
	position: relative; 
	float: left;
}

.innerdiv{
	margin: 15px;
	position: relative; 
	float: left;
	color: white;
	font-family:Segoe UI;
	font-size:14px;
}

.subtitle{
	font-family:Segoe UI Light;
	font-size:24px;
}

#headerglass{position: fixed; height: 100px; background-image: linear-gradient(black, rgba(255,255,255,0)); width: 100%; z-index: -1; opacity: 0.9;}

.flatbutton{color:#FFFFFF; width:150px; height:21px; text-align:center; cursor:pointer; border-width:0px 0px 4px 0px; background-image:none; border-bottom-style:solid;}
.flatbutton:hover{height:0px; border-bottom-width:25px;}

.flatbutton_mini{color:#FFFFFF; width:90px; height:18px; text-align:center; cursor:pointer; border-width:0px 0px 4px 0px; background-image:none; border-bottom-style:solid;}
.flatbutton_mini:hover{height:0px; border-bottom-width:22px;}

.areabutton{line-height:41px; font-weight:bold; float:left; width:221px; color:#FFFFFF; height:40px; text-align:center; cursor:pointer; border-width:0px 0px 6px 0px; background-image:none; border-bottom-style:solid; margin-right:10px;}
.areabutton:hover{height:0px; border-bottom-width:46px;}


.flatbutton_green{background-color:#00994D;	border-bottom-color: #008040;}
.flatbutton_red{background-color:#E33A34; border-bottom-color: #BF312C;}
.flatbutton_orange{background-color:#FBB05E; border-bottom-color: #CC8F4C;}

.flatbutton_blue_sp{background-color:#0090D9; border-bottom-color: #0073AD;}
.flatbutton_green_sp{background-color:#5F997E; border-bottom-color: #4E7D67;}
.flatbutton_red_sp{background-color:#FF6666; border-bottom-color: #D15454;}
.flatbutton_black_sp{background-color:#404857; border-bottom-color: #17191F;}
.flatbutton_purple_sp{background-color:#9933FF; border-bottom-color: #4C0099;}
.flatbutton_lightpurple_sp{background-color:#6666FF; border-bottom-color: #5757D9;}
.flatbutton_lavender_sp{background-color:#9999FF; border-bottom-color: #5353D1;}
.flatbutton_mimosa_sp{background-color:#F0BF59; border-bottom-color: #A8863E;}
.flatbutton_orange_sp{background-color:#F17F0F; border-bottom-color: #BF5400;}
.flatbutton_gray_sp{background-color:#A2A2A2; border-bottom-color: #828282;}
.flatbutton_crimson_sp{background-color: #CA1A4B; border-bottom-color: #88092C;}
.flatbutton_lightgray_sp{background-color: #9c9c9c; border-bottom-color: #545454;}


.flatbutton_silver{background-color:#B3B3B3; border-bottom-color: #808080;	color:#808080;}

.document{background-color: white; width: 50%; height: 90%; margin: 10px auto 10px auto; color: black; font-family: serif; z-index: 50; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow-y: scroll;} 
.documentTitle{font-size: 24px; text-align: center; margin: 20px; float: left; width: calc(100% - 40px);} 
.documentContent{float: left; width: calc(100% - 80px); margin: 80px 40px 40px 40px; font-size: 18px; text-align: justify; height: 740px;} 
.documentDate{float:left;} 
.documentImage{width: 100%; height: 100px; background-size: contain; margin: 30px auto 20px auto; top: 20px; float: left; background-position-x: center; background-repeat-x: no-repeat;}

.docfundo{position: fixed; background-color: black; width: 100%; height: 100%; top: 0; left: 0; z-index: 49; opacity: 0.8;}

/* Divs of News */
.div1, .div2, .div3{
	float:left;
	padding:5px;
	border:5px;
	overflow:hidden;
}

.div1:hover, .div2:hover, .div3:hover{
	background-color:#F5F5F5;
}

.div1{
	width:294px;
}
.div2{
	width:598px;
}
.div3{
	width:902px;
}

/* New article alert */
.map_alert{
	width:20px;
	height:15;
	font-family:'MuliRegular',helvetica,arial;	
	text-align:center;
	font-size:10px;
	background-color:#FF0000;
	position:absolute;
	z-index:2;
	color:#FFFFFF;
}

/* LogoSet */
.central{
	position:relative;
	margin-left:auto;
	margin-right:auto;
	width:800px;
	height:100px;
	text-align:center;
}

.central .logo {
	position:relative;
	float:left;
	left:290px;
	top:10px;
	width:212px;
	height:78px;
	background:url(images/logo.png);
	z-index:3;
}

.central .logo_message{
	position:relative;
	float:left;
	top:15px;
	left:110px;
	width:171px;
	height:67px;
	background:url(images/message.png);
	z-index:1;	
	-webkit-transition: left 0.5s ease;
	-moz-transition: left 0.5s ease;
}

.central .logo_shadow{
	position:relative;
	float:left;
	top:8px;
	left:78px;
	width:32px;
	height:84px;
	background:url(images/shadow.png);
	z-index:2;
	-webkit-transition: left 0.5s ease;
	-moz-transition: left 0.5s ease;
}
.central:hover .logo_shadow{
	left:98px;
}

.central:hover .logo_message{
	left:200px;
	z-index:1;
}

/* Standard div gradient */
.standard_gradient{
	background-color:#006666;
	background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(0,102,102)), color-stop(1, rgb(0,153,153)));
	background-image:-moz-linear-gradient(center bottom, rgb(0,102,102) 0%, rgb(0,153,153) 100%);
}

.standard_gradient_down{
	background-color:#006666;
	background-image:-webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(0,153,153)), color-stop(1, rgb(0,102,102)));
	background-image:-moz-linear-gradient(center bottom, rgb(0,153,153) 0%, rgb(0,102,102) 100%);
}

.gradientGreen{
	background-color:#008800;
	background-image:-moz-linear-gradient(top, #008800 0%, #00FF00 50%, #008800 100%);
	background-image:linear-gradient(top, #008800 0%, #00FF00 50%, #008800 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#008800), color-stop(50%,#00FF00),color-stop(100%,#008800));
}

.gradientYellow{
	background-color:#CCCC00;
	background-image:-moz-linear-gradient(top, #888800 0%, #FFFF00 50%, #888800 100%);
	background-image:linear-gradient(top, #888800 0%, #FFFF00 50%, #888800 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#888800), color-stop(50%,#FFFF00),color-stop(100%,#888800));
}

.gradientRed{
	background-color:#880000;
	background-image:-moz-linear-gradient(top, #880000 0%, #FF0000 50%, #880000 100%);
	background-image:linear-gradient(top, #880000 0%, #FF0000 50%, #880000 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#880000), color-stop(50%,#FF0000),color-stop(100%,#880000));
}

/* grad two colors*/
.gradGray{
	background-color:#999999;
	background-image:-moz-linear-gradient(top, #999999 0%, #666666 100%);
	background-image:linear-gradient(top, #999999 0%, #666666 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#999999), color-stop(100%,#666666));
}

.gradYellow{
	background-color:#993300;
	background-image:-moz-linear-gradient(top, #CCCC00 0%, #993300 100%);
	background-image:linear-gradient(top, #CCCC00 0%, #993300 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#CCCC00), color-stop(100%,#993300));
}

.gradBlack{
	background-color:#000000;
	background-image:-moz-linear-gradient(top, #333333 0%, #666666 100%);
	background-image:linear-gradient(top, #333333 0%, #666666 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#333333), color-stop(100%,#666666));
}

.gradBlue{
	background-color:#0000CC;
	background-image:-moz-linear-gradient(top, #0000CC 0%, #000099 100%);
	background-image:linear-gradient(top, #0000CC 0%, #000099 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#0000CC), color-stop(100%,#000099));
}

.gradRed{
	background-color:#FF0000;
	background-image:-moz-linear-gradient(top, #FF0000 0%, #880000 100%);
	background-image:linear-gradient(top, #FF0000 0%, #880000 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#FF0000), color-stop(100%,#880000));
}

.gradGreen{
	background-color:#009900;
	background-image:-moz-linear-gradient(top, #009900 0%, #006600 100%);
	background-image:linear-gradient(top, #009900 0%, #006600 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#009900), color-stop(100%,#006600));
}

.gradWhite{
	background-color:#FFFFFF;
	background-image:-moz-linear-gradient(top, #FFFFFF 0%, #DDDDDD 100%);
	background-image:linear-gradient(top, #FFFFFF 0%, #DDDDDD 100%);
	background-image:-webkit-gradient(linear, right top, right bottom, color-stop(0%,#FFFFFF), color-stop(100%,#DDDDDD));
}


/* position */
.center{
	margin-left:auto;
	margin-right:auto;
}

/* article */
.motherbar{position:relative; float:left;}

.motherbar .topTitlebar{	position:relative; /*margin:5px; padding:10px; */ z-index:5;}

.motherbar .textbar{	/*margin:5px; */ position:relative; /*padding:10px; */ z-index:1}

.motherbar .settingbar{position:relative; /*margin:5px; 	padding:10px; */ z-index:4; -webkit-transition: top 0.5s ease; -moz-transition: top 0.5s ease;}

.motherbar .settingbarOpen{top:-110px;}

.settingTransition {
	-webkit-transition: top 0.5s ease; 
	-moz-transition: top 0.5s ease;
}

/* setting */
.setting_off, .setting_on{
	float:left;
	margin:5px 5px 5px 5px;
	font-size:12px;
	cursor:pointer;
	font-weight:bold;
}

.setting_off:hover, .setting_on:hover{
	text-shadow:0px 0px 3px #FFFFFF;
}

.setting_off{
	color:#555555;
}

.setting_on{
	color:#FFFFFF;
}

.motherbar .topTitlebar, .motherbar .settingbar {
	position:relative; 0
	background-color:#000000;
	-webkit-box-shadow: 0px 3px 5px #333333;
	-moz-box-shadow: 0px 3px 5px #333333;
}

.side_shadow{
	background-color:#000000;
	box-shadow: 2px 0px 7px gray;
}

.closebutton{position: absolute; width: 30px; height: 30px; background-color: red; z-index: 1; right: -10px; top: -10px; border-radius: 15px; box-shadow: black 1px 1px 6px; border: 1px solid white; color: white; font-family: arial; font-size: 25px; text-align: center; cursor:pointer;}

body{margin:150px; overflow:auto;}
div#header{position:fixed; top:0; left:0; width:100%; z-index:6; height:0px;}
@media screen{
	body>div#header{position: fixed;}
}
* html body{ overflow:scroll;} 
* html div#content{	height:100%; overflow:auto;}

#logo {padding: 10px;}

#imglogo {width:50px;}

#headerbar .avatar { height:72px; width:72px; position:absolute; z-index:3; margin:5px;}
#headerbar .avatar img { height:72px; width:72px; }
#username { height:24px; width:300px; margin-top:0px; float:left; padding-left:82px; color:#FFFFFF; }
#superusername { height:17px; width:260px; margin-top:0px; float:left; padding-left:82px; color:#FFFFFF; font-size:14px;}
.progressbar {height:15px; width:150px; margin-top:4px; color:#FFFFFF;}
#bars {float:left; margin:3px 0 0 10px; }
.barvalue {height:100%; margin-top:-16px; max-width:100%; -webkit-transition: all 1s linear;}
.baritem {margin-left: 2px; font-size: 12px;}
.barnumeric {margin-right: 2px; font-size: 12px; text-align:right; margin-top:-14px;}
#countryflag {margin-left: 80px; width: 32px; height: 10px; float: left;}
#mail {margin: 5px; width: 50px; height: 20px; float: left; font-size: 12px; color: #FFFFFF;}

#eat {float:left; margin:7px 0 0 5px; height:72px; width:120px;}
#eat select {width:113px;  margin:3px 3px 0 3px;} 
#buttoneat {margin: 30px 3px 3px 3px; width: 113px;}

#study {float:left; margin:7px 0 0 5px; height:72px; width:170px;}
#study select {width:163px;  margin:3px 3px 0 3px;}
#market {float:left; margin:7px 0 0 5px; height:72px; width:170px;}
#market select {width:163px;  margin:3px 3px 0 3px;}

#jobs {float:left; margin:7px 0 0 5px; height:72px; width:170px;}
#jobs select {width:163px;  margin:3px 3px 0 3px;}

#buttonstudy {margin: 30px 3px 3px 3px; width: 163px;}

#work {float:left; margin:7px 0 0 5px; height:72px; width:150px;}
#work select {width:113px;  margin:3px 3px 0 3px;}
#work img {height:36px; width:36px; margin:2px; float:left;}
#work #companyname {position: relative; float: left; width: 106px; margin: 2px; text-align: center; color:#333333;}
#work #daysworked {position: relative; float: left; width: 106px; margin: 2px; text-align: center; color:#FFFFFF;}
#buttonwork {margin: 10px 3px 3px 3px; width: 143px;}

.buildhere{width: 990px; overflow: visible;}
.buildings{float: left; width: 290px; height: 430px; margin: 15px; background-color: lightblue; display: block;}
.imagem-building{background-size: 100%;height: 290px;}
.building_details{height:140px; color:black;}
.building_name{font-weight:bold; line-height: 30px;}
.building_resources{text-align: left; padding-left: 10px;}

#sellproducts{background-color:#404857; overflow:auto; margin-bottom:15px;}
.company_header_image{width:1166px; height:300px;margin-bottom: 15px;}
.product_qtd{width: 90px; height: 20px !important;}
#transfer_to_div{float:right;}

#modal{position: absolute; width: 500px; height: 300px; background-color: white; left: calc(50vw - 250px); top: calc(50vh - 150px);} 
#modalheader{font-size: 34px;}
#modalimage{width: 100px; height: 100px; background-size: 100px 100px;}
#modalmessage{height: 20vh; font-size: inherit;}
#modalbutton{width: 260px; margin: auto;}
/*
#cash{float: left; width: 106px; height: 75px; font-size: 12px; color: white; font-family: Segoe UI; background-color: #099; margin: 6px 0 0 10px; overflow-y: scroll;}
*/
    #cash{color: white; font-family: Segoe UI; background-color: #099;position: fixed; bottom: 5px; height: 35px; margin-left: 5px; font-size: 20px; z-index: 1; overflow: hidden; line-height: calc(4vh + 10px); transition: height 250ms ease;}
    .cash-height{height:inherit !important; transition: height 250ms ease;} 
	
#innercash{padding: 1px; overflow-x: hidden; margin: 0px 0px 5px 0px;}

.hidden{visibility:hidden !important; opacity:0 !important;}
.citylistitem{display:none;}

#chatinput{position: absolute; bottom: 0px; padding: 10px; width: calc(100% - 20px); background-color: #006666; height: 50px;}
#chattalk{height: calc(100% - 7px); width: calc(100% - 94px); float: left;}
#buttontalk{width: 76px; margin-left: 10px; float: left;}
#chatmessagelist{overflow-y: scroll; height: calc(100vh - 251px);}
.chatmessage{margin: 5px; overflow-y: auto;}
.chattext{float: left; background-color: white; width: calc(100% - 63px); margin-left: 5px; height: 100%; overflow-y: auto; min-height: 32px; padding-left: 3px; padding-right: 5px;}
.chatavatar{float:left;}
.chatusername{float: left; width: calc(100% - 178px); margin-left: 5px; overflow: hidden; font-weight: bold; color: #006666; background-color: white; padding-left: 3px; font-size: 11px; line-height: 18px; text-overflow: ellipsis; white-space: nowrap;}
.chattime{float: left; background-color: white; width: 117px; text-align: right; color: #006666; font-size: 10px; line-height: 18px; padding-right: 3px;}
#chat{background-color: #00AAAA; width: 300px; height: calc(100vh - 181px); position: fixed; z-index: 5; right: -300px; top:164px; overflow-y:hidden; transition: right 0.2s ease;}
#openchat{display:block !important; position: fixed; bottom: 0px; right: 0px; z-index: 7; font-size: 15px; color: white; font-family: Segoe UI; width: 90px; height: 36px; text-align: center; line-height: 36px; cursor: pointer;}
.chatvisible{right:0vw !important; transition: right 0.1s ease;}

#chatmessagelist::-webkit-scrollbar {width:12px;}
#chatmessagelist::-webkit-scrollbar-track {background-color: #00AAAA;}
#chatmessagelist::-webkit-scrollbar-thumb {background-color: #006666;}

#zoom>img{display:none;}

#JuridicalPerson{display:none; float: left; width: 100px; font-size: 12px; color: white; font-family: Segoe UI; background-color: #099; margin: 0px 0 0 5px; position: fixed; top: 85px;}
.visible{display:block !important;}
	
	
/* Mobile */
@media only screen and (max-device-aspect-ratio: 1/1){
    
    body{margin:0px;}
    #sellproducts{width: 100vw;}
    #salesReport{width: 100vw;}
    #productivity_report{width: 100vw;}
    #production{width: 100vw;}
    #humanresources{width: calc(100vw - 20px);}
    #area{width: 100vw;}
    #branding{width: calc(100vw - 20px);}
    #storage{width: 100vw;}
    #company_header{width: 100vw;}
    #frmProduction{width: calc(100vw - 20px);}
    #setProduction{margin-right:20px; float:right;}
    .subtitle-text{width:inherit !important;}
    .areabutton{width: calc(100% - 10px) !important; margin: 0px 5px 5px 5px;}
    th{text-align:left;}
    .table_modern{width:calc(100vw - 20px) !important;}
    .company_header_image{width:100vw; height:100px;}
    .standard_nest{width:100vw;}
    .flatbutton{width:80px;}
    .tickets{width:40px;}
    .innerdiv{margin:5px;}
    #select_transfer_to{width:calc(100vw - 20px);}
    .product_name{width:50px;}
    .product_qtd{width: 50px;}
    #transfer_to_div{float:left;}
    #modal{position: absolute; width: 100vw; height: 100vh; left: 0px; top: 0px; z-index:10} 
    #modalheader{font-size:5vw;}
    #modalimage{width: 40vw; height: 40vw; background-size: 40vw 40vw;}
    #modalmessage{height: 20vh; font-size: 3vw;}
    #modalbutton{width: 90vw; height: 5vh; margin: 5vw; font-size: 4vw; bottom: 0px; position: fixed;}
    .zoomterrain{zoom: 250%;}
	#zoom>img{width: 30px; position: fixed; right: 7px; top: 70px; display:block;}
	
    #cash{position: fixed; bottom: 5px; width: calc(50vw - 5px); margin-left: 5px; font-size: 3vh; z-index: 1; overflow: hidden; line-height: calc(4vh + 10px); transition: height 250ms ease;}
    .cash-height{height:inherit !important;}
	
	.standard_innerth_produto{width:30vw !important;}
	.standard_innerth_estoqueinterno{width:20vw !important;}
	.standard_innerth_estoqueexterno{width:15vw !important;}
	.standard_innerth_preco{width:15vw !important;}
	.input_estoqueexterno{padding: 5px 0 !important; width: 100% !important;} 
	.input_preco{padding: 5px 0 !important; width: 100% !important;} 
	
	/* Chat */
	#chat{width: 100vw; height: 100vh; left:100vw; position: fixed; z-index: 6; bottom: 0px; top:initial; transition: left 0.2s ease;}
	#chatmessagelist{height: calc(100vh - 70px);}
	#openchat{display:block !important; position: fixed; bottom: 0px; right: 0px; z-index: 7; font-size: 15px; color: white; font-family: Segoe UI; width: 90px; height: 36px; text-align: center; line-height: 36px;}
	
	.chatvisible{left:0vw !important; transition: left 0.1s ease;}
	
	/*City list*/
	.citylistitem{display:block; width: calc(100vw - 20px); height: 10vh; left: 10px; background-color: #006666; margin: 10px; font-size: 5vw; text-align: center; line-height: 10vh;}
	#worldmap{display:none;}
	
	#imglogo {width:30px;}
	#headerbar .avatar { height:50px; width:50px;}
	#headerbar .avatar img { height:50px; width:50px; }
	#JuridicalPerson{top: 60px;}
	#username { width:280px; padding-left:62px; }
	#superusername { width:280px; padding-left:62px; }

	#alerts{width: 100vw; left: calc(-100vw - 5px); margin:0px; transition: left 0.1s ease;}
	.alertsvisible{left:0vw !important; transition: left 0.1s ease;}

	.document{width: 95%;} 
	
	#buildhere {width: calc(100vw - 10px);}
	.buildhere {width: 100vw;}
	.buildings {width: calc(100% - 30px); float: left; height: 100%; margin: 15px; background-color: lightblue; display: block; }
	.imagem-building { background-size: calc(100vw - 60px); background-position: center; height: 100vw; background-repeat: no-repeat; }
	
	
}
