@charset "UTF-8";
/* CSS Document 
> photoset.css is intended for use in conjuction with photography.css. Photoset.css 
> only contains the specific changes from photography.css to photoset.css. */

/*~~~~~ Notes ~~~~~
- Colors used:
    Black = rgb(12, 12, 12)
    White = rgb(256, 256, 256) or #FFFFFF
    Off-white = #f1f1f1
    Grey = #757575
    Teal = #c34a18
    Burgundy = #c34a18


/**********************
Smartphone size
**********************/

#current {
    color: #c34a18;
    font-weight: bold;
    padding: 0px 32px 10px 55px;
}

.setHeader {
    text-align: center;
    color: white;
    margin-top: 30px;
}

.setTitle {
    font-size: 1.8em;
    font-family: iAWriterDuospace-Bold;
    margin-bottom: 0;
}

.setSubtitle {
    font-size: 1em;
}

.mainContent p {
    font-size: 1em;
    text-align: left;
    text-indent: 3em;
    line-height: 1.4em;
    margin: 2em 0;
    text-rendering: optimizeLegibility;
}

.mainContent a:link {
    color: white;
    text-decoration: underline #c34a18;
}

.mainContent a:visited {
    color: white;
    text-decoration: underline #c34a18;
}

.mainContent a:hover {
    color:  white;
    background-color: #c34a18;
    text-decoration: underline white;
}

.mainContent img {
    margin: 15px auto;
}

/**********************
Tablet size
**********************/
@media screen and (min-width: 768px) {

    .setHeader {
        padding: 0 8%;
    }

    .mainContent {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }

    .mainContent img {
        width: 85%;
        position: relative;
        transform: translateX(8%);
        margin: 60px 0;
    }

}
/**********************
Desktop size
**********************/
@media screen and (min-width: 1024px) {
    
    .mainContent {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
    
}

/**********************
1440p width size
**********************/
@media screen and (min-width: 1440px) {

}