Move Cookie Banner buttons below text and centered

Hi, I'm trying to move the position of the buttons in the Cookie Banner to below the text and centred within the banner. Please see the attached image to see what I mean. 

I've managed to make some edits to the banner with the below code but I don't know CSS well enough to achieve my goal

Your help would be greatly appreciated.

If there's a way to blur the background slightly until a button is pressed then this would be extra appreciated! 

Many thanks,

Nick

.sqs-cookie-banner-v2 p, .sqs-cookie-banner-v2 a {
 color: #eb6521 !important;
}
.sqs-cookie-banner-v2-accept {
font-size: 16px !important;
color: #eb6521 !important;
}
.sqs-cookie-banner-v2 {
  height: 200px;
}
.sqs-cookie-banner-v2 p, .sqs-cookie-banner-v2 a {
  font-size: 14px;
}

Hi @NP3000, can you share your website URL?

I can see that you've made some edits, can you describe what you're missing? Maybe button sizing even? Red button border? On both? Are you wanting the whole website to be blurred until a button is clicked?

Hey Ziggy, thanks for your quick response. 

The website is www.sessionstudio.com

I just want to centralise the text and buttons within the banner. And yes, if the whole site can be blurred slightly until the buttons are selected. Or, if the banner could float in front of the whole site until a button is selected then that would be great. 

Many thanks,

Nick

I think if you want a more sophisticated cookie banner with an overlay effect you might need to find a plugin you can install. 

Centering the items you would need to add this CSS:

@media screen and  (min-width: 640px) {
.sqs-cookie-banner-v2.BAR {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
 }
}

Yes, I was thinking the same but wanted to check if there was a way to do it with CSS first.

Thanks again Ziggy, 

Nick