body
{
    --cartCol1Width     : 90px;
    --cartCol2Width     : 250px;
    --cartCol3Width     : 90px;
}
#walletContent
{
    --tokenImgSizeMax : 240px;
    --tokenImgSizeMin : 120px;
    --tokenImgSizeMinPixelated:96px;
    margin-top: 20px;
    margin-right:calc( var(--cartCol1Width) + var(--cartCol2Width) + var(--cartCol3Width) );
}
.collection
{
    --paddingLeft : 10px;
    position:relative;
    top:0;
    left:calc(0px - var(--shadowSize));
    display: inline-block;
}
.collection ul.tokens
{
    list-style:none;
    overflow:hidden;
    padding:0;
    padding-left: var(--shadowSize);
}
.collection_title .atitle
{
    margin-left: calc(var(--shadowSize) + var(--paddingLeft));
    text-transform: uppercase;
    display: inline-block;
}
.collection_title .atitle
{   border-bottom: 1px solid #888;
}
.collection_title .collection_count
{
    padding-left:5px;
    font-size:0.85em;
}
ul.tokens
{
    --chkWidth:36px;
}
ul.tokens li
{
    display:block;
    /*height : 300px;*/
    float :left;
    margin-right: 20px;
    margin-bottom : 20px;
    min-height: calc( var(--tokenImgSizeMax) + 2*var(--mattingWidth) + 39px);
}
#Collection8Bidou ul.tokens li 
{
    min-height : auto;
}
ul.tokens li.walletTokenError
{
    min-height: auto;   
    padding : 10px;
    color : #fff;
    background: var(--mattingColor);
    border-radius: 5px;
    font-family: var(--fontFamily1);
    letter-spacing: 0.05em;
	font-weight: var(--fontWeightLight);
}

ul.tokens li .tokentitle
{
    display: block;
    padding-left: var(--paddingLeft);
    font-family: var(--fontFamily1);
    font-weight: 200;
    font-size : 0.7rem;
}
ul.tokens li .editions
{
    font-size : 0.6rem;
    padding: 2px 0 5px var(--paddingLeft);
    display: inline-block;
}
ul.tokens li .editions .longform
{
    font-size:9px;
}
ul.tokens li .img
{
    display:inline-block;
    margin:0;
    background : var(--mattingColor);
    padding		: var(--mattingWidth);
    box-shadow: var(--frameShadow);
    position:relative;
    top:0;
    left:0;
}
ul.tokens li .img img
{
    max-height : var(--tokenImgSizeMax);
    max-width : var(--tokenImgSizeMax);
    min-width : var(--tokenImgSizeMin );
    min-height : var(--tokenImgSizeMin );

}
ul.tokens li .img img.pixelated
{   image-rendering: pixelated;
    min-width : var(--tokenImgSizeMinPixelated );
    min-height : var(--tokenImgSizeMinPixelated );
    width : var(--tokenImgSizeMinPixelated );

}                            
ul.tokens input.chk, ul.tokens abbr
{
    width : var(--chkWidth);
    height: var(--chkWidth);
    background-color: var(--mattingColor);
    color : #fff;
   cursor : pointer;
    margin:0;
    position:absolute;
    right : calc(0px + var(--mattingWidth) );
    bottom : calc(0px + var(--mattingWidth));
}
ul.tokens .btnLink
{
    position:absolute;
    width : var(--chkWidth);
    color : #fff;
    background-color: var(--mattingColor);
    text-decoration: none;
    text-align:center;
    padding:2px;
    font-size : 0.6rem;
    left : calc(0px + var(--mattingWidth) + 2px);
    bottom : calc(0px + var(--mattingWidth));
}
ul.tokens .slot2
{
    right : calc(0px + var(--mattingWidth) + var(--chkWidth) + 2px );

}
ul.tokens abbr
{
    background-color:rgba(255,255,255,0.5);
    background-color: var(--mattingColor);
    display:inline-block;
    line-height: var(--chkWidth);
    text-align: center;
    font-size:18px;
    text-decoration: none;
    cursor : help;
    padding : 0;
    margin:0;
}
ul.tokens abbr.slot2
{   
    background-color: #fff;
    color : #000;
    border:1px solid var(--mattingColor);
    border-radius: 3px;
}

ul.tokens .icLock
{
    background-image: url(../Img/iclock.svg);
    background-position: 70% 50%;
    background-repeat: no-repeat;
    background-size: 30px 30px;
}

