@charset "utf-8";
/* CSS Document */
@font-face { font-family: Oswald; font-weight:400; src: url('fonts/Oswald-Light.ttf'); }
@font-face { font-family: Oswald; font-weight:500; src: url('fonts/Oswald-Regular.ttf'); }
@font-face { font-family: Oswald; font-weight:600; src: url('fonts/Oswald-Medium.ttf'); }
@font-face { font-family: Oswald; font-weight:700; src: url('fonts/Oswald-Bold.ttf'); }

@font-face { font-family: Roboto; font-weight:300; src: url('fonts/Roboto-Thin.ttf'); }
@font-face { font-family: Roboto; font-weight:400; src: url('fonts/Roboto-Light.ttf'); }
@font-face { font-family: Roboto; font-weight:500; src: url('fonts/Roboto-Regular.ttf'); }
@font-face { font-family: Roboto; font-weight:600; src: url('fonts/Roboto-Medium.ttf'); }
@font-face { font-family: Roboto; font-weight:700; src: url('fonts/Roboto-Bold.ttf'); }

body {
	margin:0px;
	background-color: #ccc;
	background-image: url("../img/Conections.png");
	background-size: 400px auto;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}
input::placeholder {
  color: #aaa;
font-style: normal;
}
img
{
	display:block;
}

table {
	
	padding: 0px;
}

.triangle1 {
	
width: 0;
height: 0;
border: 0 solid transparent;
border-left-width: 7px;
border-right-width: 7px;
border-top: 7px solid #eee;
	
}

.triangle2 {
	
width: 0;
height: 0;
border: 0 solid transparent;
border-left-width: 7px;
border-right-width: 7px;
	
}

.timebar:hover {
	
	background-color: #fff;
	
}

/* --- SCROLLER --- */

.left{
 float: left;
 width: 42px;
 height: 41px;
}

.con_hov {
	
	background-color: transparent;
	
}

.con_hov:hover {
	
	background-color: #eee;
	
}

.pict {
	
	 filter: grayscale(100%);
		background-color: #eee;
}

.nav {
	border: 1px solid #aaa;
	border-right: 0px solid #666;
	border-top: 0px solid white;
}

.nav_name {
	
 background-color: #eee;
	
}

.internal{
 width: 202px;
 height: 41px;
 border: 0px solid #666;
 display: inline-block;
 white-space: normal;
}

.internal:hover .nav_name {
	
	background-color: #fff;
	
}

.internal:hover .pict {
	
	filter: grayscale(0%);
	background-color: #fff;
	
}

.internal:hover .nav {
	
	border: 1px solid #999;
	border-right: 0px solid #666;
	border-bottom: 1px solid #E52929;
	border-top: 0px solid white;
	
}

.center{
 float: right; 
 width: calc(100% - 494px);
 height: 41px;
 overflow: hidden;
 white-space: nowrap;
	font-size: 0px;
}

.right{
 float: right; 
 width: 42px;
 height: 41px;
}

.button_nav {
	border: 0px solid #999;
	background-color: #888;
	color: #ddd;
	width: 42px;
	height: 41px;
}

.button_nav:hover {
	border: 0px solid #999;
	background-color: #666;
	color: white;
}

.button_more {
	background-color: transparent;
	border: 0px solid #999;
	color: #ddd;
	padding: 12px 10px 10px 10px;
}

.button_more:hover {
	border: 0px solid #999;
	color: white;
}

.button_more2 {
	background-color: transparent;
	border: 0px solid #999;
	color: #333;
	padding: 7px 8px 5px 9px;
	cursor: pointer;
}

.button_more2:hover {
	border: 0px solid #999;
	color: black;
}

.name {
	font-family: 'Roboto', sans-serif;
	font-size:35px;
	font-weight: 300;
	color: white;
}

.search {
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	font-weight: 300;
	color: white;
	background-color: transparent;
	border: 0px solid white;
	border-bottom: 0px solid #777;
}

.txt2 {
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight: 500;
	color:#000;
}
	.txt2 a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	color:#000;
	text-decoration: none;
	}
	.txt2 a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	color:#000;
	text-decoration: none;
	}
	.txt2 a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	color:#000;
	text-decoration: underline;
	}

