@charset "utf-8";

/* CSS Document Setup*/
@font-face {
    font-family: 'Lithograph';
    src: url('../fonts/Lithograph.eot');
    src: url('../fonts/Lithograph.eot') format('embedded-opentype'),
         url('../fonts/Lithograph.woff2') format('woff2'),
         url('../fonts/Lithograph.woff') format('woff'),
         url('../fonts/Lithograph.ttf') format('truetype'),
         url('../fonts/Lithograph.svg#Lithograph') format('svg');
}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
* {
    box-sizing: border-box;
}
.spinner {
	position: absolute;
	height: 40px;
	width: 40px;
	left: 50%;
	top: 50%;
	margin: -20px 0 0 -20px;
	border: 3px transparent solid;
	border-top: 3px #5082E7 solid;
	border-radius: 20px;
	animation: spin 1000ms infinite linear;
	
}
.wiggle {		
	animation: wiggle 2000ms forwards ease;	
}
@keyframes wiggle{
	0%{transform: rotate(0deg);}
	40%{transform: rotate(-10deg);}
	42%{transform: rotate(10deg);}
	45%{transform: rotate(-7deg);}
	50%{transform: rotate(6deg);}
	55%{transform: rotate(-4deg);}
	60%{transform: rotate(2deg);}
	100%{transform: rotate(0deg);}
}	
@keyframes spin {
	0%{transform: rotate(0deg);}
	50%{transform: rotate(180deg);}
	100%{transform: rotate(360deg);}
}
@keyframes blink {
	0%{opacity: 1;}
	50%{opacity: 0.7;}
	100%{opacity: 1;}
	
}
body, html {
	width:100%;
	height:100%;
	position:relative;
}
body {
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;	
     background: url(../images/background.jpg) fixed;
	background-size: cover;
	 overflow-x:hidden;
}
a:link {
	color:#CDF;
	text-decoration:none;
}
a:visited {
	color:#CDF;
}
a:hover {
	color: #000;
	text-decoration:none;
}
a:active {
	color: #009;
}
breadcrumbs {
    position: relative;
    margin-top: -50px;
    font-size: 13px;
    color: #FFF;
    height: 21px;
    width: 100%;
    border-bottom: 1px solid #1c3f9c;
}
h1 {
    display: block;
    clear: both;
    width: 100%;
    font-size: 30px;
    font-family: 'Lithograph';
    color: #9eb2d0;
    text-shadow: 0 0 30px #000;
}
h3 {	
    margin: 0 0 30px -35px;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

::-webkit-scrollbar {
    width: 10px;
	border-radius: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #020827; 
	border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #566A88; 
	border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555; 
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #7B9AFF;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #7B9AFF;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #7B9AFF;
}
:-moz-placeholder { /* Firefox 18- */
  color: #7B9AFF;
}
.siteInput {
	width: 100%;
	padding: 5px; 
	border-radius:5px;
	color: #666;
	background-color:#FFF;
	margin: 15px 0;
}
.ui-dialog {
	z-index: 9999999 !important;
	box-shadow: 0 0 0 10000px rgba(0,0,0,0.4), 0 0 20px rgba(0,0,0,1);
}
/*Logo*/
.adcraftLogo {
	transition: all 800ms ease;
	padding:5px 5px 5px 80px;
	font-family: Arial;
	font-weight:900;
	font-size:70px;
	position:relative;
	cursor:pointer;
	height: 100px;
	width: 360px;
	z-index: 3;
}
.adcraftLogoSmall {
    transform: scale(0.4);
    top: -38px;
    position: fixed;
}
.adcraftLogo:after {
    transform: scale(0.5);
    content: '';
    background: url(../images/logo.png) no-repeat;
    background-size: contain;
    background-position: left;
    transition: all 800ms ease;
    opacity: 1;
    position: absolute;
    z-index: -1;
    display: block;
    top: -25px;
    left: -50px;
    width: 200px;
    height: 200px;
}
.adcraftLogo:hover {
	padding:5px 5px 5px 5px;
}
.adcraftLogo:hover:after {
	opacity:0;
}

.adcraftLogo div {
	transition: transform 800ms ease, text-shadow 800ms ease, color 800ms ease, margin-left 800ms ease;
	float:left;
	position:relative;
   text-shadow:-1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF, -2px -2px 0 #FFF, 2px -2px 0 #FFF, -2px 2px 0 #FFF, 2px 2px 0 #FFF,  4px 4px 15px rgba(0,0,0,0.7);
}

.adcraftLogo div span {
	animation: jumper 3000ms ease infinite;
}
@keyframes jumper {
	0%{margin-top:0;}
	70%{margin-top:0;}
	85%{margin-top:-50px;}
	100%{margin-top:0;}
}
.adcraftLogoSmall div {
   text-shadow:-1px -1px 0 rgba(255,255,255,1), 1px -1px 0 rgba(255,255,255,1), -1px 1px 0 rgba(255,255,255,1), 1px 1px 0 rgba(255,255,255,1) !important;
}
.adcraftLogo:hover div {
	transform:unset !important;
	margin-left :0px !important;
	color: #475975 !important;	
   text-shadow:-1px -1px 0 rgba(255,255,255,0.2), 1px -1px 0 rgba(255,255,255,0.2), -1px 1px 0 rgba(255,255,255,0.2), 1px 1px 0 rgba(255,255,255,0.2) !important;
}

.adcraftLogo #AFirst {
	color:#0AD;
	z-index:1;
}

