body{background: #2d2d2d;
background: -webkit-linear-gradient(-45deg,  #2d2d2d 0%,#474747 12%,#353535 22%,#222222 34%,#222222 34%,#222222 40%,#282828 50%,#1e1e1e 63%,#2b2b2b 78%,#1c1c1c 91%,#022222 100%);
background: linear-gradient(135deg,  #2d2d2d 0%,#474747 12%,#353535 22%,#222222 34%,#222222 34%,#222222 40%,#282828 50%,#1e1e1e 63%,#2b2b2b 78%,#1c1c1c 91%,#022222 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d2d2d', endColorstr='#022222',GradientType=1 )}

html{min-height:100%;font-size:14px;}
body{color:#fff;font:300 14px/1.52 "Open Sans",sans-serif;line-height:1;min-height:100%;margin:0;padding:0;-webkit-text-size-adjust:none;}
body{-webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-font-smoothing:subpixel-antialiased !important;}
a{outline:none;color:#fff;text-decoration:none;}
a:hover{text-decoration:underline;}
a img{border:0;}
footer,header,nav,section{display:block;}
textarea{resize:none;}
img,input{max-width:100%;box-sizing:border-box;outline:none;}
input,button,textarea{font-family:"Open Sans",sans-serif;}
.lgt{font-weight:300;font-family:'Open Sans',sans-serif;}
.lgt>b{font-weight:800;}
.lgt{transition:transform .4s;display:inline-block;}
.lgt:hover{transform: rotateY(360deg);text-shadow:-1px 1px 13px #fff,-2px 2px 3px #000}	
@keyframes square {50%{opacity:0;}}
.lgt:hover{animation:square .4s cubic-bezier(1,1,1,1);}

 .cont{max-width:90%;width:400px;margin:0 auto;padding:0 0 8rem;position:relative;top:12vh;text-align:center;}
 .promo{}
 .promo a:link,.promo a:visited{font-size:2.4rem;display:block;margin-bottom:.5rem;}
 .promo a:hover{text-decoration:none}
 .promo a+p{font-size:.9rem;margin:0 0 2rem;cursor:default}
.pagetitle{font-weight:400;font-size:1.5rem;text-transform:uppercase;padding:20px 0;border-top:1px dotted #666;}
 .f-page .fline{min-height:5.3rem;}
 .text-danger{margin:5px 0 0;text-align:left;}
 .f-page input{background-color:#ddd;border-radius:2px;border:0;box-shadow:1px 1px 1px #999 inset;line-height:1.2rem;letter-spacing:.1rem;padding:.9rem .9rem .9rem 40px;font-size:1.2rem;display:block;width:100%;}
 .f-page input[type="email"]{background:url(img/user1.png) no-repeat 14px 50% #ddd}
 .f-page input[type="password"]{background:url(img/key.png) no-repeat 14px 50% #ddd; }
 .f-page input:focus{background-color:#fff;border:0;box-shadow:1px 1px 5px #444 inset;}
 .goline{border-bottom:1px dotted #666;padding:0 0 2.2rem;}
 .f-page .btn{display:block;width:200px;line-height:2.8rem;margin:0 auto;background:url(img/enter.png) no-repeat 30% 50% #f90;border:0;border-top:1px solid #f9d75a;border-bottom:2px solid #bb8a00;border-left:1px solid #e8c02a;box-shadow:1px 2px 5px rgba(0,0,0, .8);text-shadow:1px 1px 1px rgba(0,0,0, .3),1px 1px 15px rgba(255,230,100, .9);cursor:pointer;font-size:1.2rem;color:#fff;font-weight:400;border-radius:2px;}
 .f-page .btn:focus,.f-page .btn:hover{box-shadow:0px 0px 5px rgba(0,0,0, .8);text-shadow:0px 0px 1px rgba(0,0,0, .5),0px 0px 15px rgba(255,230,100, .9);outline:none;}
.btn:active{margin:1px auto -1px;}
.goline +a{display:inline-block;font-size:13px;line-height:20px;border-bottom:1px solid #bbb;margin-top:1rem}
.goline +a:hover{text-decoration:none;border-bottom:0;opacity:.7}

/*-----------------------*/
.all{}
.all>div{box-sizing:border-box;padding:2rem;display:inline-block;vertical-align:top;}
.lmenu{background:#333;position:fixed;top:0;bottom:0;left:0;;padding-left:7vw !important}
.main-frame{width:calc(100% - 3rem);max-width:1100px;padding-left:calc(28vw + 5rem) !important;}

.lmenu nav p,.logout{cursor:pointer;display:block;width:21vw;box-sizing:border-box;line-height:1rem;padding:1rem 1.5rem;border-bottom:1px solid #2d2d2d;border-top:1px solid #404040;margin:0;}
.lmenu nav p:hover,.logout:hover{opacity:.6;text-decoration:none;}
.lmenu nav p:first-of-type{border-top:0;}
.webvine{position:absolute;bottom:0;font-size:24px;text-align:center;width:106px;left:50%;margin-left:-53px;}
.webvine a{display:block;line-height:24px;}
.webvine a:hover{text-decoration:none;border-bottom:1px solid #eee;}
.webvine p{font-size:12px;margin:2px 0 2rem;}

nav p{background:url(img/profile.png) no-repeat 98% 50%}
nav p:nth-of-type(2){background-image:url(img/email.png)}
nav p:nth-of-type(3){background-image:url(img/site.png)}
nav p:nth-of-type(4){background-image:url(img/tool.png)}
nav p:nth-of-type(5){background-image:url(img/cash.png)}
nav p:nth-of-type(6){background-image:url(img/msg.png)}
nav p:nth-of-type(7){background-image:url(img/edit.png)}
.logout{background:url(img/exit.png) no-repeat 98% 50%}


.view-info,.edit-info,.view-info>div{display:none}
.view-info.active,.edit-info.active,.view-info>div.active{display:block}

.section{}
.section h3{font-size:1.7rem;font-weight:400;margin:.5rem 0;}
.section h3+p{border-bottom:1px dotted #777;line-height:1.3;padding-bottom:1rem;margin:1rem 0;color:#bbb}
.section>p{padding:1rem 0;margin:0;border-bottom:1px dotted #333;}
.section>p span:first-of-type{display:inline-block;min-width:10rem;color:#ddd;padding-right:1rem;box-sizing:border-box;}
.section>p>span:last-of-type{display:inline-block;}
.section>p:last-of-type{border-bottom:none}
.section .btn{display:inline-block;margin:.5rem 0;padding:.7rem 1rem;border-radius:2px;background:#f90;box-shadow:1px 1px 4px rgba(0,0,0, .6);border-top:1px solid #f9d75a;border-bottom:1px solid #bb8a00;}
.section .btn:hover{text-decoration:none;background:#ffa318;box-shadow:0px 0px 3px rgba(0,0,0, .6);}

#uWarng{padding:.7rem 1.2rem .7rem .7rem;background:#f90;color:#000;border-radius:3px;position:relative;}
#uWarng:before{content:"x";line-height:16px;width:16px;text-align:center;position:absolute;right:.5rem;top:calc(50% - 11px);font:bold 16px monospace;cursor:pointer;color:#e8dd9f;}
#uWarng:empty{display:none}

.frt{text-align:right}
.section .edit-profile{background:url(img/edit.png) no-repeat 10px 50% #f90;border-top:1px solid #f9d75a;border-bottom:2px solid #bb8a00;cursor:pointer;padding:8px 12px 8px 30px;}
.section .edit-profile:hover{background:url(img/edit.png) no-repeat 10px 50% #ffa318;}

.section.emails{}
.section.emails>p span:first-of-type{min-width:15rem;}
#emails span:last-of-type{font-size:11px;color:#999;}
.nn{display:none;}
.sect-info{line-height:1.7;display:block;padding:1rem;margin:1rem auto;border-radius:4px;background:rgba(0,0,0,.1);color:#81b35c;font-weight:400;}

 .domains fieldset{padding:1.2rem;border:1px dotted #444;margin-bottom:.5rem;}
 .domains fieldset p{margin:0;padding:1rem;border-bottom:1px dotted #333;}
 .domains fieldset p:last-of-type{border:0}
 .domains fieldset p>span{display:inline-block;vertical-align:top;width:calc(100% - 12rem);line-height:1.3rem;}
 .domains fieldset p>span:first-of-type{width:11rem;}
 .domains fieldset p a{display:inline-block;border-bottom:1px solid #aaa;padding:2px 0;}
 .domains fieldset p a:hover{text-decoration:none;border:0;opacity:.8}
 .domains fieldset.hide{height:0;overflow:hidden;}
 .domains fieldset+p{color:#999;font-size:.8rem;padding-left:1rem;margin:0 0 2rem}
 .domains legend{padding:0 1.2rem 0 22px;cursor:pointer;background:url(img/site.png) no-repeat 3% 50%;background-size:12px;}
 .domains legend:hover{opacity:.7}
.ssl{background:url(img/ssl.png) no-repeat 0% 50%;padding-left:18px;box-sizing:border-box}
.inf{display:block;padding:1rem 0;border-top:1px solid #999;line-height:1.2rem;}
em,.inf{font-size:.9em;color:#aaa;}

 .services{}
 .services>p span{width:calc(100% - 13rem);display:inline-block;vertical-align:top;line-height:1.3rem;color:#eee}
 .services>p em{display:block;}
 .services>p span:last-of-type{width:12rem;text-align:center;}
 .services>p span a{display:inline-block;padding:.4rem;border:1px solid #fff;}
 .services>p span a:hover{border:1px solid #999;text-decoration:none;}
 .services>p.off{opacity:.5}

.pay-stat{border-bottom:}
#pays p{display:flex;background:rgba(255,255,255,.1);padding:.8rem .5rem;margin-bottom:1px;margin-top:.5rem}
#pays p p:nth-of-type(even){background:rgba(255,255,255,.05);}
#pays p p span:last-of-type{display:flex;justify-content:space-between;align-items:center;width:100%;}
#pays p span{min-width:100px}
#pays p p span em{width:100%}
#pays p i{font-size:.9em;padding-left:5px;font-style:normal}
.paycomment{font-size:11px;color:#999;display:block;line-height:2}


.msg-frm{max-width:100%;width:26rem;}
.msg-frm p{margin:8px 0}
.msg-frm input,.msg-frm textarea{display:block;width:100%;border:1px solid #222;padding:.5rem .7rem;box-sizing:border-box;margin-bottom:1rem;font-family:"Open Sans"}
.msg-frm input:focus,.msg-frm textarea:focus{box-shadow:1px 1px 3px #888 inset;}
.msg-frm input[type="submit"]{background:url(img/send.png) no-repeat 17% 50% #19a9f1;text-transform:uppercase;width:13rem;color:#fff;max-width:100%;border:0;border-radius:2px;margin-top:25px;box-shadow:1px 1px 3px rgba(0,0,0, .8);padding:.7rem;cursor:pointer;border-top: 1px solid #7bc8ef;border-bottom:1px solid #0c7eb7;}
.msg-frm input[type="submit"]:hover{box-shadow:none;text-shadow:0px 0px 10px #fff;border-bottom:1px solid #179cde}
.msg-frm textarea{height:10rem;}


/* ---------edit----------*/
.off{position:relative;opacity:.6;display:block;}
.off:after{content:"";top:0;left:0;right:0;bottom:0;position:absolute;z-index:1;text-align:center;}
.account-edit p{margin:0;padding:.8rem 0;border-bottom:1px dotted #555;}
.account-edit p>span{width:12rem;display:inline-block;}
.account-edit p input{border:1px solid #111;padding:.3rem .5rem;width:20rem;}

.dop-edit{margin-top:1.5rem;opacity:.85;}
.dop-edit:hover{opacity:1}
.dop-edit p{margin:0;padding:.6rem 0;border-bottom:1px dotted #333;display:flex;align-items:center}
.dop-edit p>span{width:12rem;padding-right:1rem}
.dop-edit p input[type="text"]{border:1px solid #111;padding:.5rem;width:100%}
.dop-edit>h4{cursor:pointer}
.dop-edit>div{display:none;}

.account-type{display:flex;align-items:center;min-width:65%}
.account-type label{display:flex;align-items:center;padding-right:15px;line-height:15px;cursor:pointer}

.saver{background:#7ed80a !important;border:0;border-radius:2px;color:#fff;text-transform:uppercase;font-weight:400;box-shadow:1px 3px 5px #000;cursor:pointer;display:inline-block;float:right;text-shadow:0px 1px 1px rgba(0,0,0, .3)}
.saver:hover{box-shadow:0px;}
.saver:active{margin-top:1px;margin-bottom:-1px;}

.edit-info textarea{position:absolute;left:20px;opacity:.3}
.edit-info textarea.on{width:300px;height:300px;opacity:1;}
.edit-info input.off{opacity:.4}
.domain-info{display:none;padding:.8rem;border:1px dashed #666;margin:1rem 0;}
.domain-info span{display:inline-block;min-width:11rem;}
.domain-info.active{display:block;}
.domain-info>a{background:#ffed00;padding:.4rem .6rem;margin-right:1rem;display:inline-block;border-radius:2px;color:#000;font-size:13px;margin-top:10px;}
.domain-info>a:hover{text-decoration:none;box-shadow:1px 1px 5px rgba(247, 231, 26, 0.39);text-shadow:1px 1px 1px #fff;}


/*--snip--*/
.close{display:inline-block;opacity: .2;color:#000;}
.close:before{content:"x";font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;}
.wv-anim{transition: background-color 0.7s, color 1s, opacity 0.5s;}


/*--MQ--*/
@media(min-width:1500px){
html{font-size:16px;}
.all>div{padding-top:10vh}
/*^1500*/}

@media(min-width:1400px){
.main-frame{max-width:1300px}	
/*^1300*/}

@media(max-width:850px){
html{font-size:12px;}
.lmenu{padding-left:2rem !important;}	
.main-frame{padding-left:calc(21vw + 7rem) !important}
.section>p{padding: .7rem 0;font-size:13px;}	
/*850px*/}

@media(max-width:685px){
.lmenu{transform:translate(-125px,0);min-width:175px;padding:2rem 15px !important}
.main-frame{padding-left:6rem !important;width:100%}
.lmenu nav p, .logout{width:145px}
.lmenu nav span,.webvine{opacity:0}	
/*685px*/}

@media(max-width:460px){
html{font-size:12px}
.lmenu{transform:translate(-131px,0);padding: 2rem 8px !important;}
.lmenu nav p, .logout{width:155px}
.main-frame{padding-left: 5rem !important;}
.services>p span{width:100% !important;padding:.7rem 0 !important}
.services>p span a{display:block;margin-top:1rem;}	

/*460px*/}
@media(max-width:375px){
.domains fieldset p{padding:.8rem 0;}
	.domains fieldset{padding: 0rem 1rem .5rem;}
	.domains fieldset.hide{height:12px}
	.domains fieldset p>span:first-of-type{font-size:12px;margin-bottom:.4rem;}
	.domains fieldset p>span{display:block;width:100%;font-size:13px;}
	.sect-info{font-size:13px;line-height:1.2;}
	#pays p span{font-size:12px;min-width:65px;}
}