Protonmail Theme [Black/Red]

OP 03 May, 2019 - 05:28 PM
Code:
@charset "UTF-8";

:root{

   --theme1:#ff0000;

   --theme2:#fefefe;

   --theme3:#000000;

   --theme4:#4e3636;

   --theme5:#912f2f;

   --theme6:#ff00009f;

   --theme7:#252323;

   --red:#cc9393;

   --red-light:#ec6446;

   --fullred:#ff0000;

   --fullred-light:#e93b3b;

   --reddish:#8b4444;

   --reddish-light:#bc7070;

   --redandblue:#622188;

   --redandblue-light:#d689bd;

   --white:#FFF;

   --black:#000;

   --redbox:#ff0000

}

#exiting{

   background-color:var(--theme3);

   color:var(--theme2)

}

#exiting .spinner.large .spinner1,#exiting .spinner.large .spinner2,#exiting .spinner.large .spinner3{

   background-color:var(--theme1)

}

.spinner.large .spinner1,.spinner.large .spinner2,.spinner.large .spinner3{

   background-color:var(--theme3)

}

.spinner1,.spinner2,.spinner3{

   background-color:var(--theme1)

}

.proton-embedded:after{

   background:url(/assets/img/icons/broken-img.png) 5px 50% no-repeat var(--theme3);

   border-color:var(--theme2) var(--theme4) var(--theme4) var(--theme2)

}

html.protonmail body{

   background:var(--theme2)

}

html.protonmail body.blank,html.protonmail body.secure{

   background:var(--theme3)

}

html.protonmail .visionary{

   color:var(--theme3)

}

html.protonmail .plus{

   color:var(--theme3)

}

html.protonmail .text-gray{

   color:var(--theme2)

}

html.protonmail .text-light-gray{

   color:var(--theme4)

}

html.protonmail .text-reddish{

   color:var(--reddish)

}

html.protonmail .text-yellow{

   color:var(--fullred)

}

html.protonmail .text-red{

   color:var(--red)

}

html.protonmail .text-purple{

   color:var(--theme1)!important

}

html.protonmail .border-panel{

   border:1px solid var(--theme4)

}

header#pm_header{

   background:var(--theme2)

}

header#pm_header .newBugReport-container,header#pm_header a{

   color:var(--theme3)

}

header#pm_headerDesktop,header.headerDesktop-container{

   background:var(--theme3)

}

header#pm_headerDesktop a.logo,header .headerDesktop-logo.logo,.headerSecuredDesktop-logo{

   color:var(--theme1);

   background-color:var(--theme3)

}

header#pm_headerDesktop a.logo img,header .headerDesktop-logo.logo img,.headerSecuredDesktop-logo::before{

   webkit-filter:grayscale(100%) brightness(50%);

   filter:grayscale(100%) brightness(50%)

}

header#pm_headerDesktop ul.navigation>li:hover,header.headerDesktop-container ul.navigation>li:hover{

   border-color:var(--theme1)!important

}

header#pm_headerDesktop ul.navigation>li.active,header.headerDesktop-container ul.navigation>li.active{

   border-color:var(--theme1)!important

}

header#pm_headerDesktop ul.navigation>li>a,header.headerDesktop-container ul.navigation>li>a{

   color:var(--theme2)

}

header#pm_headerDesktop .navigation .navigationUser-dropdown{

   color:var(--theme2)

}

header#pm_headerDesktop.no-auth{

   background:var(--theme2)

}

header#pm_headerDesktop.no-auth a{

   color:var(--theme3)

}

header#pm_header-tablet{

   background:var(--theme5)

}

header#pm_header-tablet .compose{

   background-color:var(--theme1);

   color:var(--theme3)

}

header#pm_header-tablet .compose:hover{

   background-color:var(--theme6)

}

header#pm_header-tablet .compose:active{

   background-color:var(--theme5)

}

header#pm_header-tablet a.logoMobile{

   color:var(--theme3)

}

header#pm_header-tablet .location{

   color:var(--theme3)

}

header#pm_header-mobile{

   background:var(--theme5)

}

header#pm_header-mobile a.compose,header#pm_header-mobile a.compose:hover{

   background:var(--theme5)

}

header#pm_header-mobile a.logoMobile{

   color:var(--theme3)

}

header#pm_header-mobile .searchBtn,header#pm_header-mobile a.compose{

   color:var(--theme3)

}

header#pm_header-mobile .location{

   color:var(--theme3)

}

.headerBlock-container{

   border-bottom:1px solid var(--theme4)

}

#attachmentArea{

   background:var(--theme3);

   border-top:1px solid var(--theme4)

}

#attachmentArea header .embedded{

   color:var(--theme1)

}

body section.sidebar{

   background:var(--theme3)

}

.sidebarApp-container .sidebar-btn-back{

   border:1px solid var(--theme5)!important;

   color:var(--theme5)!important

}

.sidebarApp-container .sidebar-btn-back:hover{

   background:var(--theme1)!important;

   color:var(--theme3)!important

}

.sidebarApp-container .sidebar-btn-compose{

   background:var(--theme1)!important;

   border-color:var(--theme1)!important;

   color:var(--theme2)!important

}

.sidebarApp-container .sidebar-btn-compose:hover{

   background-color:var(--theme6)!important;

   border-color:transparent!important;

   color:var(--theme2)!important

}

.sidebarApp-item .navigationItem-item,.sidebarApp-item .sidebarApp-link,.sidebarApp-menu .menuLabel-link{

   color:var(--theme3)

}

.sidebarApp-item .navigationItem-icon,.sidebarApp-item .sidebarApp-icon,.sidebarApp-menu .menuLabel-icon,.sidebarApp-icon .donateBtn-icon{

   color:var(--theme4)

}

body section.sidebar ul.menu li button{

   color:var(--theme2)

}

body section.sidebar ul.menu li button:hover{

   color:var(--theme1)

}

body section.sidebar ul.menu li button i.fa{

   color:var(--theme2)

}

body section.sidebar ul.menu li a{

   color:var(--theme2)

}

body section.sidebar ul.menu li a:hover{

   color:var(--theme1)

}

body section.sidebar ul.menu li a em{

   color:var(--theme5)

}

body section.sidebar ul.menu li a i.fa{

   color:var(--theme2)

}

body section.sidebar ul.menu li a .fa-repeat{

   color:var(--theme6)

}

body section.sidebar ul.menu li a .fa-repeat:hover{

   color:var(--theme1)

}

body section.sidebar ul.menu li.active a{

   color:var(--theme2)

}

body section.sidebar ul.menu li.active a:hover{

   color:var(--theme1)

}

body section.sidebar ul.menu li.active a i.fa{

   color:var(--theme6)

}

body section.sidebar div.labels ul li.active a,.menuLabel-item.active .menuLabel-title{

   color:var(--theme2);

   font-weight:700

}

body section.sidebar div.labels ul li a:hover{

   color:var(--theme3)

}

body section.sidebar div.footer div.link a{

   color:var(--theme1)

}

body section.sidebar div.footer div.link a:hover{

   color:var(--theme2)

}

.sidebarApp-container .footer div.storage strong{

   color:var(--theme1)

}

body section.sidebar div.footer a.upgrade{

   color:var(--theme1)

}

body section.sidebar div.footer .bar em{

   background-color:var(--theme1)

}

body section.sidebar div.footer .bar{

   background-color:var(--theme4)

}

.sidebarApp-container .version{

   color:var(--theme1)!important

}

.sidebarApp-container .version:hover{

   color:var(--theme2)!important

}

