| Current File : /home/bwalansa/www/wp-content/themes/Savia/stylesheets/responsive.css |
/* ================================================
Skeleton Responsive CSS
================================================== */
@media only screen and (max-width: 980px) {
#header.scrolled #menu > ul > li > a {
line-height: 20px!important;
}
#header.has_subheader #menu > ul > li:last-child a, #header.has_subheader #menu > ul > li:first-child a, #header.has_subheader #menu > ul > li:nth-child(2) a {
line-height: 60px !important;
}
.pic img {
width: 100%;
}
#alpr {
background: #9ad202 none repeat scroll 0 0;
border-radius: 20px;
color: #fff;
float: right;
font-size: 10px;
font-style: italic;
font-weight: bold;
line-height: 16px;
margin: 10px;
padding: 6px 14px;
text-transform: uppercase;
}
}
/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 769px) and (max-width: 959px) {
.container { width: 768px; }
.full_container_slider { width: 100%; }
.boxed_wrapper, .boxed_wrapper #header, .boxed_wrapper #footer { width: 788px; }
.container .column,
.container .columns { margin-left: 10px; margin-right: 10px; }
.column.alpha, .columns.alpha { margin-left: 0; margin-right: 10px; }
.column.omega, .columns.omega { margin-right: 0; margin-left: 10px; }
.alpha.omega { margin-left: 0; margin-right: 0; }
.container .one.column,
.container .one.columns { width: 28px; }
.container .two.columns { width: 76px; }
.container .three.columns { width: 124px; }
.container .four.columns { width: 172px; }
.container .five.columns { width: 220px; }
.container .six.columns { width: 268px; }
.container .seven.columns { width: 316px; }
.container .eight.columns { width: 364px; }
.container .nine.columns { width: 412px; }
.container .ten.columns { width: 460px; }
.container .eleven.columns { width: 508px; }
.container .twelve.columns { width: 556px; }
.container .thirteen.columns { width: 604px; }
.container .fourteen.columns { width: 652px; }
.container .fifteen.columns { width: 700px; }
.container .sixteen.columns { width: 748px; }
.container .one-third.column { width: 236px; }
.container .two-thirds.column { width: 492px; }
.container .one-fifth.column { width: 133px; }
.container .two-fifths.column { width: 287px; }
.container .three-fifths.column { width: 440px; }
.container .four-fifths.column { width: 594px; }
/* Offsets */
.container .offset-by-one { padding-left: 48px; }
.container .offset-by-two { padding-left: 96px; }
.container .offset-by-three { padding-left: 144px; }
.container .offset-by-four { padding-left: 192px; }
.container .offset-by-five { padding-left: 240px; }
.container .offset-by-six { padding-left: 288px; }
.container .offset-by-seven { padding-left: 336px; }
.container .offset-by-eight { padding-left: 384px; }
.container .offset-by-nine { padding-left: 432px; }
.container .offset-by-ten { padding-left: 480px; }
.container .offset-by-eleven { padding-left: 528px; }
.container .offset-by-twelve { padding-left: 576px; }
.container .offset-by-thirteen { padding-left: 624px; }
.container .offset-by-fourteen { padding-left: 672px; }
.container .offset-by-fifteen { padding-left: 720px; }
}
/* #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 768px) {
.container { width: 300px; }
.boxed_wrapper, .boxed_wrapper #header { width: 300px; }
.boxed_wrapper #footer { width: auto; }
.container .columns,
.container .column { margin: 0; }
.container .one.column,
.container .one.columns,
.container .two.columns,
.container .three.columns,
.container .four.columns,
.container .five.columns,
.container .six.columns,
.container .seven.columns,
.container .eight.columns,
.container .nine.columns,
.container .ten.columns,
.container .eleven.columns,
.container .twelve.columns,
.container .thirteen.columns,
.container .fourteen.columns,
.container .fifteen.columns,
.container .sixteen.columns,
.container .one-third.column,
.container .two-thirds.column,
.container .one-fifth.column,
.container .two-fifths.column,
.container .three-fifths.column,
.container .four-fifths.column { width: 300px; }
/* Offsets */
.container .offset-by-one,
.container .offset-by-two,
.container .offset-by-three,
.container .offset-by-four,
.container .offset-by-five,
.container .offset-by-six,
.container .offset-by-seven,
.container .offset-by-eight,
.container .offset-by-nine,
.container .offset-by-ten,
.container .offset-by-eleven,
.container .offset-by-twelve,
.container .offset-by-thirteen,
.container .offset-by-fourteen,
.container .offset-by-fifteen { padding-left: 0; }
}
/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 768px) {
.boxed_wrapper, .boxed_wrapper #header{ width: 420px; }
.boxed_wrapper #footer { width: auto; }
.container { width: 420px; }
.container .columns,
.container .column { margin: 0; }
.container .one.column,
.container .one.columns,
.container .two.columns,
.container .three.columns,
.container .four.columns,
.container .five.columns,
.container .six.columns,
.container .seven.columns,
.container .eight.columns,
.container .nine.columns,
.container .ten.columns,
.container .eleven.columns,
.container .twelve.columns,
.container .thirteen.columns,
.container .fourteen.columns,
.container .fifteen.columns,
.container .sixteen.columns,
.container .one-third.column,
.container .two-thirds.column,
.container .one-fifth.column,
.container .two-fifths.column,
.container .three-fifths.column,
.container .four-fifths.column { width: 420px; }
}
/* ================================================
Custom Responsive CSS
================================================== */
/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 769px) and (max-width: 959px) {
h4 {font-size: 15px;}
aside h4 {font-size: 13px;margin:0;}
.association > a {padding-right: 14px;}
.association_bwa {font-size: small;}
.rpfc-container h4 {display: inline;}
.textwidget .shortcode_icon {margin-right: 7px;}
.alignleft, img.alignleft {margin-right: 0.5em;}
.pic img { width: 100%!important;}
.post_list_right.six.columns {width: 84%;float: none!important;}
#wrapper, #wrapper.full_wrapper
{ width: 100%; margin: 0px auto; border-radius: 0px; padding:0; border: none;}
#footer { width: 100%; position: relative; }
#header { position: relative; background: #fff; -webkit-box-shadow: none;-moz-box-shadow: none; box-shadow: none; min-height: auto; }
.page_title_bgr .full_container_page_title {border-top: 1px solid #eee;}
.full_header { border-bottom: none; background: none;}
#header #menu > ul > li > a { line-height: 52px;}
#header #logo .logo_img { height: 62px;}
#menu { display: none; }
#mobile_menu_toggler{ display: block; margin: }
.column.client_info_holder, .columns.client_info_holder {margin-left: 24px; padding-left: 8px; }
.three.columns.client_info { width: 132px; }
.info_overlay h3 { font-size: 13px!important; }
.info_overlay p { font-size: 11px; }
.info_overlay .info_desc { margin-left: 0; }
.circ_counter { width: 144px; }
.circ_counter .circ_counter_desc { font-size: 13px;}
.left_title { font-size: 14px;}
.horizontal .resp-tabs-list li{ padding: 7px 12px 6px 12px;}
.more-link:before { top: 4px; }
.rev_slider_wrapper .button, .rev_slider_wrapper a.button, .rev_slider_wrapper a.button:hover {
padding:3px 8px 3px; line-height:18px !important; font-size:11px !important;font-weight:normal;
}
.icon_big { width: 88px; height: 88px; }
.icon_big i { font-size: 40px; line-height: 88px;}
#header.scrolled .header_cart .cart-icon-wrap { padding-top: 14px;}
.link_span { background: url('../images/arrow.png') -1px 7px no-repeat; }
#sidebar #s { width: 128px; background: url('../images/button_search.png') 141px center no-repeat;}
.boxed_wrapper #header .header_cart {
background: none;
border-left: 1px solid transparent;
padding-right: 10px;
border-right: none;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
text-align:center;
}
.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price {
text-align:center !important;
display: block!important;
margin: 4px 0 4px !important;
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit, .woocommerce #content input.button, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button, .woocommerce-page #respond input#submit, .woocommerce-page #content input.button {
display: inline-block!important;
text-align: center!important;
float: none!important;
margin: 4px 0 16px !important;
font-size:12px !important;
}
.woocommerce .products .star-rating, .woocommerce-page .products .star-rating {
display: inline-block!important;
margin: 6px 0 2px 0px!important;
}
#footer .latest_post_sidebar img {
width: 50px;
height: 50px;
}
/* Force table to not be like tables anymore */
table.tableau, .tableau thead, .tableau tbody, .tableau th, .tableau td, .tableau tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.tableau thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
.tableau tr { /*border: 1px solid #ccc;*/
border-bottom: 1px dotted #f3f3f3;
border-top: 1px dotted #f3f3f3;
margin-bottom: 1%;
margin-left: 0;
margin-right: 0;}
.tableau td {
/* Behave like a "row" */
border: none;
/*border-bottom: 1px solid #eee; */
border-bottom: 1px solid #fff;
position: relative;
/*padding-left: 50%; */
}
.tableau td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
}
.date_left{
width: 32px;
}
.date_left .day {
font-size: 12px;
}
.rpfc-container h4 {
display: inline-block !important;
font-size: 11px;
}
.column.omega, .columns.omega {
margin-top: 30px!important;
}
aside h4 a {
font-size: 14px!important;
}
.small_post_list_right {
margin-left: 39px;
padding-top: 6px;
}
.small_post_list_left {
width: 32px;
}
.association {
float: right;
}
.quote_content p {
font-size: 13px;
}
.dark_container_white_text h2 {
font-size: 16px;
}
.text_box.no_mar {
margin: 0;
}
.text_box .button {
float: right;
margin: 0 0 20px 28px;
}
#footer h3 {
font-size : 16px!important;
}
.container .row.page_sidebar .twelve.columns, .container .row.blog_list_page .twelve.columns {
width: 476px!important;
}
.container .row.page_sidebar .four.columns, .container .row.blog_list_page .four.columns {
width: 242px!important;
}
#sitemap_list li.home-item {
font-size: larger!important;
}
.post_title {
font-size: 18px !important;}
.post_item .pic.five.columns {
margin-left: 10px;
margin-right: 10px;
}
.twelve.columns .post_item{
padding-right: 10px!important;
}
.post_list_left {width: 32px;}
#alpr {
background: #9ad202 none repeat scroll 0 0;
border-radius: 20px;
color: #fff;
float: right;
font-size: 10px;
font-style: italic;
font-weight: bold;
line-height: 16px;
margin: 10px;
padding: 6px 14px;
text-transform: uppercase;
}
}
/* #Mobile (Portrait)
================================================== */
@media only screen and (max-width: 768px) {
#wrapper, #wrapper.full_wrapper
{ width: 100%; margin: 0px auto; border-radius: 0px; padding:0; border: none; }
#header { position: relative; background: #fff; -webkit-box-shadow: none;-moz-box-shadow: none; box-shadow: none; min-height: auto; }
.page_title_bgr .full_container_page_title {border-top: 1px solid #eee;}
.boxed_wrapper .full_header { border-bottom: none; background: none;}
#footer { width: 100%; }
#header #menu > ul > li > a { line-height: 52px;}
#header #logo .logo_img { height: 62px;}
.header_contacts { display: block; float: auto; margin: 10px 0;}
#menu { display: none; }
#mobile_menu_toggler{ display: block;}
.header_phone { float: none; display: inline; margin: 4px 0 5px 14px; padding-top: 1px; }
.header_mail { float: none; display: inline; margin-top: 4px; padding-top: 2px;}
.masthead {
float: right;
}
.header_search { float: left; }
#s { right: auto;}
#s:focus, #s:hover { width: 150px; }
.button_search { right: 26px; }
#logo .logo_img { display: block; margin: 14px 60px 12px 0; height: auto; }
#header.has_subheader #logo .logo_img { height: auto;}
#logo .logo_img img { max-width: 100%; height: auto; }
.content_bgr { margin-bottom: 0!important; margin-top: 0px !important;}
#footer { position: relative;}
#wrapper.responsive .content_bgr .page .full_container:last-child { margin-bottom: 0;}
.columns.title,
.column.title { margin: 20px 0 46px; }
.margined_left, #footer .columns ul.margined_left { margin-left: 0; }
#footer h3 { margin-top: 30px; }
#footer .columns ul { margin-left: 0; }
#powered { display: block; }
.more-link:before { top: 4px; }
.button { margin-bottom: 12px; }
.parallax_bgr { background-position: center center !important; padding-bottom: 20px!important;}
/* Page Specific */
.margined20 { margin: 10px 0 20px; }
.related_posts_section { margin: 0; }
.aqua_input, input[type="text"].aqua_input, input[type="email"].aqua_input, textarea.aqua_input { width: 280px; }
.page_heading h1 { font-size: 20px;}
.section_big_title { margin: 10px 0 24px !important;}
#map_canvas { height: 340px!important;}
.quote_content { margin: 2px;}
.team_block_content .pic { text-align: center; }
.team_image { width: 70%; display: inline-block;}
.portfolio_description { padding-left: 0; }
.clients_section { margin-left: 0; margin-right: 0;}
.client_info_intro { padding-left: 0px; padding-bottom: 20px; }
.columns.client_info_holder { margin-left: 0px; padding-left: 0px; border-left: none; }
.column.client_info, .three.columns.client_info { width: 100%; text-align: center;}
.info_block .info_item, .info_block .info_item { margin-bottom: 20px; margin-top: 20px; }
.portfolio_section { top: 0px; }
.isotope_element { margin-bottom: 20px !important; }
.portfolio_page .eleven.columns { margin-right: 0px; margin-bottom: 24px; width: auto; max-width: 100%;}
.page_sidebar .twelve.columns { margin-right: 10px; width: 100%; }
.info_overlay .info_desc { margin-left: 0; }
.circ_counter .circ_counter_desc { font-size: 15px;}
.counter { display: block; width: auto; margin: 30px 0; }
.circ_counter { width: 100%; }
.rev_slider_wrapper .button, .rev_slider_wrapper a.button, .rev_slider_wrapper a.button:hover {
padding: 1px 7px 1px; font-size: 8px !important;
}
.carousel_section { margin: 0;}
.price_column ul { font-size: 12px;}
.price_column ul .button{ font-size: 11px; padding: 7px 10px;}
.price_column ul li.price_column_title {font-size: 13px;}
.price_column.price_column_featured ul li.price_column_title {font-size: 13px;}
.button, a.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
font-size: 15px;
line-height: 15px;
padding: 9px 20px;
}
.button .shortcode_icon { margin: 0px 5px 0 -1px;}
.button.small_button, button.small_button, a.small_button, input[type="submit"].small_button, input[type="reset"].small_button, input[type="button"].small_button {
font-size: 14px;
padding: 8px 18px;
line-height: 15px;
}
.button.tiny_button, button.tiny_button, a.tiny_button, input[type="submit"].tiny_button, input[type="reset"].tiny_button, input[type="button"].tiny_button {
font-size: 13px;
padding: 7px 16px;
line-height: 14px;
}
.button.regular_text.tiny_button, button.regular_text.tiny_button, a.tiny_button.regular_text { font-size: 12px; padding: 7px 12px; }
.left_padded { padding-left: 0px;}
.title, .left_title, .title span { font-size: 13px; letter-spacing: 0; }
.tab-content img {float: none !important; display: block; margin: 0 auto 12px !important;}
.tab-content div {width: 100% !important; padding-left: 0 !important;}
.jcarousel-next-horizontal, .custom-next { right: 0px !important;}
.jcarousel-prev-horizontal, .custom-prev { right: 25px !important;}
.icon_big { width: 88px; height: 88px; margin-bottom: 12px; }
.icon_big i { font-size: 40px; line-height: 88px;}
.custom_slides_title { font-size: 22px; line-height: 30px;}
.image_featured_text { display: block; width: auto; border: none;}
.image_featured_text { padding: 16px 0px; }
.image_featured_text .image { width: 100px; height: 100px; }
.image_featured_text .text { margin: 0 4px 10px 120px;}
.image_featured_text .author_position { margin: 0 4px 0px 120px;}
.section_big_title h1 { font-size: 37px; line-height: 47px; }
#header .header_cart {
top: 0px;
padding: 0px 14px 0 12px;
height: 60px;
border-left: none;
background: none;
}
.boxed_wrapper #header .header_cart {
background: none;
border-left: 1px solid transparent;
padding-right: 10px;
border-right: none;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
width: 100%!important;
margin-right: 0 !important;
margin-bottom: 10px!important;
text-align:center;
}
.woocommerce .col_12 ul.products li.product, .woocommerce-page .col_12 ul.products li.product, .woocommerce ul.products li.product.last, .woocommerce-page ul.products li.product.last {
width: 100%!important;
margin-right: 0 !important;
margin-bottom: 10px!important;
}
.woocommerce ul.products li.product:nth-child(even), .woocommerce-page ul.products li.product:nth-child(even) {
margin-right: 0 !important;
}
.info_overlay h3 { font-size: 14px; }
.woocommerce ul.products li.first, .woocommerce-page ul.products li.first {
clear: none !important;
}
.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price {
text-align:center !important;
display: block!important;
margin: 4px 0 4px !important;
}
.woocommerce ul.products li.product a.button {
display: inline-block!important;
text-align: center!important;
float: none!important;
margin: 4px 0 16px !important;
font-size:12px !important;
}
.woocommerce .products .star-rating, .woocommerce-page .products .star-rating {
display: inline-block!important;
margin: 6px 0 2px 0px!important;
}
.woocommerce .single_product_left, .woocommerce .single_product_right {
width: auto !important;
margin-right: 0!important;
margin-left: 0!important;
}
/* New Tabs */
ul.resp-tabs-list {
display: none;
}
h2.resp-accordion {
display: block;
padding: 5px 19px !important;
}
.horizontal .resp-tab-content, .vertical .resp-tab-content{ margin-bottom: 0; border-radius: 0; padding: 12px 19px; border: 1px solid #e1e1e1; border-top: none;}
.resp-vtabs .resp-tabs-container {
border: none;
float: none;
width: 100%;
min-height: initial;
clear: none;
box-shadow: none;
}
.resp-accordion-closed {
display:none !important;
}
.resp-vtabs .resp-tab-content:last-child {
border-bottom: 1px solid #e1e1e1 !important;
}
input[type="text"], input[type="password"], input[type="email"], textarea {
-webkit-appearance: none;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.pic img {
width: 100%!important;
}
.association {
width: 100%!important;
float: right;
}
.dark_container_white_text h2 {
font-size: 20px;
float: left;
}
.text_box .button.button_pale.tiny_button {
float: left;
text-align: center;
margin-left: 0;
}
.association_bwa {
font-size: 13px;
}
}
/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 768px) {
#powered { display: block; float: right; margin-top: 20px; margin-right: 0; }
/* Page Specific */
.rev_slider_wrapper .button, .rev_slider_wrapper a.button, .rev_slider_wrapper a.button:hover {
padding:2px 8px 2px; line-height:20px !important; font-size:10px !important;font-weight:normal;
}
.aqua_input, input[type="text"].aqua_input, input[type="email"].aqua_input, textarea.aqua_input { width: 360px; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
width: 49%!important;
margin-right: 2%!important;
margin-bottom: 10px!important;
text-align:center;
}
.woocommerce .col_12 ul.products li.product, .woocommerce-page .col_12 ul.products li.product, .woocommerce ul.products li.product.last, .woocommerce-page ul.products li.product.last {
width: 49%!important;
margin-right: 2%!important;
margin-bottom: 10px!important;
}
.woocommerce ul.products li.product:nth-child(even), .woocommerce-page ul.products li.product:nth-child(even) {
margin-right: 0 !important;
}
#footer .latest_post_sidebar img {
width: 50px;
height: 50px;
}
}
@media only screen and (max-width: 480px) {
.association_bwa {
font-size : small!important;
text-align: justify!important;
padding: 0!important;
}
.wp-image-1739 {
float: none!important;
}
.info_desc > h3 {
font-size: 16px!important;
}
.text_box .button.button_pale.tiny_button {
float: none;
}
.text_box.no_mar.box_no_bgr > h2 {
font-size: 18px;
text-align: justify;
}
.newtabs.horizontal {
margin-top: 10px!important;
}
blockquote {
margin: 0 0 20px !important;
}
blockquote, blockquote p {
font-size: 14px!important;
}
.post_description ul, .page_sidebar .twelve.columns ul, .resp-tabs-container ul {
margin-left: 0!important;
}
.newtabs.horizontal {
width: 100% !important;
}
/* Force table to not be like tables anymore */
table.tableau, .tableau thead, .tableau tbody, .tableau th, .tableau td, .tableau tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
.tableau thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
.tableau tr { /*border: 1px solid #ccc;*/
border-bottom: 1px dotted #f3f3f3;
border-top: 1px dotted #f3f3f3;
margin-bottom: 1%;
margin-left: 0;
margin-right: 0;}
.tableau td {
/* Behave like a "row" */
border: none;
/*border-bottom: 1px solid #eee; */
border-bottom: 1px solid #fff;
position: relative;
/*padding-left: 50%; */
}
.tableau td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
}
#tribe-events-event-meta .column {
width:auto!important;
}
.pic img {
width: 300px!important;
}
#tribe-events-loop .pic img {
width: auto!important;
}
.events-archive #tribe-events-nav-below {
text-align: center!important;
}
#tribe-events-nav-below .tribe-events-nav-previous {
float: none!important;
}
#tribe-events-nav-below .tribe-events-nav-next {
float: none!important;
}
}