.adcraftLogo #d{
	color:#009;
	transform:rotate(15deg);
	margin-left:-15px;
	z-index:2;
}
.adcraftLogo #hyphen{
	color:#000;
	z-index:1;
}
.adcraftLogo #c{
	color:#40A;
	z-index:2;
}
.adcraftLogo #r{
	color:#F00;
	z-index:1;
	transform: scale(0.85) translateY(2px);
	margin-left:-15px;
}
.adcraftLogo #a{
	color:#F80;
	z-index:2;
	transform: rotate(-15deg) scale(0.85);
	margin-left:-5px;
}
.adcraftLogo #f{
	color:#FF0;
	z-index:3;
	margin-left:-5px;
}
.adcraftLogo #t{
	color:#090;
	z-index:4;
	margin-left:-5px;
	transform: scale(0.85) translateY(2px);
}

.adcraftLogo #sas{
	font-family: 'Lithograph';
	font-size:23px;
     margin-top: -10px;
    letter-spacing: 1px;
	transition: all 800ms ease;
	color: #131331 !important;
}
.adcraftLogo:hover #sas{
    letter-spacing: 4px;
}
/*header*/
.header {
	width:100%;
	max-width:1250px;
	margin:50px auto 0 auto;
	position:relative;
	height:238px;
	z-index: 1;
	text-align: right;
}
.headText {
	position:absolute;
	font-size:21px;
	color:#FFF;
	top:30px;
     right: 0;
}
.headerTop {
	width:100%;
	height:50px;
	background-color:#022C46;
	color:#FFF;
	position:fixed;
	top: 0;
	left: 0;
	z-index: 2;
}
/*Main menu*/
.menubar {	
	display:block;
	width:100%;
	height:40px;
	background-color:#1445757d;
	position:absolute;
	left:0;
	top: 198px;
}
ul.mainMenu {
	max-width:1250px;
	list-style-type:none;
	display:block;
	width:100%;
	height:40px;
	line-height:40px;
	margin:0;
	padding:0;
	clear: both;
	background-color:#1445757d;
	position:absolute;
	bottom:0;
}
ul.mainMenu li {	
	display:inline-block;
	width:13.9%;
	height:40px;
	margin:0;
	padding:0;
	text-align:center;
	position:relative;    
	float: left;
}

ul.mainMenu li:not(:first-of-type):before {
	display:block;
	content:'';
	position:absolute;
	left:-2px;
	top:15%;
	height:70%;
	border-right:1px solid #000;
}
ul.mainMenu li a {	
	display:block;
	width:100%;
	height:100%;	
	margin:0;
	padding:0 1%;
	color: #FFF;
}
.keepMenu {
	position:fixed !important;
	top:50px;
}
ul.mainMenu li:hover a {	
	background-color:#DDD;
	color: #555;
}
/*slideshow*/
.slideshow {
    width: 100%;
    position: relative;
    height: calc(100vh - 288px);
    z-index: -1;
}
.slideshow .pictures {
    width: 100%;
    position: relative;
    height: 100%;
}

.slideshow .text {
    bottom: 0;
    width: 100%;
    padding-left: 10%;
    position: absolute;
    height: 200px;
    text-align: left;
    z-index: 1;
    font-family: arial;
    font-size: 30px;
    font-weight: 100;
    color: #FFF;
	background-color:rgba(0,0,0,0.2);
    text-shadow: 0 0 20px rgba(0,0,0,0.7), 0 0 10px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1);
	
}
.slideshow .text div {
    width: 100%;
    position: absolute;
    height: 50%;
    z-index: 1;
	top: 0;
	display:none;
}

