/*==================================================================================================*/
/* CONFIGURAÇÃO PARA CELULAR =======================================================================*/
/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
@media (max-width: 700px) {

    body {
       /* background: url("img/fundo_teste_m.jpg");
        background-repeat: no-repeat;                  */
        width:100%;
        justify-content: center;
        align-content: center;
        text-align: center;
    }

    .vCapa {
      width: 400px;
      
    }

    .tudo {
      width:100%;
      justify-content: center;
      align-content: center;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-itens: center;
      place-items: center;
      background-color: #ffffff;
/*      background-image: linear-gradient(white, #E6E6E6, white);  */
    
    }  
    
    .cabec {

        width:90%;
        align-content: right;
        /*border: 1px solid green;*/
    }

    .img_cab {
      /*  height:100%; */
    }

    .img_menu {

        width:75%;
        display: flex;

    }
    
    .checkboxG {
        width:40px; 
        height:40px;;
    }

    .row_menu {
      display: none;
  /*    justify-content: center;
      align-itens: center;
      align-content: center;    */
      width:80%;
      box-sizing: border-box;
    }

    .menu {
        width: 100%;
        height: 50px;
        background: white;
        font-size: 22px;
        font-family: Arial, Helvetica, sans-serif;
        color: 0B3B17;
        z-index: 20;
        border: 1px solid #D8D8D8;
        border-radius: 0px;
        box-sizing: border-box;
  /*     border-width: 3px 0px 3px 0px;  25px top, 10px right, 4px bottom and 35px left */
    }

    /* div do conteudo*/
    .row {
      display: grid;
      flex-wrap: wrap;
      align-content: center;
      justify-content: center;
/*      place-items: center;  */
      width:95%;
      flex-direction: column;
      grid-gap: 10px;
    }

hr {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
  color: 201d1d;
  width: 95%;
}

    .row-destaque {
      display: grid;
      background-color: #D8D8D8;
      flex-wrap: wrap;
      justify-content: center;
      width:90%;
      grid-gap: 20px;
      padding: 10px;
    }    

    /* div do evento/roteiro */
    .divRoteiro {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
        justify-content: center;
        align-content: center;
        display: inline-table;
        box-shadow: 3px 3px 8px grey;
        padding: 0px;
        border-radius: 5px;
        background-color: #ffffff;
    }
    
    .divInfoRoteiro {
        padding: 10px;
    }
    
    /* div de informações do roteiro/evento */
    .divNome {
        width: 100%;
        height: 110px;
        background-color: F7D358;
        background-image: linear-gradient(F7D358, F4FA58);
        text-align: center;
        display: flex;
        flex-wrap: wrap;
        place-content: center;
        font-size: 18px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
        border-radius: 5px;
    }
    
.divNomeRoteiro {
    //background-color: #ffffff;
    background-image: linear-gradient(F7D358, F4FA58);
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    font-size: 18px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: 201d1d;
    border-radius: 2px;
}

.divRoteiroI {
    width: 270px;
    /*height: 96%; */
    border: 0px solid black;    
    text-align: center;
    justify-content: center;
    align-content: center;
    display: inline-grid;
    box-shadow: 3px 3px 6px grey;
    padding: 15px;
    border-radius: 5px;
    box-sizing: border-box;
}
    
    .divTituloRow1 {
        text-align: center;
        font-size: 56px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
        width: 30%;
        display: none;
    }
    
    .row_1 {
      display: flex;
      flex-wrap: wrap;
      width:95%;
      grid-gap: 30px;
      box-shadow: 3px 3px 8px grey;
      padding: 10px;
      border-radius: 5px;
      text-align: left;
    }

    .row_aluguel {
      width:90%;
      box-shadow: 3px 3px 8px grey;
      padding: 5px;
      border-radius: 5px;
      place-content: center;
      text-align: center;
      align-itens: center;
      align-content: center;
      justify-content: center;
    }
    
    .img-aluguel {
      width: 300px;

    }

    .pagina {
        width: 100%;
        height: 100%;
        flex-wrap: wrap;
        background-color: F7D358;
        text-align: center;
        font-size: 24px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        vertical-align: baseline;
        color: 201d1d;
        border-radius: 5px;
    }

    .titulo-g {
        width: 85%;
        //height: 40px;
        //background-color: F7D358;
        //background-image: linear-gradient(yellow, grey);
        display: flex;
        flex-wrap: wrap;
        text-align: center;
        font-size: 24px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        place-content: center;
        color: 201d1d;
        border-radius: 5px;
        //box-shadow: 3px 3px 8px grey;
    }
    
.titulo-i {
    width: 100%;
    height: 40px;
    //background-color: F7D358;
    //background-image: linear-gradient(yellow, grey);
    text-align: center;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    place-content: center;
    justify-content: center;
    color: 201d1d;
    border-radius: 5px;
    box-shadow: 3px 3px 8px grey;
}

    .escola {
        width: 350px;
        text-align: center;
        font-size: 18px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
    }
    
    .divImagem {
        display: none;
    }

    .rodape {
        display: flex;
        flex-wrap: wrap;
        place-content: center;
        justify-content: center;
        align-content: center;
        width:100%;
        height: 750px;
        background-image: linear-gradient(#1C1C1C, #0B2F3A);
    }

    .itemR {
      text-align: left;
      width:100%;
      display: block;
      font-size: 18px;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      color: FFFFFF;
      border-bottom: 3px solid white;
      border-right: 0;
    }
    
    .texto {
      width: 90%;
    }
    
.destaque-produto {
    width: 90%;

}
    
    .texto_esq {
        font-size: 16px;
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
        width:95%;
        height:600px
        display: flex;
        flex-wrap: wrap;        
    }    
    
    .texto_dir {
        font-size: 16px;
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
        width:95%;
        height:600px
        display: flex;
        flex-wrap: wrap;
    }
    
    .texto_meio {
        font-size: 16px;
        text-align: left;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        color: 201d1d;
        width:80%;
        height:600px
        display: flex;
        flex-wrap: wrap;
        text-align: center;
    }
    
    /* galeria */
    /* The grid: Four equal columns that floats next to each other */
    .column {
      padding: 5px;
    }

    /* Style the images inside the grid */
    .column img {
      opacity: 0.8;
      cursor: pointer;
    }

    .column img:hover {
      opacity: 1;
    }

    .img-gal {
       width:165px;
       height:150px';
    }

    .gal {
      display: flex;
      flex-wrap: wrap;
      align-itens: center;
      align-content: center;
      justify-content: center;
      place-items: center;
      width: 100%;
      box-sizing: border-box;
    }

    /* The expanding image container (positioning is needed to position the close button and the text) */
    .container {
      position: relative;
      display: none;
      width: 95%;
    }
    
    /* Expanding image text */
    #imgtext {
      position: absolute;
      bottom: 15px;
      left: 15px;
      color: white;
      font-size: 20px;
    }
    
    /* Closable button inside the image */
    .closebtn {
      position: absolute;
      top: 10px;
      right: 15px;
      color: white;
      font-size: 35px;
      cursor: pointer;
    }
    
    /* Style the tab */
    .tab {
      display: none;
    }

   /* Style the tab content */
    .tabcontent {
      display: block;
      flex-wrap: wrap;
    /*  font-size: 18px;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold; */
      color: 201d1d;
      text-align: left;
      width:95%;
    }
    
    .tituloAba {
      display: block;
      font-size: 20px;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      color: 201d1d;
      text-align: left;
      background-color: f1c013
    }
    
    .final {
        text-align: center;
        width:100%;
        height: 50px;
        background-color: 0B2F3A;
        font-size: 18px;
        font-family: Arial, Helvetica, sans-serif;
        color: FFFFFF;
    }
    .whats {
      position: fixed;
      right: 15%;
      top: 90%;
      margin-top: -2.5em;
    }


/* Form ***********************************************************************************************************/
.form-font {
	font-weight: normal !important;
	padding: 3px;
	font-size: small;
}
.div-form td, .div-form td input, .div-form td select, .div-form td textarea {
	font-size: small;
	padding: 3px;

}
#dados .div-form td .checkbox {
	/*margin-top: 4px;*/
}
.div-form {
	margin-top: 0px;
	text-align: center;
	width: 100%;

}
#dados .div-form table {
	text-align: center;
	width: 100%;
	
}

