| Current Path : /var/www/media/lib_compojoom/css/ |
| Current File : /var/www/media/lib_compojoom/css/compojoom-backend-style-responsive.css |
@media (min-width: 1200px) {
.compojoom-bootstrap .table-responsive {
overflow-x: auto !important;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*
=========================================================================
UPDATE FOR VERSION 1.1
=========================================================================
*/
/** PRICING TABLES **/
.compojoom-bootstrap .pricing-tables table.table-inner > thead > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > tbody > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > tfoot > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > thead > tr > td,
.compojoom-bootstrap .pricing-tables table.table-inner > tbody > tr > td,
.compojoom-bootstrap .pricing-tables table.table-inner > tfoot > tr > td {
padding: 15px;
font-size: 14px;
vertical-align: middle;
border-top: 1px dotted #dddddd;
}
}
@media (min-width: 768px) and (max-width: 991px) {
body{overflow-x: hidden;}
.compojoom-bootstrap .table-responsive {
width: 100%;
margin-bottom: 15px;
overflow-x: scroll !important;
overflow-y: hidden;
border: 1px solid #dddddd;
-ms-overflow-style: -ms-autohiding-scrollbar;
-webkit-overflow-scrolling: touch;
}
.compojoom-bootstrap .table-responsive > .table {
margin-bottom: 0;
}
.compojoom-bootstrap .table-responsive > .table > thead > tr > th,
.compojoom-bootstrap .table-responsive > .table > tbody > tr > th,
.compojoom-bootstrap .table-responsive > .table > tfoot > tr > th,
.compojoom-bootstrap .table-responsive > .table > thead > tr > td,
.compojoom-bootstrap .table-responsive > .table > tbody > tr > td,
.compojoom-bootstrap .table-responsive > .table > tfoot > tr > td {
white-space: nowrap;
}
.compojoom-bootstrap .table-responsive > .table-bordered {
border: 0;
}
.compojoom-bootstrap .table-responsive > .table-bordered > thead > tr > th:first-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr > th:first-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr > th:first-child,
.compojoom-bootstrap .table-responsive > .table-bordered > thead > tr > td:first-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr > td:first-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr > td:first-child {
border-left: 0;
}
.compojoom-bootstrap .table-responsive > .table-bordered > thead > tr > th:last-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr > th:last-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr > th:last-child,
.compojoom-bootstrap .table-responsive > .table-bordered > thead > tr > td:last-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr > td:last-child,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr > td:last-child {
border-right: 0;
}
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr:last-child > th,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr:last-child > th,
.compojoom-bootstrap .table-responsive > .table-bordered > tbody > tr:last-child > td,
.compojoom-bootstrap .table-responsive > .table-bordered > tfoot > tr:last-child > td {
border-bottom: 0;
}
.compojoom-bootstrap .button-menu-mobile{display: block;}
.compojoom-bootstrap .navbar{margin: 0 0 0 40px;}
.compojoom-bootstrap .left {
width: 225px;
margin-left: 0px;
left: -225px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.compojoom-bootstrap .right {
left: 0;
right: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
overflow-x: hidden;
}
.compojoom-bootstrap .mobile-sidebar{left: 0px;}
.compojoom-bootstrap .mobile-content{left: 225px;right: -225px;}
.compojoom-bootstrap .box-info .icon-box{
width: 45px;
font-size: 20px;
margin-top: 5px
}
.compojoom-bootstrap .box-info .text-box p{font-size: 11px;}
.compojoom-bootstrap .toolbar-btn-action{text-align: center;}
.compojoom-bootstrap .gallery-wrap .column .inner .img-wrap{
height: 60px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap .gallery-wrap .column-3 .inner .img-wrap{
height: 140px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap .gallery-wrap .column-4 .inner .img-wrap{
height: 100px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap .user-profile-sidebar{text-align: center;}
/*
=========================================================================
UPDATE FOR VERSION 1.1
=========================================================================
*/
/** Weather widget **/
.compojoom-bootstrap .weather-widget .overlay-weather-info{
top: 10px;
left: 10px;
right: 10px;
}
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city{margin: 10px 0;}
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city h4{font-size: 15px;}
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city h1{font-size: 24px;}
.compojoom-bootstrap .weather-widget .overlay-weather-info i.weather-icon{font-size: 60px;}
}
@media (max-width: 767px) {
body{overflow-x: hidden;}
.compojoom-bootstrap .header.sidebar{
position: absolute;
right: 39px;
left: 40px;
top: 0px;
text-align: center;
z-index: 999992;
}
.compojoom-bootstrap .header.sidebar.logo-brand{
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.compojoom-bootstrap .left {
top: -50px;
}
.compojoom-bootstrap .navbar{
margin: 0 0 0 0px;
z-index: 999991;
}
.compojoom-bootstrap .navbar-default {
border: none;
}
.compojoom-bootstrap .button-menu-mobile{
display: block;
z-index: 999993;
}
.compojoom-bootstrap button.navbar-toggle{
padding: 15px 15px;
border-radius: 0;
background: #1B1E24;
color: #A5B2BC;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
border: none;
font-size: 14px;
}
.compojoom-bootstrap .navbar-default .navbar-toggle:hover,
.compojoom-bootstrap .navbar-default .navbar-toggle:focus {
background: #1B1E24;
color: #A5B2BC;
}
.compojoom-bootstrap .navbar-collapse{
padding-right: 15px;
padding-left: 15px;
margin: 0;
}
.compojoom-bootstrap .left {
width: 225px;
margin-left: 0px;
left: -225px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.compojoom-bootstrap .right {
left: 0;
right: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
overflow-x: hidden;
}
.compojoom-bootstrap .mobile-sidebar{left: 0px;}
.compojoom-bootstrap .mobile-content{left: 225px;right: -225px;}
.compojoom-bootstrap .header.sidebar.logo-brand.logo-brand-toggle{left: 225px;right: -225px;}
.compojoom-bootstrap .box-info table{margin: 0 0 0 0;}
.compojoom-bootstrap .box-info .table-responsive{border: none;}
.compojoom-bootstrap .nav.navbar-nav.top-navbar li span.absolute {left: 25px;}
.compojoom-bootstrap .box-info .additional .list-group{margin-bottom: -10px;}
.compojoom-bootstrap .data-table-toolbar .btn{margin: 15px 0;}
.compojoom-bootstrap .toolbar-btn-action{text-align: center;}
.compojoom-bootstrap .gallery-wrap .column{width: 25%;}
.compojoom-bootstrap .gallery-wrap .column-4{width: 33.33333333333333%;}
.compojoom-bootstrap .gallery-wrap .column-3{width: 50%;}
.compojoom-bootstrap .gallery-wrap .column .inner .img-wrap{
height: 70px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap .gallery-wrap .column-3 .inner .img-wrap{
height: 140px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap .gallery-wrap .column-4 .inner .img-wrap{
height: 105px;
overflow: hidden;
background: #ddd;
}
.compojoom-bootstrap footer{text-align: center;}
.compojoom-bootstrap .lock-screen{text-align: center;}
.compojoom-bootstrap .ava-lock-screen{text-align: center; margin-bottom: 20px;}
.compojoom-bootstrap .ava-lock-screen img{
width: 100px;
margin: 0;
}
.compojoom-bootstrap .la-pricing-table .la-col-4{width: 50%;}
.compojoom-bootstrap .user-profile-sidebar{text-align: center;}
/*
=========================================================================
UPDATE FOR VERSION 1.1
=========================================================================
*/
/** PRICING TABLES **/
.compojoom-bootstrap .pricing-tables .header{padding: 15px 0 50px;}
.compojoom-bootstrap .pricing-tables .header h3{font-size: 20px;}
.compojoom-bootstrap .pricing-tables .circle-price-wrap{
width: 120px;
height: 120px;
top: 50px;
margin-left: -60px;
}
.compojoom-bootstrap .pricing-tables .circle-price-wrap h2{
font-size: 35px;
padding: 5px 0 ;
}
.compojoom-bootstrap .pricing-tables .circle-price-wrap h2 small{
font-size: 13px;
color: #909090;
display: block;
}
.compojoom-bootstrap .pricing-tables table.table-inner > thead > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > tbody > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > tfoot > tr > th,
.compojoom-bootstrap .pricing-tables table.table-inner > thead > tr > td,
.compojoom-bootstrap .pricing-tables table.table-inner > tbody > tr > td,
.compojoom-bootstrap .pricing-tables table.table-inner > tfoot > tr > td {
padding: 10px;
font-size: 13px;
vertical-align: middle;
border-top: 1px dotted #dddddd;
}
/** Weather widget **/
.compojoom-bootstrap .weather-widget .overlay-weather-info i.weather-icon{font-size: 90px;}
}
@media (max-width: 480px){
.compojoom-bootstrap .box-info .icon-box{
width: 100%;
display: block;
}
.compojoom-bootstrap .box-info .icon-box,.box-info .text-box{text-align: center;}
.compojoom-bootstrap .gallery-wrap .column,.gallery-wrap .column-3,.gallery-wrap .column-4{width: 33.33333333333333%;}
.compojoom-bootstrap .gallery-wrap .column .inner .img-wrap,.gallery-wrap .column-3 .inner .img-wrap,.gallery-wrap .column-4 .inner .img-wrap{height: 70px;}
.compojoom-bootstrap .login-wrap{margin: 20px 0 0 0;}
/*
=========================================================================
UPDATE FOR VERSION 1.1
=========================================================================
*/
/** PRICING TABLES **/
.compojoom-bootstrap .pricing-tables .header{padding: 5px 0 50px;}
.compojoom-bootstrap .pricing-tables .header h3{font-size: 20px;}
.compojoom-bootstrap .pricing-tables .circle-price-wrap{
width: 120px;
height: 120px;
top: 70px;
margin-left: -60px;
}
/** Weather widget **/
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city{margin: 5px 0;}
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city h4{font-size: 14px;}
.compojoom-bootstrap .weather-widget .overlay-weather-info .weather-info-city h1{font-size: 20px;}
.compojoom-bootstrap .weather-widget .overlay-weather-info i.weather-icon{font-size: 45px;}
}
@media (max-width: 360px){
.compojoom-bootstrap .gallery-wrap .column,.gallery-wrap .column-3,.gallery-wrap .column-4{width: 50%;}
.compojoom-bootstrap .gallery-wrap .column .inner .img-wrap,.gallery-wrap .column-3 .inner .img-wrap,.gallery-wrap .column-4 .inner .img-wrap{height: 80px;}
.compojoom-bootstrap .la-pricing-table .la-col-4{width: 100%;}
}
@media (max-width: 320px){
.compojoom-bootstrap .gallery-wrap .column,.gallery-wrap .column-3,.gallery-wrap .column-4{width: 50%;}
.compojoom-bootstrap .gallery-wrap .column .inner .img-wrap,.gallery-wrap .column-3 .inner .img-wrap,.gallery-wrap .column-4 .inner .img-wrap{height: 70px;}
}
.compojoom-bootstrap .c-toolbar .btn-wrapper {
display: inline-block;
}