:root {
    --fontfamily: 'Roboto',sans-serif;
    --boxBackgroundColor: #F6F6F6;
    --boxBorderColor: #f6f6f6;
    --headerBackgroundColor:#3c67c4;
    --titleColor: #FFF;
    --btnCloseColor: #FFF;
    --txtColor:#333;
    --txtAnchorColor:#3c67c4;
    --txtAnchorColorHover:#333;

    --btnSettings-backcolor:transparent;
    --btnSettings-color:#333;
    --btnSettings-backcolor-hover:#CCC;
    --btnSettings-color-hover:#000;

    --btnTecnics-backcolor:#b8c8d8;
    --btnTecnics-color:#333333;
    --btnTecnics-backcolor-hover:#CCC;
    --btnTecnics-color-hover:#333333;

    --btnAllCookies-backcolor:#3c67c4;
    --btnAllCookies-color:#FFF;
    --btnAllCookies-backcolor-hover:#CCC;
    --btnAllCookies-color-hover:#333333;

    --btnTransactionAll: all 0.5s ease;
}
#cookieswarning {background: var(--boxBackgroundColor); border:1px solid var(--boxBorderColor); font-family: var(--fontfamily); 
    width: 90%; max-width: 900px; position: fixed;
    left: 50%; top: 50%; transform: translate(-50%, -50%);-webkit-box-shadow:  1px 1px 5px rgba(0,0,0,.1); box-shadow: 1px 1px 5px rgba(0,0,0,.1); z-index:99999999;}
#cookieswarning header { background-color:  var(--headerBackgroundColor); border-bottom: 1px solid #cccccc;padding: 5px 20px;justify-content: center;position: relative; width:auto; margin:auto;}
#cookieswarning header span.title{display: block;padding:10px 0;font-size:18px;font-weight: bold;color: var(--titleColor);}
#cookieswarning header button.close {border:none;cursor: pointer;background: transparent; -webkit-appearance: none; -moz-appearance: none; 
    appearance: none; opacity: 1 !important; position: absolute; top: 6px; right: 10px; padding:0; font-size: 35px !important; 
    color: var(--btnCloseColor); text-shadow: 0 1px 0 #fff; font-weight: 700; line-height: 1;}
#cookieswarning div { padding:20px; margin:auto;}
#cookieswarning div p{ margin:0; padding:0; font-size:14px; color:var(--txtColor); text-align:center; line-height:20px; text-align: justify; }
#cookieswarning div p a{ color:var(--txtAnchorColor); text-decoration: underline; -webkit-transition: var(--btnTransactionAll);
    -moz-transition: var(--btnTransactionAll);
    -o-transition: var(--btnTransactionAll);
    transition: var(--btnTransactionAll); }
#cookieswarning div p a:hover{ text-decoration: none; color:var(--txtAnchorColorHover); }

#cookieswarning footer { padding:10px 0; margin:0; display:flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around; align-items: center; align-content: center;     background-color:transparent }

#cookieswarning footer button{ padding: 10px 15px; margin:auto 5px; border:none; cursor:pointer; text-transform: uppercase; font-size: 12px; 
    -webkit-transition: var(--btnTransactionAll);
    -moz-transition: var(--btnTransactionAll);
    -o-transition: var(--btnTransactionAll);
    transition: var(--btnTransactionAll);
}

#cookieswarning footer button.setting{ flex-grow: 2; background: var(--btnSettings-backcolor); color: var(--btnSettings-color);text-decoration:underline;text-underline-offset: 4px; }
#cookieswarning footer button.setting:hover{ background: var(--btnSettings-backcolor-hover); color: var(--btnSettings-color-hover); }

#cookieswarning footer button.only-tecnics{ flex-grow: 0; background: var(--btnTecnics-backcolor); color: var(--btnTecnics-color);   }
#cookieswarning footer button.only-tecnics:hover{ background: var(--btnTecnics-backcolor-hover); color: var(--btnTecnics-color-hover); }

#cookieswarning footer button.all-cookies{ flex-grow: 0;  background-color: var(--btnAllCookies-backcolor);color: var(--btnAllCookies-color); font-weight: bold; }
#cookieswarning footer button.all-cookies:hover{  background: var(--btnAllCookies-backcolor-hover); color: var(--btnAllCookies-color-hover); }

@media only screen and (max-width:640px) {
    #cookieswarning footer {flex-direction: column-reverse;  }    
    #cookieswarning footer button{ margin:7px auto;}
}