
/********************** COOKIE CONSENT MODULE *****************/
/* ANIMATE IN MODULE */
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInUp {
	-webkit-animation-name: slideInUp;
	animation-name: slideInUp;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	animation-delay: 1s;
}

/* BUTTONS */
.cookieSettingsInfo a + a {margin-left:1rem;}
.cookieSettingsInfo button,
.DataSubjectResponseWrapper input[type="button"], 
.DataSubjectResponseWrapper input[type="submit"] {
	border: 1px solid rgba(175,38,38,0);
	background: rgb(175,38,38);
	border-radius: 1px;
	color: rgb(255, 255, 255);
	display: inline-block;
	font-size: 13px;
	padding: 9px 19px;
	text-align: center;
	text-decoration:none;
	text-transform:uppercase;
	font-family:inherit;
	font-weight:500;
	-moz-transition: opacity .15s ease-in, width .45s ease-in-out;
	-o-transition: opacity .15s ease-in, width .45s ease-in-out;
	-webkit-transition: opacity .15s ease-in, width .45s ease-in-out;
	transition: opacity .15s ease-in, width .45s ease-in-out;
	cursor:pointer;
}
/* HOVER BUTTONS */
.cookieSettingsInfo button:hover,.cookieSettingsInfo button:focus,.cookieSettingsInfo button:active,
.DataSubjectResponseWrapper input[type="button"]:hover, .DataSubjectResponseWrapper input[type="button"]:focus, .DataSubjectResponseWrapper input[type="button"]:active, 
.DataSubjectResponseWrapper input[type="submit"]:hover, .DataSubjectResponseWrapper input[type="submit"]:focus, .DataSubjectResponseWrapper input[type="submit"]:active {
	background:#7d0d0d;
	border: 1px solid rgba(0,0,0,0);
	text-decoration:none;
	-moz-transition: opacity .15s ease-out, width .45s ease-in-out;
	-o-transition: opacity .15s ease-out, width .45s ease-in-out;
	-webkit-transition: opacity .15s ease-out, width .45s ease-in-out;
	transition: opacity .15s ease-out, width .45s ease-in-out
}
/* SECONDARY BUTTONS */	
.cookieSettingsInfo button.secondary {color:rgb(175,38,38);background:none;border:0;padding:0;display:inline;position:relative;text-transform:none;font-weight:300;margin-left: 12px;}

