.iFrameWindow {
    position:fixed;
    z-index:99999;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    height:100vh;
    background:rgba(0,0,0,0.6);
}

.iFrameContainer {
    display:block;
    width:90%;
    max-width:1400px;
    height:90%;
    height:90vh;
    max-height:880px;
    margin:40px auto;
    background-color:#E3E3E3;
    border-radius:14px;
    padding:10px 20px 10px 20px;
}

.iFrame_Half_Container {
    float:left;
    width:48%;
    padding:1%;
}

.iFrame_Half_Container h3 {
    font-size:26px;
    line-height:30px;
    padding:0px;
    margin-bottom:12px;
}

.iFrame_Half_Container h5 {
    font-size:22px;
    line-height:26px;
    padding:0px;
    margin-bottom:25px;
    margin-top:0px;
}

.iFrame_Half_Container p {
    font-size:16px;
    line-height:20px;
    padding:0px;
    margin-bottom:25px;
}

.iFrame_Half_Container .elementSelection {
    width:100%;
    font-size:18px;
    line-height:26px;
    padding-top:15px;
    padding-bottom:15px;
    padding-left:7px;
    padding-right:7px;
    max-width:2000px !important;
    margin-bottom:10px;
    height:56px !important;
}

.iFrame_Half_Container .selectionSelectorString {
    width:100%;
    max-width:2000px !important;
    height:150px !important;
    font-size:18px;
    line-height:26px;
    padding-top:15px;
    padding-bottom:15px;
    padding-left:7px;
    padding-right:7px;
    border-radius: 8px;
    resize: none !important;
}

.iFrameTitle {
    display:block;
    width:100%;
    height:50px;
}

.iFrameCloseWindow {
    float:left;
    width:30%;
    text-align:right;
}

.iFrameCloseButton {
    float:right;
    box-sizing: border-box;
    margin-top:3px;
    -webkit-appearance:none;
    border:none;
    margin-right:10px;
    background:transparent url( "../icons/001-close.png" ) center right no-repeat;
    background-size:contain;
    width:20px;
    height:15px;
    position: relative;
    z-index: 99999999999;
}

.iFrameCloseButton:hover {
    cursor:pointer;
}

.iFrameForwardButton {
    float:left;
    box-sizing: border-box;
    margin-top:3px;
    -webkit-appearance:none;
    border:none;
    margin-right:10px;
    background:transparent url( "../icons/001-forward.png" ) center center no-repeat;
    background-size:contain;
    opacity:0.5;
    width:20px;
    height:15px;
}

.iFrameForwardButton:hover {
    cursor:pointer;
}

.iFrameBackButton {
    float:left;
    margin-right:10px;
    margin-top:3px;
    -webkit-appearance:none;
    border:none;
    background-color:transparent;
    background:transparent url( "../icons/001-back.png" ) center center no-repeat;
    background-size:contain;
    opacity:0.5;
    width:20px;
    height:15px;
}

.iFrameBackButton:hover {
    cursor:pointer;
}

.iFrameWindow {
  position:fixed;
  z-index:99999;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  height:100vh;
  background:rgba(0,0,0,0.6);
}
.iFrameContainer {
  display:block;
  width:90%;
  max-width:800px;
  height:90%;
  height:90vh;
  max-height:880px;
  margin:40px auto;
  background-color:#E3E3E3;
  border-radius:14px;
  padding:10px 20px 10px 20px;
}
.iFrameContainer iframe {
  display:block;
  margin:0px auto;
  height:calc(90vh - 100px);
  width:calc((90vh - 100px)*0.4620853081);
  margin-bottom:10px;
  position:relative;
  z-index:9999999;
  border-radius:50px;
}
.iFrameTitle {
  display:block;
  width:100%;
  height:30px;
}
.iFrameURL {
  float:left;
  font-size:14px;
  font-family:"Open Sans SemiBold";
  width:calc(100% - 60px);
  overflow:hidden;
  text-align:center;
  margin-top:2px;
}

.iFrame_Phone_Container {
    margin-top:-20px;
}

.iFramePopoverElement {
    margin-top:-70px !important;
}

.iFrameEditURLButton {
    display:inline-block;
    margin-left:15px;
    background:transparent url( "../icons/edit.png" ) center center no-repeat;
    background-size:15px 15px;
    width:15px;
    height:15px;
}

.iFrameEditURLButton:hover {
    cursor:pointer;
}