.slideshow .text div h1 {
	display: block;
	clear:both;
	margin-left:-400px;
	transition:all ease 400ms;
	font-family:times;
	font-weight:bold;
	font-size:80px;
	text-align:left;
	margin-top:0;
	padding: 0;
}
.slideshow .text div.current h1 {
	margin-left:0px;
}
.slideshow .text div span {
	margin-top:60px;
	transition:all ease 600ms;
}
.slideshow .text div.current span {
	margin-top:0px;
}
.slideshow .pictures span {
    width: 100%;
    position: absolute;
    height: 100%;
    top: 0;
	background-size: cover;
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-position: 0 0;
	display:none;
}

.slideshow .text div:first-of-type, .slideshow .pictures span:first-of-type {
	display:block;
}

/*body content*/
.contactForm {
	position: relative;
}
.contactForm label {
	position: relative;
	width: 100%;
	display: block;
	height: 50px;
}
.contactInput {
    float: right;
    width: 50%;
    padding: 1%;
    border-radius: 5px;
    border: none;
    background-color: rgba(255,255,255,0.7);
    color: #059;
}
textarea.contactInput {
	height: 110px;
    margin-top: -4px;
}
.contactSubmitbutton {
    width: 47%;
    border-radius: 5px;
    border: none;
    background-color: rgba(0,14,100,0.70);
    margin-top: 10px;
    color: #FFF;
	cursor: pointer;
}
.pricelist__table {
	border: 1px solid #000;
	position: relative;
    margin-top: 5px;
    width: 100%;
}
.pricelist__table td {
	border-collapse: collapse;
	border: 1px solid #000;
    width: 20%;
}
.bcard {
	background-color: #4E5575;
	
}
.bcard .trHeader {
	background-color: #000C22;
}

.flyers {
	background-color: #4E9575;
	
}
.flyers .trHeader {
	background-color: #0C351E;
}

.general {
	background-color: #A87070;
	
}
.general tr:hover {
	background-color: #785050;
	
}
.general .trHeader {
	background-color: #480000;
}
.Others {
	background-color: #B1938C;
	
}
.Others .trHeader {
	background-color: #332116;
}
.pricelist__table_h1 {
    margin-top: 50px;
}
.measure {
	position: relative;
	width: 50%;
	float: left;
	min-width: 114px;
    font-size: 12px;
	overflow: hidden;
    height: 0;
	opacity: 0;
	transition: all 500ms ease;
}
.pricelist__table tr:hover .measure {
    height: 25px;
	opacity: 1;
	
}

.pricelist__table tr:hover .measure {
	display: block;
	
}
.measure span {
    position: absolute;
    right: 13%;
    color: #999;
    font-size: 10px;
    z-index: 99;
    top: 4px;
}
.measure input {
	position: absolute;
	width: 50%;	
	right: 10%;
	-moz-appearance: textfield;
}
.measure input::-webkit-outer-spin-button, .measure input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.specialPopup {
	width: 60%;
	height: 60%;
	position: fixed;
	top:20%;
	left:20%;
	z-index: 999999;
}
.specialPopup img {
    object-fit: contain;
    width: 100%;
}
.closePopup {
    display: block;
    position: fixed;
    top: 20%;
    right: 20%;
    width: 30px;
    height: 30px;
    color: #FFF;
    background-color: #000;
    border: 2px solid #FFF;
    border-radius: 30px;
    font-size: 20px;
    line-height: 14px;
    text-align: center;
	margin: -12px;
	transition: all ease 300ms;
	cursor: pointer;
     outline: none;
	transform: rotate(45deg);
}
.closePopup:active, .closePopup:hover, .closePopup:focus {
	outline: none;
	background-color: #700;
}
input[type="checkbox"], input[type="checkbox"]:focus, input[type="checkbox"]:active {
	outline: none;
}
.hidepopup {
	position: relative;
	margin: -20px 0 0 10px;
	text-shadow: 0 0 5px #FFF;
	cursor: pointer;
}

.hidepopup:hover {
	color: #009;
}
.overlay {
	position: fixed;
	top: 0;
	left:0;
	width:100%;
	height:100%;
	z-index: 499;
	background-color: rgba(0,0,0,0.5);
}
.bodyContainer {
	width: 100%;
	max-width:1250px;
	margin: 0 auto;	
     padding-top: 75px;
     padding-bottom: 75px;
	 font-size:20px;
	 color:#fff;
}
.miniGallery img {
	width: 48%;
	height: 200px;
	margin-bottom:20px;
	object-fit: cover;
	float:left;
}
.miniGallery img:nth-of-type(2n+2) {
	margin-left: 2%;
}

