/*
﻿@import "whhg.css";
*/
@import "whhg.css";

@font-face {
	font-family: 'webhostinghub-glyphs';
	src: url('fonts/webhostinghub-glyphs.eot');
	src: local('☺'), url('fonts/webhostinghub-glyphs.woff') format('woff'), url('fonts/webhostinghub-glyphs.ttf') format('truetype'), url('fonts/webhostinghub-glyphs.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

a { text-decoration:none; }



body > header { }
body > header aside { float:left; }
body > header nav { float:right; }
body header nav .btn { padding:8px 12px; /*color: #000; background-color:#FFF; */}
body header nav .btn:hover { color:#efefef; background-color:#131313; }

.navbar { position: relative; z-index: 1000; min-height: 50px; margin-bottom: 20px; border: 0px solid transparent; }
.navbar.forceFixedPosition { position:fixed; top:0px; width:100%; }

body > footer { font-size:12px; padding:15px; position:fixed; z-index:1500; bottom:0; width:100%; text-align:center; }
body > footer:after { clear:both; content: ""; display:block; }
body > footer aside { float:left; }
body > footer article { float:right; }

.nav > li { display:inline-block; border-right: 1px rgba(255,255,255,.1) solid; }
body .nav a { transition:all .2s ease; }
body > nav .nav li a { display:block; }

a.module,
figure.module { display:inline-block; margin:5px; width:175px; height:130px; position:relative; }
a.module figcaption,
figure.module figcaption { position:absolute; bottom:0px; text-align:center; }

table { width:100%; border-collapse: separate; border-spacing: 1px; }
table th { font-weight:bold; }
table td { font-weight:normal; }
table th.short-cell { width:40px; }


h3, .h3 { font-size:22px; }

main { min-height:500px; padding-bottom:150px; }

main .container > .btn { font-size:18px; margin:5px auto; }
main .container > .btn:hover,
main .container > .btn:focus { color:#fff; }
main .container > .btn [class^="icon-"], [class*=" icon-"] { font-size:18px; }

main header { padding: 5px; text-align: right; }

main footer { padding: 5px; }

.btn span[class^="fui-"] { margin-right:10px; }

.checkbox-checked, .checkbox-unchecked { cursor:pointer; }
.checkbox-checked:hover, .checkbox-unchecked:hover { opacity:.75;  }



a.switchLoading, a.switch0, a.switch1, a.switch2
{ display: block; margin: 0 auto; text-align: center; }

.formalize { margin: 0 auto; max-width: 891px; }
.formalize input:not([type="radio"]):not([type="checkbox"]),
.formalize select,
.formalize textarea { box-shadow:inset 3px 3px 5px rgba(0,0,0,.1); border-radius:5px; border:1px #dfdfdf solid; background-color:#ffffff; color:#777; width:100%; padding:5px; max-width: 500px;}
.formalize div.right { width: 500px; display: inline-block; vertical-align: top; }
.formalize textarea { height:100px; resize: vertical; }
.formalize fieldset > label { display: inline-block; width: 300px; margin: 2px 5px 2px; font-size: 16px; text-align: right; line-height: 1em; vertical-align: top;}
.formalize label span { font-size: 10px; }
.formalize > br { line-height: 3em; }
.formalize input[type="color"] { padding: 0 !important; background: none; border-radius: 0 !important; width: 30px !important; height: 30px; }


.formalize input.error { border-color: #f00 !important; }

.formalize select:focus, .formalize input:focus, .formalize textarea:focus { outline-color: transparent; border-color: #000000; color:#000; background-color: rgba(0,0,0,.08); }

.formalize fieldset { padding: 10px 20px; margin: 0 0px; border: 1px solid #dfdfdf; background-color: #f7f7f7; border-radius: 10px; }

.formalize legend { font-family: "Roboto Condensed", "Arial Narrow", Arial; border: 0; padding: 5px 15px; width: auto; font-weight: bold; font-size: 22px; text-shadow: 0px 3px 0px #fff;}

.formalize .priviliges-row{ display: inline-block; vertical-align: top; width: 250px; overflow: hidden; text-align: right; margin: 0px 0px 18px 0px; }
.formalize .priviliges-row label {width: auto; margin-right:20px; }

.formalize iframe{
	width:100%;
	min-height:300px;
}


#gallery-items figure { display: inline-block; margin: 5px; box-shadow: 0px 3px 8px rgba(0,0,0,.2); width: 100px; height: 130px; background-color: #FFF; text-align: center; padding-top: 5px; vertical-align: top; cursor: pointer; position:relative; }
#gallery-items figure:hover { opacity:.75; }
#gallery-items figure figcaption { position:absolute; bottom:5px; width:100%; text-align:center; }
#gallery-items figure .btn { padding:3px 5px; }

.pluploadmain b { display: block; overflow: visible; min-width: 10px; width: 10px; background-color: #cdcdcd; height: 3px; font-size: 10px; margin-bottom: 15px; padding-top: 5px; color: #9a9a9a;
}
.pluploadmain b.ok { background-color:#80d500; }
.pluploadmain b.error { background-color:#cd3439; }


.fb { font-weight:bold; }
.tl { text-align:left; }
.tc { text-align:center; }
.tr { text-align:right; }
.th { text-align:justify; }
.vt { vertical-align:top; }

.incorrect{
	border:red 1px solid !important;
}
.pagination{
	text-align:right;
	margin: 0;
	display:block;
	font-weight:normal;
	font-size:0;
	margin-bottom:3px;
}

.pagination div{
	background:rgba(0,0,0,.05);
	border-radius:4px;
	display:inline-block;
	overflow:hidden;
}
.pagination a{
	display:inline-block;
	min-width:20px;
	padding: 5px 10px;
	text-align: center;
	font-weight:bold;
	font-size:12px;
    background: #ffffff;
}
.pagination a.active { background-color: #dddddd; }
.pagination a:hover,
.pagination a:hover{
	background:rgba(0,0,0,.1);
}

table.short_600{
	width:600px;
	margin:auto;
}

table .dndHandler {
	opacity:.25;
}
table td.dndHandler:hover {
	opacity:1;
	cursor:pointer;
}
table tr.tDnD_whileDrag {
	outline:1px #343434 solid;
	opacity:.5;
	cursor:pointer;
}
table tr.tDnD_whileDrag td {

}

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


.login_page{
	background:#1e6799;
	font-family: "Roboto Condensed", "Arial Narrow", Arial;
}
.login_page h2,
.login_page h3{
	font-weight:300;
	color:white;
}
.login_page h2{
	margin-top:100px;
	font-size:40px;
}
.login_page form{
	background:#eef1f6;
	width:384px;
	padding:34px 40px 15px 40px;
	margin:auto;
	margin-top: 25px;
	 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
   color:#656565;
   -webkit-box-shadow: rgba(255,255,255,0.5) 0px 0px 250px;
   -moz-box-shadow: rgba(255,255,255,0.5) 0px 0px 250px;
   box-shadow: rgba(255,255,255,0.5) 0px 0px 250px;
}
.login_page input{
	width:303px;
	height:40px;
	 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
   color:#656565;
   display:block;
   border:#cccccc 1px solid;
   padding:0px 15px;
   margin:0px;
   margin-bottom:7px;
   font-size:22px;
}
.login_page button{
	 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
   	display:block;
	background:#2473a9;
	border:#2473a9 1px solid;
	margin-top:4px;
	margin-bottom: 15px;
	height:63px;
	line-height:63px;
	color:white;
	font-weight:bold;
	text-align:center;
	font-size:24px;
	width:100%;
	cursor:pointer;
	transition:all 200ms;
}
.login_page button:hover{
	background:#1e6799;
	transition:all 200ms;
}
.login_page p{
	text-align:center;
	font-size:18px;
	color:#fff;
}
.login_page a{
	display:inline-block;
	padding:10px;
	color:white;
	text-decoration:none;
}
.login_page div a {
	color:#000000;
}
.login_page a:hover{
	text-decoration:underline;
}
.login_page .start_forms {
	margin-bottom:50px;
}
.login_page a.inp {
	color:#FFF;
	color:rgba(255,255,255,.75);
	padding:0;
}
#login_bottom {
    text-align: center;
    font-size: 12px;
    color: #FFF;
}

/* MOBILE VERSION */
/*
 .btn { width:30px; }
*/

.blockPreload:before {
	content:"";
	background-color:rgba(0,0,0,.5);
	z-index:999999;
	width:100%;
	height:100%;
	top:0;
	left:0;
}










.ui-tooltip, .arrow:after {
    background: black;
    border: 2px solid white;
    max-width: 300px;
}
.ui-tooltip {
    padding: 10px 20px;
    color: white;
    border-radius: 20px;
    font: bold 14px "Helvetica Neue", Sans-Serif;
    text-transform: uppercase;
    box-shadow: 0 0 7px black;
    text-align: center;
}
.arrow {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
}
.arrow.top {
    top: -16px;
    bottom: auto;
}
.arrow.left {
    left: 20%;
}
.arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.arrow.top:after {
    bottom: -20px;
    top: auto;
}

.file-btn {position: relative;overflow: hidden;cursor: pointer;}
.file-btn input {opacity: 0;position: absolute;left: 0;right: 0;top: 0;bottom: 0;}

#elfinder-bootstrap-images .modal-dialog,
#elfinder-bootstrap .modal-dialog { width: 993px; }

.alert.smaller { font-size: 13px; line-height: 1.3em; padding: 7.5px 15px; margin: 0; }

.color-badge { display: inline-block; vertical-align: top; padding: 3px 7px; border-radius: 3px; margin-bottom: 3px; }

.cb { clear: both; }

.list-image { display: block; max-height: 50px; margin: auto; }
.switch-row { margin-bottom: 5px; font-size: 0.8em; }
.switch-row a.switchLoading,
.switch-row a.switch0,
.switch-row a.switch1,
.switch-row a.switch2 { font-size: 18px; }

#main { padding-bottom: 120px; }

.price-inline,
.stock-inline {display: inline-block;vertical-align: middle;font-size: 12px;line-height: 16px;}
.stock-inline input,
.price-inline input {width: 65px;height: 24px;font-size: 14px;text-align:right;}


.no-wrap { white-space: nowrap; }

table .dropdown-menu {left: initial;right: 0;padding: 10px;}
table .dropdown-menu li:not(:last-of-type) { margin-bottom: 5px }
table .dropdown-menu .btn {width: 100%;border-radius: 0;}
table .btn-drop {padding: 8px;}
table .btn-drop .caret {border-width: 7px;}

.filter-form {  }
.filter-form input,
.filter-form select { max-width: 160px; }


.inline-block { display: inline-block; }

.categories_checkbox .categories_checkbox { padding-left: 30px; }

.ui-datepicker .ui-datepicker-title select { color: #000000; }


.switch-wrapper { display: inline-block; vertical-align: top;  }
.switch-wrapper input { display: none !important; }
.switch-wrapper label.switch-label:not(.inline) { background: #cacaca; text-align: center; min-width: 65px; width: auto; margin: 0; color: #fff; padding: 0 15px; font-size: 12px; cursor: pointer; }
.switch-wrapper label.switch-label:not(.inline):nth-of-type(1) {  }
.switch-wrapper label.switch-label:not(.inline):nth-of-type(2) {  }
.switch-wrapper label.switch-label:not(.inline):nth-of-type(3) {  }
.switch-wrapper label.switch-label:not(.inline):first-of-type { border-radius: 5px 0 0 5px; }
.switch-wrapper label.switch-label:not(.inline):last-of-type { border-radius: 0 5px 5px 0; }
.switch-wrapper input:checked + label.switch-label:not(.inline):nth-of-type(1) { background-color: #3391d1; }
.switch-wrapper input:checked + label.switch-label:not(.inline):nth-of-type(2) { background-color: #e74c3c; }
.switch-wrapper input:checked + label.switch-label:not(.inline):nth-of-type(3) { background-color: #33d191; }

.loader-wrapper {position: fixed;left: 0;top: 0;right: 0;bottom: 0;background: rgba(255, 255, 255, 0.57);z-index: 9999999999;}
.loader-wrapper .loader { position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; }


.loader {border: 16px solid transparent;border-radius: 50%;border-top: 16px solid blue;border-bottom: 16px solid blue;width: 120px;height: 120px;-webkit-animation: spin 2s linear infinite;animation: spin 2s linear infinite;}
@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