.sidebarApp-container .footer .storageBar{

   background-color:var(--theme4)!important

}

.storageBar .storageBar-progress{

   background-color:var(--theme1)!important

}

body section.sidebar div.labels ul li a{

   color:var(--theme2)!important

}

body section.sidebar div.labels ul li a:hover{

   color:var(--theme1)!important

}

body section.sidebar div.labels ul li a em{

   color:var(--theme2)!important

}

body.mobileMode #pm_sidebar section.sidebar{

   background:var(--theme2)!important

}

body.mobileMode #pm_sidebar section.sidebar .pm_button.round .fa{

   color:var(--theme3)!important

}

body.mobileMode #pm_sidebar section.sidebar .userDisplay em,body.mobileMode #pm_sidebar section.sidebar .userDisplay strong{

   color:var(--theme3)!important

}

body.mobileMode #pm_sidebar section.sidebar ul.menu li button{

   color:var(--theme3)!important

}

.pm_toolbar{

   box-shadow:inset 0 -1px 0 var(--theme4)!important

}

#conversation-view .fa-star{

   color:var(--fullred)!important

}

#conversation-view header{

   border-bottom:0 solid var(--theme4)!important

}

#conversation-view header h1{

   color:var(--white)!important

}

#conversation-view .message{

   border:1px solid var(--theme4)!important

}

#conversation-view .message .contact a.compose{

   color:var(--theme1)!important

}

#conversation-view .message .details{

   background:var(--theme3)!important

}

#conversation-view .message .message-contact-sender{

   color:var(--theme5)!important

}

#conversation-view .message.marked .details,#conversation-view .message.marked .summary{

   box-shadow:inset 5px 0 0 var(--theme1)!important

}

#conversation-view .message.details.open .labelz .pm_labels label{

   box-shadow:.25rem 0 0 .25rem var(--theme3)!important

}

#conversation-view .message.unread>div.summary{

   background:var(--theme3)!important

}

#conversation-view .message.unread:not(.open) .summary .labels,#conversation-view .message.unread:not(.open) .summary .status,#conversation-view .message.unread:not(.open) .summary .time{

   background:var(--theme3)!important

}

#conversation-view .message.unread>div.summary .labels .pm_labels label{

   box-shadow:.25rem 0 0 .25rem var(--theme3)!important

}

#conversation-view .message>div.summary{

   background:var(--theme3)!important

}

#conversation-view .message>div.summary .summary-right{

   background:transparent!important

}

#conversation-view .message .summary .labels,#conversation-view .message .summary .location.folders,#conversation-view .message .summary .message-attachments,#conversation-view .message .summary .status,#conversation-view .message .summary .time{

   background:var(--theme3)!important

}

#conversation-view .message>div.summary .time::after{

   background:-moz-linear-gradient(left,rgba(255,255,255,0) 0,var(--theme3) 100%)!important;

   background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,var(--theme3) 100%)!important;

   background:linear-gradient(to right,rgba(255,255,255,0) 0,var(--theme3) 100%)!important

}

#conversation-view .message>div.summary .meta .contact span{

   color:var(--theme4)!important

}

#conversation-view .message>div.summary .labels .pm_labels label{

   box-shadow:.25rem 0 0 .25rem var(--theme3)!important

}

#conversation-view .message>div.details{

   background:var(--theme3)!important

}

#conversation-view .message>div.details .pm_buttons a{

   background:var(--theme3)!important

}

#conversation-view .message>div.details .recipients-details .from,#conversation-view .message>div.details .recipients-details .where{

   color:var(--theme4)!important

}

#conversation-view .message>div.details .recipients-details .contact em{

   color:var(--theme4)!important

}

#conversation-view .message>div.details .recipients-summary strong{

   color:var(--theme4)!important

}

#conversation-view .message>div.details .recipients-summary .from{

   color:var(--theme4)!important

}

#conversation-view .message .toggleDetails{

   color:var(--theme1)!important

}

#conversation-view .message .expiration{

   background:var(--red-light)!important;

   color:var(--theme3)!important

}

#conversation-view .message .showImages{

   background:var(--theme3)!important;

   color:var(--theme1)!important;

   border-top:1px solid var(--theme4)!important

}

#conversation-view .message .frame{

   color:var(--redbox)!important;

   background-color:var(--black)!important;

   border-top:1px solid var(--theme4)!important

}

#conversation-view .message .frame .email .pm_button.more{

   background:var(--theme3)!important

}

body.mobileMode #conversation-view .message>div.summary .time{

   background:var(--theme3)!important

}

body#eo-unlock,body#login-unlock,body#reset{

   background:var(--theme2)!important

}

body.mobileMode #conversation-view .message.details>div.summary .meta .contact em{

   color:var(--theme4)!important

}

#pm_placeholder{

   color:var(--theme4);

   padding-top:40%;

   text-transform:uppercase

}

#nothingToSeeHere .fa{

   color:var(--theme4)

}

#nothingToSeeHere span{

   color:var(--theme4)

}

#nothingToSeeHere h3{

   color:var(--theme4)

}

#pm_conversations .meta .fa-star-o,#pm_conversations .meta .singleStar,#pm_conversations article>header .fa-lock,#pm_conversations article>header .fa-paperclip,#pm_conversations header .loc,#pm_rows .meta .fa-star-o,#pm_rows .meta .singleStar,#pm_rows article>header .fa-lock,#pm_rows article>header .fa-paperclip,#pm_rows header .loc{

   color:var(--white)

}

body#reset .alert{

   color:var(--white)

}

#pm_footer{

   color:var(--theme3)

}

#pm_footer a{

   color:var(--theme3)

}

#pm_footer a:hover{

   color:var(--theme4)

}

#pm_footer.static{

   color:var(--theme2)

}

#pm_footer.static a{

   color:var(--theme2)

}

#pm_footer.static a:hover{

   color:var(--white)

}

#pm_composer .composer .meta input{

   background:var(--theme7)!important

}

#pm_composer .composer .fill{

   color:var(--black);

   background:var(--white)

}

#pm_composer .composer{

   background:var(--theme3)

}

.addFilePopover-panel,.addLinkPopover-panel,.addLinkPopover-footer,.addFilePopover-footer{

   background:var(--theme7)!important

}

.addLinkPopover-field .addLinkPopover-label,.addFilePopover-field .addFilePopover-label{

   color:var(--theme2)!important

}

.addLinkPopover-field .addLinkPopover-input,.addFilePopover-field .addFilePopover-input-url{

   border:1px solid var(--theme4)!important;

   color:var(--theme2)!important;

   background:var(--theme7)!important;

   box-shadow:inset 0 0 0 1px var(--theme1)!important

}

.composerTime-container{

   color:var(--theme5)!important

}

#pm_composer .composer .askEmbedding{

   background:var(--theme3);

   color:var(--theme2)

}

#pm_composer .composer .attachmentBar i.embedded,#pm_composer .composer .options .fa{

   color:var(--theme1)

}

#pm_composer .composer .askEmbedding ul{

   background:var(--theme3);

   border:1px solid rgba(0,0,0,.2)

}

.composerOptions-container{

   background:var(--theme3)

}

#pm_composer .composer .options footer{

   background:var(--theme3)

}

#pm_composer .composer .attachmentBar{

   border-top:1px solid var(--theme4);

   background:var(--theme3)

}

#pm_composer .composer .previews{

   background:var(--theme3)

}

#pm_composer .composer .previews .preview-close{

   color:var(--theme2)

}