.cookieSettingsInfo button.secondary:hover,.cookieSettingsInfo button.secondary:focus,.cookieSettingsInfo button.secondary:active {color:#7d0d0d;}
.cookieSettingsInfo button.secondary::before {
	content: '\276F';
	font-size: 11px;
	font-weight: normal;
	padding-right: 5px;
	position: absolute;
	left: -12px;
	top: 3px;
	line-height:11px;
}

/* BANNER */
#cookieSettingsModal { display:none;}
#cookieSettingsBanner, #cookieSettingsModal, #cookieSettingsBanner *, #cookieSettingsModal * {box-sizing: border-box;}
#cookieSettingsBanner {position:fixed;bottom:0;left:0;width:100%;padding:30px;background:#fff;box-shadow:-3px -3px 6px rgba(0,0,0,.2);font-size:1.3rem;z-index:9999;}
#cookieSettingsBanner.minimal {position:relative;padding: 10px 30px;box-shadow: none;border-top: 1px solid #e7e7e7;text-align:right;}
#cookieSettingsBanner .settingsLink {float:right;margin-left:30px;}
#cookieUtility button.secondary {margin-right:25px;}
#cookieSettingsModal {background:rgba(0,0,0,.8);left:0;top:0;width:100vw;height:100vh;position:fixed;z-index:1001;overflow:hidden;}
#cookieSettingsModal .modal {background: #fff;margin: 25px 0;max-width: 1175px;width:90%;overflow-y:auto;z-index: 2020;height: 80%;position:absolute;top:40%;left:50%; -webkit-transform:translateY(-40%) translateX(-50%); -moz-transform:translateY(-40%) translateX(-50%); -ms-transform:translateY(-40%) translateX(-50%); -o-transform:translateY(-40%) translateX(-50%); transform:translateY(-40%) translateX(-50%);}

@media screen and (min-width:768px){
	#cookieDescription{float:left;width:66%;padding-right:50px;margin:0;}
	#cookieUtility{float:left;width:34%;}
	#cookieDescription p {margin:0;}
	#cookieSettingsModal {overflow:hidden;}
	#cookieSettingsModal .modal {height: 600px;overflow:hidden;}
	#cookieDescription{width:75%;}
	#cookieUtility{width:25%;}
}
@media screen and (min-width:1200px){
	#cookieDescription{float:left;width:calc(100% - 350px);padding-right:50px;margin:0;}
	#cookieUtility{float:left;width:350px;}
}

/* MODAL */
#cookieSettingsModal header {position:fixed;top:0;z-index:999;width:100%;height:50px;padding:10px 20px;}
#cookieSettingsModal footer {height:70px;position:relative;padding:15px 20px;}
#cookieSettingsModal footer button {float:right;margin-left:20px;}
#cookieSettingsModal header button {position: absolute;right: 10px;top: 10px;padding: 4px 14px;}

@media screen and (min-width:768px){
	#cookieSettingsModal header {height:60px;position:relative;}
}
/* ========================================================================================== TABS */
#cookieSettingsModal header h2 {line-height:1.6;}
#cookieSettingsModal .tabsContent h2 {margin-bottom:10px;}
#cookieSettingsModal .tabbedContent {width:100%;clear:both;float:none;padding:50px 0 0;margin:0;}
.titanBody #cookieSettingsModal .tabbedContent ul.tabs {margin:0;padding:0;width:100%;position:relative;top:auto;z-index:90;}
#cookieSettingsModal .tabbedContent ul.tabs li{margin:1px;padding:10px;position:relative;display:block;float:none;height:auto;}
#cookieSettingsModal .tabbedContent ul.tabs li h4 {margin:0;padding:12px;}
#cookieSettingsModal .tabbedContent ul.tabs li.selected h4 {border-bottom:2px solid;}
#cookieSettingsModal .tabbedContent .tabsContent {padding:20px;margin:0;top:0;display:block;}
.titanBody #cookieSettingsModal .tabbedContent .tabsContent p {margin-bottom:12px;}
#cookieSettingsModal div.tabbedContent .tabsContent div {display:block;}
#cookieSettingsModal div.tabbedContent .tabsContent > div{display:none;}
#cookieSettingsModal div.tabbedContent .tabsContent > div.selected {display:block;}

@media screen and (min-width:768px){
	#cookieSettingsModal .tabbedContent {height:470px;padding-top:0;}
	#cookieSettingsModal .tabbedContent .tabsContent {float:left;border:none;padding:20px 30px;position:relative;width:70%;margin:0;height:100%;}
	#cookieSettingsModal .tabbedContent .tabsContent > div {overflow-y:auto;height:100%}
	.titanBody #cookieSettingsModal .tabbedContent ul.tabs {margin-bottom:5px;width:30%;float:left;}
	#cookieSettingsModal .tabbedContent ul.tabs li {width:100%;margin:0;}
}

/* ========================================================================================== STYLES */
#cookieSettingsModal .tabbedContent ul.tabs li{border:0;border-radius:0;border-bottom: 1px solid #ccc;background-color: #e6e6e6;color:#777;}
#cookieSettingsModal .tabbedContent ul.tabs li.selected {background-color:#fff;border:0;color:#000;}
#cookieSettingsModal .tabbedContent ul.tabs li:last-child.selected {border-bottom:1px solid #ccc;margin-bottom:2px;}
#cookieSettingsModal .tabbedContent .tabsContent{border-radius:0;border:none;background:#fff;}
#cookieSettingsModal .tabbedContent ul.tabs li:not(.selected)::after {content: "";height: 100%;position: absolute;right: -3px;box-shadow: -3px 0 3px rgba(0,0,0,.2);width:3px;top: 0;}

@media screen and (min-width:768px){
	#cookieSettingsModal .tabbedContent .tabsContent{border-radius:0;border:none;background:#fff;box-shadow:-3px 0 3px rgba(0,0,0,.2);}
}

#cookieSettingsModal header,#cookieSettingsModal footer {border:2px solide #ccc;border-width:2px 0;background-color:#e7e7e7;border:1px solid #ccc;border-width:1px 0;}

/* TOGGLE SWITCH */
#cookieSettingsModal div.tabbedContent .tabsContent div.enable {margin-bottom:12px;}
#cookieSettingsModal fieldset.toggle {position:relative;display:block;width:37px;height:23px;}
#cookieSettingsModal fieldset.toggle input {opacity:0}
#cookieSettingsModal fieldset.toggle label span {float:left;}
#cookieSettingsModal fieldset.toggle label {position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#414141;border-radius:23px;overflow:visible;text-indent:45px;font-size:14px;font-weight:bold;padding-top:3px;}
#cookieSettingsModal fieldset.toggle label:after {position:absolute;content:"";height:19px;width:19px;left:2px;bottom:2px;background-color:white;-webkit-transition-duration:.4s;transition-duration:.4s;border-radius:50%;}
#cookieSettingsModal fieldset.toggle input:checked+label {background-color:#6cc04a;}
#cookieSettingsModal fieldset.toggle input:checked+label:after {background-color:#f5efeb;-webkit-transform:translateX(14px);-ms-transform:translateX(14px);transform:translateX(14px);}

/*************** Cookie Details in Modals ****************/
#cookieSettingsModal .hidden.modal {display:none; position: fixed;width: 100%;height:100%;margin: 0;padding: 30px 30px 30px 40px;overflow-y:auto;box-shadow:3px 3px 3px rgba(0,0,0,.3);}
#cookieSettingsModal .hidden.modal > div:not(:last-child) {border-bottom:1px solid #e7e7e7;margin-bottom:10px;}
#cookieSettingsModal .hidden.modal > button:first-child {float:right;margin: 0 0 20px 30px;}
#cookieSettingsModal .moduleList {cursor:pointer;}
#cookieSettingsModal li {cursor:default;}
#cookieSettingsModal .label {font-weight:bold;}



/* 
 Subject Data Response
*/

.DataSubjectResponseWrapper {float:none;width:100%;clear:both;}
.DataSubjectResponseWrapper::after {content: "";clear: both;display: table;}
.DataSubjectResponseWrapper > div {margin-bottom:20px;}


/* 
Form Styles 
*/

.DataSubjectResponseWrapper span + select,.DataSubjectResponseWrapper input + input {margin-left:10px;}
.DataSubjectResponseWrapper input[type="text"],.DataSubjectResponseWrapper textarea,.DataSubjectResponseWrapper select {border: 1px solid rgba(190,190,190,1); outline:0;  max-width:320px; padding: 7px; width: 100%; border-radius:2px;}


/* 
 Tables in Subject Data Response
*/

table#DataSubjectResponseTable {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}
/* Zebra striping */
table#DataSubjectResponseTable tr:nth-of-type(odd) {
    background: #eee;
}

table#DataSubjectResponseTable tr.footer {
    background: #fff;
}

table#DataSubjectResponseTable th {
    background: rgba(68, 68, 68, 1);
    color: rgba(255, 255, 255, 1);
    font-weight: 700;
}

table#DataSubjectResponseTable td, table#DataSubjectResponseTable th {
    padding: 6px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    text-align: left;
}
