*{
  margin: 0;
  padding: 0;
}

div{
  box-sizing: border-box;
}

#connection-municip{
  width: 648px;
  margin: auto;
  text-align: center;
  position: relative;
}

#connection-municip #conn-enter h3{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 27px;
  margin-bottom: 5px;
  color: #46616c;
}

#connection-municip #conn-enter p,
#connection-municip #conn-select p{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 300;
}

/*=============================== SELECT STYLES*/
#connection-municip #conn-select{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 25px;
}

#connection-municip #conn-select .mySelect{
  position: relative;
  width: 256px;
  height: 40px;

  background-color: #464f59;
  border-radius: 5px;
  margin-left: 7px;
}

#connection-municip #conn-select .mySelect .myOptions{
  display: flex;
  align-items: center;
}

#connection-municip #conn-select .mySelect .myOptions p{
  color: #fff;
  margin: 10px 10px;
}

#connection-municip #conn-select .arrow{
  float: right;
  margin-left: auto;
  margin-right: 10px;
}

#connection-municip #conn-select .arrow.down{
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;

}

#connection-municip #conn-select .arrow.up{
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #fff;

}

#connection-municip #conn-select .mySelect .options{
  position: absolute;
  top: 100%;
  width: 100%;
  margin: auto;
  left: 0;
}

#connection-municip #conn-table .tab-header p,
#connection-municip #conn-select .selectB{
  font-weight: 700;
}

#connection-municip #conn-select .mySelect .options{
  background-color: #46616c;

  height: 250px;
  overflow-y: scroll;
  border-radius: 5px;
  -webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.75);
}

#connection-municip #conn-select .mySelect .options p{
  margin: 7px auto;
  font-weight: 400;
  color: #fff;
}

#connection-municip #conn-select .mySelect .options p:hover{
  background-color: #2f3f44;
}

/*============================================================ TABLE STYLES*/
#connection-municip #conn-table{
  margin-top: 25px;
}

#connection-municip #conn-table .enter{
  text-align: left;
}

#connection-municip #conn-table .myTable .header,
#connection-municip #conn-table .myTable .sub-tems,
#connection-municip #conn-table .table-content,
#connection-municip #conn-table .table-content .tab .line{
  display: flex;

}

#connection-municip #conn-table .myTable .header .h-main:nth-of-type(1){
  width: 30%;
  text-align: left;
}

#connection-municip #conn-table .myTable .header .h-main:nth-of-type(2),
#connection-municip #conn-table .myTable .header .h-main:nth-of-type(3){
  width: 35%;
}

#connection-municip #conn-table .myTable .header .h-main:nth-of-type(1){
  background-color: #464f59;
}

#connection-municip #conn-table .myTable .header .h-main:nth-of-type(2){
  background-color: #336666;
}

#connection-municip #conn-table .myTable .header .h-main:nth-of-type(3){
  background-color: #464f59;
}

#connection-municip #conn-table .myTable .header .h-main .txtBold{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 700;
}

#connection-municip #conn-table .myTable .sub-tems p{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 500;
  width: 33%;
}

/*=========================================================== LOADED TABLE STYLES*/
#connection-municip #conn-table .table-content{

}

#connection-municip #conn-table .header p,
#connection-municip #conn-table .table-content p{
  color: #fff;
  padding: 5px;
}

#connection-municip #conn-table .table-content p{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 13px;
  margin: auto;
}

#connection-municip #conn-table .table-content .tab.mun{
  width: 30%;
  text-align: left;
}

#connection-municip #conn-table .table-content .tab.mun p:nth-child(odd),
#connection-municip #conn-table .table-content .tab.without .colum p:nth-child(odd){
  background-color: #46616c;
}

#connection-municip #conn-table .table-content .tab.mun p:nth-child(even),
#connection-municip #conn-table .table-content .tab.without .colum p:nth-child(even){
  background-color: #464f59;
}

#connection-municip #conn-table .table-content .tab.with,
#connection-municip #conn-table .table-content .tab.without{
  display: flex;
  width: 35%;
}

#connection-municip #conn-table .table-content .tab .colum{
  width: 33.4%;
}

#connection-municip #conn-table .enter p{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 25px;
}

#connection-municip #conn-table .enter span{
  font-family: industry, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
}

#connection-municip #conn-table .table-content .tab.with .colum p:nth-child(odd){
  background-color: #339999;
}

#connection-municip #conn-table .table-content .tab.with .colum p:nth-child(even){
  background-color: #336666;
}