#pm_composer .composer .previews .attachment .fa.embedded{

   color:var(--theme1)

}

#pm_composer .composer .previews .pm_button{

   background:var(--theme3)

}

#pm_composer .composer.attachmentsOpen .attachmentBar{

   box-shadow:0 1px 0 var(--theme4)

}

#pm_composer .composer.attachmentsOpen .attachmentArea .pm_button{

   color:var(--theme2)

}

#pm_composer .composer.attachmentsOpen .attachmentArea .pm_button.uploading{

   background:var(--theme4)

}

#pm_composer .composer header{

   background:var(--theme6);

   color:var(--theme2)

}

#pm_composer .composer header.composerEncrypt-header,#pm_composer .composer header.composerExpiration-header{

   background:0;

   color:var(--theme2)

}

#pm_composer .composer header .actions .pm_button{

   color:var(--theme3)!important;

   border:none!important

}

#pm_composer .composer header .actions .pm_button:hover{

   color:var(--theme2)!important

}

#pm_composer .composer .pm_button.link{

   border:none!important

}

#pm_composer .composer .row{

   border-bottom:1px solid var(--theme6)!important

}

#pm_composer .composer .row.placeholder div{

   color:var(--theme2)

}

#pm_composer .composer input,#pm_composer .composer select{

   color:var(--theme2)!important

}

#pm_composer .composer select option{

   color:var(--theme2)!important;

   background-color:var(--theme3)!important

}

#pm_composer .composer .meta{

   color:var(--theme1)!important;

   background:var(--theme7)!important

}

#pm_composer .composer footer{

   background:var(--theme7)!important;

   border-top:1px solid var(--theme4)!important

}

#pm_composer .composer footer .pm_button{

   background:var(--theme3)!important

}

#pm_composer .composer footer .pm_button:hover{

   background-color:var(--theme7)!important;

   color:var(--theme2)!important

}

#pm_composer .composer footer .pm_button.primary{

   background:var(--theme1)!important

}

#pm_composer .composer footer .pm_button.primary:hover{

   background-color:var(--theme6)!important;

   color:var(--theme2)!important

}

#pm_composer .composer footer .pm_button.disabled{

   background:var(--white)!important

}

#pm_composer .composer ::-webkit-input-placeholder{

   color:var(--theme4)

}

#pm_composer .composer :-moz-placeholder{

   color:var(--theme4)

}

#pm_composer .composer ::-moz-placeholder{

   color:var(--theme4)

}

#pm_composer .composer :-ms-input-placeholder{

   color:var(--theme4)

}

.colorPopover-container .colorPopover-panel .colorPopover-select .colorList-list .colorList-btn-choose{

   color:inherit!important;

   background-color:inherit!important;

   border:unset!important

}

.squireToolbar-container{

   background-color:var(--theme1)!important

}

.squireToolbar-container .squire-toolbar,[class*="squireToolbar-row"]{

   background-color:var(--theme7)!important

}

[class*=squireToolbar-action-]+.squireToolbar-separator{

   border-left:1px solid var(--theme4)!important

}

.squire-popover{

   background:var(--theme3)!important;

   border:1px solid var(--theme4)!important

}

.squire-popover input{

   border:1px solid var(--theme3)!important;

   color:var(--theme2)!important

}

.squire-popover button,.squireToolbar-container button{

   background-color:var(--theme1)!important;

   color:var(--theme3)!important

}

.squireToolbar-select .squireToolbar-select-view{

   background-color:var(--theme1)!important;

   color:var(--theme3)!important;

   border:1px solid var(--theme4)!important

}

.squireToolbar-select .squireToolbar-select-view .squireDropdown-item-label{

   border:none!important;

   background-color:var(--theme1)!important;

   color:var(--theme3)!important

}

#pm_settings .well{

   border:1px solid var(--theme4)

}

#pm_settings .editor-container,#pm_settings .usage{

   background:var(--theme7)

}

#pm_settings .usage .total,#pm_settings .usage .used{

   color:var(--theme4);

   background:var(--theme3)

}

#pm_settings .usage .bar{

   background:var(--theme3)

}

#pm_settings .usage .bar .amount{

   background:var(--theme1)

}

#pm_settings .pm_tabs{

   background:var(--theme3)

}

#pm_settings .pm_tabs li a.pm_button{

   background-color:var(--theme6);

   border-color:var(--theme5);

   color:var(--theme3);

   border-bottom:1px solid var(--theme5)

}

#pm_settings .pm_tabs li a.pm_button:hover{

   background:var(--theme3);

   color:var(--theme1)

}

#pm_settings .pm_tabs li.active a.pm_button{

   background:var(--theme3);

   color:var(--theme2);

   border-bottom-color:var(--theme3)

}

#pm_settings .pm_tabs li.active a.pm_button:hover{

   color:var(--theme1)

}

#pm_settings .pm_tabs li:last-child a{

   border-right:1px solid var(--theme5)

}

#pm_settings .settings .angular-squire-wrapper{

   background:var(--white);

   border:1px solid var(--theme4);

   box-shadow:inset 0 2px 5px rgba(0,0,0,.15)

}

#pm_settings .settings #keys-addressTable td .fa-times-circle{

   color:var(--red)

}

#pm_settings .settings #keys-addressTable td .fa-check{

   color:var(--theme2)

}

.addressKeysView-container .addressKeysView-toggle .pm_button,.addressKeysView-container table tr td .pm_buttons,.addressKeysView-container table tr td .pm_button{

   border:none!important

}

#pm_settings .settings .row .border-bottom{

   border-bottom:1px solid var(--theme4)

}

#pm_settings .settings .row .setting .as-sortable-placeholder{

   background:var(--theme4)!important

}

#pm_settings .settings .row .setting .as-sortable-dragging{

   border:1px solid var(--theme4);

   background:var(--theme3)

}

#pm_settings .settings .row .setting .as-sortable-dragging .fa-check{

   background:var(--theme3);

   color:var(--theme1)

}

#pm_settings .settings .row .setting .angular-squire-wrapper iframe{

   border:1px solid var(--theme4)

}

body.mobileMode #pm_settings .settings .pm_sort ul{

   border-right:1rem solid var(--theme4)

}

body.mobileMode #pm_settings .pm_tabs{

   background:var(--theme3)

}

body.mobileMode #pm_settings .pm_tabs>li>a.pm_button{

   color:var(--theme5);

   border:1px solid var(--theme4)

}

body.mobileMode #pm_settings .pm_tabs>li>a.pm_button:hover{

   background-color:var(--theme3)

}

body.mobileMode #pm_settings .pm_tabs>li>a.pm_button:active,body.mobileMode #pm_settings .pm_tabs>li>a.pm_button:focus{

   background-color:var(--theme4)

}

body.mobileMode #pm_settings .pm_tabs>li.active>a.pm_button{

   background-color:var(--theme1);

   border-color:var(--theme1);

   color:var(--theme3)

}

body.mobileMode #pm_settings .pm_tabs>li.active>a.pm_button:hover{

   background-color:var(--theme6);

   border-color:var(--theme6)

}

body.mobileMode #pm_settings .pm_tabs>li.active>a.pm_button:active,body.mobileMode #pm_settings .pm_tabs>li.active>a.pm_button:focus{

   background-color:var(--theme5);

   border-color:var(--theme5)

}

body.mobileMode #pm_settings .settings table.pm_table tr{

   border:1px solid var(--theme4)

}

body.mobileMode #pm_settings .settings table.pm_table tr td{

   border-bottom:1px solid var(--theme4)

}

