/* 
////
//// Easing general purpose
////
--------------------------------------------------------------*/
.easeOut { -webkit-transition-property: all; -webkit-transition-duration: 350ms; -webkit-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition-property: all; -moz-transition-duration: 350ms; -moz-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); transition-property: all; transition-duration: 350ms; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }
/* 
////
//// Default Font
////
--------------------------------------------------------------*/
html, body { height: 100%; min-height: 100%; }
body { font-family: "Karla", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; background: var(--background-color); font-weight: 400;  letter-spacing:  -0.01em; color: #010101;   }
strong { font-weight: 700; }
.genC1 { color: var(--color-primary)!important; }
.genC2 { color: var(--color-secondary); }
.genC3 { color: #4db70b!important; }
#fullWrp { margin: 0 auto; min-height: 100%;  position: relative;  background: var(--background-color); }
.genPad1 { padding-top: 6rem; padding-bottom: 6rem;}
@media all and (max-width: 576px) {
.genPad1 { padding-top: 4.5rem; padding-bottom: 4.5rem;}
}

/* logo 
-----------------------------*/
#mainLogo { float: left; }
#mainLogo a { display: block; background: url(../images/main_logo_2x.png) no-repeat left center; background-size: contain!important; width: 92px; height: 53px; white-space: nowrap; text-indent: -8000px; margin-left: 0; }
@media all and (max-width: 767px) {
#mainLogo  { max-width: calc(100% - 185px); width: 140px; }
#mainLogo  a { width: 100%; }
}
@media all and (max-width: 576px) {
.nav-hamburger + #mainLogo { margin-left: 54px!important; }
#mainLogo a { height: 37px; width: calc(100% - 13px);  }
}
/* Main Header
--------------------------------------------------------------*/

#mainHdr { z-index: 2;  padding: 20px  0; background: #f1f1f3; }
#fullWrp .introHeader  { position: absolute; left: 0; top: 0; right: 0; background: none;  }
#mainHdr .nav-hamburger { display: none; }
#mainHdr  .ctr { padding: 0 2rem; margin: 0 auto; position: relative; display: flex; justify-content: space-between; align-items: center; }
#mainLogo { margin: 0; display: block; float: left; position: relative;  z-index:  10; position: relative; }
#mainHdr .mainHdrOpt li { position: relative; }
#mainNav .site-nav  li a { color: #000; }
#mainNav .site-nav  li a span.bonus {  position: absolute; top: -1.6em; line-height: 1.25em; background: #42c158; padding: 0.15em 0.55em 0.1em 0.55em; color: #fff;  left: 50%; transform: translate(-50%, 0%); font-size: 12.5px; }
#mainSignNav {  display: flex; justify-content: flex-end; height: 53px; align-items: center; white-space: nowrap;  text-transform: uppercase;   }
#mainSignNav a:last-child  { margin-left: 28px; }
#mainLogo .planType { position: absolute; top: 0; line-height: 1.45em; background: #84ddff; padding: 0 0.55em;color: #000000; font-size: 12.5px; left: 104%; text-indent: 0; text-transform: uppercase; }
@media all and (max-width: 1480px) {
#mainHdr .mainHdrOpt { font-size: 15.5px;  }
#mainSignNav a.btn {  font-size: 15px; }
#mainHdr .mainHdrOpt li span.bonus  {  font-size: 11.5px; }
#mainSignNav a:last-child  { margin-left: 15px; }
}
@media all and (max-width: 1360px) {
#mainHdr .mainHdrOpt li span.bonus  {  font-size: 10.5px; }
}
@media all and (max-width: 767px) {
#mainHdr {padding: 15px  0; }
}
@media all and (max-width: 576px) {
#mainHdr {padding: 5px  0; }
#mainLogo .planType { display: none;}
}

/* Main  Menu
--------------------------------------------------------------*/
@media all and (min-width: 1271px) {
#mainHdr #mainNav { display: flex; justify-content: space-between; align-items: center; font-weight: 700; text-transform: uppercase; font-size: 16px; line-height: 1.2em; max-width: 1080px;  width: 100%;  padding: 0 30px;  }
#mainHdr #mainNav .site-nav { width: 100%; }
#mainHdr .mainHdrOpt {  width: 100%;   display: flex;  justify-content: space-between; align-items: center;  }
#mainHdr .mainHdrMem  { max-width: 540px;  margin: 0 auto; }
#mainNav .site-nav .dropDown { position: absolute; top: 5px; left: 0; z-index: 1000; display: none; float: left; min-width: 168px; padding-top: 28px; cursor:  pointer; }
#mainNav .site-nav .dropDown ul { padding: 0  0; margin: 0.125rem 0 0; font-size: 16px; color: #fff; text-align: left; list-style: none; background-color: #cfcfd5;  background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: 0.25rem; }
#mainNav .site-nav .dropDown li a { padding: 2px  6px; font-weight: normal; font-size: 12.8px; line-height: 1.9em; display: block; white-space: nowrap;   }
#mainNav .site-nav .dropDown li a:first-child { padding-top: 4px; }
#mainNav .site-nav .dropDown li a:last-child { padding-bottom: 4px; }
#mainNav .site-nav .dropDown li a:hover { background: rgba(255,255,255,0.1); }
#mainNav .site-nav .dropDown ul a:before { content: ' '; display:  inline-block; height: 1.9em; width: 1.9em; margin-right: 0.4em; background-size: contain!important; background-position: center center; background-repeat: no-repeat; vertical-align: top ; }
#mainNav .site-nav .dropDown ul.pdfConv  a:before { background-image: url("../images/main_ico_convert_pdf.svg");}
#mainNav .site-nav .dropDown ul.audioConv  a:before { background-image: url("../images/main_ico_convert_audio.svg");}
#mainNav .site-nav .dropDown ul.videoConv  a:before { background-image: url("../images/main_ico_convert_video.svg");}
#mainNav .site-nav  li.dropElm > a:after { content: ' '; border: solid  #000; border-width: 0 3px 3px 0; display: inline-block; padding: 3px; vertical-align: top; position: relative;  -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-left: 8px; position: relative; top: 0.2em; }
#mainNav .site-nav  li.dropElm:hover .dropDown { display: block; }
#mainNav .site-nav  li.hideLg { display: none!important; }
}
@media all and (max-width: 1270px) {
/*burger icon + animation*/
#mainHdr .nav-hamburger { background: transparent none repeat scroll 0 0; border: 0 none; cursor: pointer; display: block; height: 35px; margin-bottom: auto; margin-top: auto; outline: medium none; padding: 0; position: relative; transition: all 0.3s ease-in-out 0s; width: 30px; position: absolute; left: 2rem; top: 9px;  }
.nav-hamburger::before, .nav-hamburger::after, .nav-hamburger span { background-color: #000; transition: all 0.3s ease-in-out 0s; }
.nav-hamburger::before, .nav-hamburger::after, .nav-hamburger span { background-color: #000; }
.nav-hamburger::before, .nav-hamburger::after { content: ""; height: 2px; left: 0; position: absolute; top: 50%; transform-origin: 50% 50% 0; width: 100%; }
.nav-hamburger span { height: 2px; left: 0; overflow: hidden; position: absolute; text-indent: 200%; top: 50%; width: 100%; cursor: pointer; }
.nav-hamburger::before { transform: translate3d(0px, -10px, 0px); }
.nav-hamburger::after { transform: translate3d(0px,  10px, 0px); }
.menuOpen .nav-hamburger span { background-color: #fff; opacity: 0; }
.menuOpen .nav-hamburger::before { background-color: #fff; transform: rotate3d(0, 0, 1, 45deg); }
.menuOpen .nav-hamburger::after { background-color: #fff; transform: rotate3d(0, 0, 1, -45deg); }
.nav-hamburger { position: absolute; left: 0; top: 14px; z-index: 1001; cursor: pointer;  }
.nav-hamburger + #mainLogo { margin: 0 0 0 61px;   } 
#mainNav .site-nav  { display: block; top: 0; bottom: -100vh ; left: 0; right: 0; overflow-y: auto; position: absolute; padding: 0;  box-shadow: 0 -30px 0 0 var(--color-primary);  }
#mainNav .site-nav  ul, #site-menu .site-nav   li { margin: 0; padding: 0; }
#mainNav .site-nav  li { padding: 0; display: block; text-align: left;   }
#mainNav .site-nav  li:first-child { margin-top: 68px; }
#mainNav .site-nav  li a {  background: var(--color-primary);display: block; padding: 16px 20px 16px 20px!important; color: #fff; font-size: 15px; line-height: 16px; -webkit-transition:0ms ease-out all; transition: 0ms ease-out all; text-align: center;  border-bottom: solid 1px rgba(255,255,255,0.15); text-align:left; font-weight: 400;  letter-spacing: 0.015em; text-transform: uppercase;  }
#mainNav .site-nav  li a span.bonus { position: static; display: inline; vertical-align:  top; margin-left: 0.4em;   }
#mainNav .site-nav  li:first-child  a  { border-top: solid 1px rgba(255,255,255,0.2); }
#mainNav .site-nav  li a.cur, #mainNav .site-nav  li a.cur:active   { outline: none; color: #fff;  background: #c72d22; }
#mainNav .site-nav  li a:active  { background: #c72d22; }
#mainNav .site-nav  li li a { border-top: 0!important; padding-left: 32px!important;}
#mainNav .site-nav  li.dropElm> a:after { content: ' '; border: solid #fff; border-width: 0 2px 2px 0; display: block; padding: 2px; width: 0.25em; height: 0.25em;  vertical-align: middle; position: relative;  -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; right: 20px; top: 17px; }
#mainNav .site-nav  li li:first-child { margin: 0;}
#mainNav .site-nav  li .dropDown { display: none; }
#mainNav .site-nav  li.dropOpen > a:after {  -webkit-transform: rotate(-135deg); transform: rotate(-135deg); top: 22px;}
#mainNav .site-nav  li.dropOpen .dropDown { display: block; }
/* open menu 
-----------------------------*/
#mainNav { background: var(--color-primary); color: var(--background-color); display: block!important; max-width: 300px; top: 0;  box-shadow: -1000vh 900vh  0 1000vh var(--color-primary), -1000vh  900vh 20px 1000vh  rgba(0,0,0, 0.4); position: absolute; left: 0; width: 100%;  -webkit-transition: 300ms ease-out all; transition: 300ms ease-out all; z-index: 900;    -webkit-transform: translateX(-500px); transform: translateX(-500px); transform: translate3d(-500px, 0, 0);  -webkit-transform: translate3d(-500px, 0, 0); pointer-events: none; -webkit-perspective: 1000; -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d;   will-change: transform; }
.menuOpen #mainNav  { -webkit-transform: translateX(0); transform: translateX(0); transform: translate3d(0, 0, 0);  -webkit-transform: translate3d(0, 0, 0); pointer-events: auto;  }
}
/* 
////
//// Mainpage Index
////
--------------------------------------------------------------*/
/* Main Intro
--------------------------------------------------------------*/
#mainIntroId { background: #f1f1f3 ; background-size: cover; position: relative; padding: 6rem 0; }
#mainIntroBg .FrmCtr  { min-height: 591px; display: flex; justify-content: space-between; align-items: center; max-width: 1169px; }
#mainIntroBg .FrmCtr .sideIntro { width: 100%; max-width: 509px; color: #000;  padding-top: 0;  font-size: 10px; padding-right: 4rem; }
#mainIntroBg .FrmCtr .sideIntro .ln1 { font-size: 1.5em; line-height: 1.2em; font-weight: 400; margin: 0; padding-bottom: 1em;  letter-spacing:  0.04em;   }
#mainIntroBg .FrmCtr .sideIntro .ln1 span.un { border-bottom: solid 0.35em  var(--color-primary); display: inline-block; }
#mainIntroBg .FrmCtr .sideIntro .ln1 span.grad { display: inline-block; background: -webkit-linear-gradient(0deg, #fe4e55 0%, #fe7948 92%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; position: relative;  padding: 0.015em;  z-index: 22;   }
#mainIntroBg .FrmCtr .sideIntro .ln2 { font-size: 6em; line-height: 1.1em; font-weight: 400; margin: 0; max-width: 12em; padding-bottom: 0.07em; text-transform: none;  letter-spacing:  -0.05em;    }
#mainIntroBg .FrmCtr .sideIntro .ln2 .rg { font-weight: 400;}
#mainIntroBg .FrmCtr .sideIntro .ln3 { font-size: 2em; line-height: 1.64em; padding-bottom: 1.8em; max-width: 25em; padding: 1.6em 0 2.2em 0; color: #565656; }
#mainIntroBg .FrmCtr .sideIntro .ln4 { font-size: 1.4em; line-height: 1.2em; padding-top: 2.4em; }
#mainIntroBg .FrmCtr .sideIntro .btn { font-size: 18px!important; display: block; }
#mainIntroBg .FrmCtr .sideTmb { width: 83%; max-width: 618px; background: url("../images/main_intro_tmb.jpg") no-repeat center right; background-size: contain;  }
#mainIntroBg .FrmCtr .sideTmb:after { content: ' '; display: block;  padding-top: 69%; }

@media all and (min-width: 1270px) {
#mainIntroBg .FrmCtr, .mainIntroBg .FrmCtr3, #mainHdr .ctr { padding-left: 8rem; padding-right: 8rem;  } 
}
@media all and (max-width: 992px) {
#mainIntroBg .FrmCtr  { flex-direction: column; justify-content: center;  }
#mainIntroBg .FrmCtr .sideIntro  { font-size: 10px; text-align: center; padding-right: 0; }
#mainIntroBg .FrmCtr .sideIntro .ln2, #mainIntroBg .FrmCtr .sideIntro .ln3 { margin: 0 auto; }
#mainIntroBg .FrmCtr .sideTmb { width: 76%; max-width: 329px; margin-top: 4rem; }
#mainDrop { margin: 0 auto; }
}
@media all and (max-width: 767px) {
#mainIntroId  { padding: 63px 0 0 0}
#mainIntroBg .FrmCtr { min-height: 96vw; }
#mainIntroBg .FrmCtr .sideIntro  { z-index: 2; position: relative; font-size: 10px;   text-align: center;  }
#mainIntroBg .FrmCtr .sideIntro p { margin-left: auto!important; margin-right: auto!important; }
#mainIntroBg .FrmCtr .sideIntro .ln2 { padding-bottom: 0.14em;}
#mainIntroBg .FrmCtr .sideIntro .ln3 { max-width: 25em; }
}
@media all and (max-width: 684px) { 
#mainIntroBg .FrmCtr .sideIntro .ln2 {  }
#mainIntroBg .FrmCtr .sideIntro .ln3 {  padding: 0.8em 0 1.4em 0; }
}
@media all and (max-width: 576px) {
#mainIntroBg .FrmCtr .sideIntro  { font-size: 2.3vw; }
}

/* Main Drop
--------------------------------------------------------------*/
#mainDrop { max-width: 374px; }
#mainDrop .input { background: #fff; display: flex; justify-content: left; align-items: center;  width: 100%; padding: 0 1em 0 0em; border-radius: 3px; font-size: 15px; font-weight: 500; color: #969696; height: 3.2em; margin-bottom: 20px; box-sizing: border-box; text-align: left; border: solid 2px #000;  }
#mainDrop .input .ico { min-width: 1.7em; max-width: 1.7em; margin: auto 0.7em; }
#mainDrop .input .ico img { width: 100%; }
@media all and (max-width: 479px) {
#mainDrop .input, #mainIntroBg .FrmCtr .sideIntro .btn { font-size: 3.3vw!important;}
}
/* Main Btm
--------------------------------------------------------------*/
#mainBtm { background: #b30b00;   }
#mainBtm .bg { background: #f0eff5; -webkit-border-top-left-radius: 5rem; -webkit-border-top-right-radius: 5rem; -moz-border-radius-topleft: 5rem; -moz-border-radius-topright: 5rem; border-top-left-radius: 5rem; border-top-right-radius: 5rem; max-width: 1920px; margin: 0 auto; padding: 5rem 8rem;  }
#mainBtm .bg .FrmCtr { max-width: 1520px; }
#mainBtm .bg .title { font-size: 36px; padding-bottom: 0;  }
#mainBtm .bg .title em { font-style: italic; font-weight: 400; }
#mainBtm .bg .quotes { display: flex; justify-content: space-between; }
#mainBtm .bg .quotes .itm { width: 416px; max-width: calc(33.33% - 1.8rem); }
#mainBtm .bg .quotes .itm .dtls { display: flex; align-items: center; font-size: 10px;  }
#mainBtm .bg .quotes .itm .dtls .tmb { width: 4.7em; margin-right: 2em;  }
#mainBtm .bg .quotes .itm .dtls .name { font-size: 1.6em; line-height: 1.1em; font-weight: 700; padding-bottom: 0.4em; }
#mainBtm .bg .quotes .itm .dtls .city { font-size: 1.3em; color: #666666; padding-bottom: 0;  }
#mainBtm .bg .quotes .itm p.quote { font-size: 2.4em; line-height: 1.5em; padding: 2em 0;  }
@media all and (max-width: 1780px) {
#mainBtm .bg { padding: 0 6rem; }
#mainBtm .bg .quotes .itm { font-size: 9.5px; }
}
@media all and (max-width: 1410px) {
#mainBtm .bg .quotes .itm { font-size: 0.66vw; }
}
@media all and (max-width: 1270px) {
#mainBtm .bg { padding: 0; }
}
@media all and (max-width: 992px) {
#mainBtm .bg { text-align: center; max-width: 715px; }
#mainBtm .bg .title { font-size: 30px; }
#mainBtm .bg .quotes { flex-direction: column; align-items: center; }
#mainBtm .bg .quotes .itm  { width: 426px; max-width: 100%; font-size: 7.2px;  }
#mainBtm .bg .quotes .itm p.quote { margin: 0 auto; max-width: 25em; }
#mainBtm .bg .quotes .itm .dtls  { justify-content: center; text-align: left; }
}
@media all and (max-width: 576px) {
#mainBtm .bg .title { font-size: 5.2vw; }
#mainBtm .bg .quotes .itm  { font-size: 1.25vw;  }
}
@media all and (max-width: 479px) {
#mainBtm .bg .quotes .itm { font-size: 1.35vw; }
#mainBtm .bg .quotes .itm .dtls { font-size: 1.65em; }
}
/* 
////
//// Mainpage (members)
////
--------------------------------------------------------------*/
/* Main Intro
--------------------------------------------------------------*/
#mainIntro { display: flex; justify-content: center; align-items: center; color: #000; text-align: center; position: relative; z-index: 10; padding-top: 4rem;  }
#mainIntro .title { font-size: 73px; line-height: 1.3em;  padding-bottom: 0; font-weight: 500;  }
#mainIntro .title strong { font-weight: 600; }
#mainIntro  p { font-size: 18px; letter-spacing: -0.01em; display: block; margin: 0 auto; max-width: 42em;  padding: 1.3em 0;  line-height: 1.63em; }
#mainIntro  p:last-child { padding-bottom: 0; }
@media all and (max-width: 1090px) {
#mainIntro .title { font-size: 8vw }
#mainIntro  p { font-size: 2.03vw;}
}
@media all and (max-width: 767px) {
#mainIntro .title { font-size: 7.4vw; line-height: 1.3em; padding-bottom: 0; }
#mainIntro  p { font-size: 3.2vw; max-width: 25em; line-height: 1.5em; }
}

/* Main Convert
--------------------------------------------------------------*/
#mainConvert { text-align: center; position: relative;  }
#mainConverter { background: rgba(69,69,69,0.85);  border-radius: 10px; padding: 30px; color: #fff; position: relative; z-index: 10; }
#mainConverter .innerBrd { border: dashed 2px rgba(255,255,255,0.8);  border-radius: 10px; padding: 30px;  }
#mainConverter .planType { position: absolute; top: -0.1px; line-height: 1.5em; background: #ff902c; padding: 0 0.65em; color: #fff; font-size: 15.5px; text-indent: 0; text-transform: uppercase; right: -0.1px; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomleft: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 5px; font-weight: 600; backface-visibility: hidden; }
#mainConverter .progress-container { left: calc(16% + (44px / 2)); width: calc(66% - (44px / 2)); height: 44px; display: flex;  align-items:center; justify-content: center; position: relative;  }

@-webkit-keyframes progress-bar-stripes{from{background-position:13px 0}to{background-position:0 0}}
@keyframes progress-bar-stripes{from{background-position:13px 0}to{background-position:0 0}}
#mainConverter .progress {display:-webkit-box;display:-ms-flexbox;display:flex;height:13px;overflow:hidden;font-size:.75rem;background-color:#e9ecef;border-radius:.25rem; width: 100%; }
.progress-container .progress {background-color: rgba(225,225,225,.6);}
.progress-bar {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:#fff;text-align:center;background-color:var(--color-secondary);transition:width .6s ease}
.progress-bar-striped{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:13px 13px}.progress-bar-animated{-webkit-animation:progress-bar-stripes 1s linear infinite;animation:progress-bar-stripes 1s linear infinite}
#mainConverter .step-number { background: var(--color-primary);  color: var(--background-color);  width: 44px;  min-width: 44px; height: 44px; line-height: 46px; font-size: 32px; opacity: 0.5; font-weight: 600; display: block;  position: absolute; top: 0.5px ;  }
#mainConverter .progress-container .step1  { left: -22px; } 
#mainConverter .progress-container .step2  { left: 50%; margin-left: -22px;  } 
#mainConverter .progress-container .step3  { right: -22px;  } 
#mainConverter .progress-container .active { box-shadow: 0 0 0 6px rgba(255,0,0,0.5); opacity: 1; }
#mainConvIn { display: flex; justify-content: center; align-items: flex-start; }
#mainConvIn .col  {max-width: 33.33%; min-width: 33.33%;  padding-top: 32px;  }
#mainConvIn .col button, #mainConvIn .col select , #mainConvIn .col .btn  { opacity:  0.5;   }
#mainConvIn .col:hover *, #mainConvIn .active button , #mainConvIn .active select, #mainConvIn .active  .btn { opacity: 1; }
#mainConvIn #step-2 { padding:32px 40px 0 40px; }
#mainConvIn .mobTitle { display: none; }
#mainConvIn .chooseBtnWrp { position: relative; display: inline-flex; vertical-align: middle; width: 100%; height: 42px;  line-height: 42px;  max-width: 180px;  }
#mainConvIn .chooseBtn { color: var(--color-primary); background: #fff; border:  solid 1px var(--background-color); border-right: 0; -webkit-border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-bottomleft: 6px; border-top-left-radius: 6px; border-bottom-left-radius: 6px; font-size: 14px; font-weight: 700; flex-grow: 1; padding-top: 3px;  font-family: "Karla", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; line-height: 1.6em; }
#mainConvIn .chooseBtnDrp { display: inline-block; color: var(--background-color); background: #fff; border:  solid 1px var(--background-color);  -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; padding: 0 14px;  padding-top: 1px; }
#mainConvIn .chooseBtnDrp:after { display: inline-block; margin-left: 0.255em;vertical-align: 0.255em; content: " "; border-top: 0.3em solid; border-right: 0.3em solid transparent; border-bottom: 0; border-left: 0.3em solid transparent; }
#mainConvIn  #inputFile { position: absolute; left: -8000px; top: 0; }
#mainConvIn .textSm { font-size: 13px; line-height: 1.6em;  padding: 8px 0 0 0;  }
#mainConvIn .textSm .emailNote { display: block; padding-top: 0.6em; }
#mainConvIn .textSm .emailNote input { position: relative; top: 0.2em; vertical-align: top; }
#mainConvIn a  { color: var(--color-primary); }
#mainConvIn svg { width: 1.6em; height: 1.6em; vertical-align:  top;  fill: currentColor;  }
#mainConvIn #step-2 select {  font-size: 14px;  height: 42px; text-align: center; width: 100%; border: solid 2px #fff; background-color: var(--background-color); color: #000; border-radius: 6px; font-weight: 700; max-width: 180px; margin: 0 auto; font-family: "Karla", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans;   font-weight: 700; }
#mainConvIn .btnConvert  {  font-size: 14px;  height: 42px; width: 100%; color: var(--background-color); border-radius: 6px;  max-width: 180px; margin: 0 auto;  font-family: "Karla", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans;  font-weight: 700; outline: 0!important;  border: 0!important;  }
#mainConvIn .btnConvert:after { border-radius: 6px;  }
#mainConvIn .emailWrp .input-group { display: flex; padding-top: 10px; }
#mainConvIn .emailWrp .ico {  border: solid 1px #d7d7d7;  -webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; display: flex; justify-content: center; align-items: center;  height: 35px!important; width: 36px; background: #f5f5f5; color: #8f8f8f; font-size: 14px;   }
#mainConvIn .emailWrp .ico svg path { fill: currentColor; }
#mainConvIn .emailWrp .email { border-color: #d7d7d7!important; font-size: 16px!important; height: 35px!important; border-left: 0; -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; flex-grow: 1; }
#mainConverter .secureTxt {  font-size: 13px; line-height: 1.6em; padding: 30px 0 0 0; }
#mainConverter .secureTxt a { color: #fff;  }
#mainConverter .secureTxt svg  { vertical-align:  top;  width: 1.4em; height: 1.4em; fill: currentColor;  }
@media all and (max-width: 1023px) {
#mainConvIn #step-2 { padding: 32px 20px 0 20px;}
}
@media all and (max-width: 800px) {
#mainConvert .FrmCtr2 { max-width: 540px; }
#mainConverter { padding: 20px; }
#mainConverter  .progress-container { display: none; }
#mainConvIn  { flex-direction: column; }
#mainConvIn .mobTitle { display: block; font-size: 16px; margin-bottom: 8px; font-weight: 400; }
#mainConvIn .col { width: 100%; min-width: 100%; max-width: none; padding-right: 0; padding:20px 0 0 0 !important;  }
}

/* Main Convert dropdown
--------------------------------------------------------------*/
.dropdown-menu { position:absolute;top:100%;left:0;z-index:1000;display:none;float:left; min-width:100%; padding:8px 0;margin: 2px 0 0 0; font-size:15px; line-height: 24px; color:#212529;text-align:left;list-style:none;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.15);border-radius:4px; }
.dropdown-item { display:block;width:100%;padding:4px 24px;clear:both;font-weight:400;color:#212529;text-align:inherit;white-space:nowrap;background-color:transparent;border:0; }
.dropdown-item:focus,.dropdown-item:hover { color:#16181b;text-decoration:none;background-color:#e9ecef; }
.dropdown-item.active,.dropdown-item:active { text-decoration:none;background-color:#c6ddf5; }
.dropdown-item.disabled,.dropdown-item:disabled { color:#adb5bd;pointer-events:none;background-color:transparent; }
.dropdown-menu.show { display:block; }
#mainConverter .dropdown-menu a { display: flex; justify-content: flex-start; align-items: center; }
#mainConverter .dropdown-menu img { margin-top:-1px; min-width:22px!important;height: 22px!important;max-width: 22px; display: block; vertical-align:  top; margin-right: 8px;    }
#mainConverter .dropdown-menu, #mainConverter .dropdown-menu * { box-sizing: border-box ;}

/* Main Supported
--------------------------------------------------------------*/
#mainSupp { box-shadow: inset 0 200px 200px -200px #a0e2f3;}
#mainSupp .title { font-size: 24px; display: block; text-align: center; padding: 0 0 6rem 0; }
#mainSupp ul { display: flex; width: 100%; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
#mainSupp ul li { flex: 1 0 20%; padding-bottom: 6rem; }
/*#mainSupp ul li:nth-child(5n) { max-width: 191px; }*/
#mainSupp ul li .itmTitle { font-size: 25px; font-weight: 800; line-height: 1.1em; white-space: nowrap; display: block; padding: 1rem 0 0.4rem 0 ; }
#mainSupp ul li .fromTo { width: 191px; max-width: calc( 100% - 15px); display: flex;  }
#mainSupp ul li .desc { width: 191px; max-width: 100%; padding: 0;  color: #626870; font-size: 13px; line-height: 1.2em;  }
@media all and (max-width: 1294px) {
#mainSupp ul li .itmTitle { font-size: 23px; } 
}
@media all and (max-width: 1244px) {
#mainSupp ul li { flex: 1 0 25%; max-width: 25%;  }
}
@media all and (max-width: 980px) {
#mainSupp ul li { flex: 1 0 33.33%; max-width: 33.33%;  }
}
@media all and (max-width: 744px) {
#mainSupp ul { margin:0 auto; max-width: 480px;    justify-content: space-between;  }
#mainSupp ul li { flex: 1 0 46%; max-width: 46%; min-width: 46%;  padding-bottom: 4rem;}
}
@media all and (max-width: 454px) {
#mainSupp .title { font-size: 3.8rem; }
#mainSupp ul li .itmTitle { font-size: 3rem; }
#mainSupp ul li .desc { font-size: 1.85rem; }
}
/* Main Footer
--------------------------------------------------------------*/
#mainFtr  { color: #000000;  background: #ffffff; box-shadow:  -4000px 4000px 0 4000px #ffffff;  font-weight: 400; }
#mainFtr .FrmCtr { padding: 5rem 0; }
#ftrNav { display: block; font-size: 13px;  margin-bottom: 1.2em; text-align: center;  }
#ftrNav li { display: inline;  } 
#ftrNav li a { color: #000000; margin: 0 0.72em; }
#ftrNav li:first-child a { margin-left: 0; }
#ftrNav li a:hover { color: #000000;  }
#mainFtr .copy { font-size: 13px; line-height: 1.75em; padding-bottom: 0;  margin: 0 auto;  text-align: center;  }
@media all and (max-width: 869px) {
#ftrNav { margin:0 auto 1.4em auto; max-width: 30.5em; text-align: center;  }
#ftrNav li a { margin: 0 0.5em; } 
#ftrNav li span { display: none; }
}
@media all and (max-width: 572px) {
#ftrNav { font-size: 1.8rem; }
#ftrNav li { line-height: 1.4em; }
#mainFtr .copy { font-size: 1.8rem; }
}

/* 
////
//// Sign Up
////
--------------------------------------------------------------*/
/* Intro
--------------------------------------------------------------*/
#joinIntro  { margin-bottom: -146px;  padding-bottom: 146px; text-align: center; color: #000;   }
#joinIntro .marker { display: inline-block; background: url(../images/signup_marker_bg.svg) no-repeat top; background-size: 100% 100%; vertical-align: top;  text-transform: uppercase; font-weight: 700; padding: 0 0.75em; margin: 0 0.1em; }
#joinIntro .title { font-size: 36px;  line-height: 1.2em; padding:  0 0 0.6em 0; max-width: 27em;   margin: 0 auto; font-weight: 600;    }
#joinIntro  p { font-size: 18px; letter-spacing: -0.01em; display: block; margin: 0 auto; max-width: 38em;  padding: 0;  line-height: 1.63em; }
@media all and (max-width: 1080px) {
#joinIntro .title { font-size: 3.33vw }
#joinIntro  p { font-size:  1.6vw;}
}
@media only screen and (max-width:880px){
#joinIntro { padding-bottom: 0; margin-bottom: 0; }
}
@media all and (max-width: 767px) {
#joinIntro .title { font-size: 4.4vw;  line-height: 1.3em; padding-bottom: 0.5em; }
#joinIntro  p { font-size: 3vw; max-width: 25em; line-height: 1.5em; }
}
@media all and (max-width: 576px) {
#joinIntro  p { font-size: 3.4vw; max-width: 25em; line-height: 1.5em; }
}
/* 3 col join (c&p)
--------------------------------------------------------------*/
#joinPkg .genPad1 { padding-top: 0; }
#joinPkgSel  { display: flex; justify-content: center; max-width: 1266px; margin: 0 auto;  }
#joinPkgSel  * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#joinPkgSel .col { text-align: center; width: 33.33%;  padding: 0 10px; }
.plan-selected .plan-name, .plan-selected .plan-price__period, .plan-selected .plan-price__value, .plan-selected .plan-purpose, .is-selected .plan-name, .is-selected .plan-price__period, .is-selected .plan-price__value, .is-selected .plan-purpose { color: var(--color-secondary)!important; }
.plan{display:flex;flex-direction:column;height:100%;width:100%;padding:16px 20px 20px;border:1px solid rgba(255,255,255,.1);border-radius:4px;background:rgba(69,69,69,0.85);font-size:14px; cursor: pointer;}
.plan-chosen-period--monthly,.plan-price__value--monthly,.plan-select-button--monthly,a.plan-select-button--monthly{display:none;}
.plan__header{padding-bottom:17px;text-align:center;}
.plan-name{margin-bottom:17px;color:#fff;font-weight:800;font-size:20px;display:block;}
.plan-purpose{ color:rgba(255,255,255,0.7); font-weight:700;font-size:14px;line-height:20px;letter-spacing:-.2px;}
.plan-features-list{ margin-bottom:0;text-align:left; flex-grow: 1; }
.plan-features-list__item{position:relative;min-height:49px;border-top:1px dotted rgba(255,255,255,0.8);color: #fff; font-weight:600;display:flex;align-items:center;margin:0;padding:0 0 0 25px;height:49px;font-size:14px;line-height:18px;}
.plan-features-list__item:after { content: '\2022'; font-weight: 700; font-size: 1.6em; position: absolute; left: 0; top: 50%; margin-top: -0.4em; }
.plan-features-list__item:first-child{border-top:1px dotted rgba(255,255,255,0.8);}
.plan-features-list__item .plan-feature-icon{position:absolute;top:12px;left:0;}
.plan-features-list__item .plan-feature-icon:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;z-index:-1;background-repeat:no-repeat;}
.plan-features-list__item--label{padding:0;display:block;}
.plan-features-list-label{display:flex;align-items:center;position:relative;padding:6px 10px 6px 25px;width:100%;height:100%;color:rgba(255,255,255,0.7);font-weight:600;cursor:pointer;font-size:14px;line-height:18px;}
.plan-features-list-label--signnow .plan-features-list-label__icon{top:14px;left:3px;}
.plan-features-list-label--uslegal .plan-features-list-label__icon{top:15px;left:-1px;}
.plan-features-list-label:hover .plan-features-list-label__notification{opacity:1;}
.plan-features-list-label__icon{position:absolute;top:10px;left:10px;}
.plan-features-list-label__notification{position:absolute;top:-2px;left:-200px;z-index:3;padding:11px 16px 16px 15px;width:190px;border:1px solid rgba(0,0,0,.18);border-bottom-right-radius:4px;border-bottom-left-radius:4px;background-color:#fefefe;box-shadow:0 4px 12px 0 rgba(0,0,0,.15);color:#444;text-align:left;font-weight:400;font-size:12px;line-height:16px;opacity:0;cursor:default;pointer-events:none;}
.plans-list { text-align: center; font-size: 0; display: flex; justify-content: center; margin: 0 -10px; }
@media only screen and (min-width:1070px){
.plan-features-list-label__notification{width:196px;left:-210px;}
}
@media only screen and (min-width:1440px){
.plan-features-list-label__notification{left:auto;right:-210px;}
}
.plan-features-list-label__notification:after,.plan-features-list-label__notification:before{position:absolute;top:18px;border-width:6px 0 6px 5px;border-style:solid;content:"";}
@media only screen and (min-width:1440px){.plan-features-list-label__notification:after,.plan-features-list-label__notification:before{border-width:6px 6px 6px 0;}
}
.plan-features-list-label__notification:before{right:-6px;border-color:transparent transparent transparent rgba(0,0,0,.18);}
@media only screen and (min-width:1440px){
.plan-features-list-label__notification:before{left:-6px;right:auto;border-color:transparent rgba(0,0,0,.18) transparent transparent;}
}
.plan-features-list-label__notification:after{right:-5px;border-color:transparent transparent transparent #fefefe;}
@media only screen and (min-width:1440px){
.plan-features-list-label__notification:after{left:-5px;right:auto;border-color:transparent #fefefe transparent transparent;}
}
.plan-features-list-label__line{position:absolute;width:100%;top:-1px;left:0;height:3px;background-color:#ff9000;border-top-right-radius:2px;border-top-left-radius:2px;z-index:2;}
.plan-features-list-label__notification-title{margin-bottom:8px;font-weight:700;}
.plan--basic{box-shadow:none;}
.plan__view-more-features{position:relative;margin-top:auto;margin-bottom:18px;text-align:center;}
.plan__view-more-features:before{position:absolute;top:50%;display:block;width:100%;height:1px;background:#ccc;content:"";}
.view-more-link{display:inline-block;cursor:pointer;position:relative;padding:5px 13px;min-width:63px;border:1px solid #ccc;border-radius:4px;background:#fff;color:rgba(255,255,255,0.7);content:"View More";vertical-align:top;font-weight:700;font-size:12px;transition:background .2s;}
.view-more-link:hover{background:#f9f9f9;}
.plan__price{position:relative;z-index:1;display:table;margin:0 auto 20px;min-height:66px;max-width:260px;width:100%;height:66px;font-size:0;}
.plan__body .plan__price{display:flex;justify-content:center;align-items:center;margin-bottom:13px;}
.plan__body .plan__price:before{content:"";position:absolute;top:auto;bottom:-4px;left:50%;transform:translateX(-50%);height:1px;width:46px;background:#ccc;}
.plan__body .plan__price .plan-price{display:block;width:57%;height:auto;text-align:right;}
.plan__body .plan__price .plan-price__value{font-size:38px;font-weight:600;}
.plan__body .plan__price .plan-price__value:before{margin:-7px 4px 10px 0;}
.plan__body .plan__price .plan-price__value span { font-size: 0.65em; vertical-align: top; line-height: 1.9em; }
.plan__body .plan__price .plan-price-details{ display:block;width:55%;padding-left:11px;line-height:16px;font-weight:700;}
.plan__body .plan__price .plan-price-details__content{width:100%;}
.plan__body .plan-chosen-period{margin-bottom:25px;font-size:12px;}
.plan-price{position:relative;display:table-cell;height:inherit;background: none;vertical-align:middle;text-align:center;}
.plan-price__value{position:relative;color:rgba(255,255,255,0.7);letter-spacing:-1px;font-weight:600;font-size:55px;line-height:55px;}
.plan-price__value:before{display:inline-block;margin:-8px 4px 12px 0;content:"$";vertical-align:top;font-size:22px;font-weight:700;}
.plan-price--default .plan-price__value{color:rgba(255,255,255,0.7);}
.plan-chosen-period{margin-bottom:24px;color: rgba(255,255,255,0.7);line-height:18px;text-align: center; }
.plan .includes  { color: rgba(255,255,255,0.7); line-height: 14px; text-align: center; font-size: 13px; }
.plan-price-details{display:none;padding:0;width:50%;color:#ffffff;vertical-align:middle;text-align:left;font-size:14px;line-height:18px;}
.plan-price-details__content{margin:0 auto;width:70px;}
.plan-schedule-title{margin-bottom:10px;color:rgba(255,255,255,0.7);text-transform:uppercase;font-weight:700;line-height:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.plan-period-select { width: 100%; font-size: 16px!important; height: 2.2em!important; }
.plan__footer{padding-top:2px;}
.plan-select-button{padding:18px 5px;width:100%;letter-spacing:-1px;font-weight:700;line-height:20px;}
.selectric-hide-select .selectric-wrapper{visibility:hidden;opacity:0;}
.plan__body{display:flex;flex-grow:1;flex-direction:column;}
.plan--with-ribbon{position:relative;}
.plan--with-ribbon:after,.plan--with-ribbon:before{position:absolute;top:-10px;right:-9px;display:block;width:91px;height:93px;background-size:contain;content:"";z-index:-1;}
.plan--with-ribbon:after{z-index:1;background:url(../images/signup_badge_gray.svg) no-repeat 50%;}
.plan--with-ribbon:before{background:url(../images/signup_badge_premium.svg) no-repeat 50%;}
.is-selected .plan--with-ribbon:before { z-index: 5; }
.plan-select-button { display: none; position: relative; min-width: 120px; border: 2px solid #a0a0a0; border-radius: 4px; background-color: #a0a0a0; background-image: none; font-weight: 600; color: #fff; vertical-align: middle; text-align: center; text-decoration: none;    cursor: pointer;    transition: all .15s ease-in;-webkit-user-select: none;    -moz-user-select: none;    -ms-user-select: none;user-select: none;touch-action: manipulation;-webkit-font-smoothing: antialiased;  font-size: 16px;  line-height: 20px;   padding: 10px 5px; letter-spacing: -0.01em; } 
.plan-select-button:hover { border: 2px solid #b3b3b3;  background: #b3b3b3 !important;}
.is-selected .plan-select-button { border: 2px solid var(--color-primary); background: var(--color-primary)!important; color: #fff; }
.is-selected .plan-select-button:hover { border: 2px solid  var(--color-primary);  background:  var(--color-primary)!important; color: #fff;}
.plan-select-button-selected { display: inline-block; }

@media only screen and (max-width:1069px){
#joinPkgSel .col { padding: 0 5px;  }
.plan-name { font-size: 16px; }
.plan-features-list__item, .plan-features-list-label, .plan-purpose { font-size: 13px; line-height: 1.1em; }
}
@media only screen and (max-width:880px){
#joinPkgSel  { max-width: 450px; flex-direction: column; }
#joinPkgSel .col { padding: 0; width: 100%; margin-top: 20px; }
#joinPkgSel .col:first-child { margin-top: 0; }
#joinPkg .plan-features-list{ flex-grow: none; }
}

/* 
////
//// Login 
////
--------------------------------------------------------------*/
/* Form
--------------------------------------------------------------*/
#loginWrp {   display: flex; justify-content: flex-start; align-content: stretch; }
#loginFormBg { flex-grow: 1 ; display: flex; justify-content:  center; align-items: stretch; padding: 6rem 2rem;  }
#loginForm {  padding: 4rem; max-width: 370px; background: rgba(69,69,69,0.95); color: #fff; border-radius: 5px;  }
#loginForm  .formTitle { font-size: 24px; line-height: 1.3em; font-weight: 500; padding-bottom: 0.15em;   } 
#loginForm  .formSubtitle  { color: rgba(255,255,255,0.7); font-size: 14px; font-weight: 400; line-height: 1.43em; margin-bottom: 20px; }
#loginForm .inputIco { position: relative; display: block;  }
#loginForm .inputIco input { padding-right:40.63px;}
#loginForm .passwordToggle { position: absolute; right: 0; top: 24px; height: 40.63px; width: 40.63px; display: flex; justify-content:  center; align-items: center; }
#loginForm .passwordToggle svg { width: 44%; height: 100%; }
#loginForm .passwordToggle svg path { fill: #919191; }
#loginForm .passwordToggle svg .st1 { display: none; }
#loginForm input[type=text] + .passwordToggle svg .st0 { display: none; }
#loginForm input[type=text] + .passwordToggle svg .st1 { display: block; }
#loginForm label .cards { float: right; white-space: nowrap; }
#loginForm label img { display: inline;  vertical-align:  top; height: 21.4px!important; width: auto!important;  margin-left: 2px;  }
#loginForm .cvvInfo { background-color: var(--color-secondary); color: #fff; display: block; position: absolute; right: 10px; top: 12px; width: 1.2em; height: 1.2em; line-height: 1.2em; font-size: 14px; font-weight: 700; text-align: center; z-index: 40;  border-radius: 3px; }
#loginForm .cvvInfo:hover { background-color:var(--color-secondary);}
#loginForm .passwordStrength { font-size: 11px; line-height: 1.2em; color:#919191; clear: both;  } 
#loginForm .passwordStrength svg { width: 1.2em; height: 1.2em; margin-right: 0.4em; position: relative; top: 0.2em;  }
#loginForm .tos { font-size: 12px; padding: 14px 0 20px 0; clear: both;   }
#loginForm .tos input[type="checkbox"] { position: relative;  display: inline-block; vertical-align:  top; width: 1.05em!important; height: 1.05em!important; font-size: 1.05em!important;  top: -0.1em;  }
#loginForm .tos a {color: #ffff00; }
#loginForm .tos a:hover { text-decoration: underline; }
#loginForm .ret {  font-size: 13px; line-height: 1.2em; width: 100%; display: block; padding: 15px 0 0 0; text-align: center;  }
#loginForm .ret a { color: #ffff00; }
#loginForm .ret a:hover { text-decoration: underline;}
@media all and (max-width:1240px){

}
@media all and (max-width:980px){
#loginFormBg { align-items: center; padding: 6rem 2rem; flex-direction: column; }
#loginForm {  margin-bottom: 2rem; }
#loginFormBg #loginForm + .col  { width: 100%; max-width: 450px; }
}
@media all and (max-width:576px){
#loginForm .formTitle { font-size: 20px; adding-bottom: 0.2em; }
#loginForm .buttonSoc { height: 36px; line-height: 36px;  }
#loginForm .buttonSoc span { display: none; }
#loginForm .buttonSoc svg { margin: 0 auto;  }
}
@media all and (max-width:472px){
#loginForm {  padding: 2rem; } 
}
@media all and (max-width:364px){
#loginForm .formSubtitle  {font-size: 13px; }
#loginForm .passwordStrength { font-size: 10.5px; }
#loginForm .tos { font-size: 11px;}
}
/* Selected Plan
--------------------------------------------------------------*/
#loginFormBg .col { margin-left: 20px; }
#loginFormBg .plan { border: 0; justify-content: center; }
#loginFormBg .plan .plan__body { flex-grow:0; }
#loginFormBg .plan__body .plan-chosen-period { margin-bottom: 0; }
@media all and (max-width:980px){
#loginFormBg .col { margin-left: 0px; }
}
/*cvv info modal
--------------------------------------------------------------*/
.popWrp { clear: left; height: 0; position: relative; font-size: 16px; z-index: 100; width: 100%; order: 3; }
.pop { background: #fff;   max-width: 350px; width: 100%; box-sizing: border-box; left: auto; right: 0;  margin: 30px auto; padding: 20px; position: absolute; border-radius: 13px; font-size: .7em; text-align: center; margin-bottom: 5px; z-index: 2; box-shadow: 0 2px 10px #00000052; top: 80px; opacity: 0; visibility: hidden; transition: all .2s ease;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;  right: 0; left: auto!important; }
.pop.active { opacity: 1; visibility: visible; top: -170px; } 
.pop p { margin-bottom: 10px; color: #6f7583; padding: 0 28px!important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box; }
.pop img { max-width: 70px; display:block; margin: 0 auto;   }
.close_pop { position: absolute; right: 0; top: 0; background: #bbc6cf; display: inline-block; border-radius: 50%; width: 30px; height: 30px; line-height: 30px; color: #fff; margin: 10px; font-weight: 700; transition: all .3s ease; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box; }
.close_pop:hover { cursor: pointer; opacity: .5 }


/* login Side
--------------------------------------------------------------*/
#loginSideWrp { background: #fff; flex-basis: 468px; max-width: 468px; text-align: center;  padding-bottom: 84px;  padding-top: 84px; }
#loginPromo img { margin: 0 auto; }
#loginPromo .promoTitle { color: #414141; font-size: 24px; font-weight: 700; line-height: 1.33; margin-top: 24px }
#loginPromo .promoDate { font-size: 12px; font-weight: 500; color: #808080;  margin-top: 20px; text-transform: uppercase;  }
#loginPromo .promoStats  { margin-top: 16px; }
#loginPromo .promoStats ul { display: flex; justify-content: center; }
#loginPromo .promoStats ul li { flex-basis: 33%; flex-grow: 1; max-width: 33%; position: relative;  }
#loginPromo .promoStats ul li:before { background-color: #e6e6e6; content: ""; display: block;  height: 24px; left: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 1px; }
#loginPromo .promoStats ul li:first-child:before { display: none; }
#loginPromo .promoStats ul li .statsNumber { color: #414141; font-size: 24px; }
#loginPromo .promoStats ul li .statsType { font-size: 10px; text-transform: uppercase; color: #808080; }
@media all and (max-width:1240px){
#loginSideWrp { display: none; }
}

/* 
////
//// Join2
////
--------------------------------------------------------------*/
#join2Wrp .formTitle { padding: 6rem 10px 4.5rem 10px; font-size: 30px; text-align: center; line-height: 1.2em;   }
#join2FormCols {  padding: 0  2rem 6rem 2rem; max-width: 1080px; margin: 0 auto;   }
#join2FormCols .row {  margin: 0 -15px; flex-grow: 1 ; display: flex; justify-content:  center; align-items: stretch; flex-wrap: wrap;  }
#join2Form, #join2Col { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; padding-right: 15px; padding-left: 15px; }
#join2Form .join2FormCont { border: solid 1px #ef5645;  border-radius:  3px; overflow: hidden; min-height: 100%;  }
#join2Form p.txt { font-size: 15px; line-height: 1.4em; }
#join2Form .amount  { color: #545454; font-size: 20px; line-height: 1.1em;  font-weight: 700; line-height: 20px; border-bottom: 1px solid #ef5645;  padding: 15px;   }
#join2Form .amount .stars { color: #fbbc04; }
#join2Form .amount .stars svg { width: 1em; height: 1.05em; margin-right: 0.1em; vertical-align: top; display: inline-block;  } 
#join2Form .amount .rgt { float: right; font-weight: 500; }
#join2Form .btmForm { padding: 15px 20px; }
#join2Form .cards { display: flex; align-items: center; justify-content: flex-end; margin-bottom: -15.8px; position: relative; z-index: 2; margin-top: 0px; top: -3px; float: right; }
#join2Form .cards img { height :22px!important; margin-left: 2px;  }
#join2Form label.text { text-transform: uppercase; font-size: 11px; font-weight: 500; color: #000;  }
#join2Form input, #join2Form select { background-color: rgba(255,255,255)!important; border-top: 0!important; border-right:  0!important; border-left: 0!important; border-bottom-width: 2px!important; border-radius: 0;  border-bottom-color: #cacaca; height: 36px!important; padding-left: 0!important; font-weight: 500;   }
#join2Form .inputFocused { border-color: var(--color-primary)!important;  box-shadow: 0 7px 7px -7px rgb(27,106,199,0.65);}
#join2Form input { padding-right: 0!important; }
#join2Form .frmLftHf { width: 50%; padding-right: 8px;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;   }
#join2Form .frmRgtHf { width: 50%; padding-left: 8px;   -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;  }
#join2Form .frmLft { width: 66.66%; padding-right: 8px;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;   }
#join2Form .frmRgt { width: 33.33%; padding-left: 8px;   -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box;  }
#join2Form .cvvInfo { background-color: var(--color-primary); color: #fff; display: block; position: absolute; right: 0; top: 25px; width: 1.2em; height: 1.2em; line-height: 1.2em; font-size: 14px; font-weight: 500; text-align: center; z-index: 40;  border-radius: 3px; }
#join2Form .cvvInfo:hover { background-color: #277add; }
#join2Form .secure { display: flex; justify-content: space-between; align-items: flex-end; clear: both; padding-bottom: 8px; padding-top: 15px;  }
#join2Form .secure .secureTxt { font-size: 11px; color: #424a5c; line-height: 1.4em;   }
#join2Form .secure .lock { color:  #4db70b; }
#join2Form .secure .lock svg { width: 1.4em; height: 1.2em; vertical-align: top; margin-right: 0.3em; margin-bottom: 0.3em;  float: left;  }
#join2Form .secure .cert { max-width:  100px; padding-left: 16px;  }
#join2Form .secure .cert img { margin-bottom: -4px;}
#join2Form .btnWrp { padding-top: 15px; }
@media all and (max-width:807px){
#join2Wrp .formTitle {  font-size: 22px; }
#join2Form, #join2Col { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; min-width: 100%; }
}
@media (max-width: 576px) {
#join2Form .amount { font-size: 16px; }
#join2Form .amount .stars svg { height: 1.1em;}
}
@media (max-width: 564px) {
 #join2Wrp .formTitle { padding: 4rem 10px 4rem 10px; }
}
@media (max-width: 479px) {
#join2Wrp .formTitle { font-size: 19px; }
#join2Wrp .formTitle2 { font-size: 18px; }
}
@media (max-width: 436px) {
#join2Form  .formWrp { display: flex; flex-wrap: wrap; justify-content: flex-start;  }
#join2Form .cardNum  { width: 100%; padding-right: 0; } 
#join2Form p { order: 1; }
#join2Form .frmExpM { width: 50%; order: 2; }
#join2Form .frmExpY { width: 50%; order: 3;  }
#join2Form .frmCvv { width: 50%; order: 4; padding-left: 0;  padding-right: 8px }
#join2Form .frmZip { width: 50%; order: 5; padding-left: 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#join2Form .cvvInfo { right: 8px; } 
#join2Form .secure { order: 10; }
#join2Form .btnWrp { order: 11; width: 100%;  }
}
@media (max-width: 364px) {
#join2Wrp .formTitle2 { font-size: 3.15em; }
#join2Form .cards { top: 0px; }
#join2Form .cards img { height: 15.8px!important;}
}
/* Col right
--------------------------------------------------------------*/
#join2Col h5 { font-weight: 700; font-size: 18px; }
#join2Col p { font-size: 15px; line-height: 1.4em;}
#join2Col p.review-star-text { padding-bottom: 0;  font-weight: 700; }
#join2Col .devices { background: url("../images/join2_devices.png") no-repeat center center; background-size: contain; padding-top: 36.95%; }
#join2Col .cert { padding:  10px 10px 20px 10px;}
#join2Col .cert img { max-width: 170px; margin: 0 auto;  }
#join2Wrp .tos { display: flex; justify-content: flex-start; align-items: flex-start; font-weight: 300; font-size: 12.7px; line-height:  1.4em; color: #9b9b9b; padding-top: 15px; }
#join2Wrp .tos input { width: 1.2em; height: 1.2em!important; margin-right: 0.4em;  }
#join2Wrp .tos  a { color: var(--color-primary);  }
#join2Wrp .tos  strong { font-weight: 600; }
@media all and (max-width:767px){
#join2Col { padding-top: 3.5rem; }
}
@media (max-width: 576px) {
#join2Col h5 { font-weight: 700; font-size: 16px; }
#join2Col p {  font-size: 13px;}
#join2Wrp .tos {  font-size: 11.5px; }
}
@media all and (max-width:413px){
#join2Col p {  font-size: 11.5px;}
#join2Wrp .tos {  font-size: 11px; }
}
/*review (c&p)
--------------------------------------------------------------*/
.review .review-header { margin: 10px 0 5px; display: block; font-size: 14px; font-weight: 700; text-overflow: ellipsis; width: 100%; line-height: 120%; font-style: italic; font-weight: 600; }
.review .review-text { font-size: 13px; line-height: 16px; color: rgba(0,0,0,.7); word-wrap: break-word; margin-bottom: 5px;  }
.card-review-slider.review-section { position: relative; padding: 10px 0 0; border-top: 1px #ccc solid; }
.card-review-slider.review-section p.review-star-text { font-size: 12px }
.card-review-slider.review-section ul.review { margin: 0 }
.card-review-slider.review-section .review li { padding: 0 0 28px; min-height: 0 }

@media(max-width: 767px) {
.card-review-slider.review-section .review li { min-height:0; }
}
.card-review-slider.review-section .review li img { width: 100% }
.card-review-slider.review-section .review li .review-text { margin-bottom: 5px }
.card-review-slider.review-section .swiper-button-next { right: 0; top: inherit; bottom: 0; z-index: 99; height: 30px }
.card-review-slider.review-section .swiper-button-prev { left: 0; top: inherit; bottom: 0; z-index: 99; height: 30px}
.card-review-slider.review-section.swiper-rtl .swiper-button-next { right: 0 }
.card-review-slider.review-section.swiper-rtl .swiper-button-prev { left: 0; right: auto }
.review-section .swiper-button-next:after,.review-section .swiper-button-prev:after { display: none }

@media all and (max-width:413px){
.review .review-text { font-size: 12px; }
}
/* 2 Col Horiz Mobile
--------------------------------------------------------------*/
.form2ColHz { min-width: 1110px;  width: 1110px;  flex-wrap: nowrap;  }
.form2ColHz #join2Form, .form2ColHz #join2Col { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; max-width: 50%; padding-left: 15px; padding-right: 15px;  } 
.form2ColHz #join2Col { padding-top: 0; }
@media (max-width: 564px) {
.form2ColHz { min-width: 200vw; width: 200vw; margin:0!important;  }
.form2ColHz #join2Form { min-width: calc(100vw - 4rem); max-width: calc(100vw - 4rem); padding-left: 0; padding-right: 0; }
.form2ColHz #join2Col { max-width: none;  flex-grow: 1; padding-right: 2rem; padding-left: 2rem; }
}
/*join-safe
--------------------------------------------------------------*/
.formSafe #join2Form .tos { font-size: 12px;  order: 10; }
 #join2Wrp .formSafe #join2Col .tos { font-size: 12px; color:#000; }
@media (max-width: 576px) {
.formSafe #join2Form .tos, #join2Wrp .formSafe #join2Col .tos {  font-size: 11.5px; }
}
@media all and (max-width:413px){
.formSafe #join2Form .tos, #join2Wrp .formSafe #join2Col .tos {  font-size: 11px; }
}
/* 
////
//// Members Main 
////
--------------------------------------------------------------*/

/* Attachments
--------------------------------------------------------------*/
#fileAttCont .title { font-size: 24px; display: block; padding: 0 0 2rem 0; }
#fileAttCont table { font-size: 16px; text-align:  left; width: 100%; max-width: 100%; box-shadow: 0 5px 10px 0px rgb(0,0,0,0.15); border-radius: 4px; overflow: hidden; color: #000; }
#fileAttCont  td { background: #fff; padding: 8px 7px; line-height: 1.1em;  }
#fileAttCont  td:last-child { text-align: right; }
#fileAttCont  tr:nth-child(odd) td { background: #f3f3f3; }
#fileAttCont  th { background: var(--color-primary); color: #fff;  font-weight: 500; font-size: 1.1em;  line-height: 1.1em;  padding: 8px 7px;   text-transform: capitalize;   }
#fileAttCont  th:first-child, #fileAttCont  td:first-child  { padding-left: 14px; }
#fileAttCont  th:last-child, #fileAttCont  td:last-child  { padding-right: 14px; }
#fileAttCont  a {  color: #2487eb; }
#fileAttCont  .delFile { display: inline-block;  transform: rotate(45deg); font-size: 1.8em; line-height: 0.9em; width: 0.9em;   text-align: center;  color: #f15641;}
#fileAttCont .downFile  { font-size: 1.8em; line-height: 0.9em; width: 0.9em; }
#fileAttCont  svg {  width: 0.9em; height: 0.9em; display: inline-block;  }
@media (max-width: 576px) {
#fileAttCont table { font-size: 12px; }
#fileAttCont  th, #fileAttCont  td  {  padding: 7px 5px;  }
#fileAttCont  th:first-child, #fileAttCont  td:first-child  { padding-left: 10px; }
#fileAttCont  th:last-child, #fileAttCont  td:last-child  { padding-right: 10px; }
#fileAttCont  td  { text-overflow: ellipsis;  word-break: break-all; }
}
@media (max-width: 454px) {
#fileAttCont .title { font-size: 3.8rem; }
}
@media (max-width: 364px) {
#fileAttCont table { font-size: 11px; }
}

/* 
////
//// Account Settings
////
--------------------------------------------------------------*/
#accountCont { display: flex; justify-content: flex-start; align-items: stretch; }
.accountSide { background: rgba(0,0,0,0.1); }
.accRgtCont { flex-grow: 1; padding: 40px 40px 20px 40px;  background: rgba(0,0,0,0.025);}
.accRgtCont .title { font-size: 20px; padding-bottom: 20px;}
.accRgtCont .formWrp { padding-bottom: 14px; max-width: 700px;  }
.accRgtCont .dtls { font-size: 16px; float: none;  font-weight: bold;  }
#accntSideNav { display: block;  font-size: 16px;  width: 14.23em; max-width: 14.23em;    }
#accntSideNav .site-nav-acnt { display: block;  padding: 40px 1em 40px 1em;  }
#accntSideNav .site-nav-acnt li { display: block; margin-bottom: 0.33em; }
#accntSideNav .site-nav-acnt h4 { font-size: 1em; padding: 0.4em 0.8em; display: block; text-decoration: none; text-transform: uppercase;  } 
#accntSideNav .site-nav-acnt a { font-size: 1em; color: #000; position: relative; display: block;  padding: 0.4em 0.8em;  text-decoration: none; border-radius: 40px;   }
#accntSideNav .site-nav-acnt a svg { width: 1.2em; vertical-align: top; padding-right: 0.3em; height: 1.2em; }
#accntSideNav .site-nav-acnt a:hover { background: rgba(0,0,0,0.06); }
#accntSideNav .site-nav-acnt a.cur { color: var(--color-primary);  cursor: default; background: rgba(0,0,0,0.06); }
.sep {  width :100%; height: 1px; margin: 20px 0 30px 0; background: rgba(0,0,0,0.3); }
.sideWrp { padding-bottom: 20px;}
.accRgtCont .userText, .accRgtCont .confMsg { font-size :14px; padding-bottom:1.2em; overflow: hidden; }
.accRgtCont .userText a { color: var(--color-primary); }
@media all and (min-width: 1000px) {
.accountContWrp { overflow: visible!important;   }
#accountSide  #accntSideNav  {  -webkit-overflow-scrolling:touch;-ms-overflow-style:none;box-sizing:border-box;flex-shrink:0  overflow-y:auto; overscroll-behavior-y:contain ; position:-webkit-sticky; position:sticky; scrollbar-width:none; top:95px; }
}
#acctTransTbl { width: 100%; max-width: 800px; border-color: rgba(0,0,0,0.1);   }
#acctTransTbl th { font-size: 16px;  background: rgba(0,0,0,0.1);  }
#acctTransTbl th:last-child, #acctTransTbl td:last-child { text-align: right; }
#acctTransTbl th, #acctTransTbl td { text-align:  left; padding: 6px 10px; }
#acctTransTbl tr:nth-child(odd) { background: rgba(0,0,0,0.05); }
#acctTransTbl td { font-size: 14px; word-break: break-all; hyphens: auto; -ms-hyphens: auto; -webkit-hyphens: auto; }
#acctTransTbl td:first-child {  word-break: normal; }
#acctTransTbl td .format { display: inline-block; border-radius: 10px; background: #f15641; font-weight: 600; font-size: 0.7em; color: #fff; vertical-align:  top;  padding: 0 0.5em; white-space: nowrap;  }
#acctTransTbl td .destFormat {  background: var(--color-primary); color: #fff; } 
#acctTransTbl td .downFile { display: inline-block; font-size: 1.4em;  color: #2487eb; }
#acctTransTbl td .downFile svg { width: 1em; height: 1em; vertical-align: middle; position: relative; top: -0.05em;  }
#acctTransTbl td .delFile { display: inline-block; font-size: 2.1em; color: #f15641; transform: rotate(-45deg); line-height:0.9em; width: 0.9em; vertical-align: middle; height: 0.9em; position: relative; top: 0.04em;  }
#acctTransTbl td .downFile+ .delFile { margin-left: 2px; }
@media all and (max-width:1020px) {
#acctTransTbl th { font-size: 14px; }
#acctTransTbl td { font-size: 12px; }
}
@media all and (max-width:867px) {
.accRgtCont { flex-grow: 1; padding: 40px 2rem 20px 2rem;  background: rgba(0,0,0,0.025);}
#acctTransTbl .head { display: none;}
#acctTransTbl td { font-size: 14px;  padding: 0px 6px; min-height: 30px; vertical-align: middle;  display: flex; justify-content: flex-end; align-items: center; border: none; border-top: solid 1px rgba(0,0,0,0.05); position: relative; padding-left: 81px; white-space: normal; text-align:right; }
#acctTransTbl  td:before { content: attr(data-type); padding-right: 10px; white-space: nowrap; text-align: left;  font-weight: bold; display: flex; position: absolute; left: 0; padding-left: 1em; align-items: center; align-content: center; height: 100%;top: 0;  }
#acctTransTbl .head + tr td:first-child { border-top: 0; }
#acctTransTbl td .delFile { top: 0.12em;} 
#acctTransTbl td .format { position: relative; top: -0.4em; margin: 0 0 0 2px; }
}
@media all and (max-width:620px) {
.accountSide {  display: none; } 
}
@media all and (max-width:364px) {
#acctTransTbl td { font-size: 12.5px; }
}

