/*

    styles13.css 

*/


datalist
{
    display: flex;
  flex-direction: row;
  justify-content: space-between;

}




div.grid-container
{
    display: flex;
    justify-content: space-around;
}

div.button-container
{
    display: flex;
    column-gap: 25px;
    margin-top: 10px; 
}


table.logTable
{
    border: 1px solid black;
    border-collapse: collapse
}
table.logTable th 
{
    text-align: center;
    border: 1px solid black;
    padding: 0 10px;
}

table.logTable td
{
    text-align: center;
    border: 1px solid black;
    padding: 0 5px;
}


table.fourthAndFifth
{
    /* width: 576px; */
    border-collapse: collapse;
}
table.fourthAndFifth th
{
    text-align: center;
    /* border: 1px solid black; */
    width: 48px;
    padding: 0;
    border: 0px;

}

table.fourthAndFifth td
{
    text-align: center;
    /* border: 1px solid black;  */
    width: 48px;
    padding: 0;
    border: 0px;
}




table.noteTable
{
   width: 720px;
   table-layout: fixed;
   border-collapse: collapse;
}


table.noteTable th
{
    width: 45px;
    text-align: center;
    padding: 0px;
    font-size: 150%;
    /* border: 1px solid black; */
}

table.noteTable td
{
    width: 45px;
    text-align: center;
    padding: 5px 0;
    /* border: 1px solid black; */
}



table.intervalTable
{
    width: 640px;
    border: 0px;
}

table.intervalTable td, th
{
    text-align: center;
    width: 40px;
    padding: 0;
    border: 0px;
}

table.intervalTable th
{
    font-size: 150%;
}


table.modeTable th
{
    text-align: left;
    border-bottom: 1px black solid;

}

table.modeTable td
{
    border: 0;
    padding: 2px 40px 0px 0px;
    white-space: nowrap;
    text-align: left;
}

table.modeTable td:nth-child(3)
{
    padding: 2px 0 0 0;
}



table.intervalTable2
{
    width: 720px;
    border: 0px;
}

table.intervalTable2 th
{
    font-size: 125%;
    text-align: center;
    width: 40px;
    padding: 0;
    border: 0px;
}

table.intervalTable2 td
{
    text-align: center;
    width: 40px;
    padding: 0;
    border: 0px;
}

td.bigger
{
    font-size: 150%;
}

table.pitchLogarithms1 th
{
    vertical-align: bottom;
    padding: 10px 20px;
}

table.pitchLogarithms1 td
{
    text-align: center;
    padding: 10px;
}

table.pitchLogarithms2 th
{
    vertical-align: bottom;
    padding: 10px 20px;
}

table.pitchLogarithms2 td
{
    text-align: center;
}



table.caramuelTable td
{
    text-align: right;
    padding: 0px 24px;
    border: 0px;
}

table.caramuelTable th
{
    text-align: center;

    border-bottom: 1px solid black;
}

table.accidentals
{
    width: 720px;
}

table.accidentals td, th
{
    text-align: center;
    width: 40px;
    padding: 0;
    border: 0px;
}

table.accidentals th
{
    font-size: 150%;
}


table.fifthsSequenceTable
{
   table-layout: fixed;
   border-collapse: collapse;
}


table.fifthsSequenceTable th
{
    font-size: 125%;
    width: 55px;
}

table.fifthsSequenceTable td
{
    text-align: center;
    width: 55px;
}

table.keysTable th
{
    text-align: left;
    white-space: nowrap;
    padding: 0 20px;
    border-bottom: 1px solid black;
}

table.keysTable td
{
    text-align: left;
    white-space: nowrap;
    padding: 0 20px;
}


/* Tables in "The Contorted Terminology */
table.chromaticIntervalsTable
{
    white-space: nowrap;
 /*   border-spacing: 20px; */
/*    border-collapse: collapse; */
}

table.chromaticIntervalsTable th
{
    padding-right: 40px;
    vertical-align: bottom;
 /*   border: 1px solid black; */
    border-bottom: 1px solid black;
}

table.chromaticIntervalsTable th:nth-child(1)
{
    padding: 0px;
}

/* Center "Number of Semitones" using padding */
table.chromaticIntervalsTable th:nth-child(2)
{
   padding: 0 40px;
}


table.chromaticIntervalsTable th:nth-child(4)
{
    text-align: left;
}

/* Provide a little horizontal space so alternate names 
        of tritone are clearer */
table.chromaticIntervalsTable td
{
    padding: 5px 0;
  /*  border: 1px solid black; */
}

/* Center the number of semitones */ 
table.chromaticIntervalsTable td:nth-child(4)
{
    text-align: center;
}