#paymentsModal .disabled input,#paymentsModal .disabled select{

   background-color:var(--theme3)

}

body.mobileMode #invoicesList li{

   border:1px solid var(--theme4)

}

body.mobileMode #invoicesList li p{

   border-bottom:1px solid var(--theme4)

}

body.mobileMode #invoicesList li p.title{

   background:var(--theme3)

}

#login-setup #pm_footer{

   color:var(--theme2)

}

#login-setup #pm_footer a{

   color:var(--theme2)

}

#login-setup #pm_footer a:hover{

   color:var(--white)

}

#login-setup .spinner.large .spinner1,#login-setup .spinner.large .spinner2,#login-setup .spinner.large .spinner3{

   background-color:var(--theme1)

}

#login-setup .wrapper label em.num{

   background-color:var(--theme3)

}

#login-setup .wrapper label span{

   color:var(--theme2)

}

#signup .spinner.large .spinner1,#signup .spinner.large .spinner2,#signup .spinner.large .spinner3{

   background-color:var(--theme1)

}

#signup .titleLabel em.num{

   background-color:var(--theme3)

}

#signup .titleLabel span{

   color:var(--theme2)

}

.ua-ie #pm_composer .composer{

   border:1px solid var(--theme4)

}

html.protonmail body.light{

   background-color:var(--theme3)

}

body#eo-message,body#eo-reply{

   background:var(--theme2)

}

body#eo-reply ul.infos{

   color:var(--theme2)

}

body#eo-reply ul.infos b,body#eo-reply ul.infos em{

   color:var(--theme1)

}

body#eo-reply #message-body .squire-toolbar{

   border-top:1px solid var(--theme4);

   border-bottom:1px solid var(--theme4)

}

body#eo-reply footer{

   border-top:1px solid var(--theme4)

}

.outside #expirationMessage{

   background-color:var(--red-light);

   color:var(--theme3)

}

.outside #outsideMessageWrap{

   background-color:var(--theme3)

}

.outside #attachmentArea{

   border-top:1px solid var(--theme4)

}

.outside .display-embedded,.outside .display-image{

   background:var(--theme3);

   border:1px solid var(--theme4)

}

.outside .display-embedded a,.outside .display-image a{

   color:var(--theme1);

   background-color:var(--theme3)!important

}

.outside .display-embedded:hover,.outside .display-image:hover{

   background:var(--theme3)

}

.outside .message-metadata{

   border-bottom:1px solid var(--theme4)

}

.outside .message-metadata ul.infos li strong,.outside .message-metadata ul.infos strong{

   color:var(--theme2)

}

.outside .message-metadata ul.infos b,.outside .message-metadata ul.infos li b{

   color:var(--theme1)

}

body.mobileMode body#eo-reply #message-body iframe{

   background:var(--theme3)

}

body{

   color:var(--theme2)

}

code{

   color:var(--white)

}

p a{

   color:var(--theme1)

}

hr{

   box-shadow:inset 0 1px 0 var(--theme4),inset 0 -1px 0 var(--theme4)

}

kbd{

   color:var(--theme2);

   background-color:var(--theme3);

   -webkit-box-shadow:0 0 0 var(--theme4),inset 0 0 0 1px var(--theme4);

   box-shadow:0 0 0 var(--theme4),inset 0 0 0 1px var(--theme4)

}

body .pm_form textarea[readonly],pre{

   background:var(--theme3);

   border:1px solid var(--theme4);

   color:var(--theme2)

}

#eo-message .email img.pm_broken,#eo-reply iframe img.pm_broken,.message .frame>.email img.pm_broken{

   background-color:var(--theme4)

}

#eo-message .email blockquote,#eo-reply iframe blockquote,.message .frame>.email blockquote{

   border-left:4px solid var(--theme4)!important

}

.tooltip.top .tooltip-arrow,.tooltip.top-left .tooltip-arrow,.tooltip.top-right .tooltip-arrow{

   border-top-color:var(--theme2)

}

.tooltip-inner{

   color:var(--theme3);

   background-color:var(--theme2)

}

.tooltip.right .tooltip-arrow{

   border-right-color:var(--theme2)

}

.tooltip.left .tooltip-arrow{

   border-left-color:var(--theme2)

}

.tooltip.bottom .tooltip-arrow,.tooltip.bottom-left .tooltip-arrow,.tooltip.bottom-right .tooltip-arrow{

   border-bottom-color:var(--theme2)

}

.alert{

   color:var(--white)!important;

   background:var(--theme4)!important

}

.alert a,.alert.alert-danger a,.alert.alert-info a,.alert.alert-success a,.alert.alert-warning a{

   color:var(--theme1)!important

}

.alert.alert-info{

   color:var(--white)!important;

   background:var(--theme4)!important

}

.alert.alert-success{

   color:var(--black)!important;

   background:var(--reddish)!important

}

.alert.alert-danger{

   color:var(--white)!important;

   background:var(--red-light)!important

}

.alert.alert-warning{

   color:var(--black)!important;

   background:var(--fullred-light)!important

}

.alert .pm_button{

   background:var(--theme3)!important

}

.customCheckbox-input:checked+.customCheckbox-mask{

   background-color:var(--theme6);

   border-color:var(--theme6)

}

.customRadio-input:checked+.customRadio-mask{

   box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 10px var(--theme6);

   border-color:var(--theme6)

}

.alert .pm_select,.alert input[type=text],.alert input[type=number],.alert input[type=password],.alert input[type=email],.alert input[type=search],.alert textarea{

   background:var(--theme3)!important

}

.labelDropdown .scrollbox{

   background-color:var(--theme6)

}

.labelDropdown .scrollbox::after,.labelDropdown .scrollbox::before{

   background:transparent

}

.labelDropdown .pm_button.link{

   color:var(--theme1)

}

.labelDropdown .alsoArchive{

   border-top:1px solid var(--theme4);

   border-bottom:1px solid var(--theme4)

}

.labelDropdown .labelSearch .fa{

   color:var(--theme1)

}

.labelDropdown .labelSearch input{

   border-bottom:1px solid var(--theme4)

}

.searchForm-advanced-container,.searchForm-advanced-main,.searchForm-advanced-wrapper{

   background-color:var(--theme7)!important

}

form.searchForm,.searchForm-container,.searchForm-advanced-container label{

   color:var(--theme2)

}

form.searchForm fieldset,.search-form-fieldset{

   box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important;

   background:var(--theme7)!important;

   color:var(--theme2)!important

}

form.searchForm fieldset button[type=button],.searchForm-action-button{

   color:var(--theme2)

}

[class*="searchForm-action-button-"]{

   color:var(--theme2)

}

form.searchForm fieldset button[type=button]:hover,.searchForm-action-button:hover{

   background:var(--theme7)

}

form.searchForm fieldset #closeAdvSearch,form.searchForm fieldset button[type=submit]{

   color:var(--theme2)

}

form.searchForm fieldset input.query,.search-form-fieldset-input{

   background:var(--theme7);

   color:var(--theme2)

}

form.searchForm #advancedSearchDropdown label,.searchForm-advanced-wrapper label{

   color:var(--theme2)

}

body.mobileMode form.searchForm #advancedSearchDropdown .wrap,.searchForm-advanced-wrapper{

   border-bottom:1px solid var(--theme3)

}

#advancedSearchModal .date em{

   color:var(--theme4)

}

body .is-selected .pika-button{

   background:var(--theme1)!important;

   color:var(--theme3)!important

}