#connectorContainer #walletButtons
{
    padding-left : 8px;
    display: inline-block;
}
#wallet_connector_container .wallet
{
    display: inline-block;
}
#connectorContainer #logoutContainer
{
    padding-left : 8px;
    display: inline-block;

}
#connInfo
{
    display: inline-block;
}
.btnClass
{
    font-size : 0.9rem;
    padding : 4px 6px 5px 6px;
    font-weight:200;
    font-family: var(--fontFamily1);
}
.btnClass.small
{
    font-size : 0.6rem;

}
#walletInfoText
{
    background-color: var(--mattingColor);
    color : #fff;
    border-radius:5px;
    box-shadow: var(--frameShadow);
    font-family: var(--fontFamily1);
	letter-spacing: 0.05em;
	font-weight: var(--fontWeightLight);
    padding:10px;
    margin-bottom: 15px;
    margin-left: 8px;
    max-width: var(--formWidthLarge);
    min-width : 200px;
}
#walletInfoText i
{
    font-size:0.8em;
}
#cart
{
    z-index : 10;
    position:fixed;
    top:10px;
    right:10px;
    background : rgba(255,255,255,0.97);
    background : var(--mattingColor);
    border-radius:5px;
    box-shadow: var(--frameShadow);
    color : #fff;
    overflow: scroll;
    max-height: 100vh;
    min-width: 500px;
    padding:10px;
}
.cartTitle
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    font-size : 1rem;
}
.cartTitle .unitSwitch, .cartTitle .currSel
{
    float:right;
    font-size:0.75rem;
    padding-left:10px;
}
.cartTitle label,.cartTitle select
{
    color: #fff;
    font-size:0.75rem;
    font-family: var(--fontFamily1);
    font-weight: 400;

}
.cartTitle .currSel select
{   background-color: #000;
    border: none;
    padding: 0;
}

.cartItems
{
    display : table;
    min-width: 500px;
    border-collapse: collapse;
}

.cartItem
{
    display : none;
    border-top : 1px dashed #888;
}
.cartPrice
{
    border-top : 1px solid #888;
    padding: 5px 0 5px 0;
    overflow: hidden;
}
.cartPrice .text
{
    line-height:1rem;
    font-weight:normal;
}
.cartPrice .textsmall
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    font-size: 0.7rem;
    line-height:1rem;
    max-width:400px;
}
.cartPrice .textsmall b
{
    font-family: var(--fontFamily1);
    font-weight:300;
}

.cartPrice .right
{
    display: block;
    float : right;
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    font-size : 1rem;
}
.cartOrder
{
    padding-top:10px;
}

.cartOrder a
{
    float:right;
    color:#000;
    background:#fff;
}

.cartItem.active
{
    display : table-row;
}
.cartItem .colImg
{
    display: block;
    width : var(--cartCol1Width);
    padding : 5px 10px 5px 0;
    display: table-cell;
}
#cart .szColImg
{
    display: inline-block;
    width : var(--cartCol1Width);
}
.cartItem .colImg img
{
    max-width: 100%;
    max-height : 100px;
}
.cartItem  .colInfo
{
    min-width : var(--cartCol2Width);
    display: table-cell;
    vertical-align: top;
    padding : 5px 10px 5px 0;

}
.cartItem .title
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    font-size: 0.8rem;
    margin-bottom: 5px;
}

.cartItem  select.formats,.cartItem select.shipCountry
{
    min-width : 200px;
    max-width: 325px;
    border: none;
    padding: 2px 1px 2px 1px;
    margin-bottom: 2px;
    font-size: 0.6rem;
}
.cartItem  .formats .name
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    padding-right : 10px;
}
.cartItem  .formats .dim
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    padding-left : 10px;
    font-size : 0.7rem;
}

.cartItem .paper
{
	font-weight: var(--fontWeightLight);
    font-size: 0.7rem;
}
.cartItem .colPrice
{   
    display: table-cell;
    vertical-align: bottom;
    text-align: right;
    min-width : var(--cartCol3Width);
    padding : 5px 0 5px 0;
}
.cartItem .price
{   font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    padding: 5px;
}
.loader
{
	display: inline-block;
	width:300px;
    top : 14px;
    margin-left:10px;
}
.loader .t
{
    font-size : 0.75rem;
}
/* Form */
.frontForm
{
    --formWidthLarge : 530px;
    --formSep        : 20px;
    --formWidthHalf :  calc( ( var(--formWidthLarge) - var(--formSep) ) / 2 - 4px );

}
.frontForm .forminput .inputTitle
{
	font-size : 1rem;
	font-weight: 100;

}
.frontForm #address1 input, .frontForm #address2 input, .frontForm #address3 input, .frontForm input[name=transactionHash]
{
    width   : var(--formWidthLarge);
}

