/* icon fonts for cards */
@import url('card-icons.css?version=0.1');

/* effector 6 defaults */
@import url('card-styles-effector6-default-theme.css');
@import url('card-theme-square-purple.css');

/* studio skin designer cards*/
@import url('card-studio-skin-designer.css');

/* studio workflow cards*/
@import url('card-studio-workflow.css');

/* studio workflow cards*/
@import url('card-studio-workflow-r2.css');

/* studio licence handler server cards*/
@import url('card-studio-lhs.css');

/* studio licence handler client cards*/
@import url('card-studio-lhc.css');

/* styles for licence (studio) cards*/
@import url('card-studio-application.css');

/* styles for licence (studio) cards*/
@import url('card-studio-users.css');

/* styles for xml (studio) cards*/
@import url('card-studio-xml.css');

/* styles for xml (studio) cards*/
@import url('card-studio-excel.css');

/* styles for xml (studio) cards*/
@import url('card-studio-fields-rules.css');

/* styles for xml (studio) cards*/
@import url('card-styles-documents.css');

/* styles for xml (studio) cards*/
@import url('card-styles-company.css');

/* colors for studio cards*/
@import url('card-palette-light-pastels.css');

/* colors for studio cards*/
@import url('card-condition-field.css');

/* platform palette */
@import url('card-platform-palette.css');


/***************************/
/* Common Card Styles      */
/***************************/

.card-text-bold { font-weight: bold; }

.card-text-italic { font-style: italic; }

.card-text-uppercase { text-transform: uppercase; }

.card-text-center { text-align: center; }

.card-text-left { text-align: left; }

.card-text-right { text-align: right; }

.card-text-justify { font-style: justify; }

.text-overflow-ellipsis { text-overflow: ellipsis; }

.white-space-nowrap { white-space: nowrap; }

.card-text-center-all {
    text-align: center;
    vertical-align: middle;
}

.safe-row { 
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.safe-rows { 
    /* white-space: nowrap; */
    overflow: hidden; 
}

/* Flexbox settings */

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-left-center {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    justify-content: center;
}

.overflow-ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
}