body .is-today .pika-button{

   color:var(--theme1)

}

#labelModal ul.palette li a .fa{

   color:var(--theme3)

}

body .cg-notify-message{

   background:var(--theme2);

   color:var(--theme3)!important

}

body .cg-notify-message.notification-success{

   background-color:var(--reddish)

}

body .cg-notify-message.notification-warning{

   background-color:var(--fullred-light)

}

body .cg-notify-message.notification-danger{

   background-color:var(--red)

}

body .cg-notify-message.notification-info{

   background-color:var(--redandblue-light)

}

#pm_latest header{

   color:var(--theme2);

   border-bottom:0 solid var(--theme4)

}

#pm_latest #storageStatus .wrap span{

   color:var(--theme2)

}

#pm_latest #storageStatus .wrap span strong{

   color:var(--theme1)

}

#pm_latest section{

   border:1px solid var(--theme4)

}

#pm_latest .storageArea div.storage{

   color:var(--theme4)

}

#pm_latest .storageArea div.storage strong{

   color:var(--theme1)

}

#pm_latest .storageArea .bar{

   background-color:var(--theme4)

}

#pm_latest .storageArea .bar em{

   background-color:var(--theme1)

}

.autocompleteEmails-container{

   color:var(--theme2)!important

}

.autocompleteEmails-container .autocompleteEmails-autocomplete{

   color:var(--theme2)!important;

   background-color:var(--theme4)!important

}

.autocompleteCommand-container .autocompleteEmails-autocomplete li+li{

   border-color:var(--theme1)!important

}

.autocompleteCommand-container .autocompleteEmails-autocomplete li{

   color:var(--theme2)!important;

   background-color:var(--theme7)!important

}

.autocompleteCommand-input{

   color:var(--theme2)!important;

   background-color:var(--theme3)!important

}

.autocomplete-container .awesomplete li[aria-selected="true"],.autocomplete-container .awesomplete li[aria-selected="true"]:hover,.autocompleteEmails-autocomplete li[aria-selected="true"],.autocompleteEmails-autocomplete li[aria-selected="true"]:hover{

   color:var(--theme2)!important;

   background-color:var(--theme1)!important

}

.autocomplete-container .awesomplete li:hover,.autocompleteEmails-autocomplete li:hover{

   color:var(--theme2)!important;

   background-color:var(--theme6)!important

}

.autocompleteEmails-item{

   border:1px solid var(--theme4)!important;

   background-color:var(--theme3)!important

}

.autocompleteEmails-item-invalid{

   border-color:var(--red)!important;

   color:var(--red)!important

}

.autocompleteEmails-field .awesomplete ul{

   border:1px solid var(--theme4)!important;

   background-color:var(--theme3)!important

}

.autocompleteEmails-field .awesomplete li[aria-selected=true],.autocompleteEmails-field .awesomplete li[aria-selected=true]:hover{

   background-color:var(--theme4)!important

}

.autocompleteEmails-field .awesomplete li[aria-selected="false"],.autocompleteEmails-field .awesomplete li[aria-selected="false"]:hover{

   background-color:var(--theme6)!important

}

.autocompleteEmails-field .awesomplete li:hover{

   background-color:var(--theme3)!important

}

.autocompleteEmails-field .awesomplete li,.autocompleteEmails-field .awesomplete li:hover,.autocompleteEmails-field .awesomplete li[aria-selected=true],.autocompleteEmails-field .awesomplete li[aria-selected=true]:hover{

   color:var(--theme2)!important

}

.autocompleteEmails-btn-remove:active,.autocompleteEmails-btn-remove:focus{

   color:var(--theme5)!important

}

.monetize .modal-dialog .modal-content .upsell h4{

   color:var(--theme1)

}

.monetize .modal-dialog .modal-content .upsell ul{

   color:var(--theme3)

}

#pm_settings .bar em{

   background-color:var(--theme1)

}

#pm_settings .donate .well{

   box-shadow:inset 0 0 3rem var(--theme4)

}

#plans .plans .plan header{

   background:var(--theme2);

   color:var(--theme3)

}

#plans .plans .plan h3,.settingsDashboard-container #plans .plan .plan-title{

   background-color:var(--theme1);

   color:var(--theme3)

}

.settingsDashboard-plans [class*="Column-container"] [class*="addonRow"] .pm_select{

   background:var(--theme7)!important

}

.settingsDashboard-plans,.settingsDashboard-plans::after,.settingsDashboard-plans::before{

   background:transparent!important

}

.overviewSection-tbody-billing,.subscriptionSection-tbody-billing,.subscriptionSection-tbody-billing>tr:first-of-type{

   background:var(--theme6)!important

}

.overviewSection-couponCode{

   color:var(--black)

}

.settingsDashboard-container #plans .plan>section ul{

   background:var(--theme3)

}

#plans .plans .plan.plus-plan footer,#plans .plans .plan.plus-plan header{

   background:var(--theme3)

}

#plans .plans .plan section,{

   border:1px solid var(--theme4)

}

#plans .plans .plan section ul li{

   border-bottom:1px solid var(--theme4)

}

#plans .plans .plan section ul li.disabled{

   color:var(--theme4)

}

#plans .plans .plan footer{

   border:1px solid var(--theme4)

}

#plans .plans .plan footer .cycle{

   border-bottom:1px solid var(--theme4);

   color:var(--theme4)

}

#plans .plans .plan footer .cycle .discount{

   border-color:var(--reddish) transparent transparent;

   color:var(--theme3)

}

#plans .plans .plan footer .cycle label{

   color:var(--theme2)

}

#plans .plans .plan footer .cycle strong{

   color:var(--theme1)

}

#plans .plans .plan.plus-plan h3 span{

   color:var(--theme3)

}

#plans .plans .plan.visionary-plan h3 span,#plans .plans .plan.visionary-plan header{

   color:var(--theme3)

}

.intl-tel-input .selected-flag .iti-arrow{

   border-top:4px solid var(--theme2)

}

.intl-tel-input .selected-flag .iti-arrow.up{

   border-bottom:4px solid var(--theme2)

}

.intl-tel-input .country-list{

   background-color:var(--theme3);

   border:1px solid var(--theme4)

}

.intl-tel-input .country-list .divider{

   border-bottom:1px solid var(--theme4)

}

.intl-tel-input .country-list .country .dial-code{

   color:var(--theme4)

}

.iti-flag{

   background-color:var(--theme4)

}

.pm_form .cardPanel{

   background:var(--theme1);

   color:var(--theme3)

}

.pm_form .cardPanel.issuer-mastercard{

   background:var(--white)

}

.paginator-disabled-main .paginator-dropdown,.paginator-disabled-next .paginator-btn-next,.paginator-disabled-previous .paginator-btn-previous{

   color:var(--theme5)!important;

   box-shadow:unset!important;

   background-color:var(--theme3)!important

}

.paginator-disabled-main .paginator-dropdown:hover,.paginator-disabled-next .paginator-btn-next:hover,.paginator-disabled-previous .paginator-btn-previous:hover{

   background-color:var(--theme7)!important;

   color:var(--theme2)!important

}

.popover{

   background-color:var(--theme3)

}

.popover-title{

   background-color:var(--theme3);

   border-bottom:var(--theme4)

}

.popover.top>.arrow{

   border-top-color:var(--theme4)

}

.popover.top>.arrow:after{

   border-top-color:var(--theme3)

}

.popover.right>.arrow{

   border-right-color:var(--theme4)

}

