/*/ Polylog SA @ 2023 /*/

/*/ Colonnes /*/

.fwk-column.column-left { 
	float: left; 
	margin-right: 10px;
	width: calc(50% - 10px);
	}

.fwk-column .fwk-column.column-left { 
	margin-right: 10px;
	width: calc(50% - 10px);
	}
	
.fwk-column.column-center { 
	float: left;
	margin-left: 5px;
	margin-right: 5px;
	width: calc(50% - 10px);
	}
	
.fwk-column.column-right { 
	float: right; 
	margin-left: 10px;
	width: calc(50% - 10px);
	}

.fwk-column .fwk-column.column-right { 
	margin-left: 10px;
	width: calc(50% - 10px);
	}
	
.fwk-column.column-s80 {
	width: calc(70% - 8px) !important;
	margin-right: 8px;
	float: left; 
	}

.fwk-column.column-s20 {
	width: calc(30% - 8px) !important;
	margin-left: 8px;
	float: right;
	}

.fwk-column.column-s60 {
	width: calc(60% - 10px) !important;
	margin-right: 10px;
	float: left; 
	}

.fwk-column.column-s33 {
	width: calc(33% - 10px) !important;
	}
	
.fwk-column.column-s30 {
	width: calc(30% - 10px) !important;
	margin-left: 10px;
	float: right;
	}

.fwk-column.column-s70 {
	width: calc(70% - 10px) !important;
	margin-right: 10px;
	float: left;
}
		
.fwk-column.column-s40 {
	width: calc(40% - 10px) !important;
	margin-left: 10px;
	float: right;
	}

.fwk-column.column-s60.column-right,
.fwk-column.column-s70.column-right {
	margin: 0 0 0 5px;
	float: right;
	}

.fwk-column.column-s40.column-left,
.fwk-column.column-s30.column-left{
	margin: 0 5px 0 0;
	float: left;
	}

/*/ Colonne (petites fenêtres) /*/

.modal-small .fwk-column.column-left {
	width: calc(50% - 8px);
	margin-right: 8px;
}

.modal-small .fwk-column.column-right {
	width: calc(50% - 8px);
	margin-left: 8px;
}

.modal-small .fwk-column.column-s60 {
	width: calc(60% - 8px) !important;
	margin-right: 8px;
}

.modal-small .fwk-column.column-s40 {
	width: calc(40% - 8px) !important;
	margin-left: 8px;
}

.modal-small .fwk-column.column-s60.column-right {
	width: calc(60% - 8px) !important;
	margin: 0 0 0 8px;
}

.modal-small .fwk-column.column-s40.column-left {
	width: calc(40% - 8px) !important;
	margin: 0 8px 0 0;
}

/*/ Modulables /*/

.fwk-sortable {
	border-radius: var(--round1);
}

.fwk-sortable-col {
	float: left;
	border-radius: var(--round1);
	padding: 8px 8px 55px;
	margin: 0 10px 10px 0;
	border: 3px solid var(--gray1);
	min-height: 126px;
	position: relative;
}

.fwk-sortable-col:first-child {
	margin-left: 0;
}

.fwk-sortable-col:last-child {
	margin-right: 0;
}

.fwk-sortable-col h5 {
	margin: 7px;
}

.fwk-sortable-col h5 em {
	color: inherit !important;
}

.fwk-sortable-item {
	display: block;
	border-radius: var(--round1);
	background: var(--gray1);
	line-height: 20px;
	padding: 10px 18px;
	margin: 7px;
}

.fwk-sortable-item i {
	line-height: inherit;
	display: inline-block;
	width: 20px;
}

.fwk-sortable-item.item-disabled {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--main-light);
	color: var(--fixdark);
	margin: 15px;
}

.fwk-sortable-item.item-disabled i {
	line-height: inherit;
	display: inline-block;
	width: 20px;
	color: var(--main);
}

/*/ Boîtes de texte /*/

.fwk-box { 
	border-radius: var(--round2);
	max-width: 1024px;
	margin: 10px 0;
	padding: 30px;
	word-wrap: break-word;
	position: relative;
	background-color: var(--mid1-light);
	}

.fwk-box.box-nomargintop {
	margin-top: 0;
	}

.fwk-box.box-photo {
	background-image: url('https://polylog.yog.swiss/assets/images/portal.jpg');
	background-size: cover;
	background-position: center;
	color: var(--fixlight);
	}

.fwk-box-photo-blur {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 0;
	background-color: var(--shadow2);
	border-radius: inherit;
}

