.naprelet-class-table {
    border-collapse: collapse;
    width: 100%;
}

.naprelet-class-table td, .naprelet-class-table th {
    padding: 4px;
}

.naprelet-class-table tr:nth-child(even){background-color: #f2f2f2;}

.naprelet-class-table tr:hover {background-color: #ddd;}

.naprelet-class-table th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #328ed0;
  color: white;
}

.naprelet-class-table th.pilot-name, .naprelet-class-table td.pilot-name {
    width: 25%;
    text-align: left;
}

.naprelet-class-table th.pilot-birth-year, .naprelet-class-table td.pilot-birth-year {
    width: 10%;
    text-align: center;
}

.naprelet-class-table th.pilot-glider, .naprelet-class-table td.pilot-glider {
    width: 24%;
    text-align: left;
}

.naprelet-class-table th.pilot-immatriculation, .naprelet-class-table td.pilot-immatriculation {
    width: 13%;
    text-align: left;
}

.naprelet-class-table th.pilot-aeroclub, .naprelet-class-table td.pilot-aeroclub {
    width: 22%;
    text-align: left;
}

.naprelet-class-table th.pilot-start-number, .naprelet-class-table td.pilot-start-number {
    width: 6%;
    text-align: center;
}

.naprelet-pilot-detail-row {
    display: flex;
}

.naprelet-pilot-detail-column-details {
    flex: 50%;
    float:left;
    padding: 0px 10px 15px 0px;
}

.naprelet-pilot-detail-column-photo {
    flex: 50%;
    float: left;
    text-align: right;
    padding: 0px 0px 15px 0px;
}

.naprelet-pilot-detail-photo {
    max-width: 100%;
    max-height: 300px;
}

.naprelet-pilot-detail-table td.property-name {
    font-weight: bold;
    padding-right: 15px;
}

a.naprelet-link {
    color: #328ed0;
}

@media screen and (max-width: 600px) {
    .naprelet-class-table th.pilot-name, .naprelet-class-table td.pilot-name {
        width: 35%;
        text-align: left;
    }
    
    .naprelet-class-table th.pilot-birth-year, .naprelet-class-table td.pilot-birth-year {
        display: none;
    }
    
    .naprelet-class-table th.pilot-glider, .naprelet-class-table td.pilot-glider {
        width: 25%;
        text-align: left;
    }
    
    .naprelet-class-table th.pilot-immatriculation, .naprelet-class-table td.pilot-immatriculation {
        display: none;
    }
    
    .naprelet-class-table th.pilot-aeroclub, .naprelet-class-table td.pilot-aeroclub {
        width: 30%;
        text-align: left;
    }
    
    .naprelet-class-table th.pilot-start-number, .naprelet-class-table td.pilot-start-number {
        width: 10%;
        text-align: center;
    }

    .naprelet-pilot-detail-row {
        display: inline;
    }
    
    .naprelet-pilot-detail-column-details {
        flex: 100%;
        float: none;
        padding: 0px 0px 15px 0px;
    }
    
    .naprelet-pilot-detail-column-photo {
        flex: 100%;
        float: none;
        text-align: left;
        padding: 0px 0px 15px 0px;
    }
    
    .naprelet-pilot-detail-photo {
        max-width: 100%;
        max-height: none;
    }
}

.naprelet-class-description {
    font-size: 0.8em;
    text-align: center;
}

/* Style inputs, select elements and textareas */
.naprelet-form-container input[type=text], select, textarea{
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    resize: vertical;
}
  
/* Style the label to display next to the inputs */
.naprelet-form-container label {
    padding: 12px 12px 12px 0;
    display: inline-block;
}
  
/* Style the submit button */
.naprelet-form-container input[type=submit] {
    background-color: #04AA6D;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    float: right;
}
  
/* Style the container */
/*.naprelet-form-container {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
}*/
  
/* Floating column for labels: 25% width */
.naprelet-form-container .col-25 {
    float: left;
    width: 25%;
    margin-top: 6px;
}
  
/* Floating column for inputs: 75% width */
.naprelet-form-container .col-75 {
    float: left;
    width: 75%;
    margin-top: 6px;
}
  
/* Clear floats after the columns */
.naprelet-form-container .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) {
    .naprelet-form-container .col-25, .naprelet-form-container .col-75, .naprelet-form-container input[type=submit] {
      width: 100%;
      margin-top: 0;
    }
}