.footer {
	position: relative;
	width: 100%;
    height: 450px;
    background-color: #0c3258cf;
	clear:both;
	color: #FFF;
	 font-size:16px;
}
.footerContent {
	width: 100%;
	max-width:1250px;
	margin: 0 auto;	
     padding-top: 75px;
     padding-bottom: 75px;
}

.footerContent > div{
	padding: 0 15px;
}
.footerContent > div:nth-of-type(3n+2){
	border-left:1px solid rgba(255,255,255,0.1);
	border-right:1px solid rgba(255,255,255,0.1);
	
}
.footerPost {
	display:block;
	width: 100%;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	padding:5px 30px;
	color: #FFF !important;
	font-size:12px;
	position:relative;
}
.footerPost:before {
	position:absolute;
	left:0;
	top: 50%;
	margin-top:-7px;
	display:block;
	content:'';
	border-left: 10px solid #FFF;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	transition:all ease 400ms;
}

.footerPost:hover:before {
	left:15px;
}
.footerPost h5 {	
	color:#47F !important;
}
.footerPost:hover h5 {
	color:#000 !important;
}
.footerPost:hover {
	background-color:rgba(255,255,255,0.1);
}
.copyright {
    position: absolute;
    bottom: 10px;
    left: 50%;
    text-align: center;
    width: 300px;
    margin-left: -150px;
    font-size: 12px;
	color: #FFF !important;
}
.copyright a {
	color: #FFF !important;
}
.eyeSpy {
    background: url(../images/see.png) no-repeat;
    display: block;
    width: 30px;
    height: 36px;
    background-size: contain;
    position: absolute;
    right: 5px;
    top: 9px;
    opacity: 0.3;
	cursor: pointer;
}

.eyeSpy:hover {
    opacity: 1;
}
#loginForm {
	width:100%;
	display: block;
}
#loginForm label {
	width: 100%;
	position: relative;
}

#loginForm label input {
	width: 60%;
	float: right;
}
#loginForm label span {
	width: 40%;
	float: left;
	overflow: hidden;
}
#loginForm label strong {
    color: #F00;
    margin-left: 5px;
    font-size: 12px;
    margin-top: 2px;
    position: absolute;
}

#loginForm input[type="submit"], #loginForm input[type="reset"] {
	width: 29%;
	float: right;
	margin-left: 2%;
	cursor: pointer;
	border: none;
}
#loginForm input[type="submit"]:hover, #loginForm input[type="reset"]:hover {
	background-color: #022C46;
	color: #FFF;
}
.wrong{
    position: absolute;
    font-size: 10px;
    color: #F00;
    margin-top: 24px;
}
/*services accordian*/

.serviceH2 {
    width: 16.66%;
    clear: none;
    float: left;
    margin: 0;
    position: relative;
    cursor: pointer;
    transition: all ease 400ms;
    height: 50vh;
     background-size: cover;
    border: 3px solid #153b5a;
	overflow: hidden;
}
.serviceH2 span {
    display: block;
    width: 50vh;
    bottom: -50vh;
    height: 100%;
	background-color: rgba(0,0,0,0.65);
    position: relative;
    left: 0;
    transition: all ease 400ms;
    transform: rotate(-90deg);
    -webkit-transform-origin: left top;
    transform-origin: left top;
    padding: 8% 20px;
	text-shadow: 0 0 10px #000, 0 0 20px #000;
}

.serviceH2:hover {
	color:#FF0;
}
.serviceH2:hover span {
	background-color: rgba(0,0,0,0.45);
}
.serviceBox {
	width:0;
	height: 50vh;
	float:left;
	transition: all ease 400ms;
	overflow: hidden;	
    overflow-y: auto;
}
.expanded {
	width: 64%;	
}
h2.contracted {
	width: 5%;	
}
h2.expanded {
	width: 11%;	
}

h2.expanded span, h2.expanded:hover span {
	background-color: rgba(0,0,0,0.1);
}
.websites {
	display: block;
    position: relative;
}
.websites img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left top;
    clear: both;
    position: relative;
}
.websites:hover img {
	animation: bigimg 800ms ease-out forwards;
}
@keyframes bigimg {
	0%{transform: translateY(0px);}
	60%{transform: translateY(-40px) scale(0.95); z-index: 2;}
	61%{transform: translateY(-40px) scale(0.95); z-index: 9999; box-shadow:0 0 0 rgba(0,0,0,1);}
	100%{transform: translateY(-40px) scale(1.3);; z-index: 9999; box-shadow:0px 20px 10px rgba(0,0,0,0.4);}
}
.websites span {
    display: block;
    position: absolute;
    background-color: rgba(0,26,60,0.8);
    width: calc(100% - 30px);
    padding: 5px;
    text-align: center;
    bottom: 0;
    color: #FFF;
}
.jobTable {
	width:100%;
}

