/*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: #f2f2f2;/* min-width: 1200px;*/ }
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: 35px 22.6666px;  }
.icon-mail { background-image: url('images/mail.png'); }



.margin-auto { margin: 0 auto !important; }
.font-desc { font-size: 14px; color: #777; }
.textalign-left { text-align: left; }
.clear { clear: both; }
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.centertext { text-align: center !important; }
.msg { background-size: 25px 25px !important; background-position: 10px 50% !important; background-repeat: no-repeat !important; padding: 10px; padding-left: 50px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: left; position: relative; }
.msg.success { background: #0f0; }
.msg.error { background: #e74c3c;  }
.msg.info { background: #3498db;  }
.msg.news { background: #3498db; background-image: url('images/alert.png'); }
.msg > .href { color: #fff; text-decoration: underline; cursor: pointer; }
.msg .top { position: absolute; right: 5px; top: 2px; font-style: italic; font-size: 12px; }
.hide { display: none; }
.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; }


.bg-gray, .bg-grey { background-color: rgba(0,0,0, 0.07) !important; }





.btn { border: none; cursor: pointer; background-color: transparent; padding: 0; margin: 0; }
.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; }
.btn-default:active { background-color: #1c689b; }
.text-default { -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: #fff; box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; }
.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; }
.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: #ccc; }
.text-default > .number-buttons > .btn:active { background-color: #aaa; }
.text-default > .number-buttons > .up { background-image: url('images/up.png'); }
.text-default > .number-buttons > .down { background-image: url('images/down.png'); bottom: 0;  }




.wrap { width: 100%; }



.container-head { top: 0; width: 100%; min-height: 50px; /*border-bottom: 1px solid #3498db;*/ position: fixed; z-index: 999; background: #fff;  -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 .fixed { bottom: 0; position: absolute; width: 100%; }
.container-head .logo { float: left; height: 40px; margin: 5px 20px; width: 200px; }
.container-head .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: #333; }
.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: #555; padding: 10px 0; margin: 0; font-size: 20px; font-weight: normal; text-transform: capitalize; }






.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; }
.box { background: #fff; -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);  }
.box > .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; }


 
.group .label { padding: 10px 0; }





.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: #444; 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 > 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-two > ul > li { width: 50%; float: left; }
.table.by-three > ul > li { width: 33.3333%; float: left; }




@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  { 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%; }
}

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