/*---------------------------------------------------------------------------------

 Theme Name:   Portfolio 2021 Theme
 Theme URI:    
 Description:  A child theme for JeremiahTrue.com
 Author:       Jeremiah True
 Author URI:   
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/

/* Filterable portfolio CSS from Divi Soup */

/* https://divisoup.com/how-to-change-columns-and-image-sizes-in-the-filterable-portfolio/ */

/*Set number of columns and margin for the images*/
@media (min-width: 981px) {
    .et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.et_pb_grid_item,
    .et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.active,
    .ds-library-grid.et_pb_portfolio_grid .et_pb_portfolio_item,
    .et_pb_column_4_4 .ds-library-grid.et_pb_grid_item:nth-child(4n) /*Change this number to value 4 in the calculator (don't remove the 'n')*/ {
        width: 25% !important; /*Change this number to value 3 in the calculator (don't remove the '%') */
        margin: 0; /*Change these numbers to values 1 & 2 in the calculator (don't remove the '%' or '0')*/
    }
}

/*Set number of columns and margin for the category filters*/
.ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li {
    float: left;
    margin: 0 5% 2% 0; /*Change these numbers to values 5 & 6 in the calculator (don't remove the '%' or '0')*/
    text-align: center;
    width: 20%; /*Change this number to value 7 in the calculator (don't remove the '%' )*/
}

.ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li:nth-child(6n) { /*Change this number to value 8 in the calculator (don't remove the 'n' )*/
    margin-right: 0;
}

/*This sets the width of the filter buttons on smaller screens, you really want to leave these as they are or your buttons will be too small*/
@media only screen and (max-width: 1080px) {
    .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li {
        margin: 0 2% 2% 0;
        width: 23.5%;
    }
    .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li:nth-child(3n+3) {
        margin-right: 0;
    }
}
@media only screen and (max-width: 980px) {
    .et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.et_pb_grid_item,
    .et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.active,
    .ds-library-grid.et_pb_portfolio_grid .et_pb_portfolio_item,
    .et_pb_column_4_4 .ds-library-grid.et_pb_grid_item:nth-child(4n) /*Change this number to value 4 in the calculator (don't remove the 'n')*/ {
        width: 23.5% !important; /*Change this number to value 3 in the calculator (don't remove the '%') */
        margin: 0 2% 2% 0 !important; /*Change these numbers to values 1 & 2 in the calculator (don't remove the '%' or '0')*/
		padding: 0 !important; 
    }
	
	.ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li {
        margin: 0 5% 2% 0 !important;
        width: 47.5%; 
    }
    .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li:nth-child(2n) {
        margin-right: 0 !important;
    }

}
@media only screen and (max-width: 479px) {
	.et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.et_pb_grid_item,
    .et_pb_gutters3 .et_pb_column_4_4 .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_item.active,
    .ds-library-grid.et_pb_portfolio_grid .et_pb_portfolio_item,
    .et_pb_column_4_4 .ds-library-grid.et_pb_grid_item:nth-child(4n) /*Change this number to value 4 in the calculator (don't remove the 'n')*/ {
        width: 50% !important; /*Change this number to value 3 in the calculator (don't remove the '%') */
        margin: 0 !important; /*Change these numbers to values 1 & 2 in the calculator (don't remove the '%' or '0')*/
		padding: 0 !important; 
    }
	
    .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters li {
        margin-right: 0;
        width: 100%;
        margin-bottom: 10px;
    }
    .ds-library-grid.et_pb_filterable_portfolio .et_pb_portfolio_filters {
        margin: -30px 0 40px !important;
    }
}

/*Ensures portfolio images display on mobile and tablets, you don't need to touch this*/
@media only screen and ( max-width: 980px) {
    .ds-library-grid .et_portfolio_image img {
        width: 100%;
    }
}

/* End Divi Soup Filterable Portfolio CSS */

/* Responsive iFrames */
.resp-iframe-container {
	overflow: hidden;
	position: relative;
}

iframe {
	width: 100% !important;
}

.resp-iframe-container iframe {
   border: 0;
   height: 100% !important;
   left: 0;
   position: absolute;
   top: 0;
   width: 100% !important;
}

.iframe16-9 {
	/* 16:9 aspect ratio */
	padding-top: 56.25%;
}

.iframe1-1 {
	/* 1:1 aspect ratio */
	padding-top: 100%;
}

.iframe1200-270 {
	/* 1200x270 aspect ratio */
	padding-top: 22.5%;
	height:270px;
}
