Styling Modal Window

I am trying to achieve a modal window that looks like the one in this webpage: modal style,

The problem i am having is that the window object,

.v-window

doesn't get modified when a border is set. I want to create a round border for the modal window or add a panel with a round border that has my information in it. How can i create a round border on the window

This CSS code did not work:

.v-window-mywindow{
 /* css3 border radius */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;

}

The window consists of several nested divs, which all need the border-radius setting depending on the background color they have. For reindeer theme I had to put at least these

.v-window-wrap {
	border-radius: 14px;
}

.v-window-outerheader {
	border-top-right-radius: 14px;
	border-top-left-radius: 14px;
}

.v-window-footer {
	border-bottom-right-radius: 14px;
	border-bottom-left-radius: 14px;
}

.v-window-resizebox {
	border-bottom-right-radius: 14px;
}

For base theme even more is needed.

@Johannes

Thanks for the quick reply, when i applied the suggested CSS to my modal window, i did achieve what i needed to but only for the top

outerheader and footer

,

I also added the border-bottom-right/left radius properties to the

.v-window-counters

, how can i apply this styling to all the div's?

You could use a Window.Notification, set to TYPE_ERROR_MESSAGE. That might be easier, no?

Christopher P: You could use a Window.Notification, set to TYPE_ERROR_MESSAGE. That might be easier, no?

But i want to create a custom window, the Window.Notification does have somewhat of the same border radius i am looking for but i want to add my own content to the modal window (ie. panels, labels ...)

@warsame bashir : I am facing your older problem, I included what Johannes Häyry has mentioned but unable to see the differnece,. No CSS is being applied on to the window,  i am using Vaadin 7.0.

It is working in firefox but not in chrome ...i want it to work on Chrome

My Scss file contain
@import "../reindeer/reindeer.scss";

@mixin vaadintest {
/* Include all the styles from the reindeer theme */
@include reindeer;
.v-window-wrap {
border-radius: 100px;
background: lightblue;
color: red;
}

.v-window-outerheader {
border-top-right-radius: 100px;
border-top-left-radius: 100px;
background: lightblue;
color: red;
}

.v-window-footer {
border-bottom-right-radius: 100px;
border-bottom-left-radius: 100px;
background: lightblue;
color: red;
}

.v-window-resizebox {
background: lightblue;
color: red;
border-bottom-right-radius: 100px;
}
}