Please see here for the article that relates to this responsive CSS code

[css collapse=”false” title=”NiftyQuoter custom css example”]

@media (max-width: 1039px) {
.proposal-html .sidebar-left .sidebar-left-inner {
position: fixed !important;
}
}

@media (max-width: 979px), handheld, (min-resolution: 1.3dppx) {
.proposal-html .sidebar-left .sidebar-left-inner {
position: static !important;
}
.left-side-style2 .sidebar-left ul.nav {
display: none;
}
.proposal-html .sidebar-left {
margin-bottom: 3%;
}
.row-fluid [class*="span"]:first-child {
margin-left: 3%;
}
.proposal-preview.small-window .proposal-html .proposal-content>.tab-content, .proposal-preview.small-window .pdf-html, .proposal-preview.small-window .pdf-container .tab-pane, .proposal-preview.small-window .pdf-html .tab-content, .proposal-preview.small-window .pdf-html .row-fluid, .proposal-preview.small-window .pdf-html .container, .proposal-preview.small-window .pdf-html body, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide:before, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide:after {
width: auto !important;
max-width: 100% !important;
margin-right: 1%;
}
.proposal-html .sidebar-left {
width: 100%;
}
.proposal-html .sidebar-left .sidebar-left-inner {
width: 100%;
}
.row-fluid [class*="span"]:first-child {
margin-left: auto;
}
}

@media (max-width: 639px) and handheld, (min-resolution: 1.3dppx) {
.proposal-preview-container .cover-page .proposal-name {
font-size: 5rem !important;
line-height: 6rem !important;
}
.tab-content .cover-page .proposal-info .pi-header-to, .tab-content .cover-page .proposal-info .pi-header-from {
font-size: 2.5rem;
}
.proposal-preview-container .cover-page .proposal-info, .proposal-preview-container .cover-page .proposal- info * {
font-size:2.5rem;
}
.proposal-section h1 {
font-size: 3.5rem !important;
line-height: 3.5rem !important;
margin-top: 10% !important;
margin-bottom: 10% !important;
}
.proposal-section h2 {
font-size: 3.0rem !important;
line-height: 3.0rem !important;
margin-top: 8% !important;
margin-bottom: 8% !important;
}
.proposal-section p {
font-size: 2.5rem !important;
line-height: 2.5rem !important;
margin-top: 5% !important;
margin-bottom: 5% !important;
}
.proposal-area.ui-sortable-helper div, .proposal-area.ui-sortable-helper p, .proposal-area.ui-sortable-helper table, .proposal-area.ui-sortable-helper span, .proposal-area.ui-sortable-helper ul, .proposal-area.ui-sortable-helper ol, .proposal-preview-container .tab-content div, .proposal-preview-container .tab-content p, .proposal-preview-container .tab-content table, .proposal-preview-container .tab-content span, .proposal-preview-container .tab-content ul, .proposal-preview-container .tab-content ol {
font-size: 2rem;
}
tr * {
line-height: 5rem;
}
.proposal-preview.small-window .proposal-html .proposal-content>.tab-content, .proposal-preview.small-window .pdf-html, .proposal-preview.small-window .pdf-container .tab-pane, .proposal-preview.small-window .pdf-html .tab-content, .proposal-preview.small-window .pdf-html .row-fluid, .proposal-preview.small-window .pdf-html .container, .proposal-preview.small-window .pdf-html body, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide:before, .proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide:after {
width: auto !important;
max-width: 100% !important;
}
.tab-pane last-section * {
font-size: 3rem;
}
}

.proposal-preview.small-window .proposal-preview-container {
max-width: 970px;
width: auto;
}

.proposal-preview.small-window .proposal-html .proposal-content {
max-width: 100%;
width: auto;
margin-left: 1%
}

.proposal-preview.small-window .proposal-preview-container .proposal-html .tab-content .inner-slide {
background-size: auto !important;
}

.proposal-pageless .proposal-preview-container .inner-slide .proposal-section {
padding: 0 7%;
}

[/css]