/*********
/* /HTML/style/style2.css
/*********
#08-02-2011 webdev      ajoute 2 class : divInfo div et h5
#24-07-2012 Martyn      SA514 included style for comodo ev agreement
#31-0&-2013	amdev       pas de height tbs_titre: formulaire de commande, produit avec garantie. 
#15-04-2013 Kevin       Ajout style analyse filtre sur confirm commande
#18-10-2013 Kevin       SA1042/846 Amélioration visuel du conseil fitlre pour les commandes
#2013-12-30	virginie	US1566 ajout bouton connexion pki
#2014-02-19 lr          #1769 - Formatting fixes for V2 reissue in EP.
#2014-03-06 Robin       #1175 - Add of Exchange syntax.
#2014-03-24	virginie	soucis affichage IE nouvelle charte
#2014-05-16 vs          #2102 soucis validation css
#2014-07-05 lr          #2263 - Updated to make pages consistent across orders/reissues and EC/EP.
#2014-07-15 lr          #2632 - Added style for email verification message, .msgmel.
#2014-09-18 vs          #2850 - Formulaire dépasse ecran + harmo présentation bis
#2014-09-19 Sfim        #2902   ajout CSS 2FA
#2014-11-28 vs          #3630 - Add zimbra syntax
#2015-05-19 vs          #4905 passer page statut EP en version mobile-friendly
#2015-07-01 Sfim        #5793 - add CSS paiement bouton 
#2015-07-07 lr          #1970 Updated to use import of phpstyles.
#2015-10-28 Sfim        #9551 new certificate option 
#2015-11-24 vs          #14923 - phpstyles.css.php bad include
#2016-02-17 Robin       #15319 - Upgrade offers and assistance pack for Free SSL certificates
#2016-03-02 vs          #19756 - revoir css pack assistance
#2016-03-04 vs          #19783 - page moche à améliorer
#2016-06-29 vs          #20799 - correction of HTML errors on EP
#2016-07-26 vs          #20823 - correction of HTML errors on EP
#2016-08-01 vs          #19954 - Responsive version of copibot
#2016-10-25 vs          #21109 - fieldset display correction
#2016-11-03 mfairfax    #21621 - add a modal window for Open Corporates search API
#2016-11-24 mfairfax    #21859 - Improve the company search on forms (opencorporates API)
#2016-12-22 vs          #21916 - make the graphical chart dynamic 
#2017-04-12 vs          #23284 - CSR BOX in detail CERTS is aligned right
#2017-06-30 sleboeuf    #24126 - Modified the Size of the Input Fields
#2019-12-18 stephane    #15817 - Adding keytool to our CSR creation assistance tool - need add masque5 and ligneJavaKeytool in style.
#2020-03-31 Ryan        #36093 - Improve confirm revocation display
#2020-08-24 Alex        #38859 - Styling for eye tool display 
#2022-07-08 Ryan        #47933 - reissue proof reading page: more alert on CSR differences
***********/

fieldset {border:none;padding:0;margin:0;}
.blocStatus fieldset {padding:10px;}

h3 {
	margin-bottom:0px;
	color:#003366;
	text-align:center;
	}
h4 {
	margin:0px;
	color:#003366;
	text-align:center;
	}
h6 {
	display:inline;
	font-size:9px;
	font-weight:normal;
	}
select {
	font-size:11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding:0px;
	}
        
input[type="text"], p, label, textarea {
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
} 

input[type="text"].dispBlock {
    display: block;
}
 
.tbs_collapse { 
    border-spacing: 0;
    border-collapse: collapse;
}
        
#principale>li {
	margin:0px;
	padding: 0px;
	list-style-type: none;
	font-family: monospace;
	font-size: 12px;
	text-align:left;
	white-space:pre;
	}
#principale>ul {margin-left:30%;}

.alG{text-align:left;}
.alD{text-align:right;}
.alT{
    vertical-align:top;
    padding-top:5px;
}
.alC, .tbs_centre {text-align:center;}

.flD {float: right;}
.flG {float: left;}

.mgD50 {margin-right:50px;}
.mgG30 {margin-left:30px;}
.pd10 {padding:10px;}
.pdL10 {
	padding-right:10px;
	padding-left:10px;
	}
.pdD5 {padding-right:5px;}
.pdD80 {padding-right:80px;}

.w80{width:80px;}
.w420{width:420px;}
.l49{width:49%}
.l80{width:80%}
.l100{width:100%}