.grid {
  background: #EEE;
  max-width: 1200px;
}

/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */

.grid-sizer,
.grid-item {
  width: 20%;
}

.grid-item {
  height: 120px;
  float: left;
  background: #D26;
  border: 2px solid #333;
  border-color: hsla(0, 0%, 0%, 0.5);
  border-radius: 5px;
}

.grid-item--width2 { width:  40%; }
.grid-item--width3 { width:  60%; }

.grid-item--height2 { height: 200px; }
.grid-item--height3 { height: 260px; }
.grid-item--height4 { height: 360px; }


#navbar {
  background-color: #333; /* Black background color */
  position: fixed; /* Make it stick/fixed */
  top: -50px; /* Hide the navbar 50 px outside of the top view */
  width: 100%; /* Full width */
  transition: top 0.3s; /* Transition effect when sliding down (and up) */
}

/* Style the navbar links */
#navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 15px;
  text-decoration: none;
}

#navbar a:hover {
  background-color: #ddd;
  color: black;
}







.box {
	-webkit-box-shadow: 5px 5px 4px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 5px 5px 4px 0px rgba(0,0,0,0.3);
	box-shadow: 5px 5px 4px 0px rgba(0,0,0,0.3);
}

.con {
	background-color: #ddd; 
}
.con:hover {
	background-color: #eee; 
}

.con2 {
	background-color: #eee; 
}
.con2:hover {
	background-color: #fff; 
}

.name3 {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	line-height: 1.4;
}
.name3 a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	line-height: 1.4;
	text-decoration: none;
}
.name3 a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	line-height: 1.4;
	text-decoration: none;
}
.name3 a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	line-height: 1.4;
	text-decoration: underline;
}

.butt {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
}
.butt a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	text-decoration: none;
}
.butt a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	text-decoration: none;
}
.butt a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color: black;
	text-decoration: none;
}

.name2 {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color: white;
	line-height: 1.4;
}
.name2 a:link {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color: white;
	line-height: 1.4;
	text-decoration: none;
}
.name2 a:visited {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color: white;
	line-height: 1.4;
	text-decoration: none;
}
.name2 a:hover {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color: white;
	line-height: 1.4;
	text-decoration: underline;
}

.txt {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 500;
	color:#000;
}
	.txt a:link {
	font-family: 'Roboto', sans-serif;
	color:#000;
	text-decoration: none;
	border-bottom: 2px dotted grey;
}
	.txt a:visited {
	font-family: 'Roboto', sans-serif;
	color:#000;
	text-decoration: none;
	border-bottom: 2px dotted grey;
}
	.txt a:hover {
	font-family: 'Roboto', sans-serif;
	color:#000;
	text-decoration: none;
	border-bottom: 2px solid black;
}



.txt5 {
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight: 500;
	color:#fff;
}
	.txt5 a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#fff;
	text-decoration: none;
	border-bottom: 2px dotted white;
	}
	.txt5 a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#fff;
	text-decoration: none;
	border-bottom: 2px dotted white;
	}
	.txt5 a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#fff;
	text-decoration: none;
	border-bottom: 2px solid white;
	}

.txt4 {
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight: 500;
	color:#fff;
}
	.txt4 a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: underline;
	}
	.txt4 a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: underline;
	}
	.txt4 a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: none;
	}

.txt41 {
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight: 500;
	color:#000;
}
	.txt41 a:link {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: underline;
	}
	.txt41 a:visited {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: underline;
	}
	.txt41 a:hover {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	color:#000;
	text-decoration: none;
	}

.txt3 {
	font-family: 'Oswald', sans-serif;
	font-size:16px;
	font-weight: 500;
	color:black;
}
	.txt3 a:link {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color:#ccc;
	text-decoration: none;
	border-bottom: 2px solid grey;
	}
	.txt3 a:visited {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color:#ccc;
	text-decoration: none;
	border-bottom: 2px solid grey;
	}
	.txt3 a:hover {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	color:white;
	text-decoration: none;
	border-bottom: 2px solid white;
	}



