@charset "utf-8";

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  font-family: 'Quicksand', sans-serif;
  font-size: 16px;
  background-color: #f3f4f7;
  margin: 0;
}

.development_container {
  height: 100%;
  width: 120px;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  padding-top: 20px;
}

.breadcrumbs {
	font-size: 13px;
	line-height: 1.8;
	overflow: hidden;
}

.breadcrumbs .box {
	float: left;
}

.breadcrumbs .box a {
	margin-right: 0;
}

.breadcrumbs .box.query {
	opacity: 0.7;
}

.breadcrumbs .separator {
	margin: 15px 0 0 0;
	float: left;
	padding: 10px 15px;
}

.search_container {
	overflow: hidden;
}

.search_container form {
	float: left;
}

button.icon {
	font-size: 20px;
	cursor: pointer;
	
}

button.icon.red {
	color: red;
	
}

body {
	margin-top: 0px;
	margin-left: 120px;
	margin-right: 0px;
	margin-bottom: 0px;
}

body .header {
  background-color: #2f3947;
  height: 60px;
  padding-top: 16px;
  padding-bottom: 16px;	
  width: 100%;
  border: 0;
}

body .header > .main  {
  margin: 0 auto;
  width: 1000px;
  height: 100%;
}



body .header > .main .site_title {
	float: left;
}

body .header > .main .menu_top {
	float: right;
}

body .header > .main .site_title h1 {
  font-size: 24px;
  padding: 0;
  margin: 0;
  color: #eaebed;
  font-weight: normal;
}

body div.content {

	  width: 1000px;
	  margin: 0 auto;
}

.side_info {
	opacity: 0.5;
	
}

.msg {
	width: 100%;
	line-height: 1.8;
	padding: 4px;
	color: white;
}

.msg.error {
	background-color: red;
}

.msg.warning {
	background-color: orange;
}

.msg.confirm {
	background-color: green;
}

table {
	width: inherit;
	background-color: #fff;
	border-collapse: collapse;
	border: 1px solid #ddd;
}


th,td {
	text-align: left;
	border: 1px solid #ddd;
	padding-left: 8px;
	padding-right: 8px;	
	line-height: 1.8;
	
}

th {
	background-color: #ddd;
	vertical-align: text-top;
}

tr:nth-child(even) {
	background-color: #eee;
}

a, a:visited {
	color: #0000EE;
	
}


.link_box {
	
}


.login, .register {
  width: 400px;
  background-color: #ffffff;
  box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
  margin: 100px auto;
}

.login h1, .register h1 {
  text-align: center;
  color: #5b6574;
  font-size: 24px;
  padding: 20px 0 20px 0;
  border-bottom: 1px solid #dee0e4;
}

.login .links, .register .links {
  display: flex;
  padding: 0 15px;
}

.login .links a, .register .links a {
  color: #adb2ba;
  text-decoration: none;
  display: inline-flex;
  padding: 0 10px 10px 10px;
  font-weight: bold;
}

.login .links a:hover, .register .links a:hover {
  color: #9da3ac;
}

.login .links a.active, .register .links a.active {
  border-bottom: 3px solid #3274d6;
  color: #3274d6;
}

.login form, .register form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 20px;
}

.login form label, .register form label {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 12%;
  height: 50px;
  background-color: #3274d6;
  color: #ffffff;
}

.login form input[type="password"], .login form input[type="text"], .login form input[type="email"], .register form input[type="password"], .register form input[type="text"], .register form input[type="email"] {
  width: 80%;
  height: 50px;
  border: 1px solid #dee0e4;
  margin-bottom: 20px;
  padding: 0 15px;
}

.login form input[type="submit"], .register form input[type="submit"] {
  width: 100%;
  padding: 15px;
  margin-top: 20px;
  background-color: #3274d6;
  border: 0;
  cursor: pointer;
  font-weight: bold;
  color: #ffffff;
  transition: background-color 0.2s;
}

.login form input[type="submit"]:hover, .register form input[type="submit"]:hover {
  background-color: #2868c7;
  transition: background-color 0.2s;
}

.login form #rememberme, .register form #rememberme {
  width: 100%;
  height: auto;
  padding: 5px 20px;
  background-color: transparent;
  color: #000;
  justify-content: flex-start;
}

.login form #rememberme input, .register form #rememberme input {
  transform: scale(1.3);
  margin-right: 7px;
}

.login form .msg, .register form .msg {
  padding: 0 20px;
  width: 100%;
}

