/*PALET
#e74c3c #c0392b
#3498db #2980b9
#bdc3c7 #ecf0f1
#7f8c8d #95a5a6
#efefef
#f1c40f
#2ecc71

*/
	    
	    
	    
* { font-family: segoe ui, arial; font-stretch: condensed;  -webkit-appearance: none; }
body, html { padding: 0; margin: 0; position: relative; background-color: #303030; min-height: 100%; /*background-image: url('images/bg.png');*/ background-repeat: repeat;/* min-width: 1200px;*/ color: #777;}
li { list-style: none; }
ul, li { padding: 0; margin: 0; }
a { color: #777; text-decoration: none; }
a:visited { color: #777; }
a:hover, span.href:hover { cursor: pointer; text-decoration: underline; }
input, input:focus, input:active { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }



.icon { background-repeat: no-repeat;  background-position: 98% 50%;  background-size: 30px 30px;  }
.icon-item { width: 15px; height: 15px; float: left; margin-right: 10px; background-size: 100% 100%; }
.icon-mail { background-image: url('images/mail.png'); background-size: 35px 22.6666px;  }
.icon-settings { background-image: url('images/settings.png'); }
.icon-lock { background-image: url('images/lock.png'); }
.icon-user { background-image: url('images/user.png'); }
.icon-key { background-image: url('images/key.png'); }
.icon-close { background-image: url('images/close.png'); }
.icon-video { background-image: url('images/video.png'); }
.icon-paypal { background-image: url('images/paypal.png'); }
.icon-btc { background-image: url('images/btc.png'); }
.icon-paypal-big { background-image: url('images/paypal-big.png'); }
.icon-btc-big { background-image: url('images/btc-big.png'); }
.icon-visa-big { background-image: url('images/visa-big.png'); }
.icon-mastercard-big { background-image: url('images/mastercard-big.png'); }



.margin-auto { margin: 0 auto !important; }
.font-desc { font-size: 14px; color: #777; }
.textalign-left { text-align: left !important; }
.textalign-right { text-align: right !important; }
.clear { clear: both !important; }
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.textalign-center { text-align: center !important; }
.msg { background-size: 25px 25px !important; background-position: 10px 50% !important; background-repeat: no-repeat !important; padding: 10px; padding-left: 45px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: left; position: relative; }
.msg.success { background-color: #00c200; background-image: url('images/success.png');  }
.msg.error { background-color: #e74c3c; background-image: url('images/error.png'); }
.msg.info { background-color: #3498db; background-image: url('images/info.png'); }
.msg.loading { background-color: #3498db; background-image: url('images/loading.gif'); background-size: 25px 10px !important; }
.msg.news { background-color: #1891e3; background-image: url('images/alert.png'); padding: 20px 20px 20px 50px !important; }
.msg > .href { color: #fff; text-decoration: underline; cursor: pointer; }
.msg .top { position: absolute; right: 5px; top: 2px; font-style: italic; font-size: 12px; }
.hide, .hidden, .invisible { display: none !important; }
.space { padding: 10px; }
.font-small { font-size: 10px !important; }
.width100 { width: 100% !important; }
.width50 { width: 50% !important; }
.width33 { width: 33.3333% !important; }
.width66 { width: 66.6666% !important; }
.width25 { width: 25% !important; }
.margin-auto { margin: auto !important; }
.transition { -moz-transition:width .5s, height .5s, background-color .5s, -moz-transform .5s;-webkit-transition:width .5s, height .5s, background-color .5s, -webkit-transform .5s;-o-transition:width .5s, height .5s, background-color .5s, -o-transform .5s;transition:width .5s, height .5s, background-color .5s, transform .5s; }
.mobile { display: none; }
.tab-page { display: none; }
.tab-page.selected { display: block; }
.signup-steps, .buy-steps { display: none; }
.signup-steps.selected, .buy-steps.selected { display: block; }
.back { padding: 5px; color: #777; cursor: pointer; font-weight: bold; }
.back:hover { text-decoration: underline; color: #999 !important; } 
.bg-gray, .bg-grey { background-color: rgba(0,0,0, 0.07) !important; }
.block { display: block !important; }
.color-white { color: #fff !important; }
.bold { font-weight: bold !important; }



.container-captcha { cursor: pointer; border: 1px solid #ccc; height: 70px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; width: 100%; position: relative; }
.container-captcha > img { width: 100%; height: 100%; cursor: pointer;  }
.container-captcha > span { color: #aaa; position: absolute; bottom: 2px; right: 5px; font-size: 14px; cursor: pointer; }





.btn { border: none; cursor: pointer; background-color: transparent; padding: 0; margin: 0; }
.btn-login { font-size: 24px; background: #3498db; border-bottom: 4px solid #1e71a8; padding: 10px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.btn-login:hover { background: #1e70a6; border-color: #1c699d;  }
.btn-login:active { background: #154f75; border-color: #113f5e; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.btn-default { font-size: 20px; background-color: #3498db; padding: 5px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.btn-default:hover { background-color: #217ebc; color: #fff; }
.btn-default:active { background-color: #1c689b; }
.text-default, .text { -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; font-size: 16px; padding: 5px; border: 1px solid rgba(0,0,0, 0.07); background-color: #292929; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; color: #ccc;}
.text-default:focus { /*background: #222;*/ -moz-transition:width .5s, height .5s, background-color .5s, -moz-transform .5s;-webkit-transition:width .5s, height .5s, background-color .5s, -webkit-transform .5s;-o-transition:width .5s, height .5s, background-color .5s, -o-transform .5s;transition:width .5s, height .5s, background-color .5s, transform .5s; } 
.text-login { background-color: transparent; font-size: 24px; border: none; border-bottom: 4px solid #3498db; background-position: 5px 50%; padding-left: 40px; background-size: 25px 25px; -moz-transition:width .5s, height .5s, background-color .5s, -moz-transform .5s;-webkit-transition:width .5s, height .5s, background-color .5s, -webkit-transform .5s;-o-transition:width .5s, height .5s, background-color .5s, -o-transform .5s;transition:width .5s, height .5s, background-color .5s, transform .5s; }
.text-login:hover,.text-login:focus { border-color: #62afe3; }
.text-default > input[type=text] { padding: 0; width: 100%; border: 1px solid rgba(0,0,0, 0.07); }
.text-default.controls { padding: 0; position: relative;  border: none; }
.text-default > .number { border: none; padding: 5px !important; font-size: 20px; width: 80px !important; float: left;  font-family: segoe ui, arial; font-stretch: condensed; color: #aaa; background: #333;}
.text-default > .number-buttons { float: left; width: 30px; }
.text-default > .number-buttons > .btn { position: absolute; min-height: 10px; width: 30px; height: 50%; right: 1px; background-position: 50% 50%; background-size: 25px 25px; background-repeat: no-repeat; }
.text-default > .number-buttons > .btn:hover { background-color: #222; }
.text-default > .number-buttons > .btn:active { background-color: #111; }
.text-default > .number-buttons > .up { background-image: url('images/up.png'); }
.text-default > .number-buttons > .down { background-image: url('images/down.png'); bottom: 0;  }




.page-transition { position: fixed; right: 100%; left: -100%; width: 100%; }
.page-transition > .group { width: 300px; margin: 150px auto; }



.wrap { width: 100%; left: 0; }



.container-head { overflow: hidden; top: 0; width: 100%; min-height: 50px; border-bottom: 4px solid #3498db; position: fixed; z-index: 999; background: #252525;  -webkit-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -moz-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07);  }
.container-head .container-fixed-pages { position: absolute; bottom: 100%; width: 100%; height: 100%; overflow-y: scroll; overflow-x: hidden; }
.container-head .container-fixed-pages .close-fixed-pages { position: absolute; top: 10px; right: 10px; height: 30px; width: 30px; background-size: cover; cursor: pointer; z-index: 999; }
.container-head .container-fixed-pages .page-fixed { padding: 50px 30% 80px 30%; width: 40%; display: none; }
.container-head .fixed { bottom: 0; position: absolute; width: 100%; background-color: inherit; }
.container-head .logo { float: left; margin: 5px 20px; height: 40px; width: 200px; }
.logo img { width: 100%; height: 100%; }
.container-head .container-nav { float: right; margin-right: 20px; }
.container-head .container-nav .nav-left { float: right; margin-right: 10px; }
.container-head .container-nav .nav-right { float: right; }
.container-head .container-nav ul li { float: left; padding: 10px; cursor: pointer; font-size: 18px; color: #ccc; }
.container-head .container-nav ul li:hover, .container-head .container-nav ul li.selected { color: #2980b9; }
.container-head .nav-right ul {  }
.container-head .nav-right ul li {  }




header {}
header > h1 { color: #777; padding: 10px 20px; margin: 0; font-size: 16px; font-weight: normal; text-transform: uppercase;  }
header > h2 { color: #777; padding: 10px 0; margin: 0; font-size: 20px; font-weight: normal; text-transform: capitalize; }
header > h3 { color: #777; padding: 10px 0; margin: 0; font-size: 26px; font-weight: normal; text-transform: uppercase; }






.container-body { padding-top: 120px; width: 90%; margin: auto; }
.container-body .section-left { float: left; width: 50%; padding: 0 1% 0 5%; }
.container-body .section-right { float: left; width: 39%; padding: 0 5% 0 0; }
.group { margin-bottom: 20px; }
.group .label { padding: 10px 0; }
.group .membership { font-size: 38px; font-weight: bold; text-transform: uppercase; }
.group .membership.guest { color: #e74c3c; }
.group .membership.premium { color: #00c200; }
.box { background: #323232; -webkit-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -moz-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.box > .content, .box-login > .content { padding: 25px; }
.box > header, .box .tabs { border-bottom: 1px solid rgba(0,0,0, 0.07); }
.box .tabs li { float: left; width: 50%; }
.box .tabs > ul:after { content: ''; display: block; clear: both;  }
.box .tabs header { text-align: center; }
.box .tabs header > h1 { font-size: 14px; padding: 14px 0;  }
.box .tabs header > h1:hover, .box .tabs header > h1.selected { color: #3498db; cursor: pointer; }
.box-login { border: 4px solid #3498db; width: 400px; margin: auto; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.box-login header > h1 { padding: 10px 0 10px 50px; font-size: 28px; color: #fefefe; background-position: 20px 55%; background-size: 25px 25px; background-color: #3498db;/*color: #3498db;*/ }
.box-login header > h2 { color: #777; font-size: 24px; }
.box-buy { color: #777; border: 4px solid #777; position: relative;  margin: auto; cursor: pointer; width: 400px; background: #222; -webkit-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -moz-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-bottom: 10px; }
.box-buy:hover { border-color: #3498db; color: #fff; }
.box-buy:hover .btn-default { background: #3498db; color: #fff; }
.box-buy:hover .price { color: #3498db; }
.box-buy:hover .amount { font-size: 74px !important; }
.box-buy:hover .icon-paypal { background-image: url('images/paypal-white.png'); }
.box-buy:hover .icon-btc { background-image: url('images/btc-white.png'); }
.box-buy .btn-default { background: #777; color: #ccc; }
.box-buy header { border-bottom: 1px solid rgba(0,0,0, 0.07);  }
.box-buy header > h1 { color: #fff;  padding: 14px 15px; }
.box-buy .price { height: 30px; position: relative; overflow: visible;  }
.box-buy .price .amount { position: absolute; left: 10px; font-size: 64px; bottom: 0; line-height: 0.7; }
.box-buy .price .tag { position: absolute; left: 0px; bottom: 0; line-height: 0.7; }
.box-buy > .content { padding: 0 15px; }

.payment-methods { width: 220px !important; margin: auto; }
.payment-methods .method-container { position: relative; width: 100px; height: 50px; }
.payment-methods .method-container .method { position: absolute; overflow: hidden; border: 1px solid #333; width: 100px; height: 50px; overflow: hidden; background-size: 100% 100% !important; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; cursor: pointer; }
.payment-methods .method-container .method:hover { border: 4px solid #3498db; top: -3px; left:-3px;/*outline: solid #3498db; outline-width: 4px;*/ }


.logo-mobile {  height: 60px; width: 300px; }


 






.add-names .psn-name-item { float: left; background-color: rgba(0,0,0, 0.07); margin: 5px 5px 0 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.add-names .psn-name-item > .psn-name { padding: 5px 8px; color: #aaa; float: left; }
.add-names .psn-name-item > .close { color: #777; padding: 5px; float: left; cursor: pointer; font-size: 16px; font-weight: bold; }
.add-names .psn-name-item > .close:hover { color: #222; }
.add-names .close-all { padding: 5px 8px; cursor: pointer; color: #777; }
.add-names .close-all:hover { color: #222; }
.add-names .close-all:active { color: #111; }

 
/*.table { width: 100%; }
.table > ul > li > ul > li { text-align: left; padding: 10px 0;  }
.table > ul.titles > li { font-size: 18px; color: #777; font-size: 14px; }
.table > ul.titles:after { content: ''; display: block; clear: both;  }
.table > ul.rows { width: 100%; }
.table > ul.rows > li { width: 100%; float: left; }
/*.table > ul.rows > li:after { clear: both; }*/
/*.table > ul.rows > li > ul { width: 100%; float: left; }
.table > ul.rows > li > ul > li { font-size: 16px; color: #aaa; }*/
/*.table > ul.rows > li > ul:after { content: ''; display: block; clear: both; }*/
/*.table.by-two > ul > li > ul > li,.table.by-two > ul.titles > li { width: 50%; float: left; }*/
/*.table.by-three > ul > li { width: 33.3333%; float: left; }*/


.table { width: 100%; }
.table > ul > li { text-align: left; padding: 10px 0; display: inline-block;  }
.table.small-spacing > ul > li { padding: 5px 0;  } 
.table > ul > li.small { font-size: 12px !important; padding: 18px 0 0 0; }
.table > ul.titles > li { font-size: 18px; color: #777; }
.table > ul.rows > li { font-size: 16px; color: #aaa; }
.table > ul.rows:after { content: ''; display: block; clear: both; }
.table.by-one > ul > li { width: 100%; float: left; }
.table.by-two > ul > li { width: 50%; float: left; }
.table.by-three > ul > li { width: 33.3333%; float: left; }






.container-footer { clear: both; position: relative; height: 200px; margin-top: -200px; background: #323232; -webkit-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); -moz-box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); box-shadow:  0 1px 3px 0 rgba(0,0,0, 0.07); }
.container-footer .footer-inner { padding: 20px 20px; }



@media only screen and (max-width: 1000px) { 
    .container-body { width: 100%; }
    .container-body .section-left { float: left; width: 52%; padding: 0 1% 0 2%; }
    .container-body .section-right { float: left; width: 42%; padding: 0 2% 0 0; }

}

@media only screen and (max-width: 800px) {
    
    
    .container-head .container-fixed-pages .page-fixed { padding: 10px 30% 80px 5%; width: 90%; }
    
    
    
    .container-head  { min-height: 100px; }
    .container-head .container-nav  { float: left; width: 100%; }
    .container-head .fixed {  } 
    .container-head nav { width: 100%; float: left; }
    .container-head .nav-left,.container-head ul { width: 100%; }
    .container-head .nav-left,.container-head .nav-right li { float: left; width: 50%; text-align: center; padding: 5px 0 !important; }
    .container-head .nav-left,.container-head .nav-left li { float: left; width: 100%; text-align: center; }
    
    
    /*.wrap { width: auto; min-width: 430px; }
    .container-head { min-width: 430px; }*/
    .container-head .logo { display: none; }
    .container-body .section-left { width: 90%; padding: 0 5%; }
    .container-body .section-right { width: 90%; padding: 0 5%; }
    
    .mobile { display: block; }
    
    .box-login, .box-buy { width: 95%; }
}

@media only screen and (min-width: 1460px) {
    .container-body { width: 1300px !important; margin: auto; }
}