.div-form th {
	padding: 8px 8px 8px 8px;
	//white-space: nowrap;
	text-align: right;
	font-weight: normal;
	font-size: small;
	color: #545454;
}
#acoes .div-form th,#acoes .div-form td {

	//white-space: nowrap;
	text-align: left;
	font-weight: normal;
	font-size: small;
	color: #545454;
}
#dados .div-form td {
	padding: 8px 8px 8px 4px;
	text-align: left;
	//white-space: nowrap;
}
#dados .div-form td span {
	/*vertical-align: middle;*/
}
#dados .div-form .separator {
	font-weight: normal;
	padding: 3px;
	border-left: 0;
	border-right: 0;
	border-top: 0;
	color: #333;
	padding: 5px 5px 5px 5px;
}
#dados .div-form td img {
	/*
	vertical-align: middle;
	padding: 0px 4px 0px 4px;
	*/
}
#dados .div-form .comment {
	margin-top: 20px;
	font-size: x-small;
	color: #999999;
	text-align: left;
}

/* View **********************************************************************************************************/
.div-view {
	width: 90%;
	text-align: center;
}
.div-view tr td {
	text-align: left;
	padding: 5px 10px 5px 10px;
	vertical-align: top;
}
.div-view tr td .label {
	font-weight: bold;
	color: #666666;
	font-size: x-small;
	text-transform: uppercase;
	white-space: nowrap;
	padding-bottom: 2px;
}
.div-view tr td .value {
	font-size: small;
	font-weight: normal;
	color: #333333;
	padding: 3px;
	max-width: 400px;
	min-width: 40px;
	min-height: 16px;
}
.div-view .separator {
	font-weight: normal;
	font-size: x-small;
	text-transform: uppercase;
	padding: 5px;
}
/* Table *********************************************************************************************************/
.div-table {
	width: 100%;
	text-align: center;
	font-size: small;
}
.div-table table {
	width: 100%;
}
.div-table th {
	font-weight: bold;
	padding: 8px 4px 8px 4px;
}

