@charset "UTF-8";
:root {
--header-background: #000000;
--header-text: #fff;
--header-text-hover: #fff;
--bg-nav-mobile:  #0a0a0a;
--bg-nav-active: #333333;
--txt-nav-mobile:  #fff;
}
body,html { padding: 0; margin: 0; }
body { -webkit-font-smoothing: antialiased; margin: 0px; font-family: "Roboto", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; }
.layout-container  { overflow-x: hidden; }
/* Button
--------------------------------------------------------------*/
.btn, .btn:active, .btn:focus { border: 0; display: -moz-inline-stack; display: inline-block; zoom: 1; *display:inline;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 3; text-align: center; color: #fff;  letter-spacing: 0; background: rgba(0,0,0,0); outline: 0!important; box-shadow: none!important; text-decoration: none; }
.btn:after { content: ' ';  position: absolute; left: 0; top: 0; bottom: 0; right: 0; display: block; z-index: -2; background: #000000; -webkit-background-clip: padding-box;   background-clip:  padding-box; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;}
.btn:active:after, .btn:active:before  { left: 1.3px; top: 1.3px; bottom: 1.3px; right: 1.3px; }

.genBtn1 { padding: 1.1em 1.9em 1.05em 1.9em;  line-height: 1.1em; font-size: 16px;   font-family: "Roboto", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; font-weight: 700; letter-spacing: 0.035em!important;  text-transform: uppercase; white-space: nowrap;   }

/* Mobile Size
-----------------------*/
@media all and (max-width: 572px) {
.genBtn1{ font-size: 13px!important; }
}
@media all and (max-width: 479px) {
.genBtn1{ font-size: 11px!important; }
}
@media all and (max-width: 364px) {
.genBtn1 { font-size: 9.5px!important; }
}
/* Button Colors
-----------------------*/
.btnC1 { color: #fff!important; }
.btnC1:after {  background: #1d84f7!important; }
.btnC2 { color: #fff!important; }
.btnC2:after {  background: none!important; }

/* logo 
-----------------------------*/
#mainLogo { display: block;  width: 181px;  max-width: 181px; text-align: center; position: relative; margin: 0; }
#mainLogo a { display: inline-block; white-space: nowrap; font-size: 56px; line-height :56px; text-indent: -8000px; background: url("../images/logo.svg") no-repeat center center; background-size: contain; color: #000; position: relative; z-index: 1; width: 100%;     }
@media all and (max-width: 767px) {
#mainLogo  a {  font-size: 48px;}
}
@media all and (max-width: 667px) {
#mainLogo { margin-left: 44px; display:  inline-block; width: auto; }
}
@media all and (max-width: 576px) {
.nav-hamburger + #mainLogo { margin-left: 54px!important; }
}
/* Main Header
--------------------------------------------------------------*/
#mainHdr { background: var(--header-background); padding: 0 0;  font-family: "Roboto", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; box-shadow: /*0 -10px 20px 10px rgba(0,0,0,0.1)*/; position: relative; z-index: 120;  border-bottom: solid 1px #000; }
#fullWrp .introHeader { box-shadow:  none!important;  }
#mainHdrBg { position: absolute; left: 0; top: 0; width: 100%; height :100%; z-index: -1; overflow: hidden;   }
#mainHdr .nav-hamburger { display: none; }
#mainHdr  .ctr { padding: 0 20px; margin: 0 auto; position: relative }
#mainLogo {   z-index:  10; position: relative; }
#mainHdr .mainHdrOpt li { position: relative; }
#mainNav .site-nav  li a {  color: var(--header-text); text-decoration: none; }
#mainNav .site-nav  li a:hover {  color: var(--header-text-hover);  }
#mainNav .site-nav  li a span.bonus {  position: absolute; top: -1.6em; line-height: 1.45em; background: #F6A624; padding: 0 0.55em; color: #fff;  left: 50%; transform: translate(-50%, 0%); font-size: 12.48px; }
#mainSignNav {  display: flex; justify-content: flex-end; height: 56px; align-items: center; white-space: nowrap;  font-size: 16px; font-weight: 700; text-transform: uppercase; float: right; }

#mainSignNav a:last-child  { margin-left: 20px; }
#mainSignNav a { color: var(--header-text); text-decoration: none;  }
#mainLogo .planType { position: absolute; top: 0; line-height: 1.45em; background: var(--bg-nav-mobile); padding: 0 0.55em;color: #fff; font-size: 12.48px; left: 104%; text-indent: 0; text-transform: uppercase; }
#mainHdr .btmHdr { background: #142978; padding: 15px 0; font-size: 16px; color: #fff; position: relative; z-index: 10;   }
@media all and (min-width: 1400px) {
#mainSignNav a:first-child { padding-left: 0; }
}
@media all and (max-width: 1399px) {
#mainHdr .topHdr .ctr { display: flex; align-items: center; justify-content: space-between; }
#mainHdr .mainHdrOpt li span.bonus  {  font-size: 11.5px; }
#mainSignNav a:last-child { margin-left: 15px; }
.nav-hamburger + #mainLogo { margin: 0 0 0 61px; width: 266px; } 
}
@media all and (max-width: 1360px) {
#mainHdr .mainHdrOpt li span.bonus  {  font-size: 10.5px; }
}
@media all and (max-width: 960px) {
#mainHdr .btmHdr { line-height: 1.1em; text-align: center; }
#mainHdr .btmHdr .ctr { max-width: 26em; }
}
@media all and (max-width: 680px) {
.nav-hamburger + #mainLogo { margin: 0 0 0 50px; width: 166px; } 
#mainHdrBg:after {  left: 110px; }
}
@media all and (max-width: 572px) {
#mainLogo .planType { display: none;}
#mainHdr .btmHdr .ctr { font-size: 14px; line-height: 1.1em;}
#mainSignNav {  font-size: 15px; }
#mainSignNav a:last-child { margin-left: 0px; }
}
@media all and (max-width: 440px) {
.nav-hamburger + #mainLogo { margin: 0 0 0 40px!important; width: 34vw; } 
#mainHdrBg:after {  left: calc(62vw - 176px); }
#mainHdr .btmHdr .ctr { font-size: 12px; line-height: 1.1em;}
}
@media all and (max-width: 364px) {
#mainSignNav { font-size: 13px!important; }
}
/* Main  Menu
--------------------------------------------------------------*/
#mainHdr ul { list-style: none; margin: 0 auto; padding: 0;  }
@media all and (min-width: 1400px) {
#mainHdr #mainNav { display: flex; justify-content: space-between; align-items: center; font-weight: 700; text-transform: none; font-size: 16px; line-height: 1.2em; max-width: 860px; width: 100%; padding: 0.25px 30px 0 30px;  }
#mainHdr #mainNav .site-nav { width: 100%; }
#mainHdr .topHdr { padding: 25px 0; margin: 0 20px; position: relative; z-index: 1;    }
#mainHdr .topHdr .ctr { display: flex; align-items: center; justify-content: space-between; padding: 0;  }
#mainHdr .topHdr .date { display: block; position: absolute; left: 30px; top: 50%; margin-top: -0.5em; font-size: 15px; line-height: 1em; }
#mainHdr .mainHdrOpt {  width: 100%;   display: flex;  justify-content: space-between; align-items: center; list-style: none;   }
#mainHdr .mainHdrMem  { max-width: 540px;  margin: 0 auto; padding: 0; }
#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: 3px   0; margin: 1.25px 0 0; font-size: 16px; 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: 0.25rem; }
#mainNav .site-nav .dropDown li a { padding: 3px  6px; font-weight: normal; font-size: 12.8px; line-height: 1.9em; display: block; white-space: nowrap;   }
#mainNav .site-nav .dropDown li a:hover { background: #eee; }
#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 var(--bg-nav-mobile); 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 (min-width: 1439px) {
#mainHdr #mainNav { max-width: 915px; }
}
@media all and (min-width: 1571px) {
#mainHdr #mainNav { max-width: 985px; }
}
@media all and (min-width: 1840px) {
 #mainHdr .topHdr { margin: 0 75px;}
}
@media all and (max-width: 1399px) {
#mainHdr .topHdr { padding: 15px 0;  }
#mainHdr .topHdr .date { display: none; }
/*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: 20px; top: 9px;  }
.nav-hamburger::before, .nav-hamburger::after, .nav-hamburger span { background-color: #fff; transition: all 0.3s ease-in-out 0s; }
.nav-hamburger::before, .nav-hamburger::after, .nav-hamburger span { background-color: #fff; }
.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: var(--txt-nav-mobile); opacity: 0; }
.menuOpen .nav-hamburger::before { background-color: var(--txt-nav-mobile); transform: rotate3d(0, 0, 1, 45deg); }
.menuOpen .nav-hamburger::after { background-color: var(--txt-nav-mobile); transform: rotate3d(0, 0, 1, -45deg); }
.nav-hamburger { position: absolute; left: 0; top: 14px; z-index: 1001; cursor: pointer;  }

#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(--bg-nav-mobile);  }
#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: 71px; }
#mainNav .site-nav  li a {  background: var(--bg-nav-mobile); display: block; padding: 16px 20px 16px 20px!important; color: var(--txt-nav-mobile)!important; 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: 500;  letter-spacing: 0.145em; 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:  var(--txt-nav-mobile);  background:var(--bg-nav-active); }
#mainNav .site-nav  li a:active  { background:var(--bg-nav-active); }
#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(--bg-nav-mobile); color: #fff; display: block!important; max-width: 300px; top: 0;  box-shadow: -1000vh 900vh  0 1000vh var(--bg-nav-mobile), -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;  }
}

/* Account Nav
--------------------------------------------------------------*/
.accountNav { background:var(--bg-nav); color: #000; display: block!important; max-width: 320px; top: 0;  box-shadow: 1000vh 900vh  0 1000vh #fff,-1000vh  900vh 20px 1000vh  rgba(0,0,0, 0.0); position: absolute; right: 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; z-index: 2000;  }
.accountMenuOpen .accountNav  { -webkit-transform: translateX(0); transform: translateX(0); transform: translate3d(0, 0, 0);  -webkit-transform: translate3d(0, 0, 0); pointer-events: auto; box-shadow: 1000vh 900vh  0 1000vh #fff,-1000vh  900vh 20px 1000vh  rgba(0,0,0, 0.4);  }
.accountNav  { background: #fff; }
.closeNav { background: none; border: 0 none; cursor: pointer; display: block; height: 35px; margin-bottom: auto; margin-top: auto; outline: none; padding: 0; position: absolute; right :20px; top: 20px;   width: 30px; }
.closeNav:before, .closeNav:after { background-color: #000;  content: ""; height: 2px; left: 0; position: absolute; top: 50%; transform-origin: 50% 50% 0; width: 100%; }
.closeNav:before { transform: rotate3d(0, 0, 1, 45deg);}
.closeNav:after { transform: rotate3d(0, 0, 1, -45deg); }
.accountNav ul { padding: 86px 30px 30px 30px!important; margin: 0; list-style:  none; }
.accountNav ul li { display: block; }
.accountNav ul li.ln1 { font-size: 22.5px; padding: 20px 0 ; border-bottom: solid 1px rgba(0,0,0,0.15); margin-bottom: 20px;  }
.accountNav ul li.hd1 { font-size: 18px;  font-weight: 700; text-transform: uppercase;  }
.accountNav ul li.ln2  { font-size: 18px; padding-bottom: 20px;  }
.accountNav ul li.btnWrp { padding: 0px 0 20px 0; border-bottom: solid 1px rgba(0,0,0,0.15);  margin-bottom: 20px; }
.accountNav ul li.btnWrp .btn { font-size: 13.6px!important; display: block; padding: 0.973em 0.8em 0.83em 0.8em; }
.accountNav ul li a.lnk { font-size: 16px; display: block; padding: 10px  0; color :#000; text-decoration:  none; position: relative; border-top: solid 1px rgba(0,0,0,0.15); }
.accountNav ul li a.lnk svg { position: absolute; right: 0; top: 50%; margin-top: -0.55em; height: 1.1em; width: auto; display: block; }
.accountNav ul li.hd2 { font-size: 18px;  font-weight: 700; text-transform: uppercase;  padding: 10px 0;   }
.accountNav ul li a.logOut { font-weight: bold; margin-top: 40px; border-top: 0; }
@media screen and (max-width: 768px) {
.accountNav { max-width: 300px;}
.closeNav { right: 15px; top: 15px; }
.accountNav ul { padding: 85px 15px 15px 15px!important; margin: 0; list-style:  none; }
}



/*footer*/
.mainFtr { padding: 30px 15px; text-align: center;  border-top: 1px solid #e4e4e4; box-shadow: inset 0 11px 5px -10px  rgba(0,0,0,0.09), 0 4000px 0 4000px #f9f9f9 ; background: #f9f9f9; font-size: 14px; font-family: "Rajdhani", "Helvetica Neue", Arial, "Nimbus Sans L", FreeSans; }
.mainFtr .ftrLogo { margin-bottom:  0.7em; padding: 0;  }
.mainFtr .ftrLogo img { max-width: 265px; margin: 0 auto; display: block;  }
.ftrNav { list-style:none; margin:  0 0  0.7em 0;  padding: 0; list-style: none;  }
.ftrNav li  { display: inline-block; padding: 0; margin: 0;  } 
.ftrNav li a { text-decoration: none; color:#221f20; } 
.ftrNav li a:hover { text-decoration: underline; color:#1d84f7}
.ftrCopy  { font-size: 9.5px; }
@media all and (max-width: 1160px ) { 
.ftrNav  { margin-left: auto; margin-right: auto; line-height :1.4em;   }
.ftrNav  span { display: none; }
}
@media all and (max-width: 480px ) { 
.ftrNav  { font-size: 3.1vw; line-height: 1.5em; }
}