.bt1{border-top:1px solid gray;}
.gris{color:#7a7b75;}
.rouge{color:#9F6000;}
.petit {font-size:0.8em;}

.pointeurLien{cursor:pointer}
.nowrap{white-space:nowrap;}

.arrondi{
/*	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;*/
	border-radius: 10px;
	}

.tbs_input {
	background:none;
	border:none;
	font-size:12px;
	color:#003366;
	padding-left:5px;
	}
.tbs_impaire {
	background-color:#E1E2E2;
	color:#003366;
	height: 16px;
	}
.tbs_paire {
	background-color:#F5F8F5;
	color:#003366;
	height: 16px;
	}
 
.tbs_paireText {
	background-color:#F5F8F5;
	height: 16px;
        padding-bottom:10px;
        padding-top:5px;
}
        


.tbs_imgLien{
	display:inline;
	border:none;
	}
.imgLien{
	display: inline;
	border: none;
	margin-left:12px;
	margin-right:12px;
	}
.rouge{
	color:#CC0000;
	font-weight:bold;
	}
.zoneAffCSR{
	padding-left:30px;
	text-align:left;
	}
.tbsBoutonStatut{
	background-color:#999;
	color:#CFF;
	}
.imputAideCSR{
	margin-right:20px;
	}
.texteAide{
	font-size:12px;
	color:#003366;
	padding:10px;
	}
.info, .succes, .alerte, .erreur, .validation { 
	width:450px;
	margin: 10px auto;
	border-radius: 2px;
	padding:15px 10px 15px 50px;
	}

#tbs_principale{
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#003366;
	font-size:11px;
	}
#divAide {
	position:absolute;
	width:90%;
	visibility:hidden;
	background-color:#AFD594;
	border:none;
	border-right:2px solid black;
	border-bottom:2px solid black;
	padding:5px;
	}
#dcssi{
	float: left;
	width: 600px;
	position: fixed;
	top: 20%;
	left: 50%;
	margin: 0 0 0 -350px;
	z-index: 100;
	background-color:#AFD594;
	border:1px solid black;
	padding:50px;
	visibility:visible;
	}
#assistance{
	height: 40px;
	font-size:12px;
	color:#003366;
	font-weight:bold;
	padding:10px;
	}
#masque, #masque2, #masque3, #masque4, #masque5, #masque6 {
	display:none;
	}
#outilCSR{
	white-space: nowrap;
	}
#ligneOpenSSL, #ligneExchange2007, #ligneExchange2010, #ligneZimbra, #ligneJavaKeytool, #ligneSkypeLync {
	margin:20px;
	font-family:monospace;
	font-size:12px;
	text-align:center;
	}
       
#choixBureau{
	margin:auto;
	width: 80%;
	}
#comodoEVAgreement{
	width: 80%;
	height: 500px;
}

#passwordReveal {
    position: relative;
    right: 25px;
    top: 3px;
    cursor: pointer;
}

.loginForm input[type="text"], .loginForm input[type="password"]{
width: 100px;
height: 15px;
}

.urg1, .urg2, .urg3 {
	border-radius:10px;width:10px; height:10px;float:left;margin:3px;margin-top:5px;
}
.urg1_tab, .urg2_tab, .urg3_tab {
	border-radius:10px;width:50px; height:10px;margin-left:auto;margin-right:auto;
}
.urg1_tab {
	background-color:#95be0c;
}
.urg2_tab {
	background-color:#e5a304;
}
.urg3_tab {
	background-color:#b8332a;
}
.urg1 {
	background-color:#95be0c;
}
.urg2 {
	background-color:#e5a304;
}
.urg3 {
	background-color:#b8332a;
}
.titre_filtre{
	font-weight:bold;line-height:20px;color:#95be0c;font-family:Arial Black;font-size:16px;letter-spacing:-2px;font-style:italic; text-align:center;
}
.filtre {
	border:1px solid #95be0c; border-radius:20px;padding:20px;text-align:center;color:#666;margin:20px 20px 20px 20px;
}
.filtre p {
	color:#666;padding:15px;
}
.filtre table {
	border:1px solid #666;
}
.filtre table th{
	border-bottom:1px solid #666;
}
.divCachee {
    position: absolute;
    visibility: hidden;
    padding: 3px;
    background-color: rgb(255, 240, 245);
    border: 1px solid black;
}

#docCSR {
    font-size: 11px;
}

.msgmel {
    text-align: left;
    padding-left: 10px;
}

