@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

#cookiesPrivacy { position: fixed; background-color: #161e2b; left: 0; bottom: 0; width: 100%;height: 10vh; padding: 0; z-index: 9999999; }
#cookiesPrivacy .cookieCenter { position: relative; width: 80%; height: auto; text-align: center; margin: 0 10%; top: 50%; -webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);}
#cookiesPrivacy .cookieCenter h3 { color: #fff; font-size: 14px; font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 400; text-transform: uppercase }
#cookiesPrivacy .cookieCenter h3 span.open { color: #fff; font-size: 14px; cursor: pointer;  font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 700; }
#cookiesPrivacy .cookieCenter h3 span.open:h0ver { text-decoration: underline; }
#cookiesPrivacy .cookieCenter h3 span.accept { display: inline-block; font-size: 10px;border-radius: 10px; padding: 5px 20px; border: 1px solid #fff; text-align: center; color: #fff; cursor: pointer; font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 700; margin-top: 10px; background-color: transparent; -webkit-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; -moz-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; -o-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; }
#cookiesPrivacy .cookieCenter h3 span.accept:hover { color: #000; background-color: #fff; -webkit-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; -moz-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; -o-transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; transition: background-color 0.35s ease-in-out 0s, color 0.35s ease-in-out 0s; }

#cookiesText { position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0); width: 100%; height: 100vh; z-index: 600; visibility: hidden; }
#cookiesText .wrapper { position: relative; top: 20vh; left: 20%; background-color: #fff; width: 60%; height: 60vh; opacity: 0; visibility: hidden; padding: 2vh; overflow-y: scroll; }
#cookiesText .wrapper h4 { color: #000; font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 700; margin: 0; font-size: 20px; }
#cookiesText .wrapper p { color: #000; font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 400; margin: 0; font-size: 14px; margin: 2vh 0 4vh 0; }
#cookiesText .wrapper p:last-of-type { margin-bottom: 0; }
#cookiesText .wrapper p a { color: #000; font-family: 'BrandonGrotesque-Regular', sans-serif; font-weight: 700; margin: 0; text-decoration: none; }
#cookiesText .close { position: absolute; top: calc(20% - 20px); right: calc(20% - 20px); background-color: #183545; width: 40px; height: 40px; cursor: pointer; opacity: 0; visibility: hidden; }
#cookiesText .close span { position: absolute; width: 30px; height: 2px; background-color: #fff; top: 50%; left: 50%; }
#cookiesText .close span:first-child { -ms-transform: translate(-50%, -50%) rotate(45deg); -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }
#cookiesText .close span:last-child { -ms-transform: translate(-50%, -50%) rotate(-45deg); -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

@media only screen and (min-device-width: 0px) and (max-device-width: 768px) {
	#cookiesPrivacy{height: 20vh;}
	#cookiesPrivacy .cookieCenter h3{font-size: 12px;}
	#cookiesPrivacy .cookieCenter h3 span.open{font-size: 12px;}
	#cookiesText .wrapper { position: relative; top: 10vh; left: 30px; background-color: #fff; width: calc(100% - 60px); height: 80vh; opacity: 0; visibility: hidden; padding: 2vw; overflow-y: scroll; }
	#cookiesText .close { position: absolute; top: calc(10% - 20px); right: 10px; background-color: #183545; width: 40px; height: 40px; cursor: pointer; opacity: 0; visibility: hidden; }
	#cookiesText .wrapper h4 { font-size: 14px; }
}
