/** 
* Cookie Commander
* 
* @author : Lab5 - Dennis Riegelsberger
* @authorUrl : https://lab5.ch
* @copyright : Copyright (C) 2018+  Lab5 - Dennis Riegelsberger. All rights reserved.
* @license : GNU/GPL General Public License version 2 or later
* @project : https://lab5.ch/cookie-commander
* @on JED : https://extensions.joomla.org/extensions/extension/site-management/cookie-control/lab5-cookie-commander/
* 
* Built with <3 
* Lab5
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ 

 
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
THE BAR
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

 
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

.btn-primary.active,
.btn-warning.active,
.btn-danger.active,
.btn-success.active,
.btn-info.active,
.btn-inverse.active {
	
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */


					#cookie-bar {
								
								box-sizing: border-box;
								padding:0.5em;
								line-height:2em; 
								/*
								vertical-align:middle;
								height:auto; 
								line-height:1.66em; 
								padding:0;
								color:#eeeeee; 
								border:1px dotted gray;
								z-index:99999;
								*/
					}
					
					#cookie-bar > div {
						
								box-sizing: border-box;
								vertical-align:middle;
								display:inline-block;
								line-height:1em; 
								/*
								line-height:1em; 
								border:1px dotted gray;
								*/
					} 
					
					#cookie-bar .cc-message {
							
								/*
								float:left;
								*/
					} 
					
					#cookie-bar .cc-buttons {
							
								float:right;
								/* padding-right:0.5em; */
					} 
					
					#cookie-bar .cc-buttons a ,
					#cookie-bar .cc-buttons a * ,
					#cookie-bar .cc-buttons button ,
					#cookie-bar .cc-buttons button *  {
							
								vertical-align:baseline;
					} 

					#cookie-bar .btn ,
					#cookie-bar .cb-btn
					{	 
													/* 
													float:right;
													padding:3px 6px;  
													*/
													text-decoration:none; 
													margin-left:0.5em;
					} 
					
					/* support for old: */
					#cookie-bar .cb-btn
					{	 
													display:inline-block; 
													border-radius:3px;
													padding:0.5em; 
					}

					/*
					#cookie-bar.fixed {position:fixed; top:0; left:0; width:100%;}
					#cookie-bar.fixed.bottom {bottom:0; top:auto;}
					*/

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
DEFAULTS
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

#cookie-bar {background:#ccc;  } 
#cookie-bar { color:#333;  } 
#cookie-bar a { color:#333;  } 
/*


#cookie-bar .cb-enable { color:#eeeeee; } 
#cookie-bar .cb-enable { background:#466666; } 

#cookie-bar .cb-disable { color:#eeeeee; } 
#cookie-bar .cb-disable { background:#2b3a42; } 

#cookie-bar .cb-policy { color:#eeeeee; } 
#cookie-bar .cb-policy { background:#2b3a42; } 

#cookie-bar .cb-controls { color:#eeeeee; } 
#cookie-bar .cb-controls { background:#2b3a42; } 

*/

/* support for old: 
#cookie-bar a.cb-btn { color:#ffffff;  }
*/

