/*
 * Theme Name:   French ICO
 * Description:  French ICO Divi theme
 * Author:       French-ICO.com
 * Author URI:   https://www.french-ico.com
 * Template:     Divi
 * Version:      1.2.9
 * Tags: right-sidebar, two-columns
 * Text Domain:  french-ico
 */

/* GENERIC ***********************************
 * used for all platforms
 */
:root {
	--color1: #ae9161;
	--color2: #0b1f2b;
	--colorHoverBtn : linear-gradient(120deg, rgba(236,240,241,1) 25%, rgba(189,195,199,1) 75%);
	--colorBtnCertificate : linear-gradient(339deg, #999 0%, #0b1f2b 49%);
}

@-webkit-keyframes animate-logo {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@-webkit-keyframes blink-cursor {
  50% {
    border-color: transparent
  }
}
@-webkit-keyframes typing-text {
  from {
    width: 0
  }
}
@-webkit-keyframes glowing {0% { background-position: 0 0; } 50% { background-position: 400% 0; } 100% { background-position: 0 0; }}
@-webkit-keyframes bounce {from { padding-top: 0px; } 50%  { padding-top: 10px; } to   { padding-top: 20px; }}
@-webkit-keyframes clignote {0%{box-shadow:0px 0px 10px #fff;} 50%{box-shadow:0px 0px 0px #fff;} 100%{box-shadow:0px 0px 10px #fff;}}
@-webkit-keyframes clignote1 {0%{box-shadow:0px 0px 10px #000;} 50%{box-shadow:0px 0px 0px #000;} 100%{box-shadow:0px 0px 10px #000;}}
@keyframes pulse-heart {10% {transform: scale(1.2)}
}
.arrow-bounce {animation: 1s linear 1s infinite alternate bounce;}
.typing-text {
	transform: rotate(0deg);
	position: relative;
	text-align: left;
	top:-100px;
	width: 22ch;
	animation: typing-text 5s steps(22), blink-cursor .5s step-end infinite alternate;
	white-space: nowrap;
	overflow: hidden;
	border-right: 0px solid;
}

#logo{animation:animate-logo 3s;}
#main-header, #main-header .nav li ul, .et-search-form, #main-header .et_mobile_menu {background-image: linear-gradient(#00000000, #00000080),url(/wp-content/themes/french-ico-theme/images/background-header.jpg);}

a {color: var(--color1);}
a:focus {color: #826a42; box-shadow: none;}
a:hover {color: #826a42;}
button:focus {outline: none;}
.main_title {margin-bottom: 20px;padding-top: 20px;text-align: center;text-transform: uppercase;}
#page-container {margin-top: 0 !important;}

/*Bouton avec hover coloré */
.glow-on-hover {border: none;outline: none;color: #fff;background: #111;cursor: pointer;position: relative;border-radius: 5px;}
.glow-on-hover:hover {z-index: 0;}
.glow-on-hover:before {content: '';background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);position: absolute;top: -2px;left:-2px;background-size: 400%;z-index: -1;filter: blur(5px);width: calc(100% + 4px);height: calc(100% + 4px);animation: glowing 20s linear infinite;opacity: 0;transition: opacity .3s ease-in-out;border-radius: 5px;}
.glow-on-hover:active {color: #000}
.glow-on-hover:active:after {background: transparent;}
.glow-on-hover:hover:before {opacity: 1;}
.glow-on-hover:after {z-index: -1;content: '';position: absolute;width: 100%;height: 100%;background: var(--color2);left: 0;top: 0;border-radius: 5px;}
.glow-on-hover:hover:after {background: var(--colorHoverBtn);}

/* Test mode */
.test_mode {left:0; top:40px; padding:0.5em 1em; background-color: red; z-index:109999; text-align:center}
.test_mode h1 {color:white; font-size:initial; padding:0}

/* Placeholder */
::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #ccc !important;}
::-moz-placeholder { /* Firefox 19+ */color: #ccc !important;}
:-ms-input-placeholder { /* IE 10+ */color: #ccc !important;}
:-moz-placeholder { /* Firefox 18- */color: #ccc !important;}

/* social network icons */
.social-network-icon {text-align: center;}
.social-network-icon .fa-telegram-plane {font-size: 20px; color: #0088cc; margin:0 20px 0 20px}
.social-network-icon .fa-linkedin-in {font-size: 20px; color: #0e76a8; margin:0 20px 0 20px}
.social-network-icon .fa-twitter {font-size: 20px; color: #00acee; margin:0 20px 0 20px}
.social-network-icon .fa-facebook-f {font-size: 20px; color: #3b5998; margin:0 20px 0 20px}

/* content */
#main-content .container {padding: 2em 0 2em 0;}
#main-content .container:before {background: none;}

/* Header */
.nav-menu {padding-top: 5px !important;}
.nav-button {padding-top: 67px !important;padding-left: 11%;}
.nav-login {padding-top: 66px !important;padding-left: 0px;padding-right: 25px;}
.nav-login .col-md-12 {padding-left: 0px}
.nav-translate {padding-top: 72px!important;padding-bottom: 40px;}
.logo_container {right: 0px;}
.avatar-ico img {width:50px; border-radius:50%; float: right;border: 1px solid;}
.avatar-ico{padding-right:10px !important; top: -8px;}
.et-fixed-header .nav-menu {padding-top: 15px !important;}
.et-fixed-header .nav-button {padding-top: 32px !important;}
.et-fixed-header .nav-login {padding-top: 32px !important;}
.et-fixed-header .nav-translate {padding-top: 35px !important;}

/* Footer */
#footer-bottom {padding-top:2em; margin:2em auto 2em auto;}
#main-footer #footer-info {text-align:center; float:none;font-size: small;}
#main-footer #menu-footer {text-align:center;}
#main-footer .bottom-nav li {font-weight: 400; border-right: solid 1px; padding: 0 22px;}
#main-footer .bottom-nav li#menu-item-139 {border-right:none;}
#main-footer #footer-bottom a {color:black;}
#main-footer .copyright {text-align:center; color:#797979; margin-top: 1em;}
#main-footer .follow-us img {width: 30px;  height: auto;}
#main-footer .follow-us .list-inline {padding-left: 0; list-style: none;}
#main-footer .follow-us ul {margin:0; padding:0;}
#main-footer .follow {text-align:center;}
#main-footer .follow figure {margin:0 1em;}
#main-footer .list-inline-item {display: inline-block; text-align:center;}
#main-footer .et_pb_row {margin:auto}
#main-footer .fa-telegram-plane {font-size: 20px; color: #0088cc}
#main-footer .fa-linkedin-in {font-size: 20px; color: #0e76a8}
#main-footer .fa-twitter {font-size: 20px; color: #00acee}
#main-footer .fa-facebook-f {font-size: 20px; color: #3b5998}

@media (max-width: 414px){
#main-footer .bottom-nav li {border-right: 0;}
}

/* btn */
.et_pb_button, .btn {background: var(--color2); border: 1px solid var(--color1);}
.btn {color:white !important; -webkit-border-radius:5px !important; border-radius:5px !important; text-transform: uppercase; transition: all 0s}
.btn-small {background: var(--color1); color:white; padding:0.5em; text-transform: uppercase; font-weight: 400; font-size:1rem; border:none;}
.text2 {display:none}
.btn:hover .text1 {display:none}
.btn:hover .text2 {display:inline; font-size: medium;}
.btn:not(:disabled):not(.disabled) {cursor: pointer; transition-property: all; transition-duration: 0.6s;}
.btn:hover{background: var(--colorHoverBtn); color: black !important;}
.btn:focus {color: white; box-shadow: 0 0 0 1px transparent;}
.btn-cancel {background: var(--colorHoverBtn); color: #826a42!important; border:1px solid black}
.btn-cancel:hover {background: #c3c4c7; color:red!important}
.btn-clignote {-webkit-animation-name: clignote;-webkit-animation-duration: 1s;-webkit-animation-iteration-count:infinite;}
.btn-clignote1 {-webkit-animation-name: clignote1;-webkit-animation-duration: 1s;-webkit-animation-iteration-count:infinite;}

/* btn login */
.btn.lrm-login {border: solid 1px var(--color1);display: block!important;margin: auto;}

/* mailshimp */
.mc4wp-checkbox-wp-registration-form input {background: transparent; border: 2px solid #e8e8eb; border-radius: 3px; height: 20px !important; width: 20px !important;}
.mc4wp-checkbox-wp-registration-form label {font-weight:initial; font-size: 15px; text-align: left;}
.btn-newsletter {background: var(--color2); border: 1px solid var(--color1); color: white; text-transform: uppercase; font-weight: 400; font-size: 1rem; padding: 5px; width: 280px !important; border-radius: 0px 0px 5px 5px;    transition: color .5s ease-in-out,background-color .5s ease-in-out,border-color .5s ease-in-out,box-shadow .5s ease-in-out;}
.btn-newsletter:hover {background: linear-gradient(127deg, rgba(255,255,255,1) 24%, rgba(205,205,205,1) 72%)!important; color: #826a42!important;}
.email-index {width: 280px; margin: auto;}
.email-index input.form-control {width: 280px !important; padding: 0.44em 1em; border-radius: 5px 5px 0px 0px; text-align: center;}
.mc4wp-alert, .mc4wp-error {margin-top:20px}

/* team */
.et_pb_team_member_image:hover {transition: all 0.8s; filter: unset;}
.et_pb_team_member_image {filter: grayscale(100%); margin: 15px auto 15px auto !important}
.et_pb_team_member .et_pb_team_member_image img {border-radius:50%; width: 200px;}

/* modal login */
.lrm-form a.button, .lrm-form button, .lrm-form button[type=submit], .lrm-form #buddypress input[type=submit], .lrm-form input[type=submit] {text-transform: uppercase; background: #303440; border: 1px solid var(--color1);color: var(--color1);}
.lrm-form a.button:hover, .lrm-form button:hover, .lrm-form button[type=submit]:hover, .lrm-form #buddypress input[type=submit]:hover, .lrm-form input[type=submit]:hover {background: var(--colorHoverBtn); color: #826a42 !important;}

/* user menu */
.menu-user-menu-container .fas, .menu-user-menu-container .far {color: #e1e1e1;}
#user_menu {border-top: 1px solid #ccc; position: absolute; right: 30px; background-color:var(--color2); padding:20px; text-align: left;line-height: 35px;}
.identification {color:var(--color1);top: -8px;}

/* slide hamburger menu */
body #page-container .et_slide_in_menu_container {background: black !important;filter: opacity(0.95);}
.et_header_style_fullscreen .et_slide_in_menu_container.et_pb_fullscreen_menu_opened {opacity:1 !important;}
.et_slide_in_menu_container ul#mobile_menu_slide {display:table-cell !important;}
.et_slide_in_menu_container #mobile_menu_slide li a {font-size:20px; color:var(--color1) !important}
.et_slide_in_menu_container #mobile_menu_slide li a:hover{color:white !important;}

/* 404 page */
.class404 h1{color:var(--color1); font-size:200px}
.class404 h2{color:black; font-size:80px}
.class404 .btn{font-size:20px}

/* transak modal */
.transak_modal {z-index:999999 !important}

/* stripe button */
button.stripe-button-el {width:100%; background: var(--color2);border: 1px solid var(--color1); color:white; -webkit-border-radius:5px !important; border-radius:5px !important; text-transform: uppercase;}
button.stripe-button-el span {background: transparent; box-shadow:none!important; -webkit-box-shadow:none!important; font-weight: initial;margin-bottom: 4px;}
button.stripe-button-el span:hover {color: #826a42;}

/* others */
.overlay_homepage_ico {position: absolute !important;top: 0;left: 0;width: 100%;height: 100%;background-color: #000000c4;display:flex;align-items: center;max-width: 100% !important;}
.overlay_homepage_timestamp {position: absolute !important;top: 0;left: 0;width: 100%;height: 100%;background-color: #000000c4;display:flex;align-items: center;max-width: 100% !important;}

@media (max-width: 414px){
  #user_menu {display:none !important}
}

@media (max-width: 980px){
  .btn {margin-top:10px;}
}

@media (max-width: 414px){
  .et_header_style_left .logo_container{position:initial}
  .nav-login, .nav-translate {padding: 0px 0 10px 0!important;}
  .nav-login .col-md-12 {padding-left: 15px}
  .nav-button {display:none}
  .nav-logo {height:90px; margin-bottom: 20px;}
  .no-menu {margin-bottom: 10px;margin-top:30px}
  .col-7, .col-5 {max-width: 100%;flex:auto;}
  .avatar-ico img {float: none;}
  .avatar-ico{padding:5px !important}
  #logo {max-height:100% !important;height: 100% !important}
  .switcher {text-align: center !important;}
  .switcher .option {text-align:left;}
  .et-fixed-header .nav-login{padding:0 !important}
  .et_header_style_left #et-top-navigation .mobile_menu_bar, .et_header_style_split #et-top-navigation .mobile_menu_bar {padding-bottom: 0px}
}

@media (min-width: 981px){
	#main-header.et-fixed-header {background-color: rgb(10 31 43 / 98%);transition: background-color 5s;background-image: none;}
}

@media (min-width: 640px) {
	.only-mobile {display: none!important;}
}

@media (max-width: 980px) and (min-width: 768px){
  .et_pb_column .et_pb_team_member_description {display: inline-block;}
}


/***** END GENERIC ***********/

/* PLUGIN DOWNLOAD MANAGER *******************************
*/

.wpdm-download-link.btn.btn-primary {background: var(--color2); border: 1px solid var(--color1); color:white; -webkit-border-radius:5px; border-radius:5px; text-transform: uppercase; transition: all 0s}
.wpdm-download-link.btn.btn-primary:hover {background: var(--colorHoverBtn); color: black}

/* END PLUGIN DOWNLOAD MANAGER *******************************/

/* PLUGIN FEEDBACK
*/
div#fvfeedbackbutton2153 span {color:#000!important; border-radius: 5px 5px 0px 0px; border: solid 1px black; font-family:initial!important; font-weight: normal!important; background-color: #d8d8d89c!important; font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif!important;}
div#fvfeedbackbutton2153 span:hover {height: 120px; margin-right:65px; transition: margin-right 1s;}
/* END PLUGIN FEEDBACK *******************************/

/* GOOGLE TRANSLATE *******************************
*/
#goog-gt-tt {display:none !important;}
.goog-te-banner-frame {display:none !important;}
.goog-te-menu-value:hover {text-decoration:none !important;}
.goog-text-highlight {background-color:transparent !important;box-shadow:none !important;}
#google_translate_element2 {display:none!important; position:relative}

.switcher {font-size:10pt;text-align:left;cursor:pointer;overflow:hidden;width:163px;line-height:17px;margin: auto;text-align:center}
.et_menu_container .switcher {text-align:left}
.switcher a {text-decoration:none;display:block;font-size:10pt;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;}
.switcher a img {vertical-align:middle;display:inline;border:0;padding:0;margin:0;opacity:0.8;}
.switcher a:hover img {opacity:1;}
.switcher .selected {position:relative;z-index:9999;}
.switcher .selected a {padding:3px 5px;width:151px;}
.switcher .option {background:var(--color2); position:absolute;z-index:9998;display:none;width:150px;max-height:max-content;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;overflow-y:auto;overflow-x:hidden;}
.switcher .option a {padding:3px 5px;}
.switcher .option a:hover {background:#f0eeee}
.switcher .option a.selected {background:#f0eeee;}
#selected_lang_name {float: none;}
.l_name {float: none !important;margin: 0;}
.switcher .option::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 3px rgba(0,0,0,0.3);border-radius:5px;background-color:#F5F5F5;}
.switcher .option::-webkit-scrollbar {width:5px;}
.switcher .option::-webkit-scrollbar-thumb {border-radius:5px;-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3);background-color:#888;}
/* END GOOGLE TRANSLATE *******************************/

/* POPUP TRANSACTION *******************************
certificate.twig
certificate_form.twig
dashboard.twig
project.twig
*/
.popup-overlay {
		position: fixed; /* fixed it */
		top: 0; /* moves it to the top */
		width: 100%; /* makes it fullwidth */
		height: 100vh; /* makes it full height of the screen */
		z-index: -1; /* moves the section behind all the rest so it is not shown */
		justify-content: center; /* centers the row in the middle */
		align-items: center;  /* centers the row in the middle */
		opacity: 0; /* hides the overlay */
		overflow: hidden;
		transition: opacity 0.4s ease-in-out; /* fades it in */
		-moz-transition: opacity 0.4s ease-in-out;
		-webkit-transition: opacity 0.4s ease-in-out;
}
.popup-overlay.show {
		display: flex; /* flex as this allows us to center the row */
		opacity: 1; /* shows the overlay */
		z-index: 99999; /* moves the overlay on top of all the other sections */
		background-color: #000000b0;
		left: 0;
		backdrop-filter: blur(4px);
}
.popup-overlay>.et_pb_row:after {
		display: block;
		content: "\4d"; /* Elegant themes icon code */
		font-family: ETmodules;
		position: absolute; /* makes the icon absolute to the parent */
		top: 0px; /* moves to top */
		right: 40px; /* moves to right */
		font-size: 40px;
		visibility: visible;
		color: #fff;
		cursor: pointer; /* changes the cursor to be a pointer */
}
.popup-overlay .popup-content {margin: 0 10px 0 10px; color: white;font-size: 15px;text-align: center;padding: 50px;opacity: 1;border: 1px solid var(--color1);border-radius: 5px;background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(./images/popup-tx.png); background-size: cover;}
.popup-overlay .popup-content .btn{margin:30px 0 0 0; width: 250px}
.popup-overlay .popup-content .btn img{height:20px; vertical-align: middle;}
.popup-overlay .popup-content .tx-success .fa-check-circle{font-size:40px; text-shadow: #50ff00 1px 0 10px;animation: 1s infinite alternate cubic-bezier(0.89, -0.04, 0.58, 1.24) success; cursor:pointer;}
.popup-overlay .popup-content .tx-failed .fa-times-circle{font-size:40px; color:#e61126; font-size:40px;cursor:pointer;}
.popup-overlay .popup-content .secret-message-content {padding: 10px; border-radius: 5px}
.popup-overlay .popup-content .secret-message img{max-height:200px;margin-bottom: 20px;}
.popup-overlay .popup-content .popup-close {cursor:pointer;margin:30px 0 0 0}
.popup-overlay .popup-content .popup-close a{color:var(--color1)}
/******* END POPUP TRANSACTION *********/

/* POPUP NETWORK *******************************
certificate.twig
certificate_form.twig
dashboard.twig
project.twig
*/
.popup-overlay-network {
		position: fixed; /* fixed it */
		top: 0; /* moves it to the top */
		width: 100%; /* makes it fullwidth */
		height: 100vh; /* makes it full height of the screen */
		z-index: -1; /* moves the section behind all the rest so it is not shown */
		justify-content: center; /* centers the row in the middle */
		align-items: center;  /* centers the row in the middle */
		opacity: 0; /* hides the overlay */
		overflow: hidden;
		transition: opacity 0.4s ease-in-out; /* fades it in */
		-moz-transition: opacity 0.4s ease-in-out;
		-webkit-transition: opacity 0.4s ease-in-out;
}
.popup-overlay-network.show {
		display: flex; /* flex as this allows us to center the row */
		opacity: 1; /* shows the overlay */
		z-index: 99999; /* moves the overlay on top of all the other sections */
		background-color: #000000b0;
		left: 0;
		backdrop-filter: blur(4px);
}
.popup-overlay-network>.et_pb_row:after {
		display: block;
		content: "\4d"; /* Elegant themes icon code */
		font-family: ETmodules;
		position: absolute; /* makes the icon absolute to the parent */
		top: 0px; /* moves to top */
		right: 40px; /* moves to right */
		font-size: 40px;
		visibility: visible;
		color: #fff;
		cursor: pointer; /* changes the cursor to be a pointer */
}
.popup-overlay-network .popup-content {margin: 0 10px 0 10px; color: white;font-size: 15px;text-align: center;padding: 50px;opacity: 1;border: 1px solid var(--color1);border-radius: 5px;background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(./images/popup-tx.png); background-size: cover;}
.popup-overlay-network .popup-content .btn{margin:30px 0 0 0; width: 250px}
.popup-overlay-network .popup-content .popup-close {cursor:pointer;margin:30px 0 0 0}
.popup-overlay-network .popup-content .popup-close a{color:var(--color1)}
.popup-overlay-network .popup-content .popup-tuto img{height: 20px;vertical-align: middle;}
/******* END POPUP NETWORK *********/

/* CGU *******************************
*/
.cgu-sommaire{border: solid 1px black;}
.cgu-sommaire a {color: black;text-decoration: blink;}
.cgu-sommaire ul {padding: 0 0 0 50px;margin:0px}
.cgu-sommaire h2 {font-size: 20px;padding: 5px 0 5px 0;margin:0px}
.cgu-sommaire h3 {font-size: 16px;padding: 5px 0 5px 20px;margin:0px}
.cgu-body h2 {font-size: 30px;padding: 5px;margin: 0 0 20px 0;color: var(--color1);border-top: 1px black solid;border-bottom: 1px black solid;background-color: var(--color2);}
.cgu-body h3 {font-size: 16px;padding: 5px;margin: 10px 0 10px 0;color: var(--color1);border-top: 1px black solid;border-bottom: 1px black solid;background-color: #ecf0f1;font-weight: bold;}
.cgu-body h4 {font-size: 15px;background-color:#ecf0f1;padding: 5px;font-weight: bold;}
.cgu-body li p {font-weight: normal;}
.cgu-body li {list-style-type: none;font-weight: normal;padding-left: 10px;}
.cgu-body li li::before{content: "●"; color: black; display: inline-block; width: 1em; margin-left: -1em;}
.cgu-body li::before{content: "✓";color: black;display: inline-block; width: 1em; margin-left: -1em;}
/* END CGU *******************************/

/* MY ACCOUNT *******************************
my_account.twig
*/
section#myAccount fieldset {background:#fcfcfc; border: 1px solid #dddddd; margin: 1.125rem 0; padding: 1.25rem; -webkit-border-radius:8px; border-radius:8px; -webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2); box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);}
section#myAccount fieldset legend {width:inherit; font-weight: bold; margin: 0; padding: 5px; color:var(--color1); text-transform: uppercase;}
section#myAccount .star-color {font-size:15px; background: linear-gradient(107deg, rgba(255,255,255,1) 0%, rgba(174,145,97,1) 51%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
section#myAccount .et_pb_tabs_controls li.et_pb_tab_active a {
    background: var(--color2) !important;
    border-color: var(--color1) var(--color1) transparent var(--color1);
    border-style: solid solid none solid;
    color: white !important;
    cursor: pointer;
    border-radius: 8px 8px 0 0 !important;
}
section#myAccount .et_pb_tabs_controls li a {
    border-color: var(--color1) var(--color1) transparent var(--color1);
    border-style: solid solid none solid;
    border-width: 2px 2px 0 2px;
    background: white;
    -webkit-border-radius: 8px 8px 0 0;
    border-radius: 8px 8px 0 0;
}
section#myAccount .et_pb_tabs_controls li a:hover {
    background: var(--colorHoverBtn);
}
section#myAccount .et_pb_tabs_controls li.et_pb_tab_active {background: none; border: none;}
section#myAccount ul.et_pb_tabs_controls{background: none;border:none;}
section#myAccount ul.et_pb_tabs_controls::after {border-top: 2px solid var(--color1);}
section#myAccount ul.et_pb_tabs_controls li{border:0;padding: 0 10px 0 0;}
section#myAccount .et_pb_tabs {border:none;}
section#myAccount .et_pb_all_tabs{background: #f6f7f7;}
section#myAccount .et_pb_tab_0 .et_pb_tab,
section#myAccount .et_pb_tab_1 .et_pb_tab,
section#myAccount .et_pb_tab_2 .et_pb_tab {padding: 0 0.5em 0 0;}
section#myAccount .transak_btn {width: 100%; margin-top:10px }
.et_pb_tabs_controls li.et_pb_tab_active {background-color: transparent;}

section#myAccount .btn-social {background-color: var(--color2); color:white; border-radius: 50%; width: 30px; height: 30px; margin:15px; padding:2px; display: inline-block;border: 1px solid #ffffff70;cursor: pointer;}
section#myAccount .btn-social:hover {color: var(--color1)}
section#myAccount .socials {text-align: center; margin:20px 0 20px 0;}
section#myAccount .socials a {color: #fff}
section#myAccount .socials a:hover {color: var(--color1)}
section#myAccount h3{margin-bottom: 20px; text-transform: uppercase;}
section#myAccount #referral-link {width: 250px;text-align: center;border-radius: 5px 0 0 5px;}
section#myAccount #referral-icon {color:var(--color1);border: 1px solid #bbbbbb; border-radius: 0 5px 5px 0; cursor: pointer; height: 34px; width:34px;}
section#myAccount #referral-icon :hover{color:green; animation: 3s}
section#myAccount #referral-copied {color:green;}
section#myAccount #register_sign_eth_address_loading {margin-top:20px}

/* new password */
section#myAccount .wp-generate-pw {margin-top:0; width: 100%;font-size: 13px; background-color: #549a54;}
section#myAccount .wp-hide-pw > .dashicons, .wp-cancel-pw > .dashicons {position:inherit;height: 15px;}
section#myAccount .btn-new-password {background-color: #ccc;border-radius: 5px;padding: 5px;width: 100%;height: 35px;}
section#myAccount .btn-new-password:hover {background-color: #aaa;}
section#myAccount .table-password tr td {border:0; padding:0}
section#myAccount .table-password {border:0 !important; width: 30%; margin: auto;}
section#myAccount .lrm-login {color:black; background-color: #2d2d2d}
section#myAccount .form-control:disabled {background-color: transparent; border:0; box-shadow: none}
section#myAccount #ethereum_message {text-align: center}
section#myAccount .btn-buy-eth{margin-top:20px}

/* bouton zerion */
section#myAccount .btn-zerion {color: white; background: #343992; cursor: pointer; border-radius: 10px; padding:10px; margin-top:20px; border: 1px solid #343992;}
section#myAccount .btn-zerion:hover {background: #fff; color:#343992; transition:0.5s}

/* preview avatar */
section#myAccount #add-avatar-image {height: 150px; width: 150px; margin: auto;text-align:center;color:white;position: relative; background-color: #f0eeee; border-radius: 50%;}
section#myAccount #add-avatar-image .fa-user{font-size: 55px;margin-top: 30px;color: #646970;}
section#myAccount #add-avatar-image label{margin-bottom:10px; color:black}
section#myAccount .icon-if-avatar {position: relative; font-size:25px; top:-50px; color:white}
section#myAccount .icon-ifnot-avatar {font-size:25px; color:white}
section#myAccount .btn-accept, section#myAccount .btn-reload{text-align: center; width:100px; border:0; border-radius:5px; background: #343a40; color:white; cursor: pointer; padding: 5px; margin:10px auto 0 auto;}
section#myAccount #btn-preview-image {width:100px; margin:auto}
section#myAccount #preview-image {height: 150px; width:150px;box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;position: relative;}
section#myAccount #label-for-image img {border-radius:50%; box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;}
.fico-user-myaccount-wrap{padding-top: 1em;}
.fico-user-myaccount-wrap .btn {width:250px;}

#your-profile label {line-height: 2.5em}
tr#password th {text-align: left}
#your-profile .avatar-image {margin: 20px auto 0px auto; text-align: center; width: 100%;}
#your-profile .avatar-default-image {margin: 20px auto 20px auto;text-align: center;width: 150px;height: 150px;font-size: 60px;background-color: #d2d2d2;padding-top: 45px;border-radius: 50%;}
#your-profile .avatar-image img{border-radius:50%;width:150px;}
#your-profile .avatar-image p{width:100%; text-align: center}
section#myAccount legend {background-color: #ffffff;border-radius: 5px 5px 0px 0px;padding-top: 5px;margin-bottom: 10px;font-size:20px}
#password #pass1.strong, #pass1-text.strong {width:100%; text-align: center;border-radius: 0;}
section#myAccount #pass-strength-result {margin: 0 0 10px 0;; width:100%}
section#myAccount #ethereum_address #low-balance {margin:20px 0 20px 0;border-top: 1px solid #c3c4c7; padding-top: 20px;}
section#myAccount .roles-category .explainations {border: 1px solid grey; margin-top:20px;padding-bottom:20px;background-color: #fff; color:black; border-radius:5px; height: 300px}

/* user guide */
#myAccount-user-guide {margin-top:20px}
#myAccount-user-guide .metamask-icon {height:30px; vertical-align: middle;}
#myAccount-user-guide .opera-wallet-icon {height:30px; vertical-align: middle;}
#myAccount-user-guide .btn {margin-top:20px; width:100% !important}
#myAccount-user-guide #user_eth_address {font-size:15px;font-weight: bold;}
#myAccount-user-guide #wallet-connected {margin-top:20px}
.roles-category {margin-top: 20px}
.roles-category h3 {color: var(--color1); padding:20px 0 20px 0;}
.roles-category h2 {padding:20px 0 20px 0; font-size: 25px; color:white}
.category-frame {border-radius:5px; background-color: var(--color2); color:white; padding: 35px;margin-bottom: 10px; box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;}
.category-frame .btn{width: 100%;}
.category-frame .action {margin: 20px 0 20px 0;}
.category-frame .action .finished{width: 100%;border: 1px solid var(--color1);border-radius: 5px;padding: 7px;background: var(--colorHoverBtn);color: #826a42;}
.category-frame h2{text-transform: uppercase}

@media (max-width: 640px){
	#your-profile .wp-pwd button.button {position: initial;margin-bottom:10px}
	#your-profile  .wp-pwd .button .text {display:block;}
	#your-profile .wp-pwd [type="text"], .wp-pwd [type="password"] {padding-left:0}
	section#myAccount legend{text-align: center}
	section#myAccount {width: 125%;margin-left: -40px;text-align: center}
	section#myAccount .table-password {width: 100%;}
	section#myAccount #ethereum_address #low-balance {float:initial;}
	section#myAccount .roles-category .explainations {height: auto}
}

@media screen and (max-width: 414px) {
	section#myAccount .et_pb_tabs_controls li a {font-weight: 100;border-style: none; text-align: left;}
	section#myAccount .et_pb_tabs_controls li.et_pb_tab_active {background: #E2E2E2 !important;border-bottom: solid 2px var(--color1) !important;border-style: none;color: black !important;}
	section#myAccount .et_pb_tabs_controls li.et_pb_tab_active a {border:none; background-color:transparent !important;color: black !important;}
	section#myAccount.et_pb_tabs_controls li a:hover {background:transparent; color:black!important}
}
/**** END MY ACCOUNT ****/

/********************************************/
/* PLUGIN ICO ******* ***********************/
/********************************************/

/* POPULAR PROJECT *******************************
related-projects.twig
portfolio.twig
*/
.popular-project-contenu {width:100%; margin:auto;}
#portfolio_category_filter {margin: 0 auto 20px auto}
#embed-content section#popular-project .block-index-project {box-shadow: none}

section#popular-project .projet-container {color:black;}
section#popular-project .popular-project-contenu > article {margin-bottom:2em;}
section#popular-project h2 { font-size: 4em; font-weight: 700; }
section#popular-project .block-index-project {padding:0.3em;box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);}
section#popular-project .et_pb_button_extra {border: solid 16px #f0eeee !important; border-radius: 21px;}
section#popular-project .projet-container { position:relative;}
section#popular-project .projet-container .img-details img:hover{opacity: 0.5;}
section#popular-project .projet-container .img-details img {min-width: 100%;display: block;max-width: 100%;position: absolute;    top: 0;bottom: 0;left: 0;right: 0;transition: opacity 0.5s ease-in-out;}
section#popular-project .projet-container .img-details {overflow: hidden;position: relative;display: block;width: 100%;padding: 52.25% 0 0 0;}
section#popular-project .projet-container .marque {position:absolute; bottom:0; left:0; background:rgba(255,255,255,0.8); line-height:1; display:block; padding:0.4em 0.5em; border-radius:0 5px 0 0;}
section#popular-project .projet-container .marque img {min-width:inherit !important; max-width:45px; float:left; padding-right:0.2em;border-radius: 50%;position: initial;}
section#popular-project .projet-container .marque .name-company {text-align:left; /*float:left;*/ min-height: 30px; display:inline-block; }
section#popular-project .projet-container .marque .logo-author {display:inline-block; vertical-align: bottom;margin-bottom:3px; }
section#popular-project .info {text-align:center;}
section#popular-project .favoris {background: url('images/favorie.png') no-repeat center top; width:39px; height: 32px; z-index:5; position:absolute; right:0; top:0;}
section#popular-project .favoris-red {background: url('images/favorie-select.png') no-repeat center top; width:39px; height: 32px; z-index:5; position:absolute; right:0; top:0;}
section#popular-project .text-details {background:white; text-align: left; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px;}
section#popular-project .text-details .progression > img {max-width:100%;}
section#popular-project .text-details .foot {font-weight:600; font-size:0.8rem;}
section#popular-project .progression {position:relative;}
section#popular-project .achievement {background: -webkit-linear-gradient(left, #e2e2e2 69%,#ffffff 100%);background: linear-gradient(to right, #e2e2e2 69%,#ffffff 100%);}
section#popular-project .achievement_bar {background:var(--color1); height:8px;border-radius: 10px;}
section#popular-project .achievement_percentage {position:relative; text-align:right; color:var(--color1); min-width:30px;font-size: 12px;}
section#popular-project .projet-container .category {color:#97959b; line-height:1; font-size: 0.8em;}
section#popular-project .projet-container .foot { padding:0.8em 0.4em 0.4em 0.4em; }
section#popular-project .projet-container .foot .time { text-align:right !important; }
section#popular-project .projet-container .foot .time img { float:right;padding: 4px 4px 4px 12px;height: 26px;}
section#popular-project .row.search-allproject {margin-bottom:2em;}
/* END POPULAR PROJECT *******************************/

/* PROJECT DETAIL *******************************
project.twig
*/
.project-detail-coldroite {text-align: center; border: 1px solid #ccc;background-color: var(--color2);animation: 1s cubic-bezier(0.45, 0.05, 0.55, 0.95) fader;}
@keyframes fader {from {opacity:0; } to { opacity:1;}}
.project-detail-coldroite pre {color: #fff;}
.project-detail-coldroite .transak_btn img{height:20px; vertical-align: middle;}

section#projet-details {margin-top: -30px;}
section#projet-details .project-detail {padding-top: 0.7em;}
section#projet-details .project-detail h2 {color: #826a42; text-transform: uppercase;margin-bottom: 10px;padding-bottom:0;font-weight: 700;}
section#projet-details .project-detail h3 {margin-top:0; font-weight: 300; color:var(--color1); font-size: 15px;}
section#projet-details .project-detail .table-ico {margin-top: 15px !important;}
section#projet-details .project-detail .table-ico h2 {font-size: 20px; margin: 0;}
section#projet-details .project-detail .table-ico td {padding: 5px 10px 5px 10px;}
section#projet-details .project-detail .project-detail-img img {border-radius: 0.25rem !important; padding:0.2em; background:white;}
section#projet-details .project-detail nav.tabs-project { margin-top:1.5em; }
section#projet-details .project-detail a.nav-item { color:var(--color1); }
section#projet-details .project-detail a.active { font-weight: 600; }
section#projet-details .project-detail .tab-pane { padding-top: 1em; }
section#projet-details .project-detail .project-detail-img img {width:100px;}
section#projet-details .favicon-project {width:80px; margin:auto}
section#projet-details .favicon-project img{border-radius:50%; border: 1px solid #d3d3d3;}
section#projet-details .socials {text-align: center; margin:20px 0 20px 0;}
section#projet-details .socials a {color: #fff}
section#projet-details .socials a:hover {color: var(--color1)}
section#projet-details .btn-social {cursor: pointer;background-color: var(--color2); color:white; border-radius: 50%; width: 30px; height: 30px; margin:15px; padding:2px; display: inline-block;}
section#projet-details .btn-social :hover {color: var(--color1)}
section#projet-details .iframe_snippet {width: 100%; text-align: center; height: 35px; background-color: #eeeeee; color: grey; resize: none; margin-top:20px;}
section#projet-details ul.et_pb_tabs_controls {background:none;border:none;}
section#projet-details .et_pb_tabs_controls li, section#projet-details .et_pb_tabs {border:none;}
section#projet-details .project-tabs .et_pb_tabs_controls li {height:auto !important;}
section#projet-details .et_pb_tabs_controls li a {font-size: 1em; font-weight:300; padding: 4px 11px 0px 8px;}
section#projet-details .project-tabs .et_pb_tab_0.et_pb_tab, section#projet-details .project-tabs .et_pb_tab_1.et_pb_tab, section#projet-details .project-tabs .et_pb_tab_2.et_pb_tab {padding:0.5em;}
section#projet-details .url-externe {font-weight: 300; padding: 0.5em; display: inline-block; margin-top: 0.2em;}
section#projet-details .url-externe a {color:#666; padding-top: 0.3em;}
section#projet-details .url-externe:hover {border-bottom: solid 5px #d6d6d6}
section#projet-details .share {background:#a9a9a9; color:white; border-radius:12px; float:right; font-size:1em;  font-weight:300; padding: 0.2em 1em; display: inline-block;}
section#projet-details .share a {color:white;}
section#projet-details ul.et_pb_tabs_controls .et_pb_tab:hover {border-bottom:solid 5px #d6d6d6;}
section#projet-details ul.et_pb_tabs_controls .et_pb_tab_active {border-bottom:solid 5px var(--color1) !important;}
section#projet-details .project-excerpt {margin-bottom:1em;}
section#projet-details .project-video {margin:1em 0 3em 0;}
section#projet-details .project-contenu {margin-bottom:1em;}
section#projet-details ul.choice {border-bottom:solid 1px #dadada; padding:0;}
section#projet-details ul.choice .list-inline-item { font-size:1.3em; padding:0 1.2em 0.4em 1.2em;}
section#projet-details ul.choice .list-inline-item a { color:black;}
section#projet-details ul.choice .list-inline-item a:hover { color:var(--color1);}
section#projet-details ul.choice .list-inline-item.selected { border-bottom:solid 4px var(--color1);}
section#projet-details .choice-contenu {margin-top:1em;}
section#projet-details .achievement { background:#ccc;}
section#projet-details .achievement_bar {background:#e5a400; height:22px;}
section#projet-details .achievement_percentage {text-align:right; color:#e5a400; height:58px; min-width:24px; background:url('images/round-yellow.png') no-repeat center right; line-height: 3; font-size: 0.8em;padding-right: 0.3em; font-weight: 800;}
section#projet-details .text-pourcentage {font-weight:600; font-size:2em; margin-bottom:0.2em;}
section#projet-details .table-ico tr:nth-child(2n) {background:#fafafa;}
section#projet-details .project-picture, section#projet-details .project-video {text-align: center; margin:1em 0; padding:0.5em; border:solid 1px #ccc;}
section#projet-details section#popular-project { margin-top:0.3em;}
section#projet-details .project-meta {font-size:1.6em; margin-top:0.5em;}
section#projet-details .token-icon-tab {height: 20px;margin-bottom: 2px;border-radius:50%}
section#projet-details .blockchain-logo img{height:20px; margin-top:20px}
section#projet-details .blockchain-logo {text-align:center}

@media screen and (max-width: 39.9375em) {
  section#projet-details .et_pb_tab_active {background: #E2E2E2 !important;}
  section#projet-details .share {float:left; margin-bottom:1em;width: 100%;text-align: center;}
  section#projet-details .project-detail h2 {text-align:center}
  section#projet-details .project-detail h3 {text-align:center}
  section#projet-details .project-detail .table-ico h2 {text-align:left}
  section#projet-details .project-detail .table-ico td {display: inherit; border:none;}
  section#projet-details .project-tabs .et_pb_tab_content {padding: 0.8em 0;}
	section#projet-details .project-detail-img {text-align: center}
	section#projet-details .socials {display:flex;}
}

/* END PROJECT DETAIL *******************************/

/* PROJECT WIDGET COUNTDOWN *******************************
project_counters.twig
*/
section#countdown_widget, section#progression_bar_widget, section#iframe_uniswap_widget, section#contribute_widget, section#transak_widget, section#related-projects, section#project-userguide-widget, #eth_address_registration, #project-userguide-widget-log-in {padding: 10px; margin-top: 20px; margin-bottom: 20px; background-color:#fff;}
section#countdown_widget .projet-countdown {text-align: center; padding: 15px;background-color:var(--color2);}
section#countdown_widget .projet-countdown h2 {font-size:20px; color:#fff;}
section#countdown_widget .projet-countdown .ico-successfull {font-size:40px; text-shadow: #50ff00 1px 0 10px;animation: 1s infinite alternate cubic-bezier(0.89, -0.04, 0.58, 1.24) success;padding-top: 20px;padding-bottom: 10px;}
@keyframes success {from {text-shadow: #50ff00 1px 0 10px; } to { text-shadow: #50ff00 1px 0 15px;} }
section#countdown_widget #decompte {margin:10px auto 15px auto; font-size:small; border-radius:5px }
section#countdown_widget #decompte > div { text-align: center; }
section#countdown_widget #decompte .days, #decompte .hours, #decompte .minutes, #decompte .seconds {margin:0.2em; color:var(--color1); font-size: 2.4em; font-weight: 600;padding:10px 0 8px 0; border-radius:5px; background: linear-gradient(170deg, rgba(255,255,255,1) 24%, rgba(186,186,186,1) 73%);}
section#countdown_widget #decompte span { display: block; font-size: 0.4em; font-weight: 400;}
/* END PROJECT COUNTDOWN *******************************/

/* PROJECT WIDGET CONTRIBUTE *******************************
contribute.twig
*/
section#contribute_widget #no_remaining_message{margin-top:20px; margin-bottom:20px}
section#contribute_widget .block {display: block;}
section#contribute_widget .btn{width:100%}
section#contribute_widget .btn-clignote1{margin-top:10px}
section#contribute_widget #max_remaining_message, section#contribute_widget #min_remaining_message {text-align: center; margin-top:20px;}
section#contribute_widget button#set_max, section#contribute_widget button#set_min {border-radius:0 !important}
section#contribute_widget .buy-token{margin-top:20px}
section#contribute_widget .amount {text-align:center; line-height: 2.5em; width: 80%; border: 1px var(--color1); border-style: solid none none solid; border-radius: 5px 0px 0 0; background-color: white;}
section#contribute_widget .max_min {width: 20%; border: 1px var(--color1); border-style: solid solid none none;}
section#contribute_widget .qrcode_label {margin-bottom: 0.8em;}
section#contribute_widget #contribute_submit {width: 100%;}
section#contribute_widget #contribute_submit.btn {border-radius: 0 0 5px 5px !important; border: 1px solid var(--color1); margin: 0 0 15px 0;}
section#contribute_widget input#amount {border: none; display:inline-block; color:var(--color1); width:84%; height: 52px; text-align: center; text-transform: uppercase; background-color: transparent;}
section#contribute_widget button#set_max, section#contribute_widget button#set_min {margin: 1px; width: 100%; line-height: 10px; cursor:pointer; color:white; float: right; font-size: 12px;}
section#contribute_widget .blockchain-logo img{height:20px; margin-top:20px}
section#contribute_widget .sub{width: 100%}
#contribute_message {color: var(--color1); padding-bottom: 15px; padding-top: 15px;}

/* transak */
section#transak_widget .btn {width:100%}

@media screen and (max-width: 39.9375em) {
  #contribute_submit {height:38px;}
}
/* END PROJECT WIDGET CONTRIBUTE *******************************/

/* PROJECT WIDGET PROGRESSION BAR *******************************
project_counters.twig
*/
section#progression_bar_widget {margin-top:-20px}
section#progression_bar_widget .project-meta {text-align:center; padding-top: 15px;}
.progression {position:relative;text-align: center; animation: 3s cubic-bezier(0.45, 0.05, 0.55, 0.95) slidein;}
@keyframes slidein {from {width:0%; } to   { width:100%;}}
section#progression_bar_widget .achievement_percentage {position:relative; color:var(--color1); min-width:24px; text-align: center;}
section#progression_bar_widget .achievement {background: -webkit-linear-gradient(left, #e2e2e2 69%,#ffffff 100%);background: linear-gradient(to right, #e2e2e2 69%,#ffffff 100%);}
section#progression_bar_widget .achievement_bar {background: var(--color1); height: 18px;}
/* END PROJECT WIDGET PROGRESSION BAR *******************************/

/* PROJECT WIDGET UNISWAP *******************************
token_swap.twig
*/
section#iframe_uniswap_widget .iframe-tokenswap {margin-top:20px; min-height:660px; width:100%}
section#iframe_uniswap_widget .exchange {margin-top:10px}
section#iframe_uniswap_widget .metamask-icon {height:30px; vertical-align: middle;}
/* END PROJECT WIDGET UNISWAP *******************************/


/* PROJECT WIDGET USERGUIDE *******************************
connection.twig
*/
section#project-userguide-widget .metamask-icon {height:30px; vertical-align: middle;}
section#project-userguide-widget .trust-wallet-icon {height:30px; vertical-align: middle;}
section#project-userguide-widget .opera-wallet-icon {height:30px; vertical-align: middle;}
section#project-userguide-widget .btn, #eth_address_registration .btn, #project-userguide-widget-log-in .btn {margin-top:20px; width:100%}
/* END PROJECT WIDGET USERGUIDE *******************************/

/* PROJECT WIDGET RELATED PROJECTS *******************************
related_projects.twig
*/
section#related-projects h2 {font-size:20px;text-transform: uppercase; margin-top: 20px; margin-bottom: 20px;}
section#related-projects .block-index-project {box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);}
section#related-projects .price-euro {font-size: 15px}
@media screen and (max-width: 600px) {
  section#iframe_uniswap_widget .add-to-metamask {display:none}
  .block-colright{margin-left: 0px; margin-right : 0px;}
  .project-detail-coldroite .block {margin-left: 0px; margin-right : 0px;}
}
/* END PROJECT WIDGET RELATED PROJECTS ****************/

/* OTHERS PROJECT *******************************
Others CSS used for project
*/
.btn_envoyer_projet {width:100%!important;}
/* END OTHERS PROJECT  *******************************

/********************************************/
/* PLUGIN CERTIFICATE ***********************/
/********************************************/

/* NFT CREATION FORM *******************************
certificate_form.twig
*/
#create_certificate_form .onoffswitch {margin: auto;position: relative; width: 75px;-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
#create_certificate_form .onoffswitch-checkbox {position: absolute;opacity: 0;pointer-events: none;}
#create_certificate_form .onoffswitch-label {display: block; overflow: hidden; cursor: pointer;border: 1px solid var(--color1); border-radius: 20px;margin-bottom: 20px;}
#create_certificate_form .onoffswitch-inner {display: block; width: 200%; margin-left: -100%;transition: margin 0.3s ease-in 0s;}
#create_certificate_form .onoffswitch-inner:before, .onoffswitch-inner:after {display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;font-size: 12px; color: white;box-sizing: border-box;}
#create_certificate_form .onoffswitch-inner:before {content: "NON"; padding-left: 18px; background-color: #EEEEEE; color: #999999;}
#create_certificate_form .onoffswitch-inner:after {content: "OUI"; padding-right: 11px; background-color: var(--color2); color: #999999; text-align: right;}
#create_certificate_form .onoffswitch-switch {display: block; width: 18px; margin: 6px;background: var(--color1);position: absolute; top: 0; bottom: 0;right: 42px;border: 4px solid #ffffff; border-radius: 20px;transition: all 0.3s ease-in 0s;}
#create_certificate_form .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {margin-left: 0;}
#create_certificate_form .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {right: 0px;}
#create_certificate_form h4 {margin: 20px 0 0 0; color: var(--color1);font-size: 15px;}
#create_certificate_form input#dna {background: transparent; border: none; color: white; padding: 0;}
#create_certificate_form input, #create_certificate_form textarea { width: 100%; border-radius: 4px; padding: 0.5rem;}
#create_certificate_form label {color:white}
#create_certificate_form #change-creator-address label {color:initial}
#create_certificate_form input[type=checkbox] { width: auto !important; margin-right: .5rem; margin-bottom: .2rem; }
#create_certificate_form small { font-size: 14px;color: white}
#create_certificate_form p {margin-bottom:10px}

@media screen and (max-width: 600px) {
	#create_certificate_form .onoffswitch {margin: 10px 0 0 0;}
}
/***** END NFT CREATION FORM ******************/

/* DROPPABLE AERA *******************************
file_drop_aera.twig
*/
#droppable-zone {border: 1px dashed var(--color1);height: 130px;margin-top:30px;width:100%;position: relative;overflow: hidden;border-radius: 10px;background-color: #0000005e;color: var(--color1);}
#droppable-zone-text {display: block;text-align: center;vertical-align: middle;font-size: 15px;overflow: hidden;margin-top:2rem;}
/* END DROPPABLE AERA *******************************/

/* CREATOR GALLERY *******************************
creator_certificates_page.twig
*/
section#creator-gallery .gallery-menu {padding:20px 0 0 20px;font-size: 20px;}
section#creator-gallery .socials {text-align: center; margin:-55px auto 20px auto;}
section#creator-gallery .socials a {color: #000; font-size:20px}
section#creator-gallery .socials a:hover {color: var(--color1)}
section#creator-gallery .btn-social {cursor: pointer; border-radius: 50%; width: 30px; height: 30px; margin:10px; padding:2px; display: inline-block;}
section#creator-gallery .btn-social :hover {color: var(--color1)}
section#creator-gallery .with-background {margin: 0 -15px 0 -15px!important;color:white; background:#000000bd ; background-blend-mode: darken; margin:0; background-size: cover;height:300px;background-position: center;}
section#creator-gallery .creator-informations {font-size: 20px; margin:auto; position: relative;top: -80px;text-align: center;}
section#creator-gallery .creator-informations img{border-radius:50%;border: 5px solid #fff;transition: all 0.2s;}
section#creator-gallery .gallery-biography {width:75%;padding:15px; margin:auto; text-align: justify}
section#creator-gallery .gallery-biography h3{text-transform: uppercase}
section#creator-gallery .content_only {margin: auto; border: 0;max-width: 100%;}
section#creator-gallery .container {max-width:100%; width:100%;background-color: white;}
section#creator-gallery .certificate-info p{margin-bottom:0}
section#creator-gallery .pagination-certificat a {font-size: 16px;color: black;}
section#creator-gallery .pagination-certificat a:hover {background: #cccccc;color: var(--color1);text-decoration: auto;}
section#creator-gallery .gallery-portfolio {margin: 0 auto 60px auto}
section#creator-gallery .flip-card-back {background-size: cover;}
section#creator-gallery .gallery-menu a{color:white}
section#creator-gallery .gallery-menu a:hover{color:var(--color1);}
section#creator-gallery .certified {font-size: 0.5em; color: green;}
section#creator-gallery .not_certified {font-size: 0.5em; color: grey;}
section#creator-gallery .no-avatar {background-color: white; width:152px; height: 152px; border-radius:50%; margin:auto; border: 1px solid grey}
section#creator-gallery .no-avatar .fa-user{font-size: 55px;margin-top: 45px;color: #646970;}

/******* END CREATOR GALLERY *********/

/* CERTIFICATE DETAIL *******************************
certificate.twig
*/
.bg-certificat .blockchain-logo img{height: 20px}
.bg-certificat .blockchain-logo {padding:20px; text-align: center; background-color: white; margin-bottom:8px}
.bg-certificat .blockchain-logo p{margin:20px 0 20px 0}
.bg-certificat .container {padding-top: 15px !important}
#certificate-details {background-color: black;padding: 10px;box-shadow: rgb(255 255 255 / 56%) 0px 1px 29px 7px;border-radius: 5px;}
#certificate-details .row{margin:0}
#certificate-details .col-sm-8 {margin:0}
#certificate-details p { font-size: 15px;  }
#certificate-details #install-web3-provider-message{text-align:center; padding:10px}
#certificate-details .btn-social {background-color: var(--color2); color:white; border-radius: 50%; width: 30px; height: 30px; margin:15px; padding:2px; display: inline-block;border: 1px solid #ffffff70;cursor: pointer;}
#certificate-details .btn-social:hover {color: var(--color1)}
#certificate-details .socials {text-align: center; margin:20px 0 20px 0;}
#certificate-details .socials a {color: #fff}
#certificate-details .socials a:hover {color: var(--color1)}
#certificate-details .certificate-background-image {display:none}
#certificate-details .certificat-message {margin-right: 0px; margin-left: 0px; color:white}
#certificate-details #display-certificate .with-background .col-sm-8 {margin: 0;}
#certificate-details .description-content {text-align: justify;max-height: 500px; overflow: auto; padding-right: 5px;}
#certificate-details .certificate-video {margin:20px 0 0 0;}
#certificate-details .certificate-audio audio {width:100%; margin:20px 0 0 0}
#certificate-details .certificate-audio audio::-webkit-media-controls-panel {background-color: white;}
#certificate-details .user-picture { z-index:10; position: relative;}
#certificate-details .user-picture-interne {margin:auto; top: -50px; position: relative;text-align:center}
#certificate-details .user-picture-interne img{position: relative; border-radius: 50%;box-shadow: #e7e7e752 0px 5px 15px;height: 100px;margin-bottom: 20px;transition:0.5s}
#certificate-details .user-picture-interne img:hover{transform: scale(1.1);}
#certificate-details .user-picture img { width:150px; height: 150px; border-radius: 50%; border: solid 15px white; position: absolute; top: -4.8rem; left:2rem; background-color: #fff; }
#certificate-details .container-info { z-index:5; position: relative; border-radius: 8px 8px 0 0; /* background: url(images/fond-carte-scaled.jpg) no-repeat center center; background-size: cover; */ }
#certificate-details .container-info h1 { padding-top: 3rem; text-transform: uppercase; font-weight: 200; font-size: 28px; text-align: center;   }
#certificate-details .container-info h1 span { font-weight: 600; font-size: 37px; }
#certificate-details .bg-color { background-color:#ededed; }
#certificate-details .border { border-bottom-width: 2px; }
#certificate-details .pair:nth-child(2n)  { background: #ededed !important; }
#certificate-details .pair [class^='col-md'] { border: 1px solid #fff!important; }
#certificate-details .container-background { position: relative; overflow: hidden; }
#certificate-details .certificate-background-image { position: absolute; top: 0; left: 0; overflow: hidden; opacity: 10%; }
@-webkit-keyframes animate-image-nft {
	0% {opacity: 0;width:50%; height:50%}
	100% {opacity: 1;width:100%; height:100%}
}
#certificate-details .certificate-image {margin: 10px auto 15px auto;text-align: center;border: 35px solid white;background: white; animation:animate-image-nft 3s;}
#certificate-details #certificate-details-image-desktop img {width:100%; filter: drop-shadow(2px 4px 6px black);cursor: zoom-in;transition:0.5s}
#certificate-details #certificate-details-image-desktop img:hover{transform: scale(1.05);}
#certificate-details #left-side {border:1px solid #1c1c1c;}
#certificate-details #left-side .col-sm {padding:0}
#certificate-details #left-side .col-sm-8 {padding:0}
#certificate-details #left-side .col-sm-12 {padding:0}
#certificate-details #left-side .certificate-tokenid .btn {width:210px;}
#certificate-details #widget {margin-top:-13px;padding-right: 0;}
#certificate-details .url_link {text-align:center;}
#certificate-details .url_link .btn {width:300px; margin:auto}
#certificate-details .url_link .btn-full-width .btn {width:100%}
#certificate-details #certificate-on-sale-mobile .btn {width:210px}
#certificate-details .certificate-links {margin-top: 30px;}
#certificate-details .icon-pdf {text-align: center;margin-bottom:20px}
#certificate-details .icon-pdf img{height:45px;}

#certificate-details .certificate-lastPrice p {margin-bottom:20px}
#certificate-details .certificate-lastPrice h2 {margin-bottom:0}
#certificate-details .certificate-lastPrice {font-size:30px; text-align:center; margin-top: -45px;}
#certificate-details .certificate-lastPrice .lastPrice{width:300px; margin:auto; color:var(--color1)}
#certificate-details .certificate-lastPrice .lastPrice-suffix{font-size: 20px}
#certificate-details .certificate-lastPrice input{color:var(--color1); background: transparent; border:0; width:100%; text-align:center}

#certificate-details .certificate-name {color: white; font-size: 30px;margin: 15px 0 15px 0;}
#certificate-details .certificate-field { margin-top: 1em; }
#certificate-details #display-data-into-blockchain { margin: 1rem; padding: 1rem; background-color: white}
#certificate-details .certificate-heading {color:var(--color1); padding: 0; }
#certificate-details .certificat-info { padding: 3rem 1rem 1rem 1rem; min-height: 300px; }
#certificate-details .certificat-info .certificate-heading { color: #ab936a; }
#certificate-details .certificat-category {margin-top:20px; margin-bottom:20px}
#certificate-details .certificat-category span { color:#aa9268; }
#certificate-details .certificat-qrcode { position: absolute; right: 1rem; top:1rem; }
#certificate-details .certificat-qrcode-bottom { display: block; position: relative; }
#certificate-details .certificate-price { float: right; font-size: 25px; }
#certificate-details .certificate-tokenid { line-height: 1.2; margin-bottom: 1rem; font-size: 15px; }
#certificate-details .certificate-tokenid img { height:24px; width: auto; }
#certificate-details .certificat-button { margin-bottom: .2rem; }
#certificate-details .certificat-message {width: 100%; color: white; }
#certificate-details .certificat-message-button { display: block; background-color: #aa9268; border-radius: 10px; color: white; font-weight: 400; padding: .3rem 1rem; margin-top: 2rem; margin-bottom: .2rem; text-align: center;  }
#certificate-details .certificat-message-euro { display: block; background-color: transparent; border-radius: 10px; color: black; font-weight: 400; padding: .3rem 1rem; margin-top: 2rem; margin-bottom: .2rem; text-align: center; border: solid 1px #aa9268  }
#certificate-details .certificat-message-button:hover { background-color: rgba(255,255,255, .8); color: black; }
#certificate-details .actions-certificate {color:white}
#certificate-details .iframe_snippet {width: 100%; text-align: center; height: 90px; resize: none; margin-top:20px;}
#certificate-details #qrcode {margin:20px 0 20px 0}
#certificate-details #qrcode img {margin:20px 0 20px 0}

#certificate-details #display-certificate .with-background {margin: 0 -15px 0 -15px!important;color:white; background:#000000bd ; background-blend-mode: darken; margin:0; background-size: cover;height:300px; padding: 0 10px 0 10px;}
#certificate-details #display-certificate .with-background .col-sm-8 {padding: 10px;}
#certificate-details #display-certificate #image-mobile {display:none}
#certificate-details .actions-certificate #blockchain-loader {text-align: center; padding-top: 20px; padding-bottom: 20px;display:none}

#certificate-details .certificate-purchase { color: white; text-align: center; margin-top: 1rem; }
#certificate-details .certificate-purchase h2 { color: #ab936a; }

#certificate-details #certificate-details-new-auction .row { margin-top:20px }
#certificate-details #certificate-details-new-auction .btn{margin-top:20px}
#certificate-details #certificate-details-new-auction #auction_start_time{cursor: text}
#certificate-details #certificate-details-new-auction #auction_end_time{cursor: text}
#certificate-details #certificate-details-new-auction input{width:100%; text-align:center;border-radius: 5px;border: 0;height: 40px;}
#certificate-details #certificate-details-new-auction #auction_error p{ text-align: center; margin-top:20px; color:red}

#certificate-details #certificate-details-transfer-token .btn{border-radius:0 0 5px 5px!important}
#certificate-details #certificate-details-burn-token .btn{margin-top:20px}
#certificate-details #certificate-details-update-creator-data .btn{border-radius:0 0 5px 5px!important}
#certificate-details #certificate-details-update-owner-data .btn{border-radius:0 0 5px 5px!important}

#certificate-details #certificate-details-bid #block-to-bid {text-align:center}
#certificate-details #certificate-details-bid #block-to-bid input{width:50%; border:0;float: left;text-align:right;}
#certificate-details #certificate-details-bid #block-to-bid input:focus{background-color: #ddd; text-align: center}
#certificate-details #certificate-details-bid #block-to-bid .bid-suffix{height: 100%;line-height: 50px;background: white;color: grey;text-align:left}
#certificate-details #certificate-details-bid #block-to-bid .btn{margin-bottom:20px}
#certificate-details #certificate-details-bid #block-to-bid #btn-bidWithAmount{border-radius:0 0 5px 5px!important;margin-bottom:20px; margin-top:0}

#certificate-details #userRole_message p {text-align:center; margin-bottom:20px; color:orange}

#certificate-details #certificate-details-bid .row { margin-top:20px }
#certificate-details #certificate-details-bid input {width:100%;text-align: center;height: 50px}
#certificate-details #certificate-details-bid #auction-countdown {text-align: center;display: flex; margin: 50px auto 50px auto;border: 1px solid #4c4c4c;padding-top: 30px;}
#certificate-details #certificate-details-bid .countdown-text {font-size:x-small;}
#certificate-details #certificate-details-bid #countdown-day,
#certificate-details #certificate-details-bid #countdown-hour,
#certificate-details #certificate-details-bid #countdown-minute,
#certificate-details #certificate-details-bid #countdown-second {border:0; font-size:40px}
#certificate-details #certificate-details-bid #day,
#certificate-details #certificate-details-bid #hour,
#certificate-details #certificate-details-bid #minute,
#certificate-details #certificate-details-bid #second {margin-bottom:20px}
#certificate-details #certificate-details-bid .topBidder {margin-bottom:20px; line-height: 40px; text-align: center}
#certificate-details #certificate-details-bid .topBidder .fa-award {font-size:50px; color:var(--color1);padding:20px}
#certificate-details #certificate-details-bid span#countdown-day,
#certificate-details #certificate-details-bid span#countdown-hour,
#certificate-details #certificate-details-bid span#countdown-minute,
#certificate-details #certificate-details-bid span#countdown-second {background: var(--color2);color: white;display: block;width: 70px;height: 65px;margin: auto;padding-top: 20px;border-radius: 5px;}
#certificate-details #certificate-details-bid .transak_btn {text-align:center; margin-top:20px; color:orange}
#certificate-details #certificate-details-bid .transak_btn .insufficient-funds{margin-bottom: 20px;padding: 5px;color: #999999;}
#certificate-details #certificate-details-bid .transak_btn img{height: 21px; vertical-align: middle;}

#certificate-details .bell{font-size:20px; background: -webkit-linear-gradient(#eee, #333);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin:0px auto 0;color: #ffffff;-webkit-animation: ring 4s .7s ease-in-out infinite;-webkit-transform-origin: 50% 4px;-moz-animation: ring 4s .7s ease-in-out infinite;-moz-transform-origin: 50% 4px;animation: ring 4s .7s ease-in-out infinite;transform-origin: 50% 4px;}
@-webkit-keyframes ring {
	0% { transform: rotate(0); }
  1% { transform: rotate(30deg); }
  3% { transform: rotate(-28deg); }
  5% { transform: rotate(34deg); }
  7% { transform: rotate(-32deg); }
  9% { transform: rotate(30deg); }
  11% { transform: rotate(-28deg); }
  13% { transform: rotate(26deg); }
  15% { transform: rotate(-24deg); }
  17% { transform: rotate(22deg); }
  19% { transform: rotate(-20deg); }
  21% { transform: rotate(18deg); }
  23% { transform: rotate(-16deg); }
  25% { transform: rotate(14deg); }
  27% { transform: rotate(-12deg); }
  29% { transform: rotate(10deg); }
  31% { transform: rotate(-8deg); }
  33% { transform: rotate(6deg); }
  35% { transform: rotate(-4deg); }
  37% { transform: rotate(2deg); }
  39% { transform: rotate(-1deg); }
  41% { transform: rotate(1deg); }
  43% { transform: rotate(0); }
  100% { transform: rotate(0); }
}

#certificate-details #certificate-details-release-token .row { margin-top:20px }
#certificate-details #certificate-details-release-token input {width:100%;text-align: center;height: 50px;}

#certificate-details #certificate-details-update-owner-data .row { margin-top:20px }
#certificate-details #certificate-details-update-owner-data input {width:100%;text-align: center;height: 50px;}

#certificate-details #certificate-details-update-creator-data .row { margin-top:20px }
#certificate-details #certificate-details-update-creator-data input {width:100%;text-align: center;height: 50px;}

#certificate-details #certificate-details-transfer-token .row { margin-top:20px }
#certificate-details #certificate-details-transfer-token input {font-size: 13px; width:100%;text-align: center;height: 50px;}
#certificate-details #certificate-details-transfer-token #_toError{margin-bottom:20px; color: red}

#certificate-details #certificate-details-burn-token .row { margin-top:20px }
#certificate-details #certificate-details-burn-token input {width:100%;text-align: center;}

#certificate-details form.auction-form { width: 60%; margin: auto; padding: 20px; }
#certificate-details .bid-amount { width: 100%; }
#certificate-details .btn-bid { width: 100%; }
#certificate-details .btn-immediate-purchase { width: 100%; margin-top: 10px; margin-bottom: 10px; }

#certificate-details #tx-message {margin-top:20px; text-align: center; width: 100%;}
#certificate-details #tx-message p {margin-bottom:20px;}
#certificate-details .tx-success {font-size:40px; text-shadow: #50ff00 1px 0 10px;animation: 1s infinite alternate cubic-bezier(0.89, -0.04, 0.58, 1.24) success; cursor:pointer}
#certificate-details .tx-failed {color:#e61126; font-size:40px; cursor:pointer}

section#certificate-details h2{color:var(--color1); text-align:center; padding-top:20px; padding-bottom: 20px; text-transform: uppercase;}
section#certificate-details .certificate-lastPrice h2{font-size: xxx-large;padding-bottom: 0px;}

section#certificate-details .certified {font-size: 0.5em; color: green;}
section#certificate-details .not_certified {font-size: 0.5em; color: grey;}

section#certificate-details .btn{width:100%; border:1px solid var(--color1); background: var(--colorBtnCertificate);}
section#certificate-details .btn:hover{background: var(--colorHoverBtn); color: black !important;}
section#certificate-details .subtitle{text-align:center}
section#certificate-details-new-auction,
section#certificate-details-bid,
section#certificate-details-release-token,
section#certificate-details-update-owner-data,
section#certificate-details-update-creator-data,
section#certificate-details-burn-token,
section#certificate-details-transfer-token {color:white; padding:15px; border:1px solid #1c1c1c; margin:10px 0 0px 0 }

section#certificate-details-update-owner-data,
section#certificate-details-update-creator-data {border:0; padding:0}

section#certificate-details-bid #message-bid {text-align:center; color:orange; margin-bottom :25px}
section#certificate-details #creatorData, #ownerData {font-family: monospace; font-style: italic; padding:20px; border:white 1px dashed; text-align:center;margin-bottom:20px;}
section#certificate-details #isOnSale {padding:20px; text-align:center}

#certificate-details .help-1 {position: relative; display: inline-block; border-bottom: 1px dotted black;	color:#d3d3d3;cursor:pointer;}
#certificate-details .help-1 .help-1-text {font-size: 12px; visibility: hidden;width: 200px;background-color: #fff;color: #000;text-align: center;border-radius: 6px;padding: 5px;position: absolute;z-index: 1;bottom: 125%;left: 10%;margin-left: -60px; opacity: 0; transition: opacity 0.3s; font-family: sans-serif;}
#certificate-details .help-1 .help-1-text::after {content: "";position: absolute;top: 100%;left: 10%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #fff transparent transparent transparent;}
#certificate-details .help-1:hover .help-1-text {visibility: visible;opacity: 1;}

#certificate-details .help-2 {position: relative; display: inline-block; border-bottom: 1px dotted black;	color:#d3d3d3;cursor:help;}
#certificate-details .help-2 .help-2-text {font-size: 12px; visibility: hidden;width: 200px;background-color: #fff;color: #000;text-align: center;border-radius: 6px;padding: 5px;position: absolute;z-index: 1;bottom: 125%;left: 20%;margin-left: -60px; opacity: 0; transition: opacity 0.3s; font-family: sans-serif;text-transform: none;}
#certificate-details .help-2 .help-2-text::after {content: "";position: absolute;top: 100%;left: 50%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #fff transparent transparent transparent;}
#certificate-details .help-2:hover .help-2-text {visibility: visible;opacity: 1;}

#certificate-details #struct_auction_bidsCount .fa-arrow-circle-up{color:#04db04;transform: rotate(45deg);}

#certificate-details #certificate-contact-owner, #certificate-details #certificate-contact-creator {margin:10px 0 20px 0}

/* wavesurfer - sound wave */
#certificate-details .sound-wave {filter: sepia(1);}
#certificate-details .sound-wave .row {background-color:white; border-radius:20px; padding: 0 10px 0 10px; margin-top:20px}
#certificate-details .sound-wave .icon {justify-content: center; display: flex; align-items: center; color: black; font-size:20px;}
#certificate-details .sound-wave .far {margin:5px;cursor: pointer;}
#certificate-details .sound-wave .far:hover {opacity:0.5}

/* user guide */
#certificate-user-guide {color: white; text-align: center; padding: 20px;background: #212529; border:1px solid var(--color1);margin-bottom: 20px;}
#certificate-user-guide h2{color: var(--color1); font-size:20px; margin-bottom: 20px}
#certificate-user-guide .metamask-icon {height:30px; vertical-align: middle;}
#certificate-user-guide .trust-wallet-icon {height:30px; vertical-align: middle;}
#certificate-user-guide .opera-wallet-icon {height:30px; vertical-align: middle;}
#certificate-user-guide .btn {margin-top:20px;}
#certificate-user-guide #user_eth_address {font-size:15px}

/* Certificat lightbox_image */
.certificate-template-default .mfp-wrap {z-index: 1000001; outline: none!important; -webkit-backface-visibility: hidden;}
.certificate-template-default .mfp-wrap,
.certificate-template-default .mfp-bg {width: 100%; height: 100%; position: fixed;}
.certificate-template-default .mfp-container {background-color: #000000c9;cursor: zoom-out; text-align: center;position: absolute;width: 100%;height: 100%;left: 0;top: 0;padding: 0 8px;box-sizing: border-box;}
.certificate-template-default .mfp-content {position: relative;display: inline-block;vertical-align: middle;margin: 0 auto;text-align: left;z-index: 1045;}
.certificate-template-default .mfp-image-holder .mfp-content {max-width: 100%;}
.certificate-template-default .mfp-auto-cursor .mfp-content{cursor:auto;}
.certificate-template-default .mfp-s-error .mfp-content, .mfp-s-ready .mfp-preloader {display: none;}
.certificate-template-default .mfp-fade.mfp-bg.mfp-ready {opacity:0.9}
.certificate-template-default .mfp-close {display: none}
.certificate-template-default img.mfp-img {filter: drop-shadow(2px 4px 6px white); margin:auto;padding: 0;max-height: 100%!important;}
.certificate-template-default .mfp-figure figure{height: 100vh;display: flex;margin: 0 auto;padding:10% 0 10% 0;}
.mfp-figure:after {background: transparent;box-shadow: none;}

@media only screen and (max-width: 576px) {
    #certificate-details { text-align:center; box-shadow: none; padding:0}
    #certificate-details .certificat-qrcode { position: inherit !important;}
    #certificate-details .certificat-qrcode-bottom { margin-top: 1rem;}
    #certificate-details .certificat-button { margin-top: 2rem;  }
    #certificate-details td th tr {display:inherit; width:100%; text-align: center}
    #certificate-details #display-certificate .with-background {background:#00000;background-image: url() !important;}
    #certificate-details #certificate-details-image-desktop {display:none}
    #certificate-details #display-certificate #image-mobile {display:block;}
    #certificate-details #display-certificate .with-background {height:auto}
    #certificate-details .btn{margin-top:0}
    .bg-certificat {background-color: black !important;}
		.bg-certificat .container {margin: 0; width: 100%;}
    #certificate-details .certificate-image {border: 0px; background: transparent}
    #certificate-details .user-picture-interne {position: inherit;margin: 20px auto 20px auto;}
    #certificate-details #left-side {border:0}
		#certificate-details .certificate-lastPrice {margin: 0px auto 35px auto;}
		#certificate-details #widget {padding-right: 10px;}
		#certificate-details .description-content {text-align: center;}
		#certificate-details .url_link .btn {width:100%}
		#certificate-details .sound-wave .icon {font-size:40px;margin-top: 20px;}
}

@media only screen and (min-width: 641px) and (max-width: 767px) {
    #certificate-details { background-image: none !important; width: 100% !important; padding: 4rem 2rem 7rem 2rem; position:relative; border-radius: 10px; width: 70%; margin: auto;  }
    #certificate-details .certificat-category { padding-left:2rem !important; }
    #certificate-details .certificat-qrcode { position: inherit !important;}
    #certificate-details .certificat-qrcode-bottom { margin-top: 1rem;}
  }
/******* END CERTIFICATE DETAIL *********/

/* CREATE CERTIFICATE FORM USER GUIDE *******************************
certificate_form.twig
*/
#create_certificate_form #add-certificate-image {height: 270px; padding-top: 95px; margin: 15px 0 15px 0;text-align:center;border: 1px dotted white;color:white;cursor: pointer;}
#create_certificate_form #add-certificate-image .fa-image{font-size:50px;cursor: pointer;}
#create_certificate_form #add-certificate-image label{margin-bottom:10px}
#create_certificate_form #add-certificate-image #btn-accept {border:0; border-radius:50%; background: green; color:white}
#create_certificate_form #add-certificate-image #btn-reload{border:0; border-radius:5px; background: #343a40; color:white;cursor: pointer;padding: 8px;}
#create_certificate_form #preview-image {margin: 15px 0 25px 0}
#create_certificate_form #show-preview-image {text-align:center}
#create_certificate_form .btn-cancel{margin-top:20px;}
#create_certificate.btn, #cancel_certificate.btn, #noweb3.btn, #noweb3-mobile.btn, #notconnected.btn, #buy-eth.btn { width: 100%;margin-bottom: 20px; }
#tx_link, #view_certificate{margin-bottom:20px}

.btn-create-certificate{width: 100%;margin-bottom:20px}
.form-overlap { background-color: #d3d3d3; position: absolute; width: 100%; border-radius:5px; height: 100%; opacity: 70%; z-index: 10; transform: scale(1.02); }
.form-overlap2 { background-color: #d3d3d3; position: absolute; width: 100%; border-radius:5px; height: 100%; opacity: 70%; z-index: 10; transform: scale(1.02); }

/* user guide */
#certificate-form-user-guide {color: black; padding: 20px;margin-bottom: 30px; border: 1px solid var(--color1);background-color: white}
#certificate-form-user-guide .metamask-icon {height:30px; vertical-align: middle;}
#certificate-form-user-guide .trust-wallet-icon {height:30px; vertical-align: middle;}
#certificate-form-user-guide .opera-wallet-icon {height:30px; vertical-align: middle;}
#certificate-form-user-guide .btn {margin-top:20px; width:100%}
#certificate-form-user-guide #user_eth_address {font-size:15px}
#certificate-form-user-guide #change-creator-address {margin:25px 0 0 0}
#certificate-form-user-guide #creator_addressError {color:red}
/* END CREATE CERTIFICATE FORM USER GUIDE *******************************/

/* CERTIFICATE THUMBNAIL V2 *******************************
certificate_thumbnail.twig
*/
.thumbnail_V2 .scene {height: 446px; width:100%; perspective: 600px;margin:10px auto 10px auto;}
.thumbnail_V2 .scene:hover .card{transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg); transition: transform 0.5s;}
.thumbnail_V2 .scene  .certified {color: green; font-size:0.5em}
.thumbnail_V2 .scene  .not_certified {color:grey; font-size:0.5em}

.thumbnail_V2 .card {border: 0; border-radius: 10px; width: 100%; height: 100%; transition: transform 0.6s cubic-bezier(0.75, 0, 0.85, 1); transform-style: preserve-3d; cursor: pointer;}
.thumbnail_V2 .card__face {position: absolute;width: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.thumbnail_V2 .card__face--front {z-index: 0; height: 100%; border-radius:10px;background: white;border:1px solid #d2d2d2; box-shadow: rgb(0 0 0 / 45%) 0px 25px 37px 0px;}
.thumbnail_V2 .card__face--back {height: 100%; border-radius:10px; transform: rotateY(180deg); background: white;border:1px solid #d2d2d2; box-shadow: rgb(0 0 0 / 45%) 0px 25px 37px 0px;}
.thumbnail_V2 .card.is-flipped {transform: rotateY(180deg); transition:transform 0.6s cubic-bezier(0.75, 0, 0.85, 1)}
.thumbnail_V2 .card.is-flipped:hover {transform: rotateY(180deg) rotateX(0deg) rotateZ(0deg) !important;}

.thumbnail_V2 .card__face--front .flip-container {padding: 10px; margin: 0.5rem; background:#d3d3d3; border-radius:10px;}
.thumbnail_V2 .card__face--front .avatar-creator {padding: 3px 0 0 0;}
.thumbnail_V2 .card__face--front .footer {font-size:20px; color:white;}
.thumbnail_V2 .card__face--front .portfolio-certificate-image {height: 270px;width: 400px;display: table-cell;vertical-align: middle;}
.thumbnail_V2 .card__face--front .portfolio-certificate-image .no-picture {border-radius: 10px 10px 0 0; height: 270px;width: 400px;display: table-cell;vertical-align: middle;filter: none; background-size: cover; background-color: #000000bd; background-blend-mode: darken; font-size:20px; color: white; }
.thumbnail_V2 .card__face--front .front-footer {padding: 5px 0px 0px 0px; margin: 10px 0 10px 0;border-top: 1px solid black;border-bottom: 1px solid black;}
.thumbnail_V2 .card__face--front .front-footer .avatar-creator img{border-radius:50%; max-height: 45px;margin-top: 3px;}
.thumbnail_V2 .card__face--front .front-footer .certificate-info {text-align:left}
.thumbnail_V2 .card__face--front .portfolio-certificate-price {color:black; width: 50%;text-align: left;padding-left: 20px;font-size: 20px;}
.thumbnail_V2 .card__face--front .portfolio-certificate-price .logo-network img{height:15px}
.thumbnail_V2 .card__face--front .portfolio-certificate-price .price-dollar{font-size: 15px;}
.thumbnail_V2 .card__face--front .portfolio-certificate-image img {max-height: 260px; border-radius: 5px; filter: drop-shadow(2px 4px 6px black); }
.thumbnail_V2 .card__face--front .certificate-info p {height: 25px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.thumbnail_V2 .card__face--front .portfolio-certificate-secret_url {width: 50%;text-align: right;color: var(--color1);padding-right: 20px;padding-top: 25px;}

.thumbnail_V2 .card__face--back .flip-container {padding: 10px; margin: 0.5rem; border-radius:10px;}
.thumbnail_V2 .card__face--back .portfolio-certificate-category {color:white; padding-left:10px; float: left!important; width: 50%; text-align: left; margin-bottom : 20px; font-size: 15px; }
.thumbnail_V2 .card__face--back .portfolio-certificate-like {float: right;  padding-right:10px; width : 20%;  text-align: right;  color:white;height: 25px;}
.thumbnail_V2 .card__face--back .portfolio-certificate-like :hover{color:red; animation:pulse-heart 1s infinite;}
.thumbnail_V2 .card__face--back .title{color:var(--color1); height: 30px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding: 0 10px 0 10px;}
.thumbnail_V2 .card__face--back .portfolio-certificate-content {color:white; height: 235px;margin: 20px 0 20px 0;overflow: hidden;padding: 10px;font-size: 12px;text-align: justify;}
.thumbnail_V2 .card__face--back .btn{margin-bottom:20px !important; width:200px}
.thumbnail_V2 .card__face--back .footer {font-size:10px; color:white;}

/* no certiicates */
.no_certificate_message {width: 100%; margin-bottom: 20px; padding:20px 0 20px 0; background-color: black; border-radius:20px}
.no_certificate_message h3{color:white}

@media screen and (max-width: 414px) {
	.thumbnail_V2 .scene {margin:10px auto 10px auto; height: 445px;}
	.thumbnail_V2 .card__face--front .portfolio-certificate-image img {max-height: 223px;}
	.thumbnail_V2 .card__face--front .portfolio-certificate-image {height: 230px;}
	.thumbnail_V2 .card__face--front .portfolio-certificate-image .no-picture {height: 230px}
	.thumbnail_V2 .card__face--front .front-footer .certificate-info {text-align:center}
	.thumbnail_V2 .card__face--back  .portfolio-certificate-content {height: 235px;}
	.thumbnail_V2 .card__face--back .flip-container {height:426px}
}
/*********** END THUMBNAIL V2 ************/

/* CREATORS THUMBNAIL *******************************
creators.twig
*/
section#creators_thumbnails .background{box-shadow: rgb(0 0 0 / 45%) 0px 25px 37px 0px; border-radius: 20px; width: 90%; height: 130px; margin: auto; background-size: cover;background-color:#000000bd; background-blend-mode: darken;margin:10px; padding: 10px}
section#creators_thumbnails a:hover .background {filter: drop-shadow(2px 4px 6px black) brightness(1.1); transform: scale(1.01); transition: 0.3s}
section#creators_thumbnails a{color:white;}
section#creators_thumbnails .avatar {padding: 20px; display: flex; align-items: center; height: 100%;}
section#creators_thumbnails .avatar img{border-radius:50%; width:100%;border:1px solid var(--color1); background-color: white}
section#creators_thumbnails .creator_info {height: 130px;}
section#creators_thumbnails .company_name {padding-top: 10px; height: 70px;}
section#creators_thumbnails	.creator_eth_address {font-size: 0.8em; color:#9c9c9c;}
section#creators_thumbnails	.creator_certificates_count {font-size: 0.8em; color:#9c9c9c;}
section#creators_thumbnails .certified {color: green; font-size:0.5em}
section#creators_thumbnails .not_certified {color:grey; font-size:0.5em}
section#creators_thumbnails .testimonial {opacity:0; z-index: 1; font-style: italic; font-size: small; background-color: #000000e3; width: 100%; height: 112px; position: relative; top: -130px; border-radius: 20px; padding: 5px; border: 1px solid var(--color1); text-align: center; overflow: hidden; display: grid; align-items: center;}
section#creators_thumbnails a:hover .testimonial {opacity:1; transition:0.3s}

@media screen and (max-width: 414px) {
	section#creators_thumbnails .background {text-align:center; height:auto}
	section#creators_thumbnails .avatar img{width:90px; height: 90px; margin:auto}
	section#creators_thumbnails .testimonial {display:none;}
	section#creators_thumbnails a:hover .testimonial {display:none;}
}
/*********** END CREATORS THUMBNAIL ************/

/* MY COLLECTION *******************************
my_collection.twig
*/
section#MyCollection {text-align:center}
section#MyCollection #user-guide .btn {margin: 20px auto 20px auto;}
section#MyCollection .lrm-login {margin: 20px auto 20px auto;}
section#MyCollection #user-guide #message3 {width:250px; margin-bottom: 20px;}
section#MyCollection #user-guide #message3 img{height: 30px; vertical-align: middle;}
section#MyCollection #user-guide #message4 {margin-bottom: 20px}
section#MyCollection #user-guide #message5 {margin-bottom: 20px}
section#MyCollection #display_my_collection .collection_loading {margin:auto}
section#MyCollection #display_my_collection .collection_empty {margin:auto}
/*********** END MY COLLECTION ************/

/* PAGINATION CERTIFICATE *******************************
*/
.pagination-certificat { color:white; font-weight: 600; text-align: center; margin-top: 30px;}
.pagination-certificat a { display: inline-block; border: solid 2px; border-radius: 50%; width: 30px; height: 30px; text-align: center; margin: .5rem; font-size:11px; }
.pagination-certificat a:hover { background: #cccccc; color: black; }
/* END PAGINATION CERTIFICATE *******************************

/************* A TRIER *******/