.popover.right>.arrow:after{

   border-right-color:var(--theme3)

}

.popover.bottom>.arrow{

   border-bottom-color:var(--theme4)

}

.popover.bottom>.arrow:after{

   border-bottom-color:var(--theme3)

}

.popover.left>.arrow{

   border-left-color:var(--theme4)

}

.popover.left>.arrow:after{

   border-left-color:var(--theme3)

}

.composerAttachments-container{

   background:var(--theme3)

}

.composerAttachments-loaders{

   border-top:1px solid var(--theme4)

}

.composerAskEmbdded-details{

   background:var(--theme3)

}

.composerInputMeta-overlay{

   background:var(--theme7)!important;

   color:var(--theme2)!important

}

.composerInputMeta-overlay-label,.composerInputMeta-label,#pm_composer .composer .fromRow{

   color:var(--theme1)!important

}

.progressLoader-container.pm_button{

   background:var(--theme3)

}

[class*=listAttachments-icon].embedded{

   color:var(--theme1)

}

.listAttachments-list .listAttachments-att{

   color:var(--theme2)!important;

   background:var(--theme3)!important

}

.listAttachments-list .listAttachments-att:after{

   border-right:1px solid var(--theme4)!important

}

.squire-dropzone{

   background:var(--theme3)!important

}

.conversation{

   background:var(--theme7)!important;

   border-bottom-color:var(--theme7)!important

}

.conversation .expiration,body #conversation-list-rows .conversation .expiration{

   border-color:transparent var(--red-light) transparent transparent!important

}

.conversation .row .meta .fa-star-o{

   color:var(--white)!important

}

.conversation .row .meta .fa-star{

   color:var(--fullred)!important

}

.conversation .row .pm_labels{

   background:transparent!important;

   box-shadow:none!important

}

.conversation .row .pm_labels label{

   background:transparent!important;

   box-shadow:none!important

}

.conversation .row h4{

   color:var(--white)!important

}

.conversation.read{

   background:var(--theme3)!important;

   border-bottom-color:var(--theme7)!important

}

.conversation.read h4{

   color:var(--white)!important;

   font-weight:400

}

.conversation.read .pm_labels label{

   box-shadow:none!important;

   background:transparent!important

}

.conversation.marked::before{

   background-color:var(--theme1)!important

}

.conversation.active{

   background:var(--theme6)!important;

   color:var(--theme3)!important;

   border-bottom-color:var(--theme7)!important

}

.conversation.active h4{

   color:var(--white)!important

}

.conversation.active .pm_labels label{

   background:transparent!important;

   box-shadow:none!important

}

body #conversation-list-rows .conversation{

   color:var(--theme2)!important;

   background:var(--theme7)!important

}

body #conversation-list-rows .conversation .expiration{

   color:var(--theme3)!important

}

body #conversation-list-rows .conversation .fa-star-o{

   color:var(--white)!important

}

body #conversation-list-rows .conversation .fa-star{

   color:var(--fullred)!important

}

body #conversation-list-rows .conversation .subject h4{

   color:var(--white)!important

}

body #conversation-list-rows .conversation .subject .pm_labels{

   background:transparent!important

}

body #conversation-list-rows .conversation .subject .pm_labels label{

   background:transparent!important

}

body #conversation-list-rows .conversation.read,body #conversation-list-rows .conversation.read .subject .pm_labels,body #conversation-list-rows .conversation.read .subject .pm_labels label{

   background:var(--theme3)!important

}

body #conversation-list-rows .conversation.read .subject h4{

   color:var(--theme2)!important

}

.unsubscribePanel-container{

   background:var(--theme3)!important;

   color:var(--theme2)!important

}

.unsubscribePanel-button,.messageExtra-container>[class*="-container"]>[class*="-button"]{

   background:var(--theme1)!important;

   color:var(--theme2)!important;

   border:1px solid var(--theme1)!important

}

.unsubscribePanel-button:hover,.messageExtra-container>[class*="-container"]>[class*="-button"]:hover{

   background:var(--theme6)!important;

   border:1px solid var(--theme6)!important

}

.eventsAttachments-container{

   background:var(--theme3)!important;

   color:var(--theme2)!important

}

.eventsAttachments-summary{

   background:var(--theme1)!important;

   color:var(--theme2)!important

}

.pm_button{

   color:var(--theme5)!important;

   border:1px solid var(--theme4)!important

}

.pm_button:hover{

   background-color:var(--theme3)!important

}

.pm_button:active,.pm_button:focus{

   background-color:var(--theme4)!important

}

.pm_button.primary{

   background-color:var(--theme1)!important;

   border-color:var(--theme1)!important;

   color:var(--theme3)!important

}

.pm_button.primary:hover{

   background-color:var(--theme6)!important;

   border-color:var(--theme6)!important

}

.pm_button.primary:active,.pm_button.primary:focus{

   background-color:var(--theme5)!important;

   border-color:var(--theme5)!important

}

.pm_button.primary.disabled,.pm_button.primary[disabled]{

   background:var(--theme6)!important

}

.pm_button.link{

   border:none!important;

   color:var(--theme1)!important

}

.pm_button.round{

   border:1px solid var(--theme4)!important

}

.pm_button.round .fa{

   color:var(--theme1)!important

}

.pm_button.round:hover{

   background-color:var(--theme3)!important

}

.pm_button.round:active,.pm_button.round:focus{

   background-color:var(--theme3)!important

}

.pm_button.success{

   background-color:var(--reddish)!important;

   border-color:var(--reddish)!important;

   color:var(--theme3)!important

}

.pm_button.success:hover{

   background-color:var(--reddish-light)!important;

   border-color:var(--reddish-light)!important

}

.pm_button.success.disabled,.pm_button.success[disabled]{

   background:var(--reddish-light)!important

}

.pm_button.error{

   background-color:var(--red)!important;

   border-color:var(--red)!important;

   color:var(--theme3)!important

}

.pm_button.error:hover{

   background-color:var(--red-light)!important;

   border-color:var(--red-light)!important

}

.pm_button.error.disabled,.pm_button.error[disabled]{

   background:var(--red-light)!important

}

.pm_buttons{

   border:1px solid var(--theme4)!important;

   background:var(--theme3)!important

}

.pm_buttons .pm_buttons{

   border:none!important

}

.pm_buttons.disabled{

   border:1px solid var(--theme3)!important;

   box-shadow:none!important;

   background:var(--theme3)!important

}

.pm_buttons .pm_buttons-child{

   background:var(--theme3)!important

}

.pm_buttons .pm_buttons-child.disabled{

   box-shadow:none!important;

   background:var(--theme3)!important

}

.pm_buttons .disabled,.pm_buttons [disabled]{

   color:var(--theme4)!important;

   box-shadow:inset 0 0 50rem 0 var(--theme3)!important;

   background:var(--theme3)!important

}

.pm_buttons .pm_buttons:not(:first-of-type),.pm_buttons>*{

   border-color:var(--theme4)!important

}

.pm_buttons a,#conversation-view .message .details .pm_buttons a,.pm_buttons .pm_buttons-child{

   color:var(--theme5)!important;

   background:var(--theme3)!important

}

.pm_buttons a:hover,#conversation-view .message .details .pm_buttons a:hover,.pm_buttons .pm_buttons-child:hover,.chooseLayoutBtns-container-rows .chooseLayoutBtns-btn-rows,.chooseLayoutBtns-container:not(.chooseLayoutBtns-container-rows) .chooseLayoutBtns-btn-column{

   background-color:var(--theme7)!important;

   color:var(--theme2)!important

}