.jobTable tr {
	position: relative;
}
.jobTable td, .jobTable th {
	padding:5px 5px 5px 23px;
	border:1px solid rgba(255,255,255,0.1);
    position: relative;
}

.jobTable th {
	padding:2px;
}
.jobTable > tbody > tr > td {
	padding: 0;
}
.jobTable input {
    position: relative;
    float: left;
    background-color: transparent;
    border: none;
    padding: 0;
    color: rgba(255,255,255,0.6);
 	width: 100%;
	pointer-events: none;
}
.ediTable input {
	pointer-events: all !important;
    color: #FFF !important;
}
.editJobTable, .addnewJob {
	filter: saturate(0.2);
	opacity: 0.3;
	cursor: pointer;
	width: 20px;
	margin-left: 5px;
}
.editJobTable:hover, .addnewJob:hover {
	filter: saturate(0.4);
	opacity: 0.6;
}

.editing {
	filter: saturate(1) !important;
	opacity: 1 !important;
}
.r {
    position: absolute;
    left:5px;
}
.jobTitle {
	cursor: pointer;
}
.moreInfo {
	position: relative;
	padding-left: 5px;
	display: block;
}
.moreInfo:hover {
	color: #009;
}
.moreInfo:before {
    content: 'i';
    display: block;
    position: absolute;
 	left: -22px;
    top: 5px;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 18px;
    font-size: 16px;
    font-weight: bold;
    color: #042662;
    border: 2px solid #042662;
    border-radius: 10px;
    background-color: rgba(200,200,255,0.4);
}
.jobDescription {
	position: absolute;
	background-color: #FFF;
	border: 1px solid #999;
	padding: 5px;
	color: #999;	
    margin-top: 37px;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
	display: none;
	z-index: 999;
}
.jobTable .result {
	position: absolute;
	top:0;
	left:100%;
 	height: 40px;
    width: 40px;
}
.jobTable .result img {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -10px;
	margin-left: -10px;
  	width: 20px;
}
#ui-datepicker-div {
	margin-top: -47px !important;
}
.sqlError {
    width: 350px;
    height: 150px;
    color: #F00;
    background-color: #FFF;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 5px;
    border: 2px solid;
    right: 0;
    position: absolute;
}
.unavailable {
	filter: saturate(0) !important;
	pointer-events: none !important;
}
.addJob {
    pointer-events: all !important;
    color: #000 !important;
    background-color: #FFF !important;
    padding: 5px !important;
    border-radius: 4px;
}
.clientSelector {
	float: left;
}
.addNewClient {
	display: block;
	float: left;
}
.galimg {
    width: 33%;
    height: 290px;
    position: relative;
    margin: 0 0 10px 0;
    float: left;
    padding: 10px;
    border: 1px solid rgba(255,255,255,0.03);
    background: linear-gradient(#244c6d35, #153b5a);
	transition: all ease 300ms;
    font-size: 14px;
    line-height: 70px;
    color: #FFF;
}
.galimg:hover {
    border-bottom: 11px solid rgba(0, 123, 255, 0.19);
}
.galimg:before {
    content: '';
    display: block;
    position: absolute;
    left: -10px;
    top: 5px;
    height: calc(100% - 5px);
    width: 9px;
    background: url(../images/shadow.png);
    background-size: 100% 100%;
}
.galimg img {
    width: 100%;
    height: 204px;
    object-fit: contain;
    cursor: pointer;
    object-position: top;
    position: relative;
	transition: all ease 300ms;
}

.galimg:hover img {
    transform: translateY(-18px) rotate(5deg) scale(1.1);
	filter: drop-shadow(2px 3px 5px rgba(0,0,0,0.8));
}
.galimg span {
	color: #4AF;
}
.galimg div {
	position: absolute;
	overflow: hidden;
	bottom: 0;
	left:0;
	text-align: center;
}
.cats {
	cursor: pointer;
}
.currentCat {
	text-decoration: underline;
}
.cats:hover {
	color: #47F;
}
.smallImg{
	cursor: pointer;
	width: 1px;
	height: auto;
	max-height: 80%;
	position: fixed;
	object-fit: cover;
	left:50%;
	top:50%;
	z-index:-1;
}
.overlayShadow {
    box-shadow: 0 0 0 9000px rgba(0,0,0,0.7), 0 0 15px 9px rgba(0,0,0,0.7);
    background-color: rgba(0,0,0,0.7);
    background: rgba(0, 0, 0, 0.84);
    padding: 3px;
    border: 2px solid #000;
    border-radius: 10px;
}
.contactItem {
	margin-bottom: 30px;
}
.titleImg {
	max-width: 100%;
	filter: drop-shadow(0 0 2px #000);
}
.postImage img {
	max-width: 100%;
}
.searchResults {
	max-width: 100%;
}

.searchResults a {
	width: 100%;
	display: block;
}
.searchResults small {
	color: rgba(255,255,255,0.8) !important;
	font-size: 10px;
}
/*Site Admin*/

.sidemenu {
	list-style-type: none;
	display: block;
	width: 100%;
}
.sidemenu li {
	display: block;
	cursor: pointer;
	padding: 5px;
	width: 100%;
}

.sidemenu li:hover {
	background-color: rgba(0,0,0,0.2);
}
.currentMenu {
	color: #8899FF;
}
.headerAdmin {
	width:100%;
	max-width:1250px;
	margin:50px auto 0 auto;
	position:relative;
	height:138px;
	z-index: 1;
	text-align: right;
}
#adminMain {
	padding: 10px;
	border-left: 1px solid #FFF;
}
.adminInput {
    width: 100%;
    font-size: 16px;
    padding: 5px;
    background-color: rgba(31, 49, 86, 0.67);
    color: #6296f9;
    border: 1px solid #123354;
    border-radius: 5px;
	transition: all ease 300ms;
}
textarea.adminInput {
    height: 200px;
}
input.adminInput{
    height: 40px;
}
.adminInput:hover {
	background-color: rgba(31, 49, 86, 0.87);
}
.adminInput:focus {
    background-color: rgba(255,255,255,0.2);
    color: #FFF;
    border: 1px solid #369;
}
.adminImg {
	width: 100%;
    max-height: 200px;
    object-fit: contain;
    border: 1px solid #123354;
	cursor: pointer;
}
.adminImg:hover {
	background-color: rgba(255,255,255,0.05);
}
.invisible {
	display: block;
	font-size: 1px;
	width: 1px;
	height: 1px;
	color: transparent;
	opacity: 0;
	position: absolute;
	z-index: -2;
}
.changedAdmin {
	position: relative;
}.silentSend {
	position: relative;
	margin-bottom: 0em;
}
.changedAdmin:after {
    content: '*';
    display: block;
    color: #F00;
    top: -15px;
    right: -7px;
    font-size: 28px;
    position: absolute;
}
.submitImg {
    display: none;
    top: -10px;
    right: 0;
    position: absolute;
    padding: 5px;
    background-color: #073;
    border-radius: 5px;
    cursor: pointer;
}
.submitImg:hover {
    background-color: #3a6;
}
.silentSend .result {
	position: absolute;
	top: -10px;
	right: 50px;
	max-height: 80px;
	overflow-x: hidden;
	overflow-y: auto;
	z-index: 99999;
	color: #05D;
}
.smallLabel label {
	display: block;
	
}
.adminGalimg {
	
}
.edit, .changeImage {
    background: url(../images/edit.png) no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    float: right;
	margin-right: 5px;
	cursor: pointer;
	opacity: 0.2;
	position: relative;
	z-index: 9;
}
.changeImage {
    background: url(../images/photos.png) no-repeat;
	background-size: contain;
}
.editSaved {
    background: url(../images/done.png) no-repeat;
	background-size: contain;
}
.editSave, .addSave {
    background-size: contain;
    width: 48px;
    height: 20px;
    float: right;
    margin-right: 7px;
    cursor: pointer;
    opacity: 0.2;
    position: relative;
    z-index: 9;
    color: #FFF;
    line-height: 18px;
}
.selectGallery, .selectCategory, .selectWeb {
	position: relative;
	z-index: 2;
}
.selectGallery:hover .edit, .selectGallery:hover .editSave, .selectGallery:hover .addSave, .selectCategory:hover .edit, .selectCategory:hover .editSave, .selectCategory:hover .addSave, .selectCategory:hover .changeImage, .selectWeb:hover .changeImage, .selectWeb:hover .editSave, .selectWeb:hover .addSave, .selectWeb:hover .edit {
	opacity: 0.5;
}
.selectGallery:hover .selectGal, .selectCategory:hover .selectGal {
	color: #FFF;
}
.edit:hover, .editSave:hover, .addSave:hover, .changeImage:hover {
	opacity: 1 !important;
}
.textEdit {
	display: none;
	color: #3077ff;
	animation: blink 1000ms ease infinite;
	padding-right: 10px;
}
.addNewPlus, .addNewImage, .addNewCatPlus, .addNewServPlus , .addNewWebPlus {
    display: block;
    width: 30px;
    background-color: #270;
    text-align: center;
    line-height: 30px;
    height: 30px;
    border-radius: 30px;
    font-size: 29px;
    border-bottom: 2px solid #020;
    border-right: 2px solid #020;
    position: absolute;
	left: 123px;
    top: 13px;
	cursor: pointer;
}
.addNewPlus:hover, .addNewImage:hover, .addNewCatPlus:hover, .addNewServPlus:hover, .addNewWebPlus:hover  {
	background-color: #0A0;
}

.removeMinus, .removeCatMinus, .removeServMinus, .removeWebMinus {
    display: block;
    width: 30px;
    background-color: #600;
    text-align: center;
    line-height: 25px;
    height: 30px;
    border-radius: 30px;
    font-size: 29px;
    border-bottom: 2px solid #020;
    border-right: 2px solid #020;
    position: absolute;
	left: 158px;
    top: 13px;
	cursor: pointer;
}
 .addNewCatPlus {
	left: 329px;
}
 .removeCatMinus {
	left: 365px;
}
 .addNewServPlus {
	left: 329px;
}
 .removeServMinus {
	left: 365px;
}
.removeMinus:hover, .removeCatMinus:hover , .removeServMinus:hover, .removeWebMinus:hover {
	background-color: #A00;
}
.hiddenFormItems {
	display: none;
}
.catImg {
	width: 30px;
	cursor: pointer;	
	animation: blink 1000ms ease infinite;
	pointer-events: none;
	transition: all 300ms ease;
}
.changeCatImage{
	pointer-events: none;
}
.editableCat {	
	pointer-events: all !important;
	width: 150px;
}
.clickMetoEdit {	
	pointer-events: all !important;
}
.clickMetoEdit:after {
    content: "Click to change image";
    display: block;
    position: absolute;
    bottom: 8px;
    left: 1px;
    font-size: 15px;
    text-shadow: 0 0 3px #000;
    color: #FD0;
    pointer-events: none;
}
form.disabled {
	pointer-events: none;
	opacity: 0.2;
}
.editCancel, .addCancel {
    background-color: #700;
    border: 2px solid #FFF;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    transform: rotate(45deg);
    text-align: center;
    line-height: 18px;
    width: 22px;
    height: 22px;
    position: absolute;
    border-radius: 20px;
    right: -20px;
    top: 0;
	cursor: pointer;
}
.editCancel:hover, .addCancel:hover {
	background-color: #A00;
}
.deleteThis, .deleteThat {
	background: url(../images/delete.png) no-repeat;
	background-size: contain;
	width: 20px;
	height: 25px;
	position: absolute;
	right: -27px;
    top: 0;
    opacity: 0.5;
    cursor: pointer;
}

.catforms:hover .deleteThis, .catforms:hover .deleteThat {
    opacity: 1;
	animation: wiggle 2000ms forwards ease;	
}
#popup {
	display: none;
    width: 300px;
    height: 200px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -100px;
    background: linear-gradient(#777, #DDD);
    border-top: 1px solid #FFF;
    border-left: 1px solid #333;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #333;
    box-shadow: 0 0 0 1px #000, 0 0 0 3000px rgba(0,0,0,0.6);
    border-radius: 10px;
    padding: 10px;
    text-align: center;
    font-size: 18px;
    z-index: 999;
}
#popup .button {
    float: left;
    background-color: rgba(0,0,0,0.31);
    text-align: center;
    width: 46%;
    margin: 2%;
    color: #FFF;
	cursor: pointer;
}

