@charset "utf-8";
@font-face{font-family: 'Open Sans', sans-serif;font-display:swap;}
body{margin:0;padding:0;background-color:#EBEBEB;font-family: 'Open Sans', sans-serif;color:#262626; text-align:center;}
button, .btn{font-family: 'Open Sans', sans-serif; font-weight:700;cursor:pointer;background-repeat:no-repeat;outline:0; border: 0;background-color:#00CDF0;
-webkit-transition:background-color .2s ease-out 50ms;transition:background-color .2s ease-out 50ms}
button:hover, .btn:hover{background-color:#86e5ef;}
input[type=text]{font-family: 'Open Sans', sans-serif;text-align:left;padding-left:10px;outline:0;border:#262626 1px solid;background-color:#FFF; color:#262626;font-size:15px;}
label{font-size:15px; border:none;}
h1,h2,h3,h4,h5,h6,p,ul,li{margin:0;padding:0}h1{font-size:20px;font-weight:700;}h2{font-size:16px;font-weight:700;}h3,h4,h5,h6,p{font-weight:400;}h3{font-size:14px}h4{font-size:12px}
a{color:#262626;text-decoration:none;}
.flex{display:flex; flex-wrap:nowrap; justify-content:space-between;align-items: center;}
.m-b{margin-bottom:14px;}
.container{padding:14px;}
header {
padding:14px;
background-color:#262626;
color:#FFF;
}


.logo{
	margin-right:25px;
}

.menu a:link,
.menu a:visited,
.account a:link,
.account a:visited{
	margin-left:10px;
	color:#FFF;
}

.userform{
	width:300px;
	text-align:left;
	margin: 0 auto;
	padding-top:50px;
}


.userform input[id=username],
.userform input[id=usermail],
.userform input[id=userpass]{
	height:30px;
	width:300px;
	padding-left:10px;
	margin-top:5px;
	margin-bottom:10px;
	color:#FFFFFF;
	background-color:#333333;
	outline:none;
	border: 2px solid rgb(0, 0, 0);
    border: 2px solid rgba(0, 0, 0, 0.5);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}
.userform button[id=login],
.userform button[id=login]:focus,
.userform button[id=signup],
.userform button[id=signup]:focus{
	cursor:pointer;
	width:100px;
	height:40px;
	border:none;
	outline:none;
	background-color:transparent;
	background-image: url("https://seekicon.com/elements/login-button.svg");
	background-repeat: no-repeat;
	opacity:1;
	-webkit-transition: opacity 200ms ease-out 0.05s;
	-moz-transition: opacity 200ms ease-out 0.05s;
	-o-transition: opacity 200ms ease-out 0.05s;
	transition: opacity 200ms ease-out 0.05s;
}
.userform button[id=signup],
.userform button[id=signup]:focus{
	background-image: url("https://seekicon.com/elements/signup-button.svg");
}

.userform button[id=login]:hover{
	opacity:0.9;
}

.reporting{
	font-size:14px;
	margin-top:15px;
	width:100%;
	min-height:50px;
}

.reporting  .successcontainer{
	color: #21AB00;
	display: none;
}

.reporting .errorcontainer{
	color: #D50000;
	display: none;
}


/*DB Manager*/

.columns{
	font-size:14px;
	margin:14px 0 0 140px;
	max-width:600px;
}

.keywords{width:350px;}


.dbmanager img{
	width:40px;
	height:40px;
	display:block;
	margin:0 15px 15px 0;
}

.pagination{display:flex;justify-content:center;margin:0 auto 14px auto; padding-top:5px;background-color:#FFFFFF;}
.pagination .etc,.pagination .nxt,.pagination .pre{background-repeat:no-repeat;background-position:center}
.pagination a,.pagination span{font-weight:700;font-size:15px;border:0;display:block;text-decoration:none;line-height:normal;cursor:pointer;margin:5px;padding:8px 16px;background-color:#000;color:#FFF;-webkit-transition:background-color .2s ease-out 50ms;transition:background-color .2s ease-out 50ms}
.pagination .current,.pagination a:hover{background-color:#00CDF0}
.pagination .nxt,.pagination .pre{background-image:url(https://www.brandeps.com/elements/pre-icon.svg);background-size:10px;min-width:20px;min-height:25px}
.pagination .nxt{background-image:url(https://www.brandeps.com/elements/nxt-icon.svg)}
.pagination .etc{background-image:url(https://www.brandeps.com/elements/etc-icon.svg);background-size:15px;background-color:transparent;margin:0;padding:8px 12px}


.col {
	max-width:800px;
	text-align:left;
	width:100%;
}

.col:nth-child(odd) {
  background:#F7F7F7;
}
.col:nth-child(even) {
  background:#EBEBEB;
}

.item{
	display:inline-block;
	padding:5px 10px 0 10px;
	margin-bottom:10px;
	text-align:left;
	min-width:360px;
}

.item img, .item span, .item form, .item input, .item button{
	display:inline-block;
	vertical-align:middle;
}

.item img{
	width:50px;
	height:50px;
}

.sql{width:800px;padding:15px; background-color:#F7F7F7; border-radius:15px; text-align:left;}
.sql p{margin-bottom:10px;}