.iFrameCloseWindow {
  float:left;
  width:30%;
  text-align:right;
}
.iFrameCloseButton {
  float:right;
  box-sizing: border-box;
  margin-top:3px;
  -webkit-appearance:none;
  border:none;
  margin-right:10px;
  background:transparent url( "../icons/001-close.png" ) center right no-repeat;
  background-size:contain;
  width:20px;
  height:15px;
}
.iFrameCloseButton:hover {
  cursor:pointer;
}
.iFrameNavigationWindow {
    display:block;
    font-size:14px;
    margin:0px auto;
    text-align:center;
    margin-top:20px;
}
.iFrameForwardButton {
  float:left;
  box-sizing: border-box;
  margin-top:3px;
  -webkit-appearance:none;
  border:none;
  margin-right:10px;
  background:transparent url( "../icons/001-forward.png" ) center center no-repeat;
  background-size:contain;
  opacity:0.5;
  width:20px;
  height:15px;
}

.selectionDoneButton {
    width:100%;
    display:block;
    border:none;
    line-height:26px;
    font-size:16px;
    padding:10px 5px 10px 5px;
    text-align:center;
    color:white;
    font-weight:bold;
    background:#31C669;
    -webkit-appearance:none;
    border-radius:35px;
    margin-top:20px;
}

.selectionApplyButton {
    width:100%;
    display:block;
    border:1px solid #2270B1;
    line-height:26px;
    font-size:16px;
    padding:10px 5px 10px 5px;
    text-align:center;
    color:#2270B1;
    font-weight:bold;
    background:white;
    -webkit-appearance:none;
    border-radius:3px;
}

.iFrameForwardButton:hover,.selectionApplyButton:hover {
  cursor:pointer;
}
.iFrameBackButton {
  float:left;
  margin-right:10px;
  margin-top:3px;
  -webkit-appearance:none;
  border:none;
  background-color:transparent;
  background:transparent url( "../icons/001-back.png" ) center center no-repeat;
  background-size:contain;
  opacity:0.5;
  width:20px;
  height:15px;
}
.iFrameBackButton:hover {
  cursor:pointer;
}
.selectionContainer {
  display:block;
  width:100%;
  padding-top:14px;
  height:40px;
}
.selectionType {
  float:left;
  width:20%;
}
.elementSelection {
  -webkit-appearance:none;
  border:none;
  width:100%;
  border-radius:8px;
  background-color:white;
  font-size:16px !important;
}
.selectionSelector {
  width:60%;
  float:left;
  background-color:white;
  border-top-right-radius:3px;
  border-bottom-right-radius:3px;
  height: 33px;
}
.selectionSelectorString {
  border:none !important;
  border-radius:0px !important;
  line-height:16px;
  font-size:16px;
  width:calc(100% - 106px);
}

.iFrame_SelectorTools_Container {
    display:block;
    margin:5px auto;
}

.iFrame_SelectorTools_Container button {
    display:inline-block;
    max-width:25%;
    font-size:12px;
    line-height:17px;
    padding-left:15px;
    border-radius:8px;
    background:#919191;
    color:white;
    font-weight:bold;
    -webkit-appearance: none;
    border: none;
    padding: 15px 10px 15px 25px;
    background-size:20px 20px !important;
}

.selectionSelectorPrev {
    background: #919191 url( "../icons/arrows/left.png" ) left center no-repeat !important;
}

.selectionSelectorNext {
    background: #919191 url( "../icons/arrows/right.png" ) left center no-repeat !important;
}

.selectionSelectorChild {
    background: #919191 url( "../icons/arrows/down.png" ) left center no-repeat !important;
}

.selectionSelectorParent {
    background: #919191 url( "../icons/arrows/up.png" ) left center no-repeat !important;
}

.iFrameiPhoneFrame,.iFrameiPhoneFrame-Previewer {
    position:absolute;
    z-index:999999;
    opacity:0;
    background:transparent url( "../images/iPhoneFrame.png" ) center center no-repeat !important;
    background-size:100% 100% !important;
}

.iFrameiPhoneFrame-Previewer {
  opacity: 1;
  top:107px;
  left:170px;
  display:none;
}

.appPreviewiFrame {
  width:100%;
  max-width:320px;
  display:block;
  margin:15px auto;
  position: relative;
  z-index:100;
  border-radius: 40px;
  border: 10px solid #3c3c3c;
  max-height:78vh;
}

@media (max-width:1150px) {
  .appPreviewiFrame {
    width:90%;
    max-height:70vh;
  }
}

.selectionDone {
  width:20%;
  float:left;
  height:33px;
  border-top-right-radius:3px;
  border-bottom-right-radius:3px;
}
.selectionDone button {
  border:none;
  width:100%;
  -webkit-appearance:none;
  background-color:#31C669;
  color:white;
  font-weight:bold;
  text-align:center;
  height:33px;
}
.selectionDone button:hover {
  cursor:pointer;
}
.selectionSelectorPrev,.selectionSelectorNext {
    display:none !important;
}

.iFrameForwardButton, .iFrameBackButton {
    display:none !important;
}

.iFrameURL {
    width:100% !important;
}
