/*******************************************************************************************************************************************
*******************************************************************************************************************************************
######## ## ####### ###### ## ##
## ## ## ## ## ## ## ## ##
## ## ## ## ## ## ## ##
######## ## ## ## ## #####
## ## ## ## ## ## ## ##
## ## ## ## ## ## ## ## ##
######## ######## ####### ###### ## ##
*******************************************************************************************************************************************
**************************** see http://www.dev.equideow.com/doc/bow for more details *****************************************************
*******************************************************************************************************************************************
*******************************************************************************************************************************************/
/* LEGACY BLOCK ***************************************************************************************************************************
******************************************************************************************************************************************/
.block{
position: relative;
}
.block__content{
position: relative;
z-index: 1;
}
.block__content::after{
content: "";
display: block;
clear: both;
}
.body--ltr .block__content__strut{
padding: 20px 70px 10px 60px;
}
.body--rtl .block__content__strut{
padding: 20px 60px 10px 70px;
}
.block::after,
.block::before{
content: "";
display: block;
position: absolute;
}
.block::before{
z-index: 1;
border-radius: 8px;
overflow: hidden;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
.block::after{
left: 30px;
width: calc(100% - 60px);
height: 10px;
box-shadow: 0 0 15px rgba(0, 0, 0, .3);
z-index: 0;
border-radius: 50%;
bottom: 0;
}
.body--ltr .block .row [class*="row__cell"]:first-of-type,
.body--rtl .block .row [class*="row__cell"]:last-of-type{
border-radius: 8px 0 0 8px;
}
.body--ltr .block .row [class*="row__cell"]:last-of-type,
.body--rtl .block .row [class*="row__cell"]:first-of-type{
border-radius: 0 8px 8px 0;
}
/* CLICKABLE BLOCK ************************************************************************************************************************
******************************************************************************************************************************************/
a.block.block.block.block{
display: block;
text-decoration: none;
}
a.block::before{
transition: box-shadow .25s ease-in-out;
}
a.block:hover:not(.block--checked):not(.js-block--selectable):not(.js-block--selected)::before{
box-shadow: 0 0 30px 0 rgba(0,0,0,.3);
}
/* MODIFIER : BLOCK--SUCCESS ***************************************************************************************************************
******************************************************************************************************************************************/
.block--success.block::before,
.block--success.stickout::before{
background-image: url(/media/equideo/image/components/block/block-success.jpg);
background-position-x: center;
}
/* MODIFIER : BLOCK--EMPTY ****************************************************************************************************************
******************************************************************************************************************************************/
.block--empty.block::before,
.block--empty.stickout::before{
background: none;
border: 1px solid #af9c8c;
}
.block--empty.block::after,
.block--empty.stickout::after{
display: none;
}
/* MODIFIER : BLOCK--IMPORTANT ************************************************************************************************************
******************************************************************************************************************************************/
.block--important.block::before,
.block--important.stickout::before{
background: none;
border: 1px solid #EEC213;
}
.block--important.block::after,
.block--important.stickout::after{
display: none;
}
/* MODIFIER : BLOCK--CHECKED and BLOCK--DISABLED ***************************************************************************************/
/***************************************************************************************************************************************/
.block--checked::after,
.block--disabled::after{
background-position: center;
background-repeat: no-repeat;
background-size: 16px;
border-radius: 50%;
bottom: inherit;
box-shadow: none;
content: "";
display: block;
height: 32px;
left: inherit;
pointer-events: none;
position: absolute;
right: 10px;
top: 10px;
width: 32px;
z-index: 2;
}
/* MODIFIER : BLOCK--CHECKED ***********************************************************************************************************/
/***************************************************************************************************************************************/
a.block--checked{
cursor: default;
}
.block--checked::before{
border: 2px solid #849644;
background: linear-gradient(to bottom,#edfda4 0,#EDFDA4 10px,#FDFFF0 50px,#FDFFF0 100%);
}
.block--checked::after{
background-color: #849644;
background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmZmZmIiB2aWV3Qm94PSIwIDAgNDggNDgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQzLjYzIDguMmE0LjE0IDQuMTQgMCAwIDAtNi4wNSAwLjI0TDE4LjUyIDI5Ljk2bC04LjEtOC42M2E0LjE0IDQuMTQgMCAwIDAtNi4wNS0wLjI0IDQuNyA0LjcgMCAwIDAtMC4yNCA2LjM3TDE1LjEgMzkuMTRhNC4xNiA0LjE2IDAgMCAwIDIuNTYgMS43NWgwLjAyYTQuMDEgNC4wMSAwIDAgMCAxLjI1IDAuMSA0IDQgMCAwIDAgMC42Mi0wLjFoMC4wMWE0LjE2IDQuMTYgMCAwIDAgMi42LTEuODNsMjEuNy0yNC40OWE0LjcgNC43IDAgMCAwLTAuMjMtNi4zNyI+PC9wYXRoPjwvc3ZnPg==);
}
/* MODIFIER : BLOCK--DISABLED **********************************************************************************************************/
/***************************************************************************************************************************************/
.block--disabled{
cursor: default;
}
.block--disabled::before{
border: 2px solid #D0D0D0;
}
.block--disabled::after{
background-color: #D0D0D0;
background-image: url(data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2048%2048%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22%23949494%22%20d%3D%22m20.79976%2029.83375c0-1.8425%201.4315284-3.33375%203.20024-3.33375s3.20024%201.49125%203.20024%203.33375c0%201.175-.5843708%202.20875-1.4651268%202.8%200%200%20.3131844%201.96625.6647668%204.28375%200%20.69125-.5351732%201.24875-1.19994%201.24875h-2.39988c-.6647668%200-1.19994-.5575-1.19994-1.24875l.6647668-4.28375c-.880756-.59125-1.4651268-1.62625-1.4651268-2.8zm-3.19904-9.1675v-5.8325c0-3.68375%202.8630568-6.66625%206.39928-6.66625%203.5350232%200%206.39928%202.9825%206.39928%206.66625v5.8325zm-4.0006-5.8325v5.8325h-2.39988c-1.76871158%200-3.20024%201.49125-3.20024%203.33375v16.6675c0%201.84125%201.43152842%203.3325%203.20024%203.3325h25.59952c1.7675116%200%203.20024-1.49125%203.20024-3.3325v-16.6675c0-1.8425-1.4327284-3.33375-3.20024-3.33375h-2.39988v-5.8325c0-5.98375-4.6569671-10.83375-10.39988-10.83375s-10.39988%204.85-10.39988%2010.83375z%22%2F%3E%3C%2Fsvg%3E);
}
/* MODIFIER : BLOCK--SELECTABLE ********************************************************************************************************/
/***************************************************************************************************************************************/
.block.js-block--selectable::after{
display: none;
}
.block.js-block--selectable::before{
border: 1px solid #AF9C8C;
box-shadow: inset 0 4px 8px 0 rgba(0,0,0,0.30);
transition: none;
}
.block.js-block--selectable:hover::before{
box-shadow: inset 0 4px 8px 0 rgba(0,0,0,0.30), 0 0 0 4px rgba(0,0,0,0.10);
}
.block.js-block--selectable .svg--s.bg--success{
position: absolute;
right: 5px;
top: 0;
pointer-events: none;
}
/* MODIFIER : BLOCK--SELECTED **********************************************************************************************************/
/***************************************************************************************************************************************/
.block.js-block--selected{
cursor: default;
}
.block.js-block--selected::before{
border-width: 2px 2px 6px 2px;;
border-style: solid;
border-color: #37659A;
box-shadow: inset 0 4px 8px 0 rgba(0,0,0,0.30);
transition: none;
}
/* RADIUS *********************************************************************************************************************************
******************************************************************************************************************************************/
.radius--all{
border-radius: 4px;
}
.radius--top{
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.radius--bottom{
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
.radius--left{
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.radius--right{
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.radius--0{
border-radius: none;
}
/* TABLEVIEW INSIDE BLOCK *****************************************************************************************************************
******************************************************************************************************************************************/
.block__content .tableview{
border-radius: 8px;
overflow: hidden;
}