.two-line-overflow-ellipsis {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 37px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flex-row-center-cross {
    display: flex;
    flex-direction: row;
    overflow: hidden;
    align-items: center;
}

.flex-direction-row { 
    display: flex;
    flex-direction: row; 
}

.align-items-center { align-items: center; }

.justify-content-end { justify-content: flex-end; }

.justify-content-space-between { justify-content: space-between; }

.justify-content-right { justify-content: right; }

.word-wrap-break-word { word-wrap: break-word; }

.cursor-pointer { cursor: pointer; }

.positon-absolute { position: absolute; }

.bg-transparent { background-color: transparent; }

/*************************************/
/* Padding, margin, border           */
/*************************************/

.p-0 { padding: 0;}

.p-t-1 { padding-top: 1px; }
.p-t-2 { padding-top: 2px; }
.p-t-4 { padding-top: 4px; }
.p-t-6 { padding-top: 6px; }
.p-t-8 { padding-top: 8px; }
.p-t-10 { padding-top: 10px; }

.p-r-2 { padding-right: 2px; }
.p-r-4 { padding-right: 4px; }
.p-r-6 { padding-right: 6px; }
.p-r-8 { padding-right: 8px; }
.p-r-10 { padding-right: 10px; }

.p-b-2 { padding-bottom: 2px; }
.p-b-4 { padding-bottom: 4px; }
.p-b-6 { padding-bottom: 6px; }
.p-b-8 { padding-bottom: 8px; }
.p-b-10 { padding-bottom: 10px; }

.p-l-2 { padding-left: 2px; }
.p-l-4 { padding-left: 4px; }
.p-l-6 { padding-left: 6px; }
.p-l-8 { padding-left: 8px; }
.p-l-10 { padding-left: 10px; }

.m-0 { margin: 0; }

.m-t-2 { margin-top: 2px; }
.m-t-4 { margin-top: 4px; }
.m-t-6 { margin-top: 6px; }
.m-t-8 { margin-top: 8px; }
.m-t-10 { margin-top: 10px; }

.m-r-2 { margin-right: 2px; }
.m-r-4 { margin-right: 4px; }
.m-r-6 { margin-right: 6px; }
.m-r-8 { margin-right: 8px; }
.m-r-10 { margin-right: 10px; }

.m-b-2 { margin-bottom: 2px; }
.m-b-4 { margin-bottom: 4px; }
.m-b-6 { margin-bottom: 6px; }
.m-b-8 { margin-bottom: 8px; }
.m-b-10 { margin-bottom: 10px; }

.m-l-2 { margin-left: 2px; }
.m-l-4 { margin-left: 4px; }
.m-l-6 { margin-left: 6px; }
.m-l-8 { margin-left: 8px; }
.m-l-10 { margin-left: 10px; }

.b-0 { border: 0; }

.b-t-2 { border-top: 2px; }
.b-t-4 { border-top: 4px; }
.b-t-6 { border-top: 6px; }
.b-t-8 { border-top: 8px; }
.b-t-10 { border-top: 10px; }

.b-r-2 { border-right: 2px; }
.b-r-4 { border-right: 4px; }
.b-r-6 { border-right: 6px; }
.b-r-8 { border-right: 8px; }
.b-r-10 { border-right: 10px; }

.b-b-2 { border-bottom: 2px; }
.b-b-4 { border-bottom: 4px; }
.b-b-6 { border-bottom: 6px; }
.b-b-8 { border-bottom: 8px; }
.b-b-10 { border-bottom: 10px; }

.b-l-2 { border-left: 2px; }
.b-l-4 { border-left: 4px; }
.b-l-6 { border-left: 6px; }
.b-l-8 { border-left: 8px; }
.b-l-10 { border-left: 10px; }
.max-w-220 { max-width: 220px; }

/***************************/
/* Opacities               */
/***************************/

.opacity-1 { opacity: 0.1; }

.opacity-2 { opacity: 0.2; }

.opacity-3 { opacity: 0.3; }

.opacity-4 { opacity: 0.4; }

.opacity-5 { opacity: 0.5; }

.opacity-6 { opacity: 0.6; }

.opacity-7 { opacity: 0.7; }

.opacity-8 { opacity: 0.8; }

.opacity-9 { opacity: 0.9; }

/***************************/
/* Font sizes              */
/***************************/

.font-size-9 { font-size: 9px;}

.font-size-10 { font-size: 10px; }

.font-size-11 { font-size: 11px; }

.font-size-12 { font-size: 12px; }

.font-size-13 { font-size: 13px; }

.font-size-14 { font-size: 14px; }

.font-size-15 { font-size: 15px; }

.font-size-16 { font-size: 16px; }

.font-size-17 { font-size: 17px; }

.font-size-18 { font-size: 18px; }

.font-size-19 { font-size: 19px; }

.font-size-20 { font-size: 20px; }

.font-size-24 { font-size: 24px; }

.font-size-27 { font-size: 27px; }

.font-size-28 { font-size: 28px; }

.font-size-29 { font-size: 29px; }

.font-size-30 { font-size: 30px; }

.font-size-31 { font-size: 31px; }

.font-size-32 { font-size: 32px; }

.font-size-33 { font-size: 33px; }

.font-size-34 { font-size: 34px; }

.font-size-35 { font-size: 35px; }

.font-size-36 { font-size: 36px; }

.font-size-37 { font-size: 37px; }

.font-size-38 { font-size: 38px; }

.font-size-39 { font-size: 39px; }

.font-size-40 { font-size: 40px; }

.font-size-41 { font-size: 41px; }

.font-size-42 { font-size: 42px; }

.font-size-43 { font-size: 43px; }

.font-size-44 { font-size: 44px; }

.font-size-45 { font-size: 45px; }

.font-size-46 { font-size: 46px; }

.font-size-47 { font-size: 47px; }

.font-size-48 { font-size: 48px; }

.font-size-49 { font-size: 49px; }

.font-size-50 { font-size: 50px; }

.font-size-80 { font-size: 80px; }

.margin-t5 { margin-top: 5px; }

/*************************************/
/* Predefined                        */
/* width, height                     */
/*************************************/

/*** predefined widths ***************/

.w-100w { width: 100% }

.w-516 { width: 516px; }

.w-500 { width: 500px; }

.w-230 { width: 230px; }

.w-200 { width: 200px; }

.w-190 { width: 190px; }

.w-180 { width: 180px; }


/*** predefined heights **************/

/* card title 2 rows */
.h-40 { height: 40px; }

/* card title 1 row */
.h-20 { height: 20px; }

/* card text 2 rows */
.h-32 { height: 32px; }

.h-30 { height: 30px; }

.h-28 { height: 28px; }

.h-22 { height: 22px; }

/* card text 1 row */
.h-18 { height: 18px; }

.row-full {
    width: 100vw;
    /* position: relative; */
    /* margin-left: -50vw; */
    height: 30px;
    /* margin-top: 100px; */
    /* left: 50%; */
}



/***************************/
/* Sizes                   */
/***************************/

/*** dynamic sizes *********/

.size-100w-43 {
    width: 100%;
    height: 43px;
}

.size-100w-30 {
    width: 100%;
    height: 30px;
}

.size-80x100h {
    width: 80px;
    height: 100%;
} 

.size-70x100h {
    width: 70px;
    height: 100%;
}

.size-40x100h {
    width: 40px;
    height: 100%;
}

.size-35x100h {
    width: 35px;
    height: 100%;
}

.size-30x100h {
    width: 30px;
    height: 100%;
}


/*** rectangle sizes *************/

.size-600x30 {
    width: 600px !important;
    height: 30px !important;
}


.size-320x170 {
    width: 320px;
    height: 170px;
}

.size-300x170 {
    width: 300px;
    height: 170px;
}

.size-300x165 {
    width: 300px;
    height: 165px;
}

.size-300x160 {
    width: 300px;
    height: 160px;
}

.size-300x135 {
    width: 300px;
    height: 135px;
}

.size-300x130 {
    width: 300px;
    height: 130px;
}

.size-300x125 {
    width: 300px;
    height: 125px;
}

.size-300x120 {
    width: 300px;
    height: 120px;
}

.size-300x100 {
    width: 300px;
    height: 100px;
}

.size-300x90 {
    width: 300px;
    height: 90px;
}

.size-300x80 {
    width: 300px;
    height: 80px;
}

.size-300x66 {
    width: 300px;
    height: 66px;
}

.size-360x60 {
    width: 360px;
    height: 60px;
}

.size-260x150 {
    width: 260px;
    height: 150px;
}

.size-44x22 {
    width: 44px;
    height: 22px;
}

/*** sqare sizes ***********/

.size-60x60 {
    width: 60px;
    height: 60px;
}

.size-52x52 {
    width: 52px;
    height: 52px;
}

.size-50x50 {
    width: 52px;
    height: 52px;
}

.size-44x44 {
    width: 44px;
    height: 44px;
}

.size-34x34 {
    width: 34px;
    height: 34px;
}

.size-30x30 {
    width: 30px;
    height: 30px;
}

.size-26x26 {
    width: 26px;
    height: 26px;
}

.size-24x24 {
    width: 24px;
    height: 24px;
}

.size-22x22 {
    width: 22px;
    height: 22px;
}

/***************************/
/* Positions               */
/***************************/

.pos-l11-t9 {
    position: absolute;
    left: 11px;
    top: 9px;
}

.pos-l10-t10 {
    position: absolute;
    left: 10px;
    top: 10px;
}

.pos-l11-t12 {
    position: absolute;
    left: 11px;
    top: 12px;
}

.pos-l25-t113 {
    position: absolute;
    left: 25px;
    top: 113px;
}

.pos-l25-t65 {
    position: absolute;
    left: 25px;
    top: 65px;
}

.pos-l53-t263 {
    position: absolute;
    left: 263px;
    top: 53px;
}

.pos-l63-t263 {
    position: absolute;
    left: 263px;
    top: 63px;
}
.pos-l10-t55 {
    position: absolute;
    left: 10px;
    top: 55px;
}

.pos-l7-t17 {
    position: absolute;
    left: 7px;
    top: 17px;
}

.pos-l68-t5 {
    position: absolute;
    left: 68px;
    top: 5px;
}

.pos-l130-t3 {
    position: absolute;
    left: 130px;
    top: 3px;
}

.pos-l196-t5 {
    position: absolute;
    left: 196px;
    top: 5px;
}

.pos-l254-t70 {
    position: absolute;
    left: 254px;
    top: 70px;
}

.pos-l15-t12 {
    position: absolute;
    left: 15px;
    top: 12px;
}


.pos-l20-t9 {
    position: absolute;
    left: 20px;
    top: 9px;
}

.pos-l70-t32 {
    position: absolute;
    left: 70px;
    top: 32px;
}

.pos-l70-t48 {
    position: absolute;
    left: 70px;
    top: 48px;
}

.pos-l72-t48 {
    position: absolute;
    left: 72px;
    top: 48px;
}

.pos-l77-t48 {
    position: absolute;
    left: 77px;
    top: 48px;
}

.pos-l23-t1 {
    position: absolute;
    left: 23px;
    top: 1px;
}

.pos-l80-t0 {
    position: absolute;
    left: 80px;
    top: 0px;
}

/*** edit-icon pos ***********/

.card-frame .pos-edit-icon-l270-t10 {
    position: absolute;
    left: 270px;
    top: 10px;
}

.pos-edit-icon-l270-t14 {
    position: absolute;
    left: 270px;
    top: 14px;
}

/*** copy-icon pos ***********/

.pos-copy-icon-l93-t69 {
    position: absolute;
    left: 93px;
    top: 69px;
}

/*** subprocess-icon pos ***********/

.pos-subprocess-icon-l120-t69 {
    position: absolute;
    left: 120px;
    top: 69px;
}