/* 	============================
		Noch zu erledigen im MLS
	============================ */
.todo{color:white; background-color:red;}

	
	/* Main */
#mainTrans006{background: rgba(255, 255, 255, 0.06);}
#main{background: rgba(255, 255, 255);}	
#mainDash{background: rgba(255, 255, 255, 0.63);}  /*43%*/	
#mainHelp{background: rgba(255, 255, 255, 000);}	

		/* Zweispaltige Seitenstruktur*/
#col-mainContent{background: rgba(255, 255, 255, 0.80);}


/* Klassen, die die Schriften betreffen */
.p_first::first-letter{color: maroon;}

/* damit die Schrift weißbleibt, nach dem man den Link angeklickt hat*/
.awhite{color:white;}
.white{color:white;}


/* 	============================
		Hinweise 
	============================ */

span.more{color:maroon;}

span.anisys{color: #1eed0d; /* oragnge #ff9000;*/}
span.anisys:hover{color: #b9fa06; /* oragnge #ff9000;*/}

span.anisysM{color:#1eed0d; /* oragnge #ff9000;*/}
span.anisysM:hover{color:#b9fa06; /* oragnge #ff9000;*/}

span.break{color:rgba(33,45,80, 0.95);}

span.breakWhite{color:white;}

span.polaroid{color: black;/* teal ähnlich rgb(65, 122, 153);} /* etwas dunkler: rgb(53, 83, 99); /*color:rgb(17, 151, 224);  hellblau */
	
span.nr_medium{color:black;}

.back-to-login a {color:white;}
.back-to-login a:hover {color:grey;}

/* Error Message fürs Benutzer Anlegen Formular */
.errormsg{color:red;}

/* 	============================
		Rahmenfarben, allgemein und spezielle einstellungen 
	============================ */
/*Rahmen, das muss aber noch eingerichtet werden, damit es dann einfach ein oder ausschaltbar ist*/
.border {
	border: 5px solid rgba(33,45,80, 0.95); border-radius:5px;}  /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */
/*dünner Rahmen für den inneren Seitenbereich. Wird an php mit $border_inner übergeben*/
.border05{border: 1px solid white; border-radius:5px;}

/* angular - eckig! */
.border05ang{border: 1px solid white;}

/* Zweispaltiges Design */	
/*#col-mainContent,.aside-article{border:1px solid white; border-radius:5px;}*/

/*Bildergallerie V2*/
.vmtlTiere_V2{
	border: 5px solid rgba(33,45,80, 0.95); border-radius:5px;}   /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */

#mainHelp, #mainDash, #main, #mainTrans006, #mainLog {	
	/* Muss in Klasse, sonst keine Trennung möglich von Radius, oder ohne border
	border: 5px solid rgba(33,45,80, 0.95);    /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */
	border-radius:5px;
}

/* Sidebar */
.aside-article li {border-top:0.1px dotted rgba(33,45,80, 0.95);}

/* Flex-Item. Buttons zu den Helfen Seiten*/
.helpDashIB{border:0.1px solid white;}

/* standard Infobox*/
.dashIB{border:0.1px solid white;}

/* Tiny MCE Indextiny */
.tiny {
	border: 5px solid rgba(33,45,80, 0.95);    /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */
	border-radius:2px 73px 2px 2px;
}

/* Neuen Hund anlegen */
.button li{border: 3px solid green;}


/*  HundeUeberblick*/
.containerUeber{
	/* border: 5px solid rgba(33,45,80, 0.95);   /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */
	border-radius:5px;
}
.containerUeber1{
	border: 5px solid rgba(33,45,80, 0.95);    /* 179, 3, 139 richt magenta;   44, 56, 140, 0.84 blau */
	border-radius:5px;
}	

/* 	====================================
		Boxshadow
	==================================== */
#mainHelp, #mainDash, #mainTrans006, #mainLog {box-shadow: 0em 0em 4em 0em; }
#main{ box-shadow: 0em 0em 4em -1em;} /* das ist die Variante die wir im internen Bereich verwenden aber wenn der Hintergrund weißs 
	statt Bild ist muss der Schatten anders sein {box-shadow: 2em 2em 2em -1em;}*/	
	
/* 	====================================
		font Icons
	==================================== */
.fa-address-card{color:rgba(140, 0, 44, 0.8);} /* Fotogallerie und Tierprofil*/
.fa-cc-paypal {color:rgb(17, 151, 224);}	
.fa-home{color:gold;}
.fa-info {color: rgb(162, 20, 20);} 
.fa-angle-up {color:rgba(33,45,80, 0.95);}
.fa-check-square-o {color:green;}
.fa-check {color:green;}
.fa-pencil-square-o{color:#ff9000;}
#animalDataSheet1 .fa-pencil-square-o, #animalDataSheet2 .fa-pencil-square-o, #animalDataSheet3 .fa-pencil-square-o{color:inherit;}

/*	Dashboard	*/
.fa-wrench, .fa-list-ul, .fa-shopping-bag, .fa-clock-o, .fa-cutlery, .fa-credit-card {color:rgba(33,45,80, 0.95);}
.fa-envelope {color:white;}

.vmtlTiere .fa-address-card{color:rgba(140, 0, 44, 0.8);}
.vmtlTiere .fa-cc-paypal {color:rgb(17, 151, 224);}
.vmtlTiere .fa-home{	color:gold;}

/* 	helfen-seite Icons*/
.icon.fa-handshake-o{color:white;}	
.fa-heart{color:white;}
.icon.fa-ambulance{color:white;}	

/*Log Seiten*/
#logout .fa-paw, .fa-sign-in  {font-size:2em;}

/* Fotogallerie*/
.petRegCardDescr i.fa.fa-address-card{font-size:1.5em; color:rgba(140, 0, 44, 0.8);}
.petRegCardDescr i.fa.fa-cc-paypal {font-size:1.5em; color:rgb(17, 151, 224);}
.petRegCardDescr.fa-address-card{
	text-align:right;
	font-size:3em; 
	color:rgba(140, 0, 44, 0.8);
}

/* 	Hinweis zum Öffnen der Popup-Infofenster*/
.info .fa-info {color: rgb(162, 20, 20);}

.fa-angle-up {color:rgba(33,45,80, 0.95);}


/*	popup 	*/
.fa-check {color:green;}
.fa-info-circle{color:gold;}
.fa-pencil-square-o{color: rgba(33,45,80,0.85);} /*color:#ff9000 orange*/



/* dropdown smartphone*/
/*.fa-caret-down{color:white;}*/







/* 	====================================
	Header	
	==================================== */	

#header {background:rgba(38, 43, 57, 0.64); color:rgb(251, 240, 245);}  /*weiss*/
#headerLogo {background-color:rgb(33,45,80);  /* rgba(38, 43, 57, 0.64);*/}
#headerLogo h1 {color:#ff9000;}
#headerLogo h2 {color:maroon;}

/* 	====================================
		Informations Fenster über die aniSYS Website  
	==================================== */	

#information{border:3px solid maroon; background-color: rgba(255, 255, 255, 0.62);}
/*#information h1 {color:maroon; border-bottom: 3px solid maroon;}*/

/* 	====================================
		Popup Fenster 
	==================================== */	
/* .popwindow p, li {color:white;} Hier ist irgendwas falsch, weil die Farbangabe auch andere li weiß macht! */

/* 	====================================
	Toolbar - für eingeloggte Nutzer 
	==================================== */
/* Variante 1 - Buttons in einer Leiste mit Hintergund*/
#toolbar i {color:orange;}
#toolbar {border:0.5px solid #e4e4e4; border-radius:4px; }


/* Variante 2 - Buttonsammlung*/
.btn_group .button {
   /* background-color: teal; /* Green */
    /*border: 1px solid #125757;*/
    color: rgba(33,45,80, 0.95); 
}
.btn_group .button:hover {}

/* 	====================================
		Login
	==================================== */
.login h1{color:white;}
.logout h1{color:white;}

#logContent input, #logContent button {
	border:0.1px solid white;
	box-shadow: 4px 3px 11px 2px rgba(14, 13, 12, 0.9);  /* Farbangabe hier explitit, da sonst color: white auch für den Schatten benutzt wird!*/
	color: white; 
	background-color:rgba(24, 21, 21, 0.31);
}

#logContent input:hover, #logContent button:hover {background-color:rgba(24, 21, 21, 0.61);}

#logout a {color:rgba(33,45,80, 0.95);}
#logout a:hover{	color:#ff9000;}

/* Wizzard Login Welcome/signin */
.login_input, .login_button{
    border: 0.1px solid white;
    box-shadow: 4px 3px 11px 2px rgba(14, 13, 12, 0.9);
    color: white;
    background-color: rgba(24, 21, 21, 0.31);
	float: none;
   /* width: 28%;*/
    margin: 0.4em 0.4em 1em;
    padding: 0.5em;
    font-size: 1.4em;
}

/* 	====================================
	News - und Posts
	==================================== */
	
/* Datumsanzeige bei neuem Post*/
.date{color:rgba(33,45,80, 0.95);}

/* um den kompletten Post auszuklappen, wenn er zu lang für das Feld ist */
.postmore {color:maroon;}

/*	===================================================================
		Hundeüberblick Fotogalerie in Tabellenoptik mit Polaroid Bildern
	===================================================================== */ 
/*Container in dem das Bild und der Text drin ist.*/	
.petRegCard {background-color: rgba(252, 252, 254, 0.6);}/*rgba(114, 83, 53, 0.28); /*0.43*/ 

.petRegCardDescr p {color:#2F2D2C;}

.petRegCardDescr i.fa.fa-address-card{color:rgba(140, 0, 44, 0.8);}
.petRegCardDescr i.fa.fa-cc-paypal {color:rgb(17, 151, 224);}

div.petRegCardDescr p::first-letter {color: rgb(65, 122, 153);} /*rgb(17, 151, 224);  hellblau */

div.petRegCardDescr.fa-address-card{color:rgba(140, 0, 44, 0.8);}

/* Flex Variante*/
/*.petRegCard-flex {background-color: rgba(252, 252, 254, 0.6);} /*rgba(114, 83, 53, 0.28); /*0.43*/

/* Variante mehrspaltig mit Grid - in Verwendung */
.petRegCard-grid {background-color:rgba(252, 252, 254, 0.6);} /*rgba(114, 83, 53, 0.28); /*0.43*/

/* 	====================================
		HELFEN
	==================================== */	
#mainHelp h1{color:white;}

/* Flex-Item. Buttons zu den Helfen Seiten*/
.helpDashIB h2{color:white;}
.helpDashIB i{color:white;}
.helpDashIB{background-color:rgba(24, 21, 21, 0.31);}
.helpDashIB:hover{background-color:rgba(24, 21, 21, 0.61);}

/* 	====================================
	Ghost - Buttons
	==================================== */	
.ghost1 h1 {color:white;}
	
/* 	====================================
	Footer  - Relativ zu Body
	==================================== */	
footer {background: rgba(33,45,80, 0.85);} /* grau transparent rgba(38, 43, 57, 0.64); */
footer ul li { color:#E2DBDB; color:white; /*#9c9b9b;*/}
footer a {color:#E2DBDB;}
footer a:hover{color:#4ba9c8;}	

/* 	====================================
	Dashboard
	==================================== */

/* 	========================================
		Dasboard 
		Version mit Flexiblen Boxen:
	============================================*/
.dashIB{color:rgb(14, 13, 12); background-color:rgba(24, 21, 21, 0.31);}
.grow-3{background-color: red;}

/* Überschrift*/
.dashIB h2{background-color:white;} /* dadurch entsteht der weiße Streifen im oberen Bereich jeder Infobox*/
.dashIB ul li a {color:white;}
.dashIB ul li a:hover {color:#08c2ff;	/*#ece91c;*/}
/*.dashIB ul li a.active {border-bottom: 0.188em solid #08c2ff;}*/

/*	======================================
		Farbschemata
	=================================*/

/* Petroltöne, von hell nach dunkel*/
.teal1 {background-color:rgba(102, 217, 255, 0.75);}
.teal2 {background-color:rgba(0, 191, 255, 0.75);}
.teal3 {background-color:rgba(0, 153, 204, 0.75);}
.teal4 {background-color:rgba(0, 96, 128, 0.75);}
.teal5 {background-color:rgba(0, 38, 51, 0.75);}

.blue1 {background-color:rgba(26, 178, 255, 0.75);}
.blue2 {background-color:rgba(0, 153, 230, 0.75);}
.blue3 {background-color:rgba(0, 119, 179, 0.75);}
.blue4{background-color:rgba(0, 102, 153, 0.75);}
.blue5{background-color:rgba(0, 85, 128, 0.75);}

.purple1{background-color:rgba(153, 0, 153, 0.75);}
.purple2{background-color:rgba(128, 0, 128, 0.75);}

.berry1{background-color:rgba(204, 0, 102, 0.75);}
.berry2{background-color:rgba(153, 0, 77, 0.75);}
.berry3{background-color:rgba(102, 0, 51, 0.75);}

/* Schriftfarbe mit Klasse festlegen*/
.font-white p, .font-white ul , .font-white li , .font-white a {color:white;}
.font-black  p ul li a {color:black;} /* schreibweise wie oben!!!!! sonst wird die Klasse einfach ignoriert und jedes p ul etc auf der Website wird so eingefärbt*/

/* Schriftfarbe für gesamtes Dashborad festlegen*/
#maindash p, #maindash ul, #maindash li, #maindash a {color:white;}
#maindash a:hover {color:rgba(33,45,80, 0.85);}

#maindash span, a:hover {color:rgba(33,45,80, 0.85);}



.violet{color:rgba(93, 15, 149, 0.75);}
.maroon{background-color:rgba(203, 82, 112, 0.75);}
.blue{background-color:rgba(107, 177, 236, 0.75);}
.lightblue{background-color:#2094c5; border:1px solid teal}
.green{background-color:#78e078;}
.yellow{background-color:rgba(248, 248, 8, 0.75);}
.orange{background-color:rgba(219, 145, 8, 0.75);}
.tuerkis{background-color:rgba(15, 204, 236, 0.75);}
.petrol{background-color:rgba(58, 122, 158,0.75);}
.lime{background-color:lime;}
.teal{background-color:teal;}


/* 	====================================
	Neuen Hund anlegen 
	==================================== */	
.button li{background-color: lime;}	

/* 	====================================
	Formulareinstellungen 
	==================================== */	
/* Klasse Formular ist das div das die Formularfelder beinhaltet*/
.formular {
	box-shadow: 4px 3px 11px 2px;
	color:rgba(14, 13, 12, 0.9); /*blauer schatten rgba(33,45,80, 0.95);*/
	background-color:rgba(19, 77, 120, 0.4); /* blau rgba(5, 45, 96, 0.39); /* champagner farben: rgba(24, 21, 21, 0.31);*/
}