body {
margin:0; 
height: 100%;
}

table {
  border-collapse: collapse;
  border: 1px solid black;
  width: 700px;
}

td.nametitle {
  background-color: #f58f48;
  border: 1px solid black;
  padding-top:10px;
  padding-bottom:10px;
}

td {
  text-align: center;
  vertical-align: top;
}

td.act {
  height: 60px;
  width: 280px;
}

thead,
tfoot {
  background-color: #f58f48;
  border: 1px solid black;
}

.title {
padding-top: 85px;
text-align: center;
font: bold 25px arial, sans-serif;
}

table.main_ident {
  border: 0px;
  border-spacing: 25px 25px;
  border-collapse: separate;
}

td.ident {
  min-width: 230px;
}

p.numeration {
text-align: center;
font: bold 18px arial, sans-serif;
border:1px dashed black;
padding: 10px;
}

.content {
font-family: arial, sans-serif;
margin-top:5px;
#position: absolute;
width: 100%;
}

.header {
position:-webkit-sticky;
position: sticky;
top: 0;
text-align: center;
height: 115px;
width: 100%;
background-color: #f3db1d;
background-image: url(../images/header.png);
background-repeat: no-repeat;
background-position: center top;
border: none;
border-bottom: 3px solid black;
font: bold 25px arial, sans-serif;
}

#bigtxt {
font: bold 22px arial, sans-serif;
}

#smalltxt {
font: bold 12px arial, sans-serif;
padding-top:20px;
#text-align: left;
display: inline;
}

#clock {
position: absolute;
top: 125px;
font: bold 30px arial, sans-serif;
margin-left: 20px;
}

.subtitle {
text-align: center;
width:100%;
border: none;
padding-top: 80px;
white-space: nowrap ;
}

.detailtitle {
text-align: center;
font: bold 25px arial, sans-serif;
height: 70px;
width:100%;
border: none;
border-bottom: 3px solid black;
padding-top: 10px;
}

.warning {
text-align: center;
font: bold 16px arial, sans-serif;
color: red;
width:100%;
border: none;
border-bottom: 3px dashed black;
padding-top: 10px;
padding-bottom: 10px;
}

input[type=submit] {
background: #4999c8;
color: white;
height: 50px;
width: 400px;
font: bold 16px arial, sans-serif;
text-shadow:none;
border: 2px solid black;
border-radius: 20px;
}

input[type=submit]:hover {
background: #0066A2;
color: white;
height: 50px;
width: 400px;
font: bold 16px arial, sans-serif;
text-shadow:none;
border: 2px solid black;
border-radius: 20px;
}

#final {
background: red;
color: white;
height: 80px;
width: 500px;
font: bold 20px arial, sans-serif;
text-shadow: none;
border: 3px solid black;
border-radius: 20px;
}

#final:hover {
background: blue;
}

#tborder td,tr {
border: 1px solid black;
vertical-align: center;
}

.infos {
#position: fixed;
#bottom: 30px;
text-align: left;
font: 18px arial, sans-serif;
width:100%;
border: none;
border-top: 3px solid black;
margin-top: 25px;
padding-bottom: 35px;
}

.txtinfos {
padding-top: 5px;
padding-left: 20px;
}

#ttborder{
width : 20%;
border: 1px solid black;
vertical-align: center;
}

.footer {
height: 18px;
position: fixed;
bottom: 0;
width: 100%;
background: #f3db1d;
text-align: center;
font: bold 14px arial, sans-serif;
border: none;
border-top: 3px solid black;
padding: 5px;
}

.tooltip {
  font: bold 14px arial, sans-serif;
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
  font: bold 14px arial, sans-serif;
  visibility: hidden;
  width: 480px;
  background-color: #f3db1d;
  color: black;
  text-align: center;
  border: 3px solid black;
  border-radius: 6px;
  padding: 15px;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  left: 105%;
  top: -35px;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: vertical;
}

.act select {
	resize: none;
	padding:5px;
}

.naissance select {
        resize: none;
        padding:5px;
	width:auto;
}


label {
  padding: 12px 22px 12px 0;
  display: inline-block;
  font-family: arial, sans-serif;
}

.main_window {
  border: 1px solid black;
  border-radius: 15px;
  background-color: #f2f2f2;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px;
}

.col-left {
  float: left;
  width: 35%;
  margin-top: 6px;
  text-align: right;
}

.col-right {
  float: left;
  width: 65%;
  margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .col-left, .col-right, .main_window, input[type=submit], input[type=submit]:hover {
    width: 90%;
    margin-top: 0;
  }
  .col-left, .col-right, .main_window {
    text-align: left;
  }
  .myform {
	  max-width: 95%;
  }
}

.myform {
padding: 20px;
text-align: center;
margin-left: auto;
margin-right: auto;
max-width:1000px;
}

.dataenfant {
	text-align: center;
	width: 100%;
	padding-top: 5px;
	padding-bottom: 10px;
}

.dataenfant select {
	resize: none;
	width: auto;
	padding: 5px;
}

.enfant_indiv {
	border: none;
	border-bottom: 3px solid black;
	border-left: 3px solid black;
	border-right: 3px solid black;
	width: 1020px;
	margin-left: auto;
	margin-right: auto;
}

table .naissance {
	margin: 0 auto;
	width: auto;
        border: none;
}

table .naissance td,tr,th,tbody,thead {
        border: none;

}

table .naissance thead {
	background:none;
}

.validate_form {
        text-align: center;
        width: 1020px;
	padding-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

/* The Modal (background) */
.modal {
  font-family: arial, sans-serif;
  display: block; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 150px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fff;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 60%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close-modal {
  color: white;
  float: right;
  font-size: 66px;
  font-weight: bold;
}

.close-modal:hover,
.close-modal:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #f3db1d;
  color: black;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #f3db1d;
  color: black;
}
