/* BG Colors-------------------------- */

.pumpkin {
    background-color:#FDBA52;
}

.latte {
    background-color: #E79839;
}

.dogwood {
    background-color:#923B27;
}

.saccharine {
    background-color:#8D2830;
}

/* floats -------------------------- */

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: left;
}

/* ------- Heights ----- */

.column-1 {
    height: 1079px;
    width: 30.9027777778% /*445px*/;
    flex: 1
}

.column-2 {
    height: 1079px;
    width: 59.7222222222% /*860px*/;
    margin-left: 2.29166666667%/*33px*/;
    float: right;
    flex: 2;
}

.h-550 {
    height: 550px;
}

.h-500 {
    height: 500px;
}

.h-290 {
    height: 290px;
}

.h-430 {
    height: 430px;
}
.h-310 {
    height: 310px;
}


/*---------Floats ------------*/

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: left;
}

/* ------ Page Components ----- */

header {
    width: 100%;
    height: 95px;
    background-image: url("../img/sky.jpg");
    background-size: cover;
    overflow: hidden;
    margin-bottom: 25px;
}

.header-content {
    width: 10%;
    height: 90px;
    margin-bottom: 50px auto;
}

.logo-header {
    width: 63px;
    height: 63px;
    background-color: #FDBA52; 
    border-radius: 140px;
    margin-left: 50px;
    margin-top: 16px;
}    

body{
    background-color: black;
}

main {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding-bottom: 23px;
    
}


.row {
    width: 100%; /*1440px*/
    overflow: hidden;
    float: right;
    display: flex;
    gap: 3%;
}

.col-1-third {
    width: 100%/*445px*/;
    margin-left: 3.47222222222%/*50px*/;
}

.col-2-third {
    width: 100%;
    float: right;
    margin-right:  3.47222222222% /*50px*/;

}

.house {
    background-image: url("../img/house.jpeg");
    background-size: cover;
}

.orange {
    background-image: url("../img/orange.jpg");
    background-size: cover;
    background-position: center center;
}

.autumn_leaf {
    background-image: url("../img/autumn_leaf.png");
    background-size: 200px 200px;
    background-position: 50% 50%;
    margin-top: 29px;
}

.tree{
    background-image: url("../img/trees.jpeg");
    background-size: cover;
    background-position: center center;
    margin-top: 50px;
}

img, iframe {
    max-width: 100%;
    padding-top: 29px;
    display: block;
}