#wrapper {
 border: 0px none Red;
 overflow: auto;
}

@media screen and (max-width:1030px) {
    #arrow-fixed {
        position: fixed;
        left: 182px;
        transition: all 400ms ease-in-out;
        z-index: 99;
    }

    #arrow-fixed.toLeft {
        left: 150px;
        transition: all 500ms ease-in-out;
    }
}

@media screen and (min-width:1101px) {
    #window {
     transform: scale(0.98);
     transform-origin: 0 0;
    }
}

@media screen and (max-width:800px) {
    #controls-column img {
        width: 30px;
    }

    .ddl-templates {
        width: 125px;
        font-size: 0.8rem;
    }
}

@media screen and (max-width: 600px) {
    #controls-column img {
        width: 25px;
    }
    .ddl-templates {
        width: 100px;
        font-size: 0.8rem;
    }
}

/* Open close menu for visual editor controls 

#nav-toggle { position: absolute; right: 0; top: 0; }
#nav-toggle { cursor: pointer; padding: 0 0 0 0; }
    
#nav-toggle img {
    width: 30px;
    vertical-align: bottom;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
 position: absolute;
 display: block;
 width: 30px;
 cursor: pointer;
 margin: 2px 0 0 4px;
 padding: 0 2px 0 2px;
 transform: rotate(180deg);
}

#PanelNavigation {
 transition: all 500ms ease-in-out;
}

#PanelNavigation.toLeft #nav-toggle {
 right: -65px;
 transition: all 500ms ease-in-out;
}

#PanelNavigation.toLeft #nav-toggle span, #PanelNavigation.toLeft #nav-toggle span:before,#PanelNavigation.toLeft #nav-toggle span:after {
 transform: rotate(0deg);
}

.toLeft {
 margin-left: -210px;
 border-right: 34px solid #282828;
 transition: all 500ms ease-in-out;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
}
*/

@media screen and (min-width: 800px) {
    #arrow-fixed {
        display: none;
    }
}

@media screen and (max-width: 1024px) and (min-width: 200px) {
    #wrapper {
        margin-top: 45px;
    }

    #controls-column {
        position: relative;
/*        width: 180px !important;*/
        font-size: 1.0em;
    }

    #viewer-column {
    }

    #template-selector {
        margin-left: 28px;
    }

    #template-selector .writing {
        font-size: 1.0em !important;
    }

    #window {
        padding-top: 1.0% !important;
        background-image: none !important;
        transform: scale(0.5);
        width: 200%;
        transform-origin: 0px 0px 0px;
    }
}

@media screen and (max-width: 1024px) {
    .input-info-row {
        margin: 5px 1px 5px 1px;
        padding: 0% 0.1% 0% 0.1%;
    }
    .input-info-row .company-info {
        width: 94%;
        font-size: 1.0rem;
    }
    #FontCompanyName {
        vertical-align: super;
    }
    .input-info-row p {
        padding-left: 3%;
        font-size: 0.9rem;
    }
    #controls-column h4 {
        padding-left: 3%;
    }
    .col_third p input[type=radio]{
        transform:scale(1.4);
    }
}

@media screen and (max-width: 800px) {
    #window {
        transform: scale(0.33);
        width: 300%;
    }
    #CoverPhotoOnOff {
        width: 120px;
    }
}

@media screen and (max-width: 750px) {
    #arrow-fixed {
        left: 171px;
    }
}
@media screen and (max-width: 580px) {
    #arrow-fixed {
        left: 162px;
    }
}
@media screen and (max-width: 480px) {
    #arrow-fixed {
        left: 152px;
    }
    #window {
        transform: scale(0.25);
        width: 400%;
    }
    #CoverPhotoOnOff {
        width: 100px;
    }
}

@media screen and (max-width: 430px) {
    #arrow-fixed {
        left: 140px;
    }
    #window {
        transform: scale(0.25);
        width: 400%;
    }
}

@media screen and ( max-height: 1200px ){
  #window { height: 1000px; }
  #window iframe { height: 850px; }
}
@media screen and ( max-height: 1000px ){
  #window { height: 900px; }
  #window iframe { height: 800px; }
}
@media screen and ( max-height: 800px ){
  #window { height: 800px; }
  #window iframe { height: 700px; }
}
@media screen and ( max-height: 600px ){
  #window { height: 700px; }
  #window iframe { height: 600px; }
}
@media screen and ( max-height: 400px ){
  #window { height: 600px; }
  #window iframe { height: 850px; }
}
@media screen and ( max-height: 200px ){
  #window { height: 200px; }
  #window iframe { height: 180px; }
}