.fwk-box i { 
	font-size: inherit;
	line-height: inherit;
	width: 20px;
	color: var(--mid1);
	}

.fwk-box h3 { 
	margin: 0 0 25px;
	font-weight: 600;
	}
	
.fwk-box h2 { 
	margin: 0 0 15px;
	color: var(--dark1);
	}

.fwk-box h2.small { 
	font-size: 14px;
	}
	
.fwk-box h2 i { 
	font-size: inherit;
	line-height: inherit;
	width: 30px;
	}
	
.fwk-box .fwk-linky { 
	margin: 10px 10px 0 0;
	cursor: pointer;
	background: var(--main);
	color: var(--fixlight);
	}

.fwk-box .fwk-linky i {
	color: var(--fixlight) !important;
	}

.fwk-box .fwk-linky:hover { 
	opacity: 0.7;
	}
	
.fwk-box table tbody td.xs {
	max-width: 70px;
	width: 70px;
	}

.fwk-box .fwk-tag.tag-photo {
	background: transparent;
}

/*/ Couleur des boîtes /*/

.fwk-box.box-neutral {
	background: var(--gray1);
	color: var(--dark1);
	border-color: var(--main);
	}

.fwk-box.box-neutral h2,
.fwk-box.box-neutral i {
	color: var(--main);
	}
	
.fwk-box.box-neutral .fwk-linky {
	background: var(--main) !important;
	color: var(--fixlight) !important;
	}

/*/ - /*/

.fwk-box.box-info {
	background: var(--main-light);
	color: var(--fixdark);
	border-color: var(--main);
	}

.fwk-box.box-info h2,
.fwk-box.box-info i {
	color: var(--main);
	}

.fwk-box.box-info .fwk-linky {
	background: var(--main) !important;
	color: var(--fixlight) !important;
	}

/*/ - /*/

.fwk-box.box-error { 
	background: var(--red-light);
	color: var(--fixdark);
	border-color: var(--red);
	}

.fwk-box.box-error h2,
.fwk-box.box-error i { 
	color: var(--red);
	}

.fwk-box.box-error .fwk-linky { 
	background: var(--red) !important;
	color: var(--fixlight) !important;
	}
	
/*/ - /*/
	
.fwk-box.box-success { 
	background: var(--green-light);
	color: var(--fixdark);
	border-color: var(--green);
	}
	
.fwk-box.box-success h2,
.fwk-box.box-success i { 
	color: var(--green);
	}

.fwk-box.box-success .fwk-linky { 
	background: var(--green) !important;
	color: var(--fixlight) !important;
	}
	
/*/ - /*/

.fwk-box.box-warning { 
	background: var(--orange-light);
	color: var(--fixdark);
	border-color: var(--orange);
	}

.fwk-box.box-warning h2,
.fwk-box.box-warning i { 
	color: var(--orange);
	}

.fwk-box.box-warning .fwk-linky { 
	background: var(--orange) !important;
	color: var(--fixlight) !important;
	}
	
/*/ - /*/

.fwk-table .fwk-box {
	border: 2px solid var(--white);
	margin: 0;
	}

/*/ - /*/

.fwk-box.box-cover {
	background-position: center;
	background-size: cover;
	color: var(--fixlight);
	padding: 40px;
	position: relative;
}

.fwk-box.box-cover .fwk-box-cover-b {
	margin: 15px;
	position: absolute;
	top: 0;
	right: 0;
	color: var(--fixlight);
	font-size: 18px;
}

.fwk-box.box-cover h1 {
	text-align: left;
	margin: 0;
	padding: 10px 0;
	font-weight: 600;
	font-size: 22px;
}

.fwk-box.box-cover h1 sup {
	display: inline-block;
	margin-left: 15px;
	min-width: 22px;
	height: 22px;
	line-height: 22px;
	font-size: 12px;
	text-align: center;
	border-radius: var(--round2);
	background: var(--white);
	color: var(--fixdark);
}

.fwk-box.box-cover p {
	padding: 15px 0 0;
	margin: 0;
}

/*/ - /*/

.fwk-box.box-tablet {
	font-size: 15px;
	margin-bottom: 0;
}

.fwk-box.box-tablet h2 {
	font-size: 40px;
	margin-bottom: 20px;
}

.fwk-box.box-tablet b {
	display: block;
	margin-top: 20px;
	font-size: 40px;
	line-height: 40px;
}

.fwk-box.box-tablet .fwk-linky {
	margin: 20px 0 0;
	display: block;
	max-width: 100%;
}