.cookbook {
    column-count: 2;
    column-gap: 0.25in;
    
    h1 {
        font-family: sans-serif;
        font-size: 24pt;
        font-weight: bold;
    }
    
    a {
        flex: 1 1 auto;
        min-width: 2in;
        max-width: 3.5in;
        
        border-radius: 0.0625in;
        break-inside: avoid;
        color: black;
        font-family: serif;
        font-size: 18pt;
        text-decoration: none;

        display: flex;
        align-items: center; 
        padding: 0.0625in;
        padding-right: 0.125in;
        
        transition: all 0.25s;
        
        &:visited {
            color: black;
        }
        
        &:hover {
            background: #23B7F2;
            color: white;
        }
        
        img {
            border: 0.01in solid silver;
            border-radius: 0.0625in;
            margin-right: 0.125in;
            max-height: 0.5in;
            width: 0.5in;
        }
    }
}

.recipe {
    margin: 0 auto;
    max-width: 7in;
    
    display: flex;
    flex-direction: column;
    
    h1 {
        margin-top: 0;
        margin-bottom: 0.25in;
        
        font-family: serif;
        font-size: 24pt;
    }
            
    h2 {
        font-size: 12pt;
        margin: 0;
        margin-bottom: 0.125in;
        text-transform: uppercase;
    }
    
    .ingredients {
        display: flex;
        
        .image {
            img {
                border-radius: 0.25in;
                border: 0.01in solid silver;
                width: 3in;
                max-height: 3in;
            }
        }
        
        .list {
            margin-left: 0.25in;
            
            table {
                margin-bottom: 0.25in;
                
                tr {
                    vertical-align: top;
            
                    td:nth-child(1) {
                        font-family: sans-serif;
                        font-size: 12pt;
                        padding-right: 0.125in;
                        text-align: right;
                    }
            
                    td:nth-child(2) {
                        font-family: sans-serif;
                        font-size: 12pt;
                    }
                }
            }
        }
    }
    
    .directions {
        margin-top: 0.25in;
        
        tr {
            vertical-align: top;
            
            td {
                padding-bottom: 0.1875in;
            }
        }
        
        td:nth-child(1) {
            padding-right: 0.25in;
            
            font-family: sans-serif;
            font-size: 18pt;
            font-weight: bold;
            
            &:after {
                content: ".";
            }
        }
        
        td:nth-child(2) {
            width: 100%;
            
            font-family: serif;
            font-size: 14pt;
        }
        
        td:nth-child(3) {
            padding-left: 0.25in;
            
            font-family: sans-serif;
            font-size: 9pt;
            white-space: nowrap;
        }
    }
}

@media (max-width: 900px) {
    .cookbook {
        column-count: 1;
    }
}