#FormInput_name > .inputControl , #postalCity, #phoneEmail, #countryAndState
{
    overflow: hidden;
}
.frontForm #name, .frontForm #contactName, .frontForm #postalCode, .frontForm #city,.frontForm #FormInput_phone, .frontForm #FormInput_email, .frontForm #FormInput_country, .frontForm #FormInput_state
{
    float : left;
}
.frontForm #contactName, .frontForm #city, .frontForm #FormInput_email, .frontForm #FormInput_state
{
    margin-left: var(--formSep);
}
.frontForm #name input, .frontForm #contactName input, #postalCode input, #city input, #FormInput_phone input,#FormInput_email input, .frontForm #FormInput_twitter input, .frontForm #FormInput_state input
{   width: var(--formWidthHalf);
}
.frontForm #FormInput_country select
{
    width: calc( var(--formWidthHalf) + 6px);
    font-size: 1.2rem;
}

.frontForm .forminput .inputControl input, .frontForm .forminput textarea, .frontForm label[for=agreed]
{
	font-family : var(--fontFamily1);
	font-weight: var(--fontWeightLight);
	font-size : 1rem;
	padding: 2px;
}
#FormInput_message
{
    margin-top: 20px;
}
#FormInput_message textarea
{
    width:  var(--formWidthLarge);
    height : 66px;
}

.frontForm .forminput input[name=wallet], .frontForm .forminput input[name=transactionHash]
{
	font-size : 0.7rem;
}
.frontForm .forminput .inputComment, .buttonOrderInfo, #trsHash .info
{
	font-size : 0.65rem;
    line-height:1.1rem;
    font-weight: 400;
	letter-spacing: 0.1em;
	max-width:  var(--formWidthLarge);
}
.frontForm .forminput input[type=checkbox]
{
	font-size : 2rem;
}
.buttonOrderInfo, #trsHash .info
{
    display: block;
    margin-left:var(--paddingLeft);

    border-radius: 5px;
    box-shadow: var(--frameShadow);
    padding:5px;   
}
.buttonOrderInfo
{   background: var(--mattingColor);
    color : #ddd;
}
.buttonOrderInfo b
{
    color : #fff;
}
span.mandatory
{
    font-family: var(--fontFamily1);
	font-weight: var(--fontWeightLight);
    font-size: 0.8rem;
    padding-left:5px;
    color:#888;
}
.frontForm .errorMsg, #trsHash .info .error
{
    color:#800;
}
.frontForm .errorMsg
{
    padding : 4px;
    border : 1px solid #000;
    border-radius: 4px;
    background : var(--mattingColor);
    color : #fff;
    margin-top : 5px;
    margin-bottom:var(--shadowSize);
    position:relative;
    top:0;
    left:0;
    max-width:var(--formWidthHalf);
    box-shadow: var(--frameShadow);
    font-family: var(--fontFamily1);
    font-weight: 100;
}
.frontForm .errorMsg::after 
{
    content:" ";
    position : absolute;
    top: -5px;
    left:10px;
    z-index: 3;
    padding:0;
    display:block;
    width : 8px;
    height:8px;
    transform: rotate(45deg);
    border-top : 1px solid #000;
    border-left : 1px solid #000;
    background : var(--mattingColor);

}
#order .divBtns
{
    margin-top : 10px;
}
.info .loader 
{
	display : block;
	width : 400px;
	background:none;
    top : 0;
    margin-left : 0;
}
.tooltip
{   position:absolute;
    z-index:1;
    bottom:calc( var(--chkWidth) + var(--mattingWidth) + 2px);
    display:block;
    min-width:100px;
    max-width:200px;
    background : #000;
    border-radius: 5px;
    padding : 5px;
    box-shadow: var(--frameShadow);
    font-size: 0.7rem;
    color : #fff;
    animation-name: fadeIn;
	animation-duration: 1s;
	animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;  

}
.tooltip.right
{
    right:calc( var(--mattingWidth) + 2px);
    text-align: right;
}
.tooltip.left
{
    left:calc( var(--mattingWidth) + 2px);

}
.btnClass .balance
{
    font-size:0.65rem;
    padding-left: 0.2em;
}