/* ========================= */
/* Second table with Sliders */
/* ========================= */
table.chromaticIntervalsTable2
{
    white-space: nowrap;
    border-collapse: collapse;
}

table.chromaticIntervalsTable2 th
{
 /*   padding-right: 100px; */
    vertical-align: bottom;
    border-bottom: 1px solid black;
/*    border: 1px solid black; */
}

table.chromaticIntervalsTable2 th:nth-child(2)
{
    text-align: left;
    padding-left: 40px;
}

table.chromaticIntervalsTable2 td
{
    padding: 5px 0;
/*    border: 1px solid black; */
}

table.chromaticIntervalsTable2 td:nth-child(4)
{
    padding: 0 40px;
}


table.chromaticIntervalsTable2 td:nth-child(5)
{
    padding: 0 10px;
}

table.chromaticIntervalsTable2 td:nth-child(6)
{
    padding: 0 10px;
}

table.chromaticIntervalsTable2 td:nth-child(7)
{
    display: none;
}

/*

*/

table.fifthsIntervalsTable
{
    white-space: nowrap;
    border-collapse: collapse;
}

table.fifthsIntervalsTable th
{
    border-bottom: 1px solid black;
}

table.fifthsIntervalsTable td
{
    padding: 5px 0;
}

table.fifthsIntervalsTable td:nth-child(1)
{
    text-align: right;
}

table.fifthsIntervalsTable td:nth-child(3)
{
    text-align: left;
}


table.fifthsIntervalsTable td:nth-child(4)
{
    padding: 0 40px;
}

table.fifthsIntervalsTable td:nth-child(5)
{
    padding: 0 10px;
}

table.fifthsIntervalsTable td:nth-child(6)
{
    display: none;
}

/* Chromatic Logarithms */

table.chromaticLogarithmsTable
{
    white-space: nowrap;
    border-collapse: collapse;
}

/* Headers */

table.chromaticLogarithmsTable th
{
    border-bottom: 1px solid black;
    padding: 0 20px;
}

table.chromaticLogarithmsTable th:nth-child(1)
{
    text-align: left;
}

table.chromaticLogarithmsTable th:nth-child(4)
{
    text-align: right;
}

table.chromaticLogarithmsTable th:nth-child(5)
{
    text-align: right;
}

table.chromaticLogarithmsTable td
{
    padding: 5px 20px;
}

/* Data */
table.chromaticLogarithmsTable td:nth-child(1)
{
    text-align: left;
}

table.chromaticLogarithmsTable td:nth-child(2)
{
    text-align: center;
}

table.chromaticLogarithmsTable td:nth-child(3)
{
    text-align: center;
}

table.chromaticLogarithmsTable td:nth-child(4)
{
    text-align: right;
}

table.chromaticLogarithmsTable td:nth-child(5)
{
    text-align: right;
}

/*
    Harmonic Series Table
*/    

table.harmonicSeriesTable
{
    white-space: nowrap;
    border-collapse: collapse;
}

table.harmonicSeriesTable th
{
    border-bottom: 1px solid black;
    padding: 0 20px;
}

table.harmonicSeriesTable th:nth-child(1)
{
    text-align: left;
}

table.harmonicSeriesTable th:nth-child(2)
{
    text-align: left;
}

table.harmonicSeriesTable td
{
    padding: 5px 20px;
}

table.harmonicSeriesTable td:nth-child(4)
{
    display:none;
}


table.justIntonationRatiosTable
{
    white-space: nowrap;
    border-collapse: collapse;
}

/*

Long Just Intonation Ratios Table

*/

table.justIntonationFifthsTable
{
    white-space: nowrap;
    border-collapse: collapse;
}

table.justIntonationFifthsTable th
{
    border-bottom: 1px solid black;
    padding: 0 20px;
}

table.justIntonationFifthsTable th:nth-child(1)
{
    text-align: left;
}

table.justIntonationFifthsTable td
{
    padding: 10px 20px;
}

table.justIntonationFifthsTable td:nth-child(2)
{
    text-align: right;
}

table.justIntonationFifthsTable td:nth-child(3)
{
    text-align: center;
}



/*

table.chromaticIntervalsTable th:nth-child(3)
{
    text-align: left;
}

*/

/*

table.chromaticIntervalsTable th:nth-child(1)
{
    text-align: right;
}

table.chromaticIntervalsTable td
{
    padding: 0 40px;
}

table.chromaticIntervalsTable td:nth-child(1)
{
    text-align: center;
}

table.chromaticIntervalsTable td:nth-child(2)
{
    text-align: center;
}

*/