@charset "utf-8";
/* CSS Document */

body { margin:0; font-family:"Archivo Narrow", Arial, Helvetica, sans-serif; font-weight:400; font-size:18px; color:#404244;}


h1,h2,h3,h4,h5 , h1 a,h2 a,h3 a,h4 a,h5 a { color:#242628;}

header a , .buttons a , .button, .noselect , .selector {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
								 
}


section { min-height: 110px;}



p.folio { text-align:center; margin:2em 0;}
p.folio a , p.folio span { height:1em;line-height:1em; min-width:1em; padding:0.4em; border-radius:3px; font-weight:500; margin:0.2em; display:inline-block; border:1px solid #AAA; color:#000; text-decoration:none;}
p.folio span { color:#DDD; border-color:#DDD; cursor:default;}
p.folio span.actif { border-color: rgba(0,0,0,0.1); color:#FFF; background: #518acc;}


.updateDimensions { position:fixed; width:100%; height:100%; background:rgba(0,0,0,0.4); top:0; left:0; z-index:10; font-weight:300; display:none;}
.basket-article .updateDimensions .edit.bg { background:none; width:100%; height:100%; top:0; left:0; position:absolute; z-index:1; }
.updateDimensions form { position:absolute; top:50%; left:50%; z-index:2; background:#FFF; padding:20px; box-sizing:border-box; width:260px; margin:-150px -130px; text-align:right;}
.updateDimensions form input { width:70px; text-align:right; font-weight:500; font-family:"Archivo Narrow", Arial, Helvetica, sans-serif; height:1em; padding:0.5em 0.4em; font-size:100%; }
.updateDimensions form strong { font-size:80%; color:#AAA; font-weight:500; position:absolute; line-height:2em; height:2em; top:50%; margin:-1em 0; right:0; }
.updateDimensions .locks { padding-right:1.4em; background:url(../images/locks.svg) no-repeat right center; background-size:contain;}
.updateDimensions form .locks p { text-align:right; margin:5px 0; position:relative; padding-right:1.6em;}
.updateDimensions form h5 { text-align:left; font-weight:600; margin:0; font-size:18px; margin:-5px -20px 15px -20px; padding:0 20px 15px 20px; border-bottom:1px solid #DDD;}
input.invisible { position:absolute; padding:0; line-height:0; font-size:0; border:none; background:none; visibility:hidden;}
.updateDimensions .reset span { font-size:80%; text-decoration:underline; cursor:pointer;}
.updateDimensions .reset span:hover { text-decoration:none;}
.updateDimensions form p.reset  { text-align:center; margin-top:20px; }


.choix_fdp { margin:8px 0; font-size:90%;}
.choix_fdp a , .choix_fdp a:hover { position:relative; display:block; background:#FAFAFA; padding:15px; box-shadow:none; border-radius:4px; border:1px solid #FAFAFA; padding-left:70px; box-sizing:border-box; padding-right:100px; max-width:770px;}
.choix_fdp a:before { position:absolute; left:50px; height:100%; width:1px; background:rgba(0,0,0,0.08); content:""; top:0;}
.choix_fdp a:hover { border-color:#E5E5E5; }
.choix_fdp a strong { display:block; font-size:120%;}
.choix_fdp a em { position:absolute; right:15px; color:#5998e1; font-weight:500;}
.choix_fdp a span { position:absolute; left:18px; width:1px; background:#FFF; width:16px; height:16px; top:50%; margin:-8px 0; box-shadow:0 0 0 2px rgba(0,0,0,0.12), 0 0 0 2px #FFF inset; border-radius:100%;}
.choix_fdp a.actif span { background:#5998e1;}


a { box-shadow:0 -4px 0 rgba(89,152,225,0.3) inset; transition:box-shadow 0.2s, border-radius 0.2s; padding:0 0.12em; margin:0 -0.1em;  cursor:pointer; text-decoration:none; color:#404244; }
a:hover { box-shadow:0 -40px 0  rgba(89,152,225,0.3) inset;  border-radius:4px; }

.dark a { box-shadow:0 -4px 0 rgba(255,255,255,0.3) inset; }
.dark a:hover { box-shadow:0 -40px 0  rgba(255,255,255,0.3) inset; }

.center { margin:50px auto; max-width:1300px; padding:0 30px;}
header { padding:30px 0; margin:0; background:no-repeat center center; background-size:cover;  position:relative; overflow:hidden;}
header.short { height:44px; border-bottom:1px solid #DDD;}
/*header:before { content:""; background:rgba(255,255,255,0.05); position:absolute; top:0; left:0; width:100%; height:100%;}
*/

header:after { content:""; background: -moz-linear-gradient(top,  rgba(255,255,255,0.25) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.25) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0.25) 0%,rgba(255,255,255,0) 100%);
 position:absolute; top:0; left:0; width:100%; height:150px;}
 
/*header.dark:after {  background: -moz-linear-gradient(top,  rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%);}*/


header.dark:after {  background:#FFF; position:absolute; width:100%; left:0; height:10px; padding:8% 0; top:100%; margin:0; bottom:0; transform:skewY(-6.2deg); transform-origin:bottom left;}


header #particles { position:absolute; width:100%; height:100%; top:0; left:0; opacity:0.6;}
header .center { margin-top:0; margin-bottom:0;   padding-bottom:100px; position:relative; z-index:2;}
header.dark { background-color:#6991c0; color:#FFF; background: #5285bf;
background: -moz-linear-gradient(-45deg,  #5285bf 0%, #6991c0 100%);
background: -webkit-linear-gradient(-45deg,  #5285bf 0%,#6991c0 100%);
background: linear-gradient(135deg,  #5285bf 0%,#6991c0 100%);
}
header.dark svg { fill:#FFF; }
header svg { width:auto; height:40px;}

header form { position:relative; }

header .illustration { position:absolute; bottom:-30px; right:0; margin-right:-2%; height:85%; height:calc(100% - 50px); width:auto; z-index:2; }

header .freefdp { position:absolute; top:2.2em; left:26em; height: 7em; width: 7em; z-index:4; }


header form { margin:5% auto; padding:30px 40% 60px 0; }
header h1 { font-size:300%; margin:40px 40px 0 0; max-width:600px; line-height:90%; color:#FFF;}
header h3 { font-size:130%; line-height:115%; font-weight:400; margin:20px 0 40px 0; max-width:580px; color:#FFF;}

.reflet , .reflet span , .buttons a { position:relative;}
.reflet:before , .buttons a:before { position:absolute; content:"";  left:0; width:100%; left:calc(0px + 1px); width:calc(100% - 2px); height:50%;  top:0; top:calc(0px + 1px); height:calc(50% - 1px); 
background:rgba(255,255,255,0.3); border-radius:3px;
background: -moz-linear-gradient(top,  rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.25) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.25) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.25) 100%);
z-index:2;

 }
 
 .texte { line-height:150%;}
 .texte p { max-width:800px;}

#footer h3 { font-size:130%; margin:0;}
#footer p { margin:0 0 10px 0;}
#footer , #footer h3 , #footer a { color:#727476;}
#footer { background:#F0F2F4; padding:1px; margin-top:7%; position:relative;  min-height:180px; font-size:90%; }
#footer .center { position:relative; z-index:2;}
#footer:before { position:absolute; top:0; background:#F0F2F4; height:120px; content:""; width:100%; left:0; padding:1% 0; transform:skewY(-2.2deg); transform-origin:0 0;   }

#footer .columns { margin:0 -10px; padding-bottom:30px; }
#footer .columns .col { float:left; margin:0; padding:10px; box-sizing:border-box; width:25%;}
#footer .columns .col.large { width:50%; padding-right:150px; position:relative;}
#footer .columns .col.large p { max-width:380px;}
#footer .columns .col.large p.socials { position:absolute; right:-5px; margin-top:-10px;}
#footer .columns .col.large p.socials strong { display:block; font-size:120%;}
#footer .columns .col.large p.socials a { float:left; overflow:hidden; transition:background-color 0.2s; text-indent:-500px; width:44px; height:44px; box-shadow:none; background:#A4A6A8 no-repeat center center; background-size:40px; margin:5px 5px 0 0; padding:0; border-radius:100%;}
#footer .columns .col.large p.socials a.facebook { background-image:url(../images/social-facebook.svg);}
#footer .columns .col.large p.socials a.twitter { background-image:url(../images/social-twitter.svg);}
#footer .columns .col.large p.socials a.instagram { background-image:url(../images/social-instagram.svg);}
#footer .columns .col.large p.socials a:hover { background-color:#323436;}

#footer .columns .col p.small { max-width:200px;}

#footer ul { margin:0; list-style:none; padding:0;}
#footer ul li{ margin:2px 0;}

.clear { clear:both;}


h1 { font-size:175%;  line-height:100%;}
h2 { font-size:175%;line-height:100%;}
h3 { font-size:130%;line-height:125%;}
h4 { font-size:120%; line-height:130%;}

.al-r { text-align:right;}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: inherit;
  opacity: 0.35;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: inherit;
  opacity: 0.35;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: inherit;
  opacity: 0.35;
}





#logo { box-shadow:none; margin:0; padding:0;}

header  .form input { width:100%;  font-family:"Archivo Narrow", Arial, Helvetica, sans-serif;  background:url(../images/icons/search-grey.svg) no-repeat 10px center; box-sizing:border-box; padding:0 10px 0 52px; height:50px; line-height:50px; font-size:115%;border:none;  border-radius:4px;}
header .form { background:#FFF;  border-radius:3px; margin:0;  max-width:550px; position:relative; padding:0; border-radius:4px;  }
header .form a { background:#5998e1;   box-shadow:none;  color:#FFF; position:absolute; right:5px; top:5px; text-align:center; padding:0 10px;  border:1px solid #5998e1; border-radius:4px; height:38px; line-height:38px;}
#menu { position:relative; margin:0; }
#menu p { position:absolute; line-height:36px; top:0; margin:2px 0; right:0; }
#menu p a { color:#000;  display:inline-block; margin:0 0 0 6px;  padding:0 4px;}
.dark #menu p a { color:#FFF;}
#menu p a.button { background:#5998e1;  border:2px solid #5998e1; color:#FFF; padding:0 10px; border-radius:4px;  box-shadow:none; }
#menu p a.button:hover , header .form a:hover {  background-color:#518acc;  border-color:#518acc; transition:border-color 0.2s, background-color 0.2s; box-shadow:none;  }

#menu p a.button span { display:inline-block; padding-left:30px; background:url(../images/icons/cart.svg) no-repeat 0 center; background-size:20px; }
#menu p a.button strong { background:#FFF;  background:rgba(255,255,255,0.95);  margin:8px -2px 0 8px; font-size:14px;  color:#5998e1; border-radius:30px; text-align:center; float:right; line-height:20px; height:20px; min-width:10px; padding:0 5px; }


header.dark #menu p a.button { background:none;  border-color:#FFF;  }
header.dark #menu p a.button:before { display:none;}

.buttons.big { font-size:120%; font-weight:bold;}

.buttons a { background:#5998e1; margin:0;  color:#FFF; padding:.6em .5em; line-height:110%; border-radius:4px; display:inline-block; border:2px solid #5998e1; box-shadow:none;}
.buttons a:hover { background-color:#518acc;  border-color:#518acc; transition:border-color 0.2s,  background-color 0.2s;}


.buttons a.border { background:none;  color:#444648;  border-color:#444648; font-weight:bold;}
.buttons a.border:hover { color:#040608;  border-color:#040608;}
.buttons a.border:before { display:none;}

.buttons a.border.red {   color:#E02;  border-color:#E02; }
.buttons a.border.red:hover { color:#801;  border-color:#801;}

.buttons a span { position:relative; display:inline-block;}

.buttons a.grey:before { display:none;}
.buttons a.grey { color:#525456; background:#F2F4F6; border-color:#D2D4D6; border-color:rgba(0,10,20,0.06);}
.buttons a.grey:hover {  border-color:rgba(0,10,20,0.2);}
.buttons a.orange { background:#F60; border-color:#F60;}


.has-menu { position:relative; padding-left:300px; font-size:90%;}
.has-menu menu { position:absolute; left:0; margin:0; padding:0 20px; background:#FAFBFC; border:1px solid #E6E8EA; border-radius:3px; width:260px; box-sizing:border-box;}
.has-menu menu a { display:block; box-shadow:none; display:block; padding:15px 0;  }
.has-menu menu a + a { border-top:1px solid #E6E8EA;}

#orange { display:none;}


.buttons a.picto { padding-left:5px;}
.buttons a.picto span { padding-left:20px; background:no-repeat 0 center; background-size:20px;}
.buttons a.picto.print span { background-image:url(../images/icons/printer-white.svg);}
.buttons a.picto.download span { background-image:url(../images/icons/download.svg);}

.heart { color:#e64c45; }

.clear { clear:both;}

#search-results { margin:-10px;}

#filter { padding-left:25%; position:relative; margin-top:-20px; }
#filter .col-search { width:33.33% }
#fileselect { display:none;}

#filter .filter { margin-left:-33.33%; float:left; width:33.33%; left:0; }
#filter .filter .wrap { padding:0 0 0 0; background:#FFF; margin:10px 40px 0 0;}

#filter .filter .champ { float:none; display:block; background-color:#FFF; margin:0 0; width:100%;}

#filter .filter { font-size:90%; font-weight:400;}
#filter .filter h3 {  font-weight:500; font-size:120%; margin:30px 0 10px 0; padding-top:10px; border-top:1px solid #E5E7E9; }
#filter .filter p { margin:5px 0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative; padding:0 25px;}

a.check { box-shadow:none;}
a.check.disable { opacity:0.4;}

a.check:before { position:absolute; content:""; box-sizing:border-box; top:50%; margin:-8px 0; left:0; border-radius:3px;  border:1px solid #949698; transition:border-color 0.15s; width:16px; height:16px;}
a.check:hover:before { border-color:#424648;}


a.check.checked:after { position:absolute; content:""; box-sizing:border-box; top:50%; margin:-5px 0; left:3px; background:#404244; border-radius:2px;  width:10px; height:10px;}


a.check em { opacity:0.3; position:absolute; right:0; font-style:normal;}

.small { font-size:80%;}


.champ { width:100%; display:block; margin:8px 0; max-width:600px; padding:10px; background:#FFF; box-sizing:border-box; border:1px solid #E2E4E6; border-radius:3px; font-size:100%; font-family:"Archivo Narrow", Arial, Helvetica, sans-serif; font-weight:400;}
.champ.medium { }

.col-search { float:left; width:25%;}
.col-search .wrap { margin:10px; border:1px solid #E5E7E9; transition:border-color 0.2s; overflow:hidden; border-radius:6px; position:relative;}
.col-search .wrap a { box-shadow:none;}
.col-search .wrap:hover { border-color:#525456;}
.col-search .picture {  padding:35% 0; background:#F8F9FA url(../images/picture.svg) no-repeat center center; background-size:cover; display:block; position:relative;  }
.col-search .author , .col-search .noauthor , .col-search p { padding:15px; position:relative;  border-top:1px solid #E5E7E9; margin:0;}
.col-search .author { padding-left:65px; }
.col-search .author .avatar { width:40px; height:40px; border:1px solid #EAEBEC; left:12px; top:12px; position:absolute; border-radius:100%; background:#F8F9FA no-repeat center center; background-size:cover;}
.col-search .buttons { margin:0; background:#F8F9FA; }
.col-search .buttons .grey , .col-search .buttons .orange { float:right;}
.col-search .summary , .col-search .onlytext { font-size:90%; color:#424446;}
.col-search .onlytext { padding-top:0; border-top:none; margin-top:-10px; }

.col-search .picture:before { content:""; position:absolute; background:url(../images/thingiverse-white.png) no-repeat right center; right:12px; width:80%; height:20px; bottom:12px; margin:0; background-size:contain;}

#filter .col-search .picture:before { display:none;}

.col-search h3 a { color:#000;}
.col-search h3 { margin:0; font-weight:700; font-size:100%;}
.col-search h4 { margin:3px 0 0 0; font-weight:500; font-size:90%;}

#recap_form_search hr { margin:15px 0 25px 0; background:#E2E4E6; }


#recap_form_search input.champ { float:right; border:1px solid #E5E7E9;   background:url(../images/icons/search-grey.svg) no-repeat 8px center; padding:0 8px 0 32px; box-sizing:border-box; background-size:20px; height:36px; width:22%; width:calc(25% - 10px); font-size:100%;}
#recap_form_search h1 { float:left; margin:0; padding-right:10px; line-height:110%; padding-top:3px; width:70%; width:calc(75% - 30px); text-align:left; box-sizing:border-box; }

.champ.error { border-color:#E02;}
.errorForm { font-size:80%; font-weight:500; color:#E02; margin:-5px 0 10px 0; padding:0 8px;}

.loading a.submitter { background:#5998e1; border-color:#5998e1; cursor:default;}
.loading a.submitter span { opacity:0.5; cursor:default;}
.loading a.submitter:after {  content:""; z-index:0; position:absolute; top:0; left:0; height:100%; width:100%; background:url(../images/loader-button.apng) no-repeat center center;}


.col-content #dropper { font-size:80%; padding:10px; background-color:#FFF;  margin:20px 0 25px 0; border-color:rgba(0,0,0,0.15); }
.col-content #dropper.hover , .col-content #dropper:hover { background-color:#FFF; }
.col-content #dropper span {  padding:12px 12px 12px 66px;}
.col-content #dropper span strong { width:60px;  }


#dropper { background:#F2F4F6; padding:7%; margin:40px 0 20px 0; display:block; border:4px dashed rgba(0,0,0,0.05); text-align:center; box-shadow:none;}
#dropper.hover , #dropper:hover { border-color:rgba(0,0,0,0.3); background:#EAEBEC; transition:border-color 0.2s, background-color 0.2s;}
#dropper span { display:inline-block; margin:10px; font-size:110%; position:relative; padding:18px 15px 18px 90px; border-radius:4px; overflow:hidden; max-width:360px; background:#3A3B3C; color:#FFF; font-weight:500;}

#dropper span strong { background:#5998e1 url(../images/icons/cloud-computing.svg) no-repeat center center; background-size:contain; box-shadow:0 0 12px 1px rgba(0,0,0,0.4); border:2px solid #5998e1; box-sizing:border-box;  position:absolute; left:0; width:75px; top:0; height:100%; }



#overLayBox p { margin:15px 0 !important;}
#overLayBox {  position:fixed; top:50%; left:50%;  max-width:460px; background:#FFF; padding:10px 25px; box-sizing:border-box; z-index:51; transform:translate(-50%,-50%) }

#overLay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,10,20,0.9) no-repeat center center; z-index:50; opacity:0.8; }
#overLay.loading { background-image:url(../images/loader-black.gif)}

#popup { position:fixed; z-index:51; top:50%; left:50%; width:400px; margin:-100px -200px; margin:calc(0px); width:calc(100% - 25px); max-width:800px; transform:translate(-50%,-50%); padding:50px; box-sizing:border-box; background:#FFF;}


#popup .wrap  { max-height:400px; overflow:auto; max-height:calc(100vh - 200px); position:relative;}
#popup .wrap textarea {  max-height:calc(100vh - 320px); min-height:90px; resize:none; }

#popup h3.error { margin:0;}

#popup .wrap h3 { margin:0 0 15px 0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

#popup .wrap .buttons { margin:15px 0 5px 0;}
#popup .wrap .buttons a { margin:0 5px 0 0;}


#popup h2 { margin-top:0;}
#popup h3 { margin:0;}
#popup h3+p { margin:5px 0 0 0;}
#popup .listings { max-height:500px; overflow:auto; max-height:calc(100vh - 100px);  border-top:1px solid #D2D4D6; position:relative;}

#popup .listings p { position:relative; border-bottom:1px solid #D2D4D6; margin:0;  line-height:34px; height:34px;}
#popup .listings p .col { font-weight:400; box-sizing:border-box; padding-right:5px; float:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#popup .listings p .col.file { width:60%; position:relative; }
#popup .listings p .col.size { width:40%; text-align:right;  font-size:14px; !important; opacity:0.6; font-weight:300; }



#popup .listings p.error .col.file { color:#CCC; text-decoration:line-through; }
#popup .listings p.error .icon { opacity:0.3;}

#popup .listings p .progress { position:absolute; bottom:-1px; height:2px; background:#222; left:0;}
#popup .listings p.finished .progress {  background:#4BD964; transition:background 0.2s; }

#popup .listings p .floatError { position:absolute; background:#FFF; background:rgba(255,255,255,0.85); font-size:14px; font-weight:700; color:#E02; right:0; bottom:1px; line-height:34px; height:34px; padding:0 3px 0 10px;   }


#popup .listings p .col.options .error { padding-left:3px; font-size:12px; font-weight:700;}

#popup .listings p.head .col.options .col select { color:#000; font-size:14px; font-weight:900;}
#popup .listings p.head .col.options .col { color:#000; font-size:14px;}

#popup.loading p.buttons a.black { background:#000 url(../images/stripe-loading.gif) 0 center !important; color:rgba(255,255,255,0.5) !important; font-size:0;  cursor:default; transform:none !important; transition:none;}
#popup.loading p.buttons a.black:after { content:"envoi en cours…"; font-size:16px; }

#popup.loading .listings:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}



.basket-article { margin:15px 0; padding:15px 40px 15px 140px; border:1px solid #E5E6E7; border-radius:4px; font-size:90%; position:relative; min-height:72px;}
.basket-article .col { float:left; box-sizing:border-box; padding-right:10px;}
.basket-article .col.name { width:32%;}
.basket-article .col.material { width:15%;}
.basket-article .col.color { width:27%;}
.basket-article .col.quantity { width:9%;}
.basket-article .col.price { width:17%; padding-left:30px;}
.basket-article h2 , .basket-article h3 , .basket-article p { margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}


.basket-article .more-options { height:0; opacity:0; overflow:hidden; transition:opacity .3s;}
.basket-article.open .more-options { height:auto; overflow:visible; opacity:1; padding-top:12px; border-top:1px solid #E5E5E5; margin:14px 10px 0 0 ; }

.basket-article p.error-dim { white-space:normal; font-size:90%; color:#E02; }
.basket-article.error .price p { text-decoration:line-through; opacity:0.45;}

.basket-article p { margin-top:3px; line-height:120%;}
.basket-article h2 { font-size:115%;  line-height:100%; margin-bottom:5px; margin-top:2px;}
.basket-article h3 { font-size:85%;  line-height:140%; font-weight:500; margin-bottom:5px;}
.basket-article .big { font-size:120%; font-weight:bold; margin-top:8px;}
.basket-article a { box-shadow:none;}
.basket-article a.more { font-size:90%; opacity:1; color:#000; display:inline-block; margin:3px 0 0 0; position:relative; padding-left:1em; color}
.basket-article a.more strong { position:absolute; transition:transform 0.1s; transform:rotate(45deg); font-size:125%; line-height:12px; height:16px;left:0; top:50%; margin:-8px 0; }
.basket-article.open a.more strong { transform:none;}
.basket-article.open a.more { color:#F60;}


.basket-article .updateDimensions a.edit { background:none;  width:24px; line-height:16px !important; height:24px; margin:0; padding:0; opacity:1;text-align:center; color:#000; font-size:28px; text-indent:0; top:14px; right:10px;}
.basket-article a.edit { position:absolute;  box-shadow:none; z-index:2; margin:-5px 0 0 3px; text-indent:-500px; overflow:hidden; border-radius:100%; width:16px; height:16px; background:#F2F4F6 url(../images/edit.svg) no-repeat center center; opacity:0.5; }

.basket-article a.more:hover , .basket-article a.edit:hover {  opacity:1;}

.basket-article input { width:70%; width:calc(100% - 18px); font-weight:400; font-size:100%;}
.basket-article .selector { font-size:14px;}
.basket-article .selector , .basket-article input { padding:6px 8px; line-height:18px;  border:1px solid #E5E5E5; border-radius:4px; position:relative;}
.basket-article .selector.open {  border-radius:3px 3px 0 0; z-index:3; }
.basket-article .selector p { margin:0; line-height:18px; }

.basket-article .selector div { position:absolute; top:100%; z-index:2; background:#FFF; left:0;  border:1px solid #E5E5E5; border-width:0 1px 1px 1px; box-shadow:1px 1px 3px rgba(0,0,0,0.1); box-sizing:border-box; 
min-width:100%; min-width:calc(100% + 2px); margin:0 -1px; overflow:hidden; height:0; opacity:0; transition:opacity 0.15s; border-radius:0 0 4px 4px; }
.basket-article .selector.open div { height:auto; overflow:auto; max-height:300px; opacity:1;}

.basket-article .selector div p { padding:11px 10px; border-top:1px solid #E5E5E5; line-height:130%;  position:relative; overflow:hidden; white-space:normal;}
.basket-article .selector div p.previewed { min-height:42px; padding-left:64px;}
.basket-article .selector div p .picture { background:rgba(0,0,0,0.1) no-repeat center center; background-size:cover; height:44px; width:44px; border-radius:100%; left:9px; top:9px; position:absolute;}

.basket-article .selector div p .picture.finish_1 { background-image:url(../images/finish_1.png);}
.basket-article .selector div p .picture.finish_2 { background-image:url(../images/finish_2.png);}
.basket-article .selector div p .picture.finish_3 { background-image:url(../images/finish_3.png);}
.basket-article .selector div p .picture.finish_4 { background-image:url(../images/finish_4.png);}


.basket-article .selector div p .picture.resine.finish_1 { background-image:url(../images/finish_resine_1.png);}
.basket-article .selector div p .picture.resine.finish_2 { background-image:url(../images/finish_resine_2.png);}
.basket-article .selector div p .picture.resine.finish_3 { background-image:url(../images/finish_resine_3.png);}
.basket-article .selector div p .picture.resine.finish_4 { background-image:url(../images/finish_resine_4.png);}


.basket-article .selector div p .picture.fill_1 { background-image:url(../images/fill_1.png);}
.basket-article .selector div p .picture.fill_2 { background-image:url(../images/fill_2.png);}
.basket-article .selector div p .picture.fill_3 { background-image:url(../images/fill_3.png);}
.basket-article .selector div p .picture.fill_4 { background-image:url(../images/fill_4.png);}

.basket-article .selector div p:hover { background-color:#F2F3F4;}
.basket-article .selector div p strong { display:block; margin-bottom:4px;}
.basket-article .selector div p .holder { position:absolute; top:0; left:0; width:100%; height:100%; z-index:5; box-shadow:none;}

.basket-article .selector .selected { padding-right:20px; position:relative; cursor:default; font-weight:bold;}
.basket-article .selector .selected .arrow { position:absolute; top:0; right:0; font-size:0; background:url(../images/arrow-select.svg) no-repeat center center; width:20px; height:20px; top:50%; margin:-10px 0; }
.basket-article .grey { opacity:0.45; font-weight:500;}
.basket-article .col.material  .selector div { width:280px;}
.basket-article .col.color  .selector div {  }
.basket-article .col.color em { font-size:75%; font-style:normal; opacity:0.5;}

.basket-article .col.color .selector p { padding-left:24px;}
.basket-article .col.color .selector .preview { position:absolute; border:1px solid rgba(0,0,0,0.1); width:18px; border-radius:100%;  overflow:hidden; height:18px; padding:0; top:50%; margin:-9px 0; left:0; box-sizing:border-box;}

.basket-article .col.color .selector .preview span {  position:absolute; width:18px; height:18px; left:50%; transform:rotate(45deg); transform-origin:left center; }

.basket-article .col.color  .selector div p { padding-left:32px;}
.basket-article .col.color .selector div .preview { left:8px; }

.basket-article.loading:before { position:absolute; top:0; left:0; background:#FFF url(../images/loader.gif) no-repeat center center; background-color:rgba(255,255,255,0.9); opacity:0.9; content:""; width:100%; height:100%; z-index:5;}

.basket-article a.delete { position:absolute; box-shadow:none; margin:0; padding:0; right:0; border-left:1px solid #E5E6E7; background:#FBFCFD; height:100%; width:40px; top:0; transition:background-color 0.2s;}
.basket-article a.delete:hover {  background:#F2F4F6;}
.basket-article a.delete strong { position:absolute; width:100%; left:0; text-align:center; height:20px; top:50%; margin:-10px 0; line-height:20px; font-size:32px; font-weight:400;  color:#242628;}

.basket-article .col.color .selector p .factor { position:absolute; right:3px; font-size:10px; line-height:16px; border-radius:3px; box-sizing:border-box; margin:-8px 0; padding:0 4px; top:50%; background:rgba(255,255,255,0.8);  color:#E02;}
.basket-article .col.color .selector p .factor.positif {  color:#FFF; background:#3C6;}


.basket-article .preview .loader { position:absolute; z-index:5; width:100%; height:100%; background:#FFF no-repeat center center url(../images/loader.gif); }
.basket-article .preview { position:absolute; width:110px; height:70px; border:1px solid #DDD; left:15px;}

.basket-article .preview , #previewModelBox {  background: #EAEBEC;
background: -moz-linear-gradient(top,  #EAEBEC 0%, #C2C4C6 100%);
background: -webkit-linear-gradient(top,  #EAEBEC 0%,#C2C4C6 100%);
background: linear-gradient(to bottom,  #EAEBEC 0%,#C2C4C6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EAEBEC', endColorstr='#C2C4C6',GradientType=0 );}

.basket-article .preview .wrap { position:absolute; width:100%; height:100%; top:0; left:0;  overflow:hidden; background:center center no-repeat; background-size:cover; border:0 solid #FBFCFD; 
    }
.basket-article .preview canvas { width:100% !important; height:100% !important; position:absolute !important; top:0; left:0; }
.basket-article .preview  a.toggle { position:absolute;  margin:0; padding:0;  box-shadow:none; top:0; left:0; width:100%; height:100%; z-index:2; display:none;}
.basket-article .preview  a.toggle strong {font-size:11px; position:absolute; border-radius:0 0 0 4px; background:#454647; background:rgba(0,0,0,0.6); color:#FFF; font-weight:500; line-height:16px; padding:0 4px; margin:0; top:0; right:0;}
.basket-article .preview  a.toggle span { display:none; position:absolute; top:0; right:0; height:80px; width:80px; line-height:80px; text-align:center; color:#FFF; font-size:42px;}



.basket-project { margin:2em 0 -10px 0; font-size:80%; color:#A2A4A6; font-weight:500; text-align:right;}


#previewModelBox { width:0; height:0; overflow:hidden; position:absolute; left:50%; opacity:0; }
#previewModel { width:240px; height:180px; background:#EEE; position:absolute; }

#BOX3D .close { position:absolute; box-shadow:none; padding:0; margin:0; width:36px; height:36px; text-align:center; line-height:32px; font-weight:300; border-radius:0 0 0 3px; z-index:10; right:3px; top:3px; font-size:32px; border-radius:2px; }

#BOX3D { background:#FFF url(../images/loader.gif) no-repeat center center; position:fixed; z-index:60; border:10px solid #FFF; width:1400px; height:800px; margin:-410px -710px; top:50%; left:50%;}
#BOX3DPREVIEW { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0;}
#BOX3DPREVIEW canvas , #BOX3DPREVIEW div { width:100% !important; height:100% !important; position:absolute;}


#BOX3D a {  background:#FFF; color:#646668;}
#BOX3D a:hover {  background:#FFF; color:#000000;}


#BOX3D .options { position:absolute; z-index:100; bottom:3px; left:3px; font-size:0;}
#BOX3D .options a { float:left; font-size:12px; padding:4px 6px; border-radius:2px; margin:0 3px 0 0}
#BOX3D .logo { position:absolute; z-index:100; top:10px; left:15px; background:url(../images/logo.svg) no-repeat 0 0; background-size:contain; width:120px; height:40px; opacity:0.4;}

hr { margin:25px 0; border:none; height:1px; background:#A2A4A6;}
hr.light { margin:35px 0; background:#E2E4E6;}
hr.marger { margin: 5rem 0;}
hr.light + h4 { font-size:90%; font-weight:500; margin:0; opacity:0.5;}

.al-c { text-align:center;}

p.total { position:relative; font-size:90%; color:#A2A4A6; margin:-15px 0;}
p.total.big { font-size:130%;}
p.total.small { font-size:80%; border-top:1px dashed #A2A4A6; padding-top:10px; margin-top:25px;}
p.total.small strong { font-weight:400;}
p.total strong { display:block;  color:#404244; padding-right:90px; font-size:115%;  }
p.total strong.right { position:absolute; right:0; padding-right:0; }

p.total strong.right.loading { background:url(../images/loader-small.gif) no-repeat right center; width:60px;}

sup { line-height:0; font-size:60%;}

.ndbp { font-weight:300; margin-top:40px; font-size:70%; color:#A2A4A6;}

/*.basket-article.blanc-craie .preview .wrap , .basket-article.black-light .preview .wrap , .basket-article.nature .preview .wrap , .basket-article.phosphorescent  .preview .wrap , .basket-article.blanc-satin  .preview .wrap { background:#454647; border-color:#454647;}*/



.col-content .wrapper { background:#F2F4F6; padding:10px 35px; border-radius:6px; margin:-10px -5px 0 20px;}

.col-content.right { float:right; padding-left:30px; padding-right:0;}
.col-content {  float:left; box-sizing:border-box; padding-right:30px;}
.col-60 { width:60%; }
.col-40 { width:40%; }
.col-50 { width:50%; }

.col-content.to-fix {  padding-left:0; }


a.gallery-link { float: left; width: 4em; height: 4em; margin: 0 5px 5px 0; padding: 0; background: no-repeat center center; border-radius: 3px; background-size: cover; border: 1px solid #E5E5E5;}


h2.icon {  padding-left:2.5em; background:no-repeat 0 0; background-size:2em;   }
h2.mine { background-image:url(../images/icons/cube.svg); }
h2.icon.to-fix { background-image:url(../images/icons/plaster.svg); }

h2.icon.droid { background-image:url(../images/icons/droid.svg); }

span.counter { white-space:nowrap;}
span.counter span { border:1px solid #000; position:relative; padding:0 0.2em; margin:0 1px;  border-radius:3px; box-shadow:1px 1px 2px rgba(0,5,10,0.2); line-height:112%; display:inline-block;}




#frameBox { position:fixed; width:100%; height:100%; height:calc(100% - 40px); top:calc(20px); overflow:hidden; z-index:55;}
#frameBox .wrap { max-width:1100px; width:95%; width:calc(100% - 40px); position:relative; height:100%; margin:0 auto; box-sizing:border-box;}
#frameBox .wrap iframe { position:absolute; left:0; width:100%; height:95%; top:5%; height:calc(100% - 50px); top:50px; background:#FFF;  border:5px solid #FFF; box-sizing:border-box; border-radius:4px; box-shadow:0 0 10px rgba(0,0,0,0.2);}

#frameBox .head { position:absolute; box-sizing:border-box; height:50px; width:100%;color:#FFF; box-sizing:border-box; padding:0 80px 0 0;  }

#frameBox .head h3 { padding:0; height:40px; line-height:40px; background:#000; background:rgba(0,0,0,0.3);  box-shadow:0 0 20px rgba(0,0,0,0.4) inset; padding:0 15px; color:#FFF; color:rgba(255,255,255,0.8); border-radius:3px; margin:0; font-weight:300; font-size:100%;}
#frameBox .head h3 strong { font-weight:bold; color:#FFF;}


#timeout { box-sizing:border-box; width:100%; padding:0 10px; font-weight:500; color:#FFF; position:fixed; top:50%; left:0; z-index:52; text-align:center; transform:translateY(-50%);}
#timeout h3 strong { display:block; font-size:180%; margin-bottom:0.2em;  font-weight:700; line-height:100%;}
#timeout h3 { color:#FFF; font-weight:700; line-height:100%;}
/* Safari 4.0 - 8.0 */


.to-box { margin:10% auto 0 auto ;max-width:980px; color:#E02; font-weight:500;}
.to-box + .box { margin-top:20px;}
.box { margin:10% auto; padding:1px; background:#F8F8F8; border-radius:4px; position:relative; max-width:980px; }
.box .wrap { margin:30px 40px 40px 40px; position:relative;}

.box .col-left { float:left; width:50%; box-sizing:border-box; }
.box .col-right { float:right; width:50%; box-sizing:border-box;}

.box span.ou { position:absolute; left:0; width:38px; height:38px; line-height:38px; color:#999; text-align:center;
 margin:0 -20px; z-index:2; box-shadow:0 0 5px rgba(0,0,0,0.1) inset;  background:#F2F2F2; border:1px solid #E5E5E5; border-radius:100%; left:50%; top:118px; font-size:12px; font-weight:600;}

.box h3 { font-size:130%; margin-top:0;}
.box hr { width:0; position:absolute; left:50%; margin:0 -1px; height:100%; border:none; height:100%; border-left:1px solid #FFF; border-right:1px solid #E5E5E5;}


.form-group {
  position: relative;
  margin:0.5em 0;
}

.form-label {
  position: absolute;
  left: .9em;
  top: 1em;
  line-height:90%;
  color: #999;
  z-index: 10;
  font-weight:300;
  transition:top 0.1s, font-size 0.1s, color 0.1s, left 0.1s;
  cursor:text;
}



.focused .form-label {
  font-size: 66%;
  top:0.75em;
  left: 1.5em;
  font-weight:400;
  color: #AAA;
  
}

.form-input {
  position: relative;
  padding: 1.2em .9em 0.5em .9em;
  width: 100%;
  outline: 0;
  border: 0;
  border:1px solid #E5E5E5;
  transition: border-color .2s ease-out;
  font-size:100%; line-height:100%;
  box-sizing:border-box;
  border-radius:5px;
}

.form-input.error { border-color:#E02;}



.form-group a { position:absolute; transition:opacity 0.1s; opacity:0.5; width:2em; height:1.6em; position:absolute; border:none; padding:0;  right:0; top:50%; margin:-0.8em 0.5em; box-shadow:none; background:url(../images/icons/eye.svg) no-repeat center center; background-size:cover;}
.form-group a.actif { opacity:1;}

textarea.form-input { height:8em; resize:none;}

.form-input:focus {
	border-color:#222;
}

.form-input.filled {
	
}


.command { border:1px solid #E4E6E8; padding:1px; border-radius:4px; margin:1.5em 0;}
.command .details { background:#FAFBFC; padding:20px; line-height:20px; height:40px; border-radius:4px 4px 0 0; margin:-1px;  border-bottom:1px solid #E5E5E5;}
.command .details  p { float:left; margin:0; font-size:85%; color:rgba(0,0,0,0.4); width:100px;}
.command hr { border:1px solid #DDD; border-width:1px 0 0 0; background:none; margin:15px 10px;}
.command p.buttons { margin:0 10px;}
.command .details  p.right { float:right; width:auto; text-align:right; margin-left:20px;}
.command .details  p strong { display:block; color:rgba(0,0,0,0.8); font-weight:500; font-size:120%;}
.command .details  p strong.strong { font-weight:500;}
.command .infos { font-size:80%; font-size:300; color:#999;}
.command .infos strong { color:#333; font-weight:500;}

.command .customer { padding:0 10px; font-size:90%; font-weight:300; color:#999; display:none; }
.command .customer strong {  font-weight:300; color:#333; }

.command p .status { white-space:nowrap;}
.command p .status.need_pay { color:#F80;}


.command .wrap { margin:20px 10px;}
.command .wrap p.produit { font-size:90%; line-height:20px; position:relative; margin:10px 10px;  box-sizing:border-box; padding-left:80px;  border-radius:3px;}
.command .wrap p.produit + p.produit { border-top:1px dotted #DDD; padding-top:10px;}
.command .wrap p.produit strong { font-weight:500; }
.command .wrap p.produit strong span { opacity:0.5;}
.command .wrap p.produit strong.price { color:#A00;}
.command .wrap p.produit .picture { position:absolute; left:0; width:65px ; height:40px; padding:0; border:none; background:#EEE no-repeat center center; background-size:cover; }


@media screen and (max-width: 1180px) {
	
.has-menu { position:relative; padding-left:0; font-size:90%;}
.has-menu menu { position:static;  width:auto; box-sizing:border-box;}
	
	#form-search { padding-right: 0;}

	
	.col-search { float:left; width:100%;}
	
	.center {width:auto; max-width: 540px; overflow: hidden;}	
	header .illustration {display:none; }
	body { font-size:	14px;}
	header { overflow: hidden;}	
.col-content.right { float:none; padding-left:1px; padding-right:1px; width: auto; margin: 0;}
.col-content {  float:none; box-sizing:border-box; padding-right:0; width: auto;}
	.col-content.right .wrapper { margin: 0;}
	
	
#footer .columns .col , #footer .columns .col.large { float:none; margin:0; padding:10px; box-sizing:border-box; width:auto;}
 
#footer .columns .col.large p.socials { position:static; margin: 2em -2px;}
#footer .columns .col.large p.socials strong { display:block; font-size:120%;}
#footer .columns .col.large p.socials a { float:none; display: inline-block; margin: 0 2px;}
	.basket-article .col { float: none; width: auto !important; padding: 2px 20px 2px 5px !important;}	
    
    
    .box .col-left , .box .col-right { float: none !important; width: 100%;}    
    .box hr { position: static; width: auto; height: 1px; margin: 40px; border: none; background: #DDD;}
    .box span.ou  { display:none;  }
     header .freefdp { position:absolute; top:2.2em; left:auto; right: -1em; height: 8em; width: 8em; z-index:4; }
}

@media screen and (max-width: 520px) {
        header .freefdp { position:absolute; top:2.2em; left:auto; right: -1em; height: 6em; width: 6em; z-index:4; }
    .basket-article a.edit  { display: none;}
}

@media screen and (max-width: 480px) {
    
    



    
	.nosmall { display:none !important;}
}

@-webkit-keyframes animeBG {
  from {background-position: -200px center;}
  to {background-position:  0 center;}
}

/* Standard syntax */
@keyframes animeBG {
  from {background-position: -200px center;}
  to {background-position:  0 center;}
}

@media screen and (max-width: 1580px) , screen and (max-height: 900px)  {
#BOX3D {  width:1200px; height:686px; margin:-353px -610px;}
}

@media screen and (max-width: 1250px) , screen and (max-height: 730px)  {
#BOX3D {  width:1000px; height:571px; margin:-295px -510px;}
}


@media screen and (max-width: 1080px) , screen and (max-height: 650px)  {
#BOX3D {  width:800px; height:457px; margin:-238px -410px;}
}

@media screen and (max-width: 860px) , screen and (max-height: 520px)  {
#BOX3D {  width:600px; height:343px; margin:-181px -310px;}
}

@media screen and (max-width: 640px) , screen and (max-height: 400px)  {
#BOX3D {  width:400px; height:229px; margin:-124px -210px;}
}

@media screen and (max-width: 420px) , screen and (max-height: 270px)  {
#BOX3D {  width:300px; height:171px; margin:-95px -160px;}
}

@media screen and (max-width: 340px) , screen and (max-height: 200px)  {
#BOX3D {  width:240px; height:137px; margin:-78px -130px;}
}