.div-table td {
	border-bottom: 1px solid #E6E6E6;
	padding: 8px 4px 8px 4px;
}
.div-table td input {
	vertical-align: bottom;
}

.div-table tr.odd {
	//background-color: #FFFFFF;
}
.div-table tr.even {
	background-color: #FDFDFD;
}
.div-table .separator {
	font-weight: bold;
	text-align: left;
	border: 0;
}
.div-table td a {
	color: #464646;
	text-decoration: underline;
}
.div-table td a:hover {
	color: #D54E21;
	text-decoration: underline;
}
.div-table th a {
	text-decoration: none;
}
.div-table th a:hover {
	text-decoration: none;
}
.highlight-mouse {
	background-color: #F5F5F5 !important;
}
.highlight-selected {
	background-color: #EFF8FD !important;
}
#div-table-status {
	text-align: center;
	font-size: small;
	color: #999999;
}
#div-table-filtered {
	padding: 3px 0 3px 0;
	padding: 5px;
	margin: 0 0 3px 0;
	font-size: small;
}
#div-table-filtered a {
	text-decoration: none;
}
#div-table-filtered a:hover {
	text-decoration: underline;
}

    .image-fader {
      width: 98%;
      height: 200px;
    /*  border: 1px solid red;  */
      text-align: center;
      justify-content: center;
      align-content: center;
      display: grid;
    }

    .image-fader img {
      position: absolute;
      width: 98%;
      height: 200px;
     /* top: 0px;
      left: 0px;   */
      animation-name: imagefade;
      animation-timing-function: ease-in-out;
      animation-iteration-count: infinite;
      animation-duration: 12s;
    }
    
    }