#popup .button:hover {
    background-color: rgba(0,0,0,0.81);
}
#popup .row {
    margin: 0 0 0 -9px;
    position: absolute;
    bottom: 1px;
    width: 100%;
}
.checkboxBox {
	position: relative;
}
.checkboxLabel {
	font-size: 12px;
	padding-left: 26px;
}
.checkboxBox input[type="checkbox"] {
	display: none;
}
.checkboxBox input[type="checkbox"] ~ span {
	display: block;
	position: absolute;
	left: 0;
    top: 0;
    cursor: pointer;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	background-color: #6173AB; 
}
.checkboxBox input[type="checkbox"] ~ span:after {
	display: block;
	content: "";
	background: url(../images/done.png) no-repeat;
	background-size: contain;
	opacity: 0;
    transition: all 600ms ease;
    width: 20px;
    height: 23px;
    margin-top: -3px;
}
.checkboxBox input[type="checkbox"]:checked ~ span:after {
	opacity: 1;
}
.checkboxBox input[type="checkbox"]:checked ~ span {
	display: block;
	background-color: #a4ce46; 
}
.ui-widget-overlay {
    background: #000;
    opacity: .8;
    filter: Alpha(Opacity=80);
}
.GalleryImg img {
	width: 220px;
    height: 150px;
    object-fit: cover;
}
.GalleryImg {
	width: 230px;
    height: 200px;
	float: left;
	margin: 5px;
    position: relative;
	transition: all 300ms ease;
	cursor: zoom-in;
	cursor: -webkit-zoom-in;
}
.GalleryImg span {
	float: none;
    clear: both;
    display: block;
    height: 40px;
    text-align: center;
    padding: 5px;
    overflow: hidden;
    bottom: 0;
    left: 0;
    width: 100%;
	transition: all 300ms ease;
}

