/*---------------------------------------------- Portfolio Section ----------------------------------------------*/



img.illustration-portfolio {

    height: auto;

    width: auto;

    max-width: 100%;

    max-height: 450px;

}



.article-wrapper.portfolio-wrapper{

    padding: 3vh!important;

    height: calc(calc(100vh - 3vh) - 1rem);

}



#preview-news1 .preview-image{

  background-image:url('../img/home/webby-award.jpg');

  background-repeat: no-repeat;

  background-position: center 30px;

  background-size:cover;

  height: 65vh;

}



#preview-news2 .preview-image{

  background-image:url('../work/portfolio/ImagineCup/Airxon_Portfolio_ImagineCup_Mockup1_Filtered-Compressed.jpg');

  background-repeat: no-repeat;

  background-position: center 30px;

  background-size:cover;

  height: 65vh;

}



#preview-news3 .preview-image{

  background-image:url('../work/portfolio/Satori/Airxon_Portfolio_Satori_Mockup2_Filtered.jpg');

  background-repeat: no-repeat;

  background-position: center 30px;

  background-size:cover;

  height: 65vh;

}



#preview-news4 .preview-image{

  background-image:url('../work/portfolio/Mix/Airxon_Portfolio_Mix_Mockup7B_Unfiltered.jpg');

  background-repeat: no-repeat;

  background-position: center 30px;

  background-size:cover;

  height: 65vh;

}



/*---------------------------------------------- Section Responsive ----------------------------------------------*/



@media screen and (min-width: 1501px) {

/*---------- Insert Style -----------*/

}



@media screen and (max-width: 1500px) {

/*---------- Insert Style -----------*/

}



@media screen and (max-width: 1450px) and (min-width: 769px){

/*---------- Insert Style -----------*/

}



@media screen and (max-width: 1200px) {

/*---------- Insert Style -----------*/

}



@media screen and (max-width: 1120px) and (min-width: 769px){

/*---------- Insert Style -----------*/

}



@media screen and (min-width: 1170px) {

/*---------- Insert Style -----------*/

}



@media screen and (min-width: 769px) {

/*---------- Insert Style -----------*/

}



@media screen and (max-width: 768px) {

  .article-wrapper.portfolio-wrapper {

    height: calc(100vh - 30px)!important;

  }

  .mix {

    height: calc(100vh/3 - (((3 - 1) * 1rem) + 50px))!important;

  }

}



@media screen and (max-width: 540px) {

  .mix {

    height: calc(100vh/4 - (((4 - 1) * 1rem) + 22px))!important;

  }

}



@media screen and (max-width: 498px) {

/*---------- Insert Style -----------*/

}