/*****************************************************

Letter grid 12+ для w3-Theme

******************************************************/

/* КОНТЕЙНЕРЫ */

.ln, .b, .bl {
	display:block;
	width: 100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	position: relative;
}

.ln { padding: 0; min-width: 320px; }

.b {
	padding: 0 10px;
	margin: 0 auto;
	min-width: 320px;
}

.bl {
	padding: 0 20px;
	margin: 0 auto;
	min-width: 320px;
}

.b-table {
	display: table;
	width: 100%;
	height: 100%;
}

.b-table__cell {
	display: table-cell;
	width: 100%;
	vertical-align: middle;
}

/* очистка обтикаемости */

.ln:before, .ln:after,
.b:before, .b:after,
.bl:before, .bl:after  {
	display: table;
	content: "";
	clear:both;
}



/* строки по ширене контейнера */

.rw {
	width: auto;
	margin-top: 0;
	margin-bottom: 0;
	padding:0;
	font-size:0;
	line-height:0;
	display: block;
	margin-left: -10px;
	margin-right: -10px;
	text-align: left;
}



.rw:before {

	display: table;

	content: "";

	clear:both;

}

.rw:after {

  content: '';

  display: inline-block;

  width: 100%;

  line-height:0;

  font-size:0;

}

.rw_c { text-align:center;}

/* выравнивание блоков внутри строк по вертикали */

.rw > * { vertical-align: top; } /* по верхнему краю ( по умолчанию ) */

/* Блоки сетки */

.sp, .sp-0,
.sp-1, .sp-2, .sp-3, .sp-4,  .sp-5,  .sp-6,
.sp-7, .sp-8, .sp-9, .sp-10, .sp-11, .sp-12,
.sp-51, .sp-52, .sp-53, .sp-54 {
	margin: 0;
	padding: 0 20px;
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	display:inline-block;
	text-align: left;
	font-size: medium;
	line-height: normal;
}

.sp-0 {
	margin: 0;
	padding: 0;
	width: 0;
	height: 100%;
}




/* Очистка обтикаемости внутри блоков сетки */
.sp-0:after,  .sp-0:before,  .spin-0:after,   .spin-0:before,
.sp-1:after,  .sp-1:before,  .spin-1:after,   .spin-1:before,
.sp-2:after,  .sp-2:before,  .spin-2:after,   .spin-2:before,
.sp-3:after,  .sp-3:before,  .spin-3:after,   .spin-3:before,
.sp-4:after,  .sp-4:before,  .spin-4:after,   .spin-4:before,
.sp-5:after,  .sp-5:before,  .spin-5:after,   .spin-5:before,
.sp-6:after,  .sp-6:before,  .spin-6:after,   .spin-6:before,
.sp-7:after,  .sp-7:before,  .spin-7:after,   .spin-7:before,
.sp-8:after,  .sp-8:before,  .spin-8:after,   .spin-8:before,
.sp-9:after,  .sp-9:before,  .spin-9:after,   .spin-9:before,
.sp-10:after, .sp-10:before, .spin-10:after,  .spin-10:before,
.sp-11:after, .sp-11:before, .spin-11:after,  .spin-11:before,
.sp-12:after, .sp-12:before, .spin-12:after,  .spin-12:before,
.sp-51:after, .sp-51:before, .spin-51:after,  .spin-51:before,
.sp-52:after, .sp-52:before, .spin-52:after,  .spin-52:before,
.sp-53:after, .sp-53:before, .spin-53:after,  .spin-53:before,
.sp-54:after, .sp-54:before, .spin-54:after,  .spin-54:before,
.sp:after,    .sp:before {
	display: table;
	content: "";
	clear:both;
}
/* Основная сетка на 12 колонок */
.sp-12 { width: 100%; }
.sp-11 { width: 91.666666666666666%; }
.sp-10 { width: 83.333333333333333%; }
.sp-9 { width: 75%; }
.sp-8 { width: 66.666666666666666%; }
.sp-7 { width: 58.333333333333333%; }
.sp-6 { width: 50%; }
.sp-5 { width: 41.666666666666666%; }
.sp-4 { width: 33.333333333333333%; }
.sp-3 { width: 25%; }
.sp-2 { width: 16.666666666666666%; }
.sp-1 { width: 8.3333333333333333%; }
/* Дополнительная сетка на 5 колонок */
.sp-51 { width: 20%; }
.sp-52 { width: 40%; }
.sp-53 { width: 60%; }
.sp-54 { width: 80%; }