.pm_buttons a.active,.pm_buttons a:active,.pm_buttons .pm_buttons-child:active{

   background:var(--theme4)!important

}

.pm_buttons.primary a{

   background-color:var(--theme1)!important;

   border-color:var(--theme1)!important;

   color:var(--theme3)!important

}

.pm_buttons.primary a:hover{

   background-color:var(--theme6)!important;

   border-color:var(--theme6)!important

}

.pm_buttons.primary a:active,.pm_buttons.primary a:focus{

   background-color:var(--theme5)!important;

   border-color:var(--theme5)!important

}

.readUnread-container.disabled [class*="readUnread-btn"]{

   box-shadow:inset 0 0 50rem 0 var(--theme3)!important;

   color:var(--theme6)!important

}

body.mobileMode #body #pm_main .fa-check-square,body.mobileMode #body #pm_main .fa-square-o{

   color:var(--theme5)!important

}

.pm_dropdown{

   background:var(--theme7)!important;

   border:1px solid var(--theme4)!important

}

.pm_dropdown>a,.pm_dropdown>button,.pm_dropdown>ul>li{

   border-bottom:1px solid var(--theme4)!important;

   color:var(--theme5)!important

}

.pm_dropdown>a:hover,.pm_dropdown>button:hover,.pm_dropdown>ul>li:hover{

   color:var(--theme2)!important

}

.pm_dropdown .paginator-dropdown-item{

   background:var(--theme7)!important

}

.pm_dropdown .paginator-dropdown-item:hover{

   background:var(--theme3)!important

}

.pm_labels.inline label .close{

   color:var(--theme2)!important

}

.pm_labels label{

   color:var(--theme2)!important

}

.pm_modal .angular-squire-wrapper{

   border:1px solid var(--theme4)!important

}

.pm_modal.domains .modal-dialog .modal-content .modal-body{

   box-shadow:inset 0 1px 0 var(--theme4),inset 0 -1px 0 var(--theme4)!important

}

.pm_modal .modal-dialog{

   background:var(--theme3)!important;

   border:5px solid var(--theme1)!important;

   box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important

}

.pm_modal .modal-dialog .close{

   color:var(--theme3)!important;

   background:var(--theme1)!important

}

.pm_modal .modal-dialog .modal-content{

   background:var(--theme3)!important

}

.pm_modal .modal-dialog .modal-content .modal-body{

   box-shadow:inset 0 1px 0 var(--theme4),inset 0 -1px 0 var(--theme4)!important

}

.pm_modal .modal-dialog .modal-footer{

   background-color:var(--theme3)!important

}

.pm_modal .modal-dialog .modal-content h1,.pm_modal .modal-dialog .modal-content h2,.pm_modal .modal-dialog .modal-content h3,.pm_modal .modal-dialog .modal-content h4{

   color:var(--theme2)!important

}

.pm_modal .modal-dialog .modal-content h1 em,.pm_modal .modal-dialog .modal-content h2 em,.pm_modal .modal-dialog .modal-content h3 em,.pm_modal .modal-dialog .modal-content h4 em{

   color:var(--theme4)!important

}

body.mobileMode .pm_modal .modal-dialog{

   background:var(--theme3)!important

}

body.mobileMode .pm_modal .modal-dialog .close{

   color:var(--theme2)!important

}

.pm_form legend{

   border-bottom:1px solid var(--theme4)!important

}

.pm_form legend .small{

   color:var(--theme2)!important

}

.pm_form legend .small a{

   color:var(--theme1)!important

}

.pm_form ::-webkit-input-placeholder{

   color:var(--theme4)

}

.pm_form :-moz-placeholder{

   color:var(--theme4)

}

.pm_form ::-moz-placeholder{

   color:var(--theme4)

}

.pm_form input:-ms-input-placeholder{

   color:var(--theme4)

}

.pm_form ::-ms-input-placeholder{

   color:var(--theme4)

}

.pm_form :-ms-input-placeholder{

   color:var(--theme4)

}

.pm_form .pm_select select{

   border:1px solid var(--theme6)!important

}

.pm_form .pm_select{

   border-radius:4px;

   box-shadow:inset 0 2px 5px rgba(0,0,0,.15)!important

}

.pm_form .pm_select .fa{

   color:var(--theme2)!important

}

.pm_form optgroup{

   color:var(--theme2)!important;

   background:var(--theme3)!important

}

.pm_form .input-icon .fa{

   color:var(--theme4)!important

}

.searchForm-advanced-wrapper .pm_select{

   background:var(--theme7)!important;

   border-color:var(--theme1)!important

}

.searchForm-advanced-wrapper input[type=text],.searchForm-advanced-wrapper input[type=search],.searchForm-advanced-wrapper input[type=email],.searchForm-advanced-wrapper input[type=number]{

   box-shadow:inset 0 2px 5px rgba(0,0,0,.15)!important;

   color:var(--theme2)!important

}

.pm_form input[type=text],.pm_form input[type=number],.pm_form input[type=password],.pm_form input[type=email],.pm_form input[type=search],.pm_form input[type=tel]{

   box-shadow:inset 0 2px 5px rgba(0,0,0,.15)!important;

   background:var(--theme7)!important;

   border:1px solid var(--theme6)!important

}

.pm_form select:active,.pm_form select:focus{

   box-shadow:inset 0 0 0 1px var(--theme1)!important

}

.pm_form input[type=text],.pm_form input[type=number],.pm_form input[type=password],.pm_form input[type=email],.pm_form input[type=search],.pm_form input[type=tel],.pm_form .pm_select,.pm_form select,.pm_form textarea,.contactItem-inputs input,.contactItem-inputs textarea{

   color:var(--theme2)!important

}

.pm_form input[type=text].ng-invalid.ng-touched,.pm_form input[type=number].ng-invalid.ng-touched,.pm_form input[type=password].ng-invalid.ng-touched,.pm_form input[type=email].ng-invalid.ng-touched,.pm_form input[type=search].ng-invalid.ng-touched,.pm_form input[type=tel].ng-invalid.ng-touched,.pm_form select.ng-invalid.ng-touched,.pm_form textarea.ng-invalid.ng-touched{

   border-color:var(--red)!important

}

.pm_form input[type=text]:hover,.pm_form input[type=number]:hover,.pm_form input[type=password]:hover,.pm_form input[type=email]:hover,.pm_form input[type=search]:hover,.pm_form input[type=tel]:hover,.pm_form .pm_select:hover,.pm_form select:hover,.pm_form textarea:hover{

   border-color:var(--theme1)!important

}

.pm_form input[type=text]:focus,.pm_form input[type=number]:focus,.pm_form input[type=password]:focus,.pm_form input[type=email]:focus,.pm_form input[type=search]:focus,.pm_form input[type=tel]:focus,.pm_form .pm_select:focus,.pm_form select:focus,.pm_form textarea:focus{

   color:var(--white)!important;

   background:var(--theme7)!important;

   border-color:var(--theme1)!important

}

.pm_form input[type=text].disabled,.pm_form input[type=text][disabled],.pm_form input[type=number].disabled,.pm_form input[type=number][disabled],.pm_form input[type=password].disabled,.pm_form input[type=password][disabled],.pm_form input[type=email].disabled,.pm_form input[type=email][disabled],.pm_form input[type=search].disabled,.pm_form input[type=search][disabled],.pm_form input[type=tel].disabled,.pm_form input[type=tel][disabled],.pm_form select.disabled,.pm_form select[disabled],.pm_form textarea.disabled,.pm_form textarea[disabled]{

   color:var(--theme4)!important;

   border-color:var(--theme4)!important;

   background:var(--theme4)!important

}

