iframe {
    aspect-ratio: 16 / 9;
    width: 100% !important;
}.img {
		padding: 20px 20px 30px;
}

.container_flex {
	display: flex;
	heigh: auto;
}

.responsive {
  width: 100%;
  max-width: 600px;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
	
}

.video-container {
  position: relative;
  width: 80%;
  /*padding-top: 56.25%; /* 16:9 Aspect Ratio (height/width * 100) */
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
} 

.container_youtube {
    display: flex;
    justify-content: center;
}

.container_figura_e_legenda {
  padding: 10px 10px 10px 10px;
  display: block;
  flex-direction: column;
  justify-content: space-between;
  border: 2px solid grey;
	
  background-color: #C3C3C3;

}

nav{
    background-color:  #ed7214;
}

nav li{
    display:inline;
}

nav li a{
    display: inline-block;
    font: bold 12px arial, sans-serif;
    color: #ffffff;
    background-color: #ed7214;
    text-decoration: none;
    padding: 10px;
}

nav li a:hover{
    background-color: #9a0e0e;
}

.dropdown-menu{
    position: absolute;
    box-shadow: 0 0 2px black;
    display: none;
}

.dropdown-menu a{
    display: block;
    color: rgb(243, 247, 1);
    background-color:  #ed7214;
}

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

.TextoTitulo{
    color: rgb(255, 255, 255);
    font: bold 12px arial, sans-serif;
}

p.smallText {
	/*display: flex;*/
    font: 16px Verdana, sans-serif;
    /*font-size: 1.2em;*/
	text-align: justify;
	padding: 5px 5px 0px 5px;
}

p.smallTextEsquerda {
	/*display: flex;*/
    font: 16px Verdana, sans-serif;
    /*font-size: 1.2em;*/
	text-align: left;
	padding: 5px 5px 0px 5px;
}
p.legendText {
	display: block;
    font: 14px Verdana, sans-serif;
    text-align: center;
	padding: 5px 5px 5px;
}

p.legendTextLeft {
	display: block;
    font: 14px Verdana, sans-serif;
    text-align: left;
	padding: 0px 0px 0px;
}
p.mediumText {
    font: bold 12px arial, sans-serif;
    font-size: 1.5em;
}
p.largeText {
    font: bold 12px arial, sans-serif;
    font-size: 2em;
}

/* ABAIXO TEM UM 'ID', QUE DEVERÁ SER USADO APENAS UMA VEZ NO CODIGO HTML */

#container_cinza {
  padding: 0px 20px 30px;
  display: flex;
  flex-direction: column;
  background-color: #1E7389;
  border: 5px outset blue;
  text-align: left;
}

/* ABAIXO TEM UMA 'CLASSE', QUE PPODERÁ SER USADO INUMERAS VEZES NO CODIGO HTML */
.containerDiv_linhas {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 5px outset green;
  background-color: red;

}

/* ABAIXO, OUTRA 'CLASSE'... */

.DivQuadroGeral {
  padding: 0px 15px 15px;
  display: flex;
  max-width: 90ch;
  width: 90%;
  margin: auto;
  flex-direction: Column;
  /*border: 1px solid black;*/
  background-color: white;
  font-weight: 600;
  text-align: center;
}

.DivQuadroGeralAlignJustify {
  font: Verdana, sans-serif
  padding: 0px 15px 15px;
  /*display: flex;*/
  width: 80%;
  flex-direction: Column;
  /*border: 1px solid black;*/
  background-color: white; 
  font-weight: nomal; /*normal = 400*/
  font-style: normal
  text-align: justify;
}

.DivRow {
  /*width: 30%;*/
  //display: flex;
  flex-direction: row;
  border: 5px outset red;
  background-color: yellow;
  font-weight: 600;
  text-align: center;
}
.DivRow30 {
  width: 30%;
  display: flex;
  flex-direction: row;
  border: 5px outset red;
  background-color: yellow;
  font-weight: 600;
  text-align: center;
}

.DivRow70 {
  width: 70%;
  display: flex;
  flex-direction: row;
  border: 5px outset red;
  background-color: yellow;
  font-weight: 600;
  text-align: center;
}
.demoDiv_60porcento {
  width: 60%;
  border: 5px outset red;
  background-color: yellow;
  font-weight: 600;
  text-align: left;
}