#clesecrete,#QR,#codesecret{text-align:center;background-color:#f5dda2;padding:10px;border-top:1px solid #e5a304;color:#666;margin:15px auto;width:204px}
#clesecrete:after,#QR:after{content:"";position:relative;top:17px;left:50%;margin-left:-7px;border-width:7px 7px 0;border-style:solid;border-color:#f5dda2 transparent;display:block;width:0px}
#QR img{width:180px}
#QRcode{height:180px;width:180px;margin:auto}


.blocStatus .MoyensPaiement {width:100%;padding:10px 0; text-align:center;}


.blocStatus .paiement {height:30px; width:30px; border-radius:40px;padding:0;transition: width 2s;overflow:hidden;float:left;margin:auto;margin:0 5px;box-shadow:none}
.paiement input {background-color:transparent;border:none;color:#fff; text-align:right; font-weight:bold; cursor:pointer;text-indent:40px;transition: width 2s;width:0px;height:30px}

.paiement:hover input {width:100%;transition: width 2s;}
.paiement:hover {width:40%;border-radius:5px;transition: width 2s;padding-right:10px; box-shadow: 3px 3px 6px rgba(0, 0, 0, .5);}

.sha {font-size:10px;text-align:center;margin:20px auto;padding:0;overflow:hidden;display:table;}
.sha ul {margin:0; padding:0;list-style:none;}
.sha li {float:left;width:150px;list-style:none;margin-right:20px;padding:0;color:#fff;background-color:#98bf0e;}
.sha li ul li {border-top:1px solid #000;color:#666;background-color:#F5F8F5}

.sha li ul li ul {padding:0;list-style:none;border:0;display:table; margin : 0px auto;}
.sha li ul li ul li {float:left;width:50px;list-style:none;padding:0;color:#666;margin-right:0;}
.sha li ul li ul li ul li {float:none;}

.propo {width:166px; overflow: hidden; float:left;margin-left:17px}
  .propo div:first-child, .propo div:nth-child(3), .continuer, .e4, .e3, .e1 {background:url(/php/ecom/images/SpriteUpgrade.png);}
  .propo div:nth-child(3) {font-family:Cantarell;color:#fff;text-align:center; text-indent: 20px; line-height:24px}
  .propo div:first-child {height:132px; color:#fff; font-family:Cantarell;text-align:center; font-size:23px; font-weight:bold;line-height:18px;text-shadow:1px 1px 2px #333;letter-spacing:-2px;display:table-cell;vertical-align: middle;position: relative}
  
  .propo div:nth-child(3) {height:24px; margin-top:10px;}
  .ass div:first-child {background-position: 0 0}
  .ass div:nth-child(3) {background-position: 0 -132px}
  .dv div:first-child {background-position: 166px 0}
  .dv div:nth-child(3) {background-position: 166px -132px}
  .ov div:first-child {background-position: 166px -156px}
  .ov div:nth-child(3) {background-position: 166px -288px}
  .ev div:first-child {background-position: 0 -156px}
  .ev div:nth-child(3) {background-position: 0 -288px}
  .propo hr {color:#fff;width:138px;border-top:1px solid #e1e3e2;border-left:none}
  .propo div:nth-child(even) {margin:10px 2px;width:158px;position: relative;background: #fff;border: 1px solid #e1e3e2;border-radius:5px; padding:7px 2px;text-align:center;}
  .propo div:nth-child(even):after, .propo div:nth-child(even):before {bottom: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}

  .propo div:nth-child(even):after {border-color: rgba(255, 255, 255, 0);border-bottom-color: #fff;border-width: 8px;margin-left: -8px;}
  .propo div:nth-child(even):before {border-color: rgba(225, 227, 226, 0);border-bottom-color: #e1e3e2;border-width: 9px;margin-left: -9px;}
  
.extv {color:#92BC06;font-weight:bold}
.ass div:nth-child(2) span {line-height:26px}
.ass div:nth-child(4) {color:#996a9c;text-align: left; display:none;z-index:10}
.ass div:nth-child(3):hover > .ass div:nth-child(4) {display:block}
.propo div a, .propo div a:hover {color: #fff; text-decoration: none;}
#principale .continuer {height:24px;background-position: 0 -312px;line-height:24px;color:#666;background-repeat: no-repeat; 
           text-indent:40px;background-color:#D0D0D0; border-top-left-radius: 30px;border-bottom-left-radius: 30px;
           border-top-right-radius: 10px;border-bottom-right-radius: 10px;min-width:550px; border: none;
           position:absolute; bottom:60px; left:50%;margin-left:-275px;font-size:12px}
.propo div:first-child .e4, .propo div:first-child .e3, .propo div:first-child .e1 {height:10px;width:46px; position:absolute;left:50%; margin-left:-23px; margin-top: 3px}
.propo div:first-child .e4 {background-position: 0 -336px;}
.propo div:first-child .e3 {background-position: -12px -336px;}
.propo div:first-child .e1 {background-position: -36px -336px;}

#principale .upt1 {margin-left: 80px; text-transform: uppercase; font-weight: 500; font-size: 18px; line-height: 20px}
#principale .upt2 {margin-left: 100px; margin-bottom: 20px; text-transform: uppercase; font-weight: 500; color:#92BC06; font-size: 18px; line-height: 20px}

.refus, .propoCB, .accept {width:100%;text-align:left;margin:40px 0 0 0;font-family:Impact;text-transform:uppercase;font-size:20px;}
.refus {color:#D5392C;border-bottom:1px solid #D5392C}
.propoCB {color:#396BC6;border-bottom:1px solid #396BC6}
.accept {color:#94BE08;border-bottom:1px solid #94BE08}
.txt {margin:10px 0}
.txt a {font-size:12px;font-family:Arial;margin-bottom:40px;display:block;color:#396BC6;}

.logo_pibot {width:30%;}
.logo_pibot2 {display:none}
.logo_pibot img {padding:10px;border:1px solid #E1E3E2;width:calc(100% - 20px)}
.copibot {border:1px solid #E1E3E2;width:75%;float:right;margin-top:-40px;z-index:10;position:relative;background-color:#fff;}
.check {float:right;margin-top:-180px;width:calc(70% - 60px);font-family:Cantarell;padding:30px;text-align:center}
.verif {margin-top:-240px;}

.copibot td {padding:10px 0}
.copibot td table td {padding:5px 10px}
.copibot td table {background-color:#E1E3E2;position:relative}
.copibot td table h2 {text-align:center;font-style:normal;text-transform:uppercase;color:#666;font-family:Cantarell}
#principale  h2:first-of-type {margin-top:30px}
.copibot hr {margin:10px auto 0;padding:0;color:#fff;width:80%}

.fermdetails {line-height:14px;position:absolute;right:7px;top:7px;text-decoration:none;font-family:Cantarell;font-weight:bold;background-color:#fff;border-radius:50px;width:16px;height:15px;display:block;text-align:center;border:1px solid #999}

.pibot {background-color:#F4F4F4;padding:15px 0;margin-bottom:20px}
h2.hpib {background-color:#000;font-family:Cantarell;color:#fff;font-style: normal;text-align: center;padding:5px 0 2px;;margin:0;border-top:1px solid #fff}
h2.hpib a {color:#fff;display:inline;float:right;margin-right:5px;text-decoration: none}
h3.hpib {background-color:#e1e2e3;font-family:Cantarell;color:#666;font-style: normal;text-align: left;margin:0 30px;font-weight: normal;font-size: 12px;padding: 0 20px}
.pibottable, .tablepibot, .tablepib  {width:80%;margin-bottom: 20px}
.pibottable td {width:50%;background-color:#fff;color:#666;word-wrap: break-word;}

.pibottable {table-layout: fixed;}
.pibottable td:first-child:not([colspan="2"]), 
.tablepibot td{background-color:#98bf0e;color:#fff;}
.tablepibot td:first-child, .tablepib td {background-color:#fff;color:#666}
.tablepib a {color:#3367C6;text-decoration: none}
.respibot {border:1px solid #E1E3e2;margin:10px auto}
.respibot td {width:172px; height:31px;margin:5px}

.DCVSymInfo {margin:15px; padding: 15px; }  
.FicheProduit {background-color:#7CAED0;height:22px;width:22px;display:block;margin: 0 auto;position:relative;border-radius:2px}
.FicheProduit:after {background: url(/php/ecom/images/acrobat.svg) center center no-repeat;height: 18px;width:18px;filter: grayscale(100%) brightness(5);content: ""; position: absolute;right:2px;top:2px} 

.revokeTbl {border-collapse:collapse; width:60%; margin:25px auto;}
.revokeTbl td {padding:5px; width:50%;}

.gestionDCVtbl {
	width: 95%;
	margin: 10px auto;
}

.gestionDCVtblControl {
	background-color: #5f5f5f;
	padding: 10px;
	color: white;
	text-align: left;
}

.gestionDCVtblInfo { 
	background-color: #fff;
	color: #666;
}