.GalleryImg span:hover {
	position: absolute;
	height: auto;	
    background: #FFF;
    color: #229;
}
.NewGalleryImg {
	float: left;
	margin: 10px;
	cursor: pointer;
}
.NewGalleryImg img {
	max-width: 200px;
	height: auto;
	object-fit: contain;
	max-height: 200px;
}
.newGalleryInput {
	clear: both;
	display: none;	
    margin: 10px;
    width: 100%;
}
.newGalleryInput input, .newGalleryInput select {
	height: 40px;
    padding: 5px;
	width: 100%;
}
.deleteThisImage {
	opacity: 0;
	width: 25px;
	height: 25px;
	background: url(../images/delete.png) no-repeat;
	background-size:contain;
	position: absolute;
	top: 5px;
	right: 5px;
	cursor: pointer;
	transition: all 300ms ease;
    z-index: 99;
	filter: drop-shadow(2px 2px 3px #000);
}
.GalleryImg:hover .deleteThisImage {
	opacity: 1;
	animation: wiggle 2000ms forwards ease;	
}
.scaler {
	z-index: 99999;
	transform: scale(2);
	box-shadow: 0 0 0 1000px rgba(0,0,0,0.3);
	cursor: zoom-out;
	cursor: -webkit-zoom-out;
}
.itemList {
	position: relative;
	width: 100%;
}
.EditSave input[type="submit"] {
    display: none;
    background-color: #68F;
    border: none;
    border-radius: 3px;
    color: #FFF;
    font-size: 12px;
}
.deleteItem {
	position: absolute;
	right: 10px;
	top: 0px;
	width: 20px;
	height: 20px;
	background: url(../images/delete.png) no-repeat;
	background-size: contain;
	cursor: pointer;
	opacity: 0.6;
}
.EditItem {
	position: absolute;
	right: 35px;
	top: 0px;
	width: 20px;
	height: 20px;
	background: url(../images/edit.png) no-repeat;
	background-size: contain;
	cursor: pointer;
	opacity: 0.6;
}
.EditArticle {
	position: absolute;
	right: 65px;
	top: 2px;
	width: 20px;
	height: 20px;
	background: url(../images/editArticle.png) no-repeat;
	background-size: contain;
	cursor: pointer;
	opacity: 0.6;
}
.cancelEdit {
	position: absolute;
	right: 35px;
	top: 0px;
	width: 20px;
	height: 20px;
	background-color: #800;
	border-radius: 10px;
	border: 2px solid #FFF;
	cursor: pointer;
	opacity: 0.6;
}
.cancelEdit:after {
	content: '+';
	color: #FFF;
	transform: rotate(45deg);
	text-align: center;
	line-height: 20px;
	position: absolute;
    top: -2px;
    left: 2px;
	display: block;
}
.cancelEdit:hover, .EditItem:hover, .deleteItem:hover, .EditArticle:hover {
	opacity: 1;
	
}
.editThis[contenteditable="true"]{
	padding:5px;
}
.fullSubmit {
	width: 100%;
	background-color: #39F;
	color: #FFF;
	border: none;
	display: block !important;
}
.nicEdit-main {
	background-color:#1f3156ab;
}
.contactCaptcha {
	margin: -24px 0 -33px 0px !important;
	width: 50% !important;
}
.contactCaptcha img {
	float: left;
	filter: drop-shadow(0 0 3px rgba(0,0,0,1));
}
.contactCaptcha input {
    float: left;
    width: 56%;
    height: 30px;
    font-size: 15px;
    border-radius: 5px;
    border: none;
    padding: 9px;
    background-color: rgba(255,255,255,0.7);
}
.contactResults {
    font-size: 11px;
    color: #F00;
    position: absolute;
    top: 1px;
    right: 3px;
    pointer-events: none;
}
.green {
	background-color: #35B900 !important;
}
.contactItem iframe {
	position: relative;
	z-index: 9999;
}
/*Responsive CSS*/

@media(max-width:780px){	
	.adcraftLogo {
		transform: scale(0.4) translateY(-225px);
	}
}