.portfolio-container
{
/* Компенсируем отступы между float-блоками, чтобы они занимали все доступное пространство */
margin: -3em 0 0 -2em;

/* Выравнивание по центру */
text-align: center;
}

@media (max-width: 768px) {
.portfolio-container
{
/* Компенсируем отступы между float-блоками, чтобы они занимали все доступное пространство */
margin: 0 auto;
width: 100%;
    

/* Выравнивание по центру */
text-align: center;
}
}

.portfolio-item
{
/* Убираем подчеркивание у элемента ins,
который был использован для совместимости со старыми версиями Internet Explorer */
text-decoration: none;

/* Следующее правило для Firefox 2 */
display: -moz-inline-box;

/* а это для остальных */
display: inline-block;

vertical-align: top;

/* Убираем выравнивание по центру */
text-align: left;

/* Отступы между блоками */
margin: 3em 0 0 2em;
}

@media (max-width: 768px) {
.portfolio-item
{
/* Убираем подчеркивание у элемента ins,
который был использован для совместимости со старыми версиями Internet Explorer */
text-decoration: none;

/* Следующее правило для Firefox 2 */
display: -moz-inline-box;

/* а это для остальных */
display: inline-block;

vertical-align: top;

/* Убираем выравнивание по центру */
text-align: left;

/* Отступы между блоками */
margin: 3em auto 0 auto;
}
}

.portfolio-item .port-preview
{
/* Если есть необходимость, то свойства padding, border, background и position со значением relative
лучше задавать у этого элемента -- это несколько расширит количество поддерживаемых версий браузеров */

/* Задаем минимальную ширину по тексту */
width: 36em;

/* Минимальная ширина в пикселях будет автоматически рассчитываться по ширине картинки */
float: left;
}

.portfolio-preview-title {
    display: block;
    font-weight: 600;
    line-height: 1.2em;
    color: #151515;
	margin: 0.3em auto 0.2em;
}
/*
@media (min-width: 1441px) {
.portfolio-item .port-preview
{
width: 36em;  
float: left;
}
    }
 */

@media (max-width: 1920px) {
.portfolio-item .port-preview
{
width: 34em;  
float: left;
}
    }

@media (max-width: 1600px) {
.portfolio-item .port-preview
{
width: 30em;  
float: left;
}
    }

@media (max-width: 1440px) {
.portfolio-item .port-preview
{
width: 26em;  
float: left;
}
    }
@media (max-width: 1366px) {
.portfolio-item .port-preview
{
width: 24em;  
float: left;
}
    }
@media (max-width: 1280px) {
.portfolio-item .port-preview
{
width: 18em;  
float: left;
}
@media (max-width: 768px) {
.portfolio-item .port-preview
{
width: 100%;
float: left;
}
    }



.clients-container
{
/* Компенсируем отступы между float-блоками, чтобы они занимали все доступное пространство */
margin: -1em 0 0 -2em;

/* Выравнивание по центру */
text-align: center;
}

@media (max-width: 768px) {
.clients-container
{
/* Компенсируем отступы между float-блоками, чтобы они занимали все доступное пространство */
margin: 0 auto;
width: 100%;
    

/* Выравнивание по центру */
text-align: center;
}
}

/* Стилі для превью статтей*/
.portfolio-item .clients-preview
{
width: 17em;  
float: left;
}

@media (max-width: 1440px) {
.portfolio-item .clients-preview
{
width: 17em;  
float: left;
}
    }
@media (max-width: 1366px) {
.portfolio-item .clients-preview
{
width: 17em;  
float: left;
}
    }
@media (max-width: 1024px) {
.portfolio-item .clients-preview
{
width: 13em;  
float: left;
}
    }
@media (max-width: 768px) {
.portfolio-item .clients-preview
{
width: 100%;
margin-left: auto;
margin-right: auto;
float: left;
}
    }