/* Не адаптивная секта для внутренних блоков на 12 колонок */
.spin-12 { width: 100%; }
.spin-11 { width: 91.666666666666666%; }
.spin-10 { width: 83.333333333333333%; }
.spin-9 { width: 75%; }
.spin-8 { width: 66.666666666666666%; }
.spin-7 { width: 58.333333333333333%; }
.spin-6 { width: 50%; }
.spin-5 { width: 41.666666666666666%; }
.spin-4 { width: 33.333333333333333%; }
.spin-3 { width: 25%; }
.spin-2 { width: 16.666666666666666%; }
.spin-1 { width: 8.3333333333333333%; }
/* Не адаптивная секта для внутренних блоков на 5 колонок */
.spin-51 { width: 20%; }
.spin-52 { width: 40%; }
.spin-53 { width: 60%; }
.spin-54 { width: 80%; }

/* Модификатор спанов */
.sp_c > * {
	text-align:center;
}

/* - ГЛОБАЛЬНЫЕ МОДИФИКАТОРЫ */

/* Обтикаемость */

.g-flt-n { float:none !important; }

.g-flt-l { float:left !important; }

.g-flt-r { float:right !important; }

/* Выравнивание текста */

.g-txt-r { text-align:right !important; }

.g-txt-l { text-align:left !important; }

.g-txt-c { text-align: center !important; }

.g-txt-j { text-align: justify !important; }

/* Видимость */

.g-none { display: none; }

.g-transparent { opacity: 0; }
/*
@media (max-width: 979px) {
	/* Основная сетка на 12 колонок и дополнительная сетка на 5 колонок  *
	.sp-12,	.sp-11,	.sp-10, .sp-9, .sp-8, .sp-7, .sp-6,	.sp-5, .sp-4, .sp-3, .sp-2, .sp-1, .sp-51, .sp-52, .sp-53, .sp-54 { padding: 0 15px; width:100%; }
}*/

