/**
 * If your page background-color is red after enabling the PHPlugins function, then you know it's working.
 * Delete this after confirmation, because it's hideous :
 */

/* michaelboatrightphotography-test-custom.css */
.page__pallet__top > .content > ul > li {
    margin: 5 0 0 0; 
    
}

.myalignleft {
    float: left;
    display: block;
    padding-left: 10px;
}
.myalignright {
    float: right;
    display: block;
    padding-right: 50px;
}

/**     
div[data-presentation="grid"] {

flex: 0 0 200px;
}
*/
 div[data-presentation="grid"] {
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
    align-items: center;
	margin: 0 -9px;
}


@media only screen and (max-width: 1680px) {
	div[data-presentation="grid"][data-columns="3-small"] figure {
	    width: 16.666667%;
	}
}

@media only screen and (max-width: 1440px) {
	div[data-presentation="grid"][data-columns="3-small"] figure {
		width: 16.666667%;
	}
}

@media only screen and (max-width: 1280px) {
	div[data-presentation="grid"][data-columns="3-small"] figure {
	    width: 16.666667%;
	}
}

@media only screen and (max-width: 1140px) {
	div[data-presentation="grid"][data-columns="3-small"] figure {
	    width: 16.666667%;
	}
}
 
@media only screen and (max-width: 1024px) {
	div[data-presentation="grid"][data-columns="3-small"] figure, div[data-presentation="grid"][data-columns="12"] figure, div[data-presentation="grid"][data-columns="11"] figure, div[data-presentation="grid"][data-columns="10"] figure {
		width: 10%;
	}
}

@media only screen and (max-width: 992px) {
	div[data-presentation="grid"][data-columns="3-small"] figure, div[data-presentation="grid"][data-columns="12"] figure, div[data-presentation="grid"][data-columns="11"] figure, div[data-presentation="grid"][data-columns="10"] figure, div[data-presentation="grid"][data-columns="9"] figure, div[data-presentation="grid"][data-columns="8"] figure {
		width: 12.5%;
	}
}

@media only screen and (max-width: 640px) {
	div[data-presentation="grid"][data-columns="3-small"] figure, div[data-presentation="grid"][data-columns="12"] figure, div[data-presentation="grid"][data-columns="11"] figure, div[data-presentation="grid"][data-columns="10"] figure, div[data-presentation="grid"][data-columns="9"] figure, div[data-presentation="grid"][data-columns="8"] figure, div[data-presentation="grid"][data-columns="7"] figure, div[data-presentation="grid"][data-columns="6"] figure, div[data-presentation="grid"][data-columns="5"] figure, div[data-presentation="grid"][data-columns="4"] figure {
		width: 25%;
	}
}

@media only screen and (max-width: 414px) {
	div[data-presentation="grid"][data-columns="3-small"] figure, div[data-presentation="grid"][data-columns="12"] figure, div[data-presentation="grid"][data-columns="11"] figure, div[data-presentation="grid"][data-columns="10"] figure, div[data-presentation="grid"][data-columns="9"] figure, div[data-presentation="grid"][data-columns="8"] figure, div[data-presentation="grid"][data-columns="7"] figure, div[data-presentation="grid"][data-columns="6"] figure, div[data-presentation="grid"][data-columns="5"] figure, div[data-presentation="grid"][data-columns="4"] figure, div[data-presentation="grid"][data-columns="3"] figure, div[data-presentation="grid"][data-columns="2"] figure {
		width: 50%;
	}
}
 
 
.essay-alignleft-400 {
float: left;
width:400px;
}

.essay-alignright-400 {
float: right;
width:400px;
}

.essay-alignleft-300 {
float: left;
width:300px;
}

.essay-alignright-300 {
float: right;
width:300px;
}

.essay-alignleft-200 {
float: left;
margin: 0 1rem 0.25rem 0;
width: 200px;
}

.essay-alignright-200 {
float: right;
width: 200px;
}

/* Custom H1 */
h1 {
     color: ##857454;
}


/* Custom H1 */
.tagline {
     color: #857454;
     text-align: center;
     font-size: 2em;
}

/*Custom footer
==============================================*/
footer {
background-color: white;
border-top: 1px solid white;
color: #857454;
padding-bottom: 24px;
}

.grid_12 *[class*="col_"] {
	padding-right: 24px;
	padding-left:  24px;
	padding-bottom: 24px;
	}

.social-media-profiles ul {
float: left;
margin: 1.5rem auto;
max-width: 250px;
padding: 0;
position: relative;
}

.social-media-profiles ul li {
float: right;
list-style-type: none;
margin: 0 2px 4px;
padding: 0 4px
}

li.social-bg {
background-color: #008000;
border-radius: 5px;
}

li.social-bg a {
color: #857554;
}

li.social-bg a:hover {
text-decoration: none;
}

@media screen and ( max-width: 1023px ) {
#footer {
padding: 0 4px;
}
#footer p {
text-align: center;
}
.social-media-profiles ul {
float: none;
}
}


/**
 * Customize pallet triggers using Font Awesome

.page__toggle__buttons label[for="page__toggle__T1"] ul.palletToggle {
}
.page__toggle__buttons label[for="page__toggle__T1"] li.fa_pseudo::before {
}

.page__toggle__buttons label[for="page__toggle__T2"] ul.palletToggle {
	opacity: 0;
}
.page__toggle__buttons label[for="page__toggle__T2"] li.fa_pseudo::before {
	content: "\f002";
}

 */