pageStyle.css

body {
	background-color: rgb(38,38,38);
	color: rgb(191,191,191);
	margin: 0;
}

a:visited {
  color: rgb(100,100,100);
}

a:link {
  color: rgb(191,191,191);
}

a:hover {
  opacity: 0.7;
}


img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

.profile {
  border-radius: 50%;
}

.hidden {
  display: none;
  text-align: center;
  font-size: 40px;
  cursor: not-allowed;
}

.column.side:hover .visible
{
  display: none;
}

.column.side:hover .hidden {
  display: block;
}

video {
  max-width: 100%;
  height: auto;
}

p {
  display: block;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}

.footer {
	background-color: #333;
	padding: 10px;
  position: fixed;
  bottom: 0;
  width: 100%;
  text-align: center;
}

.navbar {
  overflow: hidden;
  background-color: #333;
  width:100%;
}

.navbar a {
  float: right;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: right;
  overflow: hidden;
}

.dropbtn:hover{
  cursor: pointer;
  opacity:0.7;
}

.dropdown .dropbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #111;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #333;
  min-width: 160px;
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #111;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropbtn.active {
  background-color: rgb(89,146,217);
}

.active {
  background-color: rgb(89,146,217);
}

/* Create three unequal columns that floats next to each other */
.column {
  float: left;
}

/* Left and right column */
.column.side.left{
  width: 10%;
}

.column.side.right{
  width: 15%;
}

/* Middle column */
.column.middle {
  width: 70%;
  margin: 20px;
  line-height: 30px;
  font-size: 16px;
}



.container{
  padding:0 0 3em 0;
}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column.side.left, .column.middle,.column.side.right {
    width: 100%;
  }
  img{
    border-radius: 0;
  }
  table{
    width:100%;
  }
}



.fab, .fa-envelope {
  padding: 10px;
  font-size: 20px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  align-content: center;
}

/* Add a hover effect if you want */
.fab:hover, .fa-envelope:hover {
  opacity: 0.7;
}
.fab:visited, .fa-envelope:hover {
  color:rgb(191,191,191);
}

/* Set a specific color for each brand */

/* Facebook */
.fa-instagram {
  color: rgb(191,191,191);
}

/* Twitter */
.fa-twitter {
  color: rgb(191,191,191);
}

.fa-github {
  color: rgb(191,191,191);
}

.fa-envelope {
  color: rgb(191,191,191);
}
/*cinzento: 191,191,191
azul:89, 146, 217
laranja: 247, 150, 70*/


/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #333; 
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #111; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #222; 
}

td, th {
  text-align: center;
  padding:20px;
}


#twitter-widget-holder {  
  max-width:100%; 
  padding:20px; 
  border-radius:3px; 
}