@media (min-width: 980px) and (max-width: 1365px) {
	.g-none-l { display:none; }
	.g-transparent-l { opacity: 0; }
	
	/* блоки */
	.b { padding: 0 10px; }
	.bl { padding: 0 20px; }
	.rw { margin: 0 -10px; }
	/* Основная сетка на 12 колонок и дополнительная сетка на 5 колонок  */
	.sp, .sp-12,	.sp-11,	.sp-10, .sp-9, .sp-8, .sp-7, .sp-6,	.sp-5, .sp-4, .sp-3, .sp-2, .sp-1, .sp-51, .sp-52, .sp-53, .sp-54 { padding: 0 10px; }
	
	/* Cетка для ноутбука + на 12 колонок */
	.spl-12 { width: 100%; }
	.spl-11 { width: 91.666666666666666%; }
	.spl-10 { width: 83.333333333333333%; }
	.spl-9  { width: 75%; }
	.spl-8  { width: 66.666666666666666%; }
	.spl-7  { width: 58.333333333333333%; }
	.spl-6  { width: 50%; }
	.spl-5  { width: 41.666666666666666%; }
	.spl-4  { width: 33.333333333333333%; }
	.spl-3  { width: 25%; }
	.spl-2  { width: 16.666666666666666%; }
	.spl-1  { width: 8.3333333333333333%; }
	
	/* Дополнительная сетка для ноутбука + на 5 колонок */
	.spl-51 { width: 20%; }
	.spl-52 { width: 40%; }
	.spl-53 { width: 60%; }
	.spl-54 { width: 80%; }
}
/*
@media (min-width: 769px) and (max-width: 979px) {
	.g-none-t { display:none; }
	.g-transparent-t { opacity: 0; }
	
	/* блоки *
	.b { padding: 0 15px; }
	.bl { padding: 0 30px; }
	.rw { margin: 0 -15px; }
	.sp-12,	.sp-11,	.sp-10, .sp-9, .sp-8, .sp-7, .sp-6,	.sp-5, .sp-4, .sp-3, .sp-2, .sp-1, .sp-51, .sp-52, .sp-53, .sp-54 { padding: 0 15px;}
	
	/* Cетка для планшета + на 12 колонок *
	.spt-12 { width: 100%; }
	.spt-11 { width: 91.666666666666666%; }
	.spt-10 { width: 83.333333333333333%; }
	.spt-9  { width: 75%; }
	.spt-8  { width: 66.666666666666666%; }
	.spt-7  { width: 58.333333333333333%; }
	.spt-6  { width: 50%; }
	.spt-5  { width: 41.666666666666666%; }
	.spt-4  { width: 33.333333333333333%; }
	.spt-3  { width: 25%; }
	.spt-2  { width: 16.666666666666666%; }
	.spt-1  { width: 8.3333333333333333%; }
	
	/* Дополнительная сетка для планшета + на 5 колонок *
	.spt-51 { width: 20%; }
	.spt-52 { width: 40%; }
	.spt-53 { width: 60%; }
	.spt-54 { width: 80%; }
}

@media (min-width: 481px) and (max-width: 768px) {
	.g-none-mp { display:none; }
	.g-transparent-mp { opacity: 0; }
	
	/* Мобильная сетка + на 12 колонок *
	.spmp-12 { width: 100%; }
	.spmp-11 { width: 91.666666666666666%; }
	.spmp-10 { width: 83.333333333333333%; }
	.spmp-9  { width: 75%; }
	.spmp-8  { width: 66.666666666666666%; }
	.spmp-7  { width: 58.333333333333333%; }
	.spmp-6  { width: 50%; }
	.spmp-5  { width: 41.666666666666666%; }
	.spmp-4  { width: 33.333333333333333%; }
	.spmp-3  { width: 25%; }
	.spmp-2  { width: 16.666666666666666%; }
	.spmp-1  { width: 8.3333333333333333%; }
	
	/* Дополнительная мобильная сетка + на 5 колонок *
	.spmp-51 { width: 20%; }
	.spmp-52 { width: 40%; }
	.spmp-53 { width: 60%; }
	.spmp-54 { width: 80%; }
}

@media (max-width: 480px) {
	.g-none-m { display:none; }
	.g-transparent-m { opacity: 0; }
	/* блоки *
	.b { padding: 0 10px; }
	.bl { padding: 0 20px; }
	.rw { margin: 0 -10px; }
	/* Основная сетка на 12 колонок и дополнительная сетка на 5 колонок  *
	.sp-12,	.sp-11,	.sp-10, .sp-9, .sp-8, .sp-7, .sp-6,	.sp-5, .sp-4, .sp-3, .sp-2, .sp-1, .sp-51, .sp-52, .sp-53, .sp-54 { padding: 0 10px;}
	
	/* Мобильная сетка на 12 колонок *
	.spm-12 { width: 100%; }
	.spm-11 { width: 91.666666666666666%; }
	.spm-10 { width: 83.333333333333333%; }
	.spm-9  { width: 75%; }
	.spm-8  { width: 66.666666666666666%; }
	.spm-7  { width: 58.333333333333333%; }
	.spm-6  { width: 50%; }
	.spm-5  { width: 41.666666666666666%; }
	.spm-4  { width: 33.333333333333333%; }
	.spm-3  { width: 25%; }
	.spm-2  { width: 16.666666666666666%; }
	.spm-1  { width: 8.3333333333333333%; }
	
	/* Дополнительная мобильная сетка на 5 колонок *
	.spm-51 { width: 20%; }
	.spm-52 { width: 40%; }
	.spm-53 { width: 60%; }
	.spm-54 { width: 80%; }
}
*/
@media (min-width: 1365px) {
	.g-none-d { display:none; }
	.g-transparent-d { opacity: 0; }
	
	/* блоки */
	.b { padding: 0 15px; }
	.bl { padding: 0 30px; }
	.rw { margin: 0 -15px; }
	/* Основная сетка на 12 колонок и дополнительная сетка на 5 колонок  */
	.sp, .sp-12,	.sp-11,	.sp-10, .sp-9, .sp-8, .sp-7, .sp-6,	.sp-5, .sp-4, .sp-3, .sp-2, .sp-1, .sp-51, .sp-52, .sp-53, .sp-54 { padding: 0 15px; }
	
	/* Cетка для десктопа + на 12 колонок */
	.spd-12 { width: 100%; }
	.spd-11 { width: 91.666666666666666%; }
	.spd-10 { width: 83.333333333333333%; }
	.spd-9  { width: 75%; }
	.spd-8  { width: 66.666666666666666%; }
	.spd-7  { width: 58.333333333333333%; }
	.spd-6  { width: 50%; }
	.spd-5  { width: 41.666666666666666%; }
	.spd-4  { width: 33.333333333333333%; }
	.spd-3  { width: 25%; }
	.spd-2  { width: 16.666666666666666%; }
	.spd-1  { width: 8.3333333333333333%; }
	
	/* Дополнительная сетка для декстопа + на 5 колонок */
	.spd-51 { width: 20%; }
	.spd-52 { width: 40%; }
	.spd-53 { width: 60%; }
	.spd-54 { width: 80%; }	
}