.pm_form input[type=text].success,.pm_form input[type=number].success,.pm_form input[type=password].success,.pm_form input[type=email].success,.pm_form input[type=search].success,.pm_form input[type=tel].success,.pm_form select.success,.pm_form textarea.success{

   color:var(--reddish-light)!important;

   border-color:var(--reddish-light)!important

}

.pm_form input[type=text].error,.pm_form input[type=number].error,.pm_form input[type=password].error,.pm_form input[type=email].error,.pm_form input[type=search].error,.pm_form input[type=tel].error,.pm_form select.error,.pm_form textarea.error{

   color:var(--red-light)!important;

   border-color:var(--red-light)!important

}

.pm_form input[type=text].warning,.pm_form input[type=number].warning,.pm_form input[type=password].warning,.pm_form input[type=email].warning,.pm_form input[type=search].warning,.pm_form input[type=tel].warning,.pm_form select.warning,.pm_form textarea.warning{

   color:var(--fullred-light)!important;

   border-color:var(--fullred-light)!important

}

.pm_panel,.pm_panel.alt a{

   color:var(--theme3)!important

}

.pm_form textarea{

   background:var(--theme7)!important

}

body.light .pm_panel{

   background:var(--theme3)!important;

   color:var(--theme2)!important

}

.contactList-table{

   background:transparent!important

}

.contactList-item-activeContact td{

   background-color:var(--theme1)!important

}

.pm_table table thead{

   border-top:1px solid var(--theme4)!important

}

.pm_table table.print em{

   border:1px solid var(--theme4)!important

}

.pm_sort ul,.pm_table table.bordered{

   border:1px solid var(--theme4)!important

}

.pm_table table.plain th{

   color:var(--theme2)!important

}

.pm_table table td .fa.fa-sort,.pm_table table th .fa.fa-sort{

   color:var(--theme4)!important

}

.pm_table table th{

   background:var(--theme3)!important;

   border-bottom:1px solid var(--theme4)!important;

   color:var(--theme5)!important

}

.pm_table table th a{

   color:var(--theme1)!important

}

.pm_table table th .fa{

   color:var(--theme1)!important

}

.pm_table table td{

   border-bottom:1px solid var(--theme4)!important;

   color:var(--theme2)!important

}

.pm_table table tr.hasTable table{

   background-color:var(--theme3)!important

}

.pm_table table tr.disabled td{

   color:var(--theme4)!important

}

.pm_toggle span.knob{

   background:var(--theme3)!important;

   border:1px solid var(--theme4)!important

}

.pm_toggle.off .off,.pm_toggle.on .on{

   background-color:var(--theme1)!important;

   color:var(--theme3)!important

}

.pm_tabs{

   border-right:1px solid var(--theme4)!important

}

.pm_tabs li a{

   background-color:var(--theme3)!important

}

.pm_tabs li.active a{

   background-color:var(--theme3)!important;

   border-bottom:unset!important;

   color:var(--theme1)!important

}

.pm_sort ul li{

   border-bottom:1px solid var(--theme4)!important;

   background:var(--theme3)!important

}

.pm_sort ul li.highlight{

   background-color:var(--theme3)!important

}

.pm_sort ul li .fa.fa-ellipsis-v{

   color:var(--theme4)!important

}

.as-sortable-dragging .fa-check,.pm_sort ul li .fa.fa-check{

   color:var(--theme1)!important

}

.pm_sort ul li .fa.fa-check{

   background:var(--theme3)!important

}

.as-sortable-placeholder{

   background:var(--theme4)!important

}

.as-sortable-dragging{

   border:1px solid var(--theme4)!important;

   background:var(--theme3)!important

}

.image.loading:after,.loader em{

   border-left:.5em solid var(--theme5)!important

}

.as-sortable-dragging .fa-check{

   background:var(--theme3)!important

}

.as-sortable-dragging .fa-ellipsis-v{

   color:var(--theme4)!important

}

#pm_loader.full{

   background:var(--theme3)!important

}

#pm_slow,#pm_slow2{

   color:var(--theme3)!important

}

#pm_loading{

   background:var(--theme3)!important

}

.image.loading:after{

   background:var(--theme3)!important

}

input[type=range].pm_range::-webkit-slider-runnable-track{

   background:var(--theme4)

}

input[type=range].pm_range::-webkit-slider-thumb{

   background:var(--theme1)

}

input[type=range].pm_range:focus::-webkit-slider-runnable-track{

   background:var(--theme4)

}

input[type=range].pm_range::-moz-range-track{

   background:var(--theme1)

}

input[type=range].pm_range::-moz-range-thumb{

   background:var(--theme1)

}

input[type=range].pm_range::-ms-track{

   background:var(--theme1)

}

input[type=range].pm_range::-ms-fill-lower{

   background:var(--theme4)

}

input[type=range].pm_range::-ms-fill-upper{

   background:var(--theme1)

}

input[type=range].pm_range::-ms-thumb{

   background:var(--theme1)

}

input[type=range].pm_range:focus::-ms-fill-lower{

   background:var(--theme4)

}

input[type=range].pm_range:focus::-ms-fill-upper{

   background:var(--theme1)

}

#pm_main,#wrapper,#conversation-list-columns,#conversation-list-rows{

   background:var(--theme3)!important;

   color:var(--theme5)!important

}

.pm_badge,.pm_tag{

   background:var(--theme4)!important

}

.pm_tag{

   color:var(--theme2)!important

}

.pm_badge{

   color:var(--theme3)!important

}

.pm_badge.default{

   color:var(--theme2)!important

}

.pm_badge.primary{

   background-color:var(--theme1)!important

}

.pm_badge.success{

   background-color:var(--reddish)!important

}

.pm_badge.error{

   background-color:var(--red)!important

}

.pm_badge.warning{

   background-color:var(--fullred-light)!important

}

.scrollbox-container{

   background-color:var(--theme7)!important;

   background-image:unset!important

}

.scrollbox-container::after,.scrollbox-container::before{

   background:none!important

}

.commandPalette-container{

   background-color:var(--theme7)!important

}

.autocompleteCommand-container .autocompleteEmails-autocomplete [aria-selected="true"]{

   background-color:var(--theme1)!important

}

.currencySelector-container .currencySelector-button.active{

   background:var(--theme4)

}

.pm_sort-container,.pm_sort-item-content{

   border-color:var(--theme4)!important

}

.emailBlockList-list{

   border-color:var(--theme4)!important

}

.emailBlockList-row{

   color:var(--theme5)!important

}

.manageContactGroupLink-container,.manageContactGroupLink-label,.manageContactGroupLink-icon{

   color:var(--theme2)!important

}

.totalRows-label-right{

   background:none!important

}

.sidebarApp-menu .ico-protonvpn{

   opacity:1;

   -webkit-filter:brightness(100);

   filter:brightness(100)

}

.pm_toggle-checkbox:checked + .pm_toggle-label{

   background-color:var(--redbox)!important

}

.message-body-container{

   background-color:var(--black)!important

}
Login
Username:
Password:	Lost Password?
	Remember me
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account Sign up for a new account in our community. It's easy! Register a new account	or	Sign in Already have an account? Sign in here. Sign in now
cracked.io | Best Forum Around | Free Premium Accounts

Protonmail Theme [Black/Red]

About Cracked.io

Navigation

Extras

Help

Account
