/* Device profile preview */
Body.DevicePreview
{
    background: #fff;
    background-position: center top;
    background-repeat: repeat-x;
}

.DeviceFrame
{
    overflow: auto;
    width: 100%;
}

.IE8 .DeviceFrame
{
    height: auto;
}

.DeviceFrame .TopLine, .DeviceFrame .CenterLine, .DeviceFrame .BottomLine
{
    display: table;
    margin: 0 auto;
    clear: both;
}

.DeviceFrame .TopLine
{
    padding-top: 10px;
}

.DeviceFrame .LeftPiece, .DeviceFrame .CenterPiece, .DeviceFrame .RightPiece
{
    float: left;
    clear: right;
    background-size: 100% 100%;
}

.DeviceFrame .TopLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_left.png');
    width: 50px;
    height: 50px;
}

.DeviceFrame .TopLine .CenterPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_center.png');
    width: 300px;
    height: 50px;
}

.DeviceFrame .TopLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_right.png');
    width: 50px;
    height: 50px;
}

.DeviceFrame .CenterLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/center_left.png');
    width: 50px;
    height: 300px;
}

.DeviceFrame .CenterLine .CenterPiece
{
    width: 300px;
    height: 300px;
    position: relative;
}

.DeviceFrame .CenterLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/center_right.png');
    width: 50px;
    height: 300px;
}

.DeviceFrame .BottomLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_left.png');
    width: 50px;
    height: 60px;
}

.DeviceFrame .BottomLine .CenterPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_center.png');
    width: 300px;
    height: 60px;
}

.DeviceFrame .BottomLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_right.png');
    width: 50px;
    height: 60px;
}

.DeviceFrame.Rotated .TopLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_left_rotated.png');
    width: 50px;
    height: 50px;
}

.DeviceFrame.Rotated .TopLine .CenterPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_center_rotated.png');
    height: 50px;
}

.DeviceFrame.Rotated .TopLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/top_right_rotated.png');
    width: 60px;
    height: 50px;
}

.DeviceFrame.Rotated .CenterLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/center_left_rotated.png');
    width: 50px;
}

.DeviceFrame.Rotated .CenterLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/center_right_rotated.png');
    width: 60px;
}

.DeviceFrame.Rotated .BottomLine .LeftPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_left_rotated.png');
    width: 50px;
    height: 50px;
}

.DeviceFrame.Rotated .BottomLine .CenterPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_center_rotated.png');
    height: 50px;
}

.DeviceFrame.Rotated .BottomLine .RightPiece
{
    background-image: url('../../CMSPages/GetResource.ashx?image=Design/Devices/bottom_right_rotated.png');
    width: 60px;
    height: 50px;
}