.lang {
	font-family: 'Oswald', sans-serif;
	font-size:14px;
	font-weight: 500;
	color: #aaa;
}
	.lang a:link {
		font-family: 'Oswald', sans-serif;
		font-size:14px;
		font-weight: 500;
		color: #aaa;
		text-decoration: none;
	}
	.lang a:visited {
		font-family: 'Oswald', sans-serif;
		font-size:14px;
		font-weight: 500;
		color: #aaa;
		text-decoration: none;
	}
	.lang a:hover {
		font-family: 'Oswald', sans-serif;
		font-size:14px;
		font-weight: 500;
		color: white;
		text-decoration: none;
		border-bottom: 2px solid white;
	}











.bigdiv {
	padding: 15px; padding-top: 5px; width: calc(100% - 96px); position: relative; float: left; background-color: darksalmon;
}

.buttonDiv {
	width: 33px; position: relative; float: left; height: 74px; background-color: #666; padding-top: 0px;
}

.headline {
	font-family: 'Oswald', sans-serif;
	font-size:24px;
	font-weight: 500;
	color:#000;
}






.tab {
	font-family: 'Roboto', sans-serif;
	font-size:20px;
	font-weight: 300;
	color:#000;
}

.txt01 {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 500;
	color:#000;
}
	.txt01 a:link {
		color:#000;
		background-color: lightgray;
		text-decoration: none;
		padding: 3px;
		padding-left: 5px;
		padding-right: 5px;
	}
	.txt01 a:hover {
		color:#000;
		background-color: gray;
		text-decoration: none;
	}
	.txt01 a:visited {
		color:#000;
		background-color: lightgray;
		text-decoration: none;
		padding-left: 5px;
		padding-right: 5px;
	}
	.txt01 a:active {
		color:#000;
		background-color: gray;
		text-decoration: none;
	}

.txt02 {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 500;
	color:#000;
}
	.txt02 a:link {
		color:#000;
		text-decoration: none;
		padding: 3px;
		padding-left: 5px;
		padding-right: 5px;
	}
	.txt02 a:hover {
		color:#000;
		text-decoration: none;
	}
	.txt02 a:visited {
		color:#000;
		text-decoration: none;
		padding-left: 5px;
		padding-right: 5px;
	}
	.txt02 a:active {
		color:#000;
		text-decoration: none;
	}

.field {
	border: 1px gray solid;
	padding: 5px;
	height: 20px;
}


.field2 {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 400;
	border: 1px gray solid;
	padding: 10px;
	width: 320px;
}

.button01 {
	font-family: 'Oswald', sans-serif;
	font-size:18px;
	font-weight: 400;
	text-align: center;
	border: 0px solid black;
	background-color: gray;
	color: white;
	width: 100px;
	height: 63px;
}

.button01:hover {
	background-color: black;
	cursor: pointer;
}

.button_tab {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 400;
	text-align: center;
	border: 0px solid black;
	background-color: #555;
	color: white;
	padding: 8px;
}

.button_tab:hover {
	background-color: #333;
	cursor: pointer;
}

.button_tab a:link {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button_tab a:visited {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button_tab2 {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: 400;
	text-align: center;
	border: 0px solid black;
	background-color: #555;
	color: white;
	padding: 8px;
}

.button_tab2:hover {
	background-color: #333;
	cursor: pointer;
}

.button_tab2 a:link {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button_tab2 a:visited {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button_tab1 {
	font-family: 'Roboto', sans-serif;
	font-size:16px;
	font-weight: 400;
	text-align: center;
	border: 0px solid black;
	background-color: #333;
	color: white;
	padding: 8px;
}

.button_tab1:hover {
	background-color: #000;
	cursor: pointer;
}

.button_tab1 a:link {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button_tab1 a:visited {
	cursor: pointer;
	color: white;
	text-decoration: none;
}

.button02 {
	border: 0px black none;
	width:33px;
	height: 32px;
	padding: 5px;
	background-color: #666;
}

.button02:hover {
	background-color: black;
	cursor: pointer;
}

.button04 {
	border: 0px black none;
	padding: 10px;
	background-color: #666;
}

.button04:hover {
	background-color: black;
	cursor: pointer;
}

.button03 {
	border: 0px black none;
	width:33px;
	height: 32px;
	padding: 5px;
	background-color: #e86d6d;
}

.button03:hover {
	background-color: #c13f3f;
	cursor: pointer;
}