
/********************** Shared Styles **********************/
.webGadgetProper {
    width: 100%;
    height: 100%;
    transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
}

.webGadgetPadding {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.webGadgetProper .viewPort, 
.webGadgetProper .webGadgetIframe {
    overflow: hidden;
    border: none;
}

.webGadget_SetupControl {
    margin-top: -1px;
}

.webGadget_SetupControl #setup-control-uri-input {
    width: 390px;
}

.webGadget_SetupControl #setup-control-refreshInterval-input {
    margin: 0.5em 1em 0 0;
    width: 170px;
}

.webGadget_SetupControl #setup-control-frameWidth-input {
    width: 155px;
    margin-right: 0px;
}

.webGadget_SetupControl .detailsPanel {
    display: inline-block;
    height: 59px;
}


.webGadget_SetupControl .se-gadget-setup label {
   margin-top: 3px;
}

.webGadget_SetupControl .displayModeOption {
    display: inline-block;
    margin-right: 30px;
    margin-top: 5px;
}

/********************** Crop Table **********************/

.webGadget_SetupControl .cropControls{
    margin-top: 20px;
    float: left;
}

.webGadget_SetupControl .left-offset {
    width: 87px;
    padding-top: 17px;
}

.webGadget_SetupControl .left-crop {
    height: 74px;
    padding-top: 0px;
    vertical-align: top;
    width: 87px;
}

.webGadget_SetupControl .left-crop input,
.webGadget_SetupControl .left-offset input {
    margin-right: 0px;
}

.webGadget_SetupControl .top-offset {
    padding-left: 43px;
    width: 153px;
}
.webGadget_SetupControl .top-crop {
    padding-left: 26px;
    width: 160px;
}

.webGadget_SetupControl .crop-image {
    background: url('webgadget-crop.png') center no-repeat;
    width: 320px;
    height: 156px;
}

.webGadget_SetupControl #setup-control-offsetX-input,
.webGadget_SetupControl #setup-control-offsetY-input,
.webGadget_SetupControl #setup-control-viewPortHeight-input,
.webGadget_SetupControl #setup-control-viewPortWidth-input {
    margin-top: 0px;
}

/********************** Preview Area **********************/

.webGadget_SetupControl .previewControls{
    width: 335px;
    float: right;
}

.webGadget_SetupControl .buttonPreviewUrl {
    width: 100%;
    margin-left: 0px;
}

.webGadget_SetupControl .iframePreview {
    width: 100%; 
    height: 193px;
    border:1px #A8A8B0 solid;
    margin-left: 0px;
}

.webGadget_SetupControl .iframePreviewSmall {
    height: 173px;
}

.webGadget_SetupControl.smallRender .cropControls {
    margin-top: 0px;
}

.webGadget_SetupControl.smallRender .se-gadget-setup {
    margin-bottom: 0px;
}