.login form > a, .register form > a {
  text-decoration: none;
  color: #5b6574;
  width: 100%;
  padding: 5px 20px;
}

.login form > a:hover, .register form > a:hover {
  color: #394049;
}










main h2 {
  margin: 0;
  padding: 25px 0;
  font-size: 22px;
  border-bottom: 1px solid #e0e0e3;
  color: #4a536e;
}


.content > p, .content > div {
  //box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
  //margin: 25px 0;
  //padding: 25px;
  //background-color: #fff;
}

.content > p table, .content > div table {
  width: 100%;
}

.content > p table td, .content > div table td {
  overflow: hidden;
  padding: 5px;
}

.content > p table td:first-child, .content > div table td:first-child {
  font-weight: bold;
  color: #4a536e;
  padding-right: 15px;
}

.content > p table td:last-child, .content > div table td:last-child {
  word-break: break-all;
}

.content > div p {
  padding: 5px;
  margin: 0 0 10px 0;
}

.content > div a, .content > div input[type="submit"] {
  display: inline-block;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  color: #fff;
  background-color: #3274d6;
  margin: 15px 5px 0 0;
  padding: 10px 15px;
}

.content > div a:hover, .content > div input[type="submit"]:hover {
  background-color: #2868c7;
}

.content form label {
  display: block;
  padding: 10px 0 5px 0;
}

.content form input[type="text"], .content form input[type="password"], .content form input[type="email"] {
  padding: 5px;
  width: 250px;
}





nav.side {
	top: 0px;
	left: 0px;
	margin: 0 0;
	position: fixed;
	overflow-x: visible;	
}

nav.side ul {
	padding: 0;
    margin: 0;
	list-style: none;
	position: relative;
}

nav.side ul li {
	background-color: grey;
	width: 120px;
}

nav.side ul li:hover {
	background-color: #333;  
}	

nav.side a {
	display:block;
	padding:0 10px;	
	color:#FFF;
	font-size:14px;
	line-height: 28px;
	text-decoration:none;
}

nav.side ul li ul {
	visibility: hidden;
	position: absolute; 
	left: 120px; 
	transition: 0.2s 0s;
	margin-top: -28px;
	
}	
nav.side ul li:hover > ul {
	
	display:inherit;
	margin-top: -28px;
	 visibility: visible;
  	transition-delay: 0s;
}	


nav.side ul li ul li {
	width:120px;
	float:none;
	display:list-item;
	position: relative;
}
	
nav.side li > a:after { 
	content:  ' >'; 
	//text-align: right;
    //float:right;
}
nav.side li > a:only-child:after { content: ''; }


input {
	font-size: 16px;
	
}




.header nav {
	position: relative;
	vertical-align: right;
	margin: 0 0;

}

.header nav ul {
	padding: 0;
    margin: 0;
	list-style: none;
	position: relative;
}

.header nav ul li {
	display:inline-block;
	background-color: #FF4649;
}

.header nav a {
	display:block;
	padding:0 10px;	
	color:#FFF;
	font-size:16px;
	line-height: 40px;
	text-decoration:none;
}
.header nav a:hover { 
	background-color: #333; 
}
.header nav ul ul {
	display: none;
	position: absolute; 
	top: 40px; 	
}	
.header nav ul li:hover > ul {
	display:inherit;
}	
.header nav ul ul li {
	width:230px;
	float:none;
	display:list-item;
	position: relative;
}
.header nav ul ul ul li {
	position: relative;
	top:-40px; 
	left:230px;
}
.header nav ul ul li {
	border: 1px solid white;
}	
.header nav li > a:after { content:  ' ▼'; }
.header nav li > a:only-child:after { content: ''; }



input[type="submit"] {

	line-height: 1.8;
	background-color: aquamarine;
	border: none;
}





body.tpl_2-3_1-3 aside.right {
  float: right;
	margin: 0 0 0 1.5%;
  width: 30%;
}

body.tpl_2-3_1-3 main.main {
	float: left;
	margin: 0 1.5% 0 0;
	width: 67%;
	overflow-x: scroll;
}

body.tpl_1 main.main {
	float: left;
	margin: 0 1.5% 0 0;
	width: 100%;
	overflow-x: scroll;
}


.pp_development_container {
	font-family: 'Fira Code', monospace;
	font-size: 13px;
	line-height: 1.5;	
}

.pp_development_php_key_header {
	font-weight: 700;
}

.pp_development_line .old {
	color: grey;
	
}