/*
#cookie-bar .cb-enable:hover { background:#466666; } 
#cookie-bar .cb-disable:hover { background:#466666; } 
#cookie-bar .cb-policy:hover { background:#2b3a42; } 
#cookie-bar .cb-controls:hover { background:#2b3a42; } 
*/

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
THE POPUP / MODAL
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */



					/* * * * * * * * * * * *
					OUTER FORM
					* * * * * * * * * * * */
								
								
								/* * * * * * *
								STYLING ONLY
								* * * * * * */
								.cooco_popup_wrapper div.popup_content ,
								.cooco_popup_wrapper div.modal {
									
								  background-color: #ffffff;
								  border: 1px solid #999;
								  border: 1px solid rgba(0, 0, 0, 0.3);
								  *border: 1px solid #999;
								  -webkit-border-radius: 6px;
									 -moz-border-radius: 6px;
										  border-radius: 6px;
								  outline: none;
								  -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
									 -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
										  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
								  -webkit-background-clip: padding-box;
									 -moz-background-clip: padding-box;
										  background-clip: padding-box;
								}
								
								/* * * * * * *
								FUNCTION ONLY
								* * * * * * */
					
								.cooco_popup_wrapper div.popup_content ,
								.cooco_popup_wrapper div.modal {
					
													left: initial;
													right: initial; 
													bottom: initial;
													
													margin:auto;
													
													width: 30vw;
													width: 80vw;
													
													max-width:560px;
													width: 560px;
													
													/* transform: translateY(-50%); */
											
								}
								
								/* * * * * * *
								FUNCTION ONLY - MODAL VARIANT ONLY
								* * * * * * */
								
								div[id$=cooco_modalwrap] div.modal {

													position: fixed; 
													
													left: 50%;
													top: 10%;
													
													/*
													width: 30vw;
													margin-left: -15vw;
													*/
													
													width: 560px;
													margin-left: -280px;
													
								}

					/* * * * * * * * * * * *
					RESPONSIVE
					* * * * * * * * * * * */

							/* Joomla JUI NOTE: Original .modal definition has to be commented */

							@media (max-width: 767px) {
								div[id$=cooco_modalwrap] div.modal {
										position: fixed;
										
										margin: auto;
										
										left:50%;
										width: 90vw;
										margin-left: -45vw;
										
										max-width:none;
										right: initial;
								  }
								 .cooco_popup_wrapper div.popup_content ,
								 .cooco_popup_wrapper div.modal {
											position: fixed; 
											top: 20px;
											right: 20px;
											left: 20px;
											width: auto;
											margin: 0; 
								  }
								  /* .cooco_popup_wrapper div.modal { */
													
													/* width: 80vw; */
								/* } */
								/* div[id$=cooco_modalwrap] div.modal { */
													
													/* margin-left: -40vw; */
								/* } */
								  .cooco_popup_wrapper div.modal.fade {
									top: -100px;
								  }
								  .cooco_popup_wrapper div.modal.fade.in {
									top: 20px;
								  }
							} 

							@media (max-width: 480px) {
							  .cooco_popup_wrapper div.popup_content , 
							  .cooco_popup_wrapper div.modal {
								top: 10px;
								right: 10px;
								left: 10px;
							  }
							}


					/* * * * * * * * * * * *
					ANIMATIONS
					* * * * * * * * * * * */

							.cooco_popup_wrapper div.modal.fade {
							  top: -25%;
							  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
								 -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
								   -o-transition: opacity 0.3s linear, top 0.3s ease-out;
									  transition: opacity 0.3s linear, top 0.3s ease-out;
							}

							.cooco_popup_wrapper div.modal.fade.in {
							  top: 10%;
							}


					/* * * * * * * * * * * *
					HEADER
					* * * * * * * * * * * */

							.cooco_popup_wrapper .modal-header {
							  padding: 9px 15px;
							  border-bottom: 1px solid #eee;
							}

							.cooco_popup_wrapper .modal-header .close {
							  margin-top: 2px;
							}

							.cooco_popup_wrapper .modal-header h3 {
							  margin: 0;
							  line-height: 30px;
							}


					/* * * * * * * * * * * *
					BODY
					* * * * * * * * * * * */

							.cooco_popup_wrapper .modal-body {
							  position: relative;
							  max-height: 400px;
							  padding: 15px;
							  overflow-y: auto;
							}


					/* * * * * * * * * * * *
					FORM ELEMENT
					* * * * * * * * * * * */

							.cooco_popup_wrapper form {
									margin-bottom: 0;
							}


					/* * * * * * * * * * * *
					TABLE ELEMENT
					* * * * * * * * * * * */

							.cooco_popup_wrapper table {
									margin-bottom: 0;
							}


					/* * * * * * * * * * * *
					FOOTER
					* * * * * * * * * * * */

							.cooco_popup_wrapper .modal-footer {
							  padding: 14px 15px 15px;
							  margin-bottom: 0;
							  text-align: right;
							  background-color: #f5f5f5;
							  border-top: 1px solid #ddd;
							  -webkit-border-radius: 0 0 6px 6px;
								 -moz-border-radius: 0 0 6px 6px;
									  border-radius: 0 0 6px 6px;
							  *zoom: 1;
							  -webkit-box-shadow: inset 0 1px 0 #ffffff;
								 -moz-box-shadow: inset 0 1px 0 #ffffff;
									  box-shadow: inset 0 1px 0 #ffffff;
							}

							.cooco_popup_wrapper .modal-footer:before,
							.cooco_popup_wrapper .modal-footer:after {
							  display: table;
							  line-height: 0;
							  content: "";
							}

							.cooco_popup_wrapper .modal-footer:after {
							  clear: both;
							}

							.cooco_popup_wrapper .modal-footer .btn + .btn {
							  margin-bottom: 0;
							  margin-left: 5px;
							}

							.cooco_popup_wrapper .modal-footer .btn-group .btn + .btn {
							  margin-left: -1px;
							}

							.cooco_popup_wrapper .modal-footer .btn-block + .btn-block {
							  margin-left: 0;
							}


					/* * * * * * * * * * * *
					BUTTONS - EMBEDDED FORM VARIANT
					* * * * * * * * * * * */
					
							 .cooco_embed_wrapper .embed-footer {
										
									text-align:right;
							}



					/* * * * * * * * * * * *
					ALERT
					* * * * * * * * * * * */

							 .cooco_popup_wrapper .alert {
										
									padding:0.33em;
									margin-top: 0.33em;
									margin-bottom: 0.33em;
							}


					/* * * * * * * * * * * *
					BACKGROUND
					* * * * * * * * * * * */

							.modal-backdrop {
							  position: fixed;
							  top: 0;
							  right: 0;
							  bottom: 0;
							  left: 0;
							  z-index: 1040;
							  /* background-color: red; */
							  /* background-color: #000000; */
							}

							.modal-backdrop.fade {
							  opacity: 0;
							}

							.modal-backdrop,
							.modal-backdrop.fade.in {
							  opacity: 0.8;
							  filter: alpha(opacity=80);
							}