corporate_theme.responsive.styles.css in Brainstorm profile 7
/*
* responsive.custom.css is for custom media queries that are not set via the
* theme settings, such as cascading media queries.
*
* By default all the other responsive stylesheets used in Adaptivetheme use a
* "stacking method", however cascading media queries use a waterfall method so
* you can leverage the cascade and inheritance for all browsers that support
* media queries.
*
* @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
*
* NOTE: this file loads by default, to disable go to your theme settings and
* look under the "CSS" settings tab.
*/
/*
* Really small screens and up
*/
/* @media only screen and (min-width: 220px) {} */
/*
* Smalltouch sizes and up
*/
/* @media only screen and (min-width: 320px) {} */
/*
* Smalltouch sizes and down
*/
@media only screen and (max-width: 480px) {
/*
* Float Region Blocks - custom media query CSS example:
*
* Float regions blocks is an Extension you can enable in the appearance
* settings for your theme. This feature allows you to automatically float
* blocks in regions, you can switch it on and off depending on your
* requirements. For design purposes you many want to remove the floats for
* devices where the entire theme is just one column - for example small
* mobile phones. The following CSS is inside the custom media query:
*
* @media only screen and (max-width: 480px){}
*
* This will target devices with a maximum width of 480px - most small phones.
* In these smaller screen sizes we can remove the float and widths so all
* blocks stack instead of displaying horizonally. The selector used is an
* "attribute selector" which will match on any float block class. Use your
* inspector or Firebug to get the classes from the page output if you need
* more granular control over block alignment and stacking.
*/
.region[class*="float-blocks"] .block {
float: none;
width: 100%;
}
}
/*
* Tablet sizes and up
*/
/*@media only screen and (min-width: 768px) {
}*/
/*
* Desktops/laptops and up
*/
/* @media only screen and (min-width: 1025px) {} */
@media (min-width: 768px) {
.section-contact-us.not-logged-in #block-system-main {
margin-top: -55px;
}
}
@media (max-width: 768px) {
.sf-menu li:hover > ul, .sf-menu li.sfHover > ul {
left: 35%;
top: -100%;
}
}
@media (max-width: 1200px) {
/* Footer BEGIN */
.region-tertiary-content .block-instagram-block .content {
margin-left: -10px;
margin-right: -10px;
}
.region-tertiary-content .block-instagram-block .content a {
margin: 0 10px 15px;
}
.region-tertiary-content .block-instagram-block img {
width: 100px !important;
height: 100px !important;
}
/* Footer END */
/* Main slider BEGIN */
.view-main-slider .owl-controls .owl-buttons div {
top: 50%;
}
/* Main slider BEGIN */
}
@media (max-width: 1024px) {
/* Header BEGIN */
#menu-bar nav,
#primary-menu-bar nav {
border-top: 1px solid #e8e8e8;
padding: 0;
}
#primary-menu-bar nav > .menu,
#menu-bar nav > .menu {
float: none;
margin: 0;
}
#primary-menu-bar .menu .menu,
#menu-bar .menu .menu {
display: block;
position: static;
box-shadow: none;
border-left: 1px solid #E8E8E8;
border-bottom: 1px solid #E8E8E8;
}
#primary-menu-bar .menu .menu .menu,
#menu-bar .menu .menu .menu {
border-bottom: none;
}
#primary-menu-bar > nav > .menu > li,
#menu-bar .menu-depth-1 {
float: none;
}
#primary-menu-bar .menu a,
#menu-bar .menu a {
border-left: none;
border-right: none;
padding: 15px 20px !important;
text-transform: uppercase;
border-bottom: 1px solid #e8e8e8;
}
#primary-menu-bar .menu li:last-child a,
#menu-bar .menu li:last-child a {
border-bottom: none;
}
#primary-menu-bar .menu .menu li,
#menu-bar .menu .menu li {
padding-left: 30px;
}
#primary-menu-bar > nav > .menu > li > a:hover,
#menu-bar .menu-depth-1 > a:hover,
#primary-menu-bar > nav > .menu > li > a.active,
#menu-bar .menu-depth-1 > a.active,
#primary-menu-bar .menu .menu a:hover,
#menu-bar .menu .menu a:hover {
background: #000;
color: #fff;
}
#block-superfish-1 {
display: none;
margin-bottom: 5%;
width: 50%
}
.sf-menu, .sf-menu li {
width: 20em;
}
.sf-menu li {
float: left;
position: relative;
z-index: 498;
display: block;
width: 100%;
}
.sf-menu a {
display: block;
position: relative;
height: 40px;
line-height: 40px;
padding: 0 1%;
text-transform: uppercase;
padding: 33px 0px 34px;
}
#main-nav-check:checked + #menu,
#menu .sub-nav-check:checked + .sub-nav,
#main-nav-check:checked ~ .l-responsive-page-container,
#main-nav-check:checked + #menu:only-of-type + .l-responsive-page-container,
#main-nav-check:checked + #menu:nth-child(n) + .l-responsive-page-container {
-webkit-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
transform: translate(100%, 0);
}
#menu.responsive-menu-block,
#menu.responsive-menu-block .sub-nav {
width: 100%;
left: -100%;
background: #fff;
border-right: 1px solid #e8e8e8;
}
#menu label {
color: #000;
}
#menu label:hover {
color: #3f9ae8;
}
#menu ul {
background: #fff;
border-top: 1px solid #e8e8e8;
}
#menu li {
border-bottom: 1px solid #e8e8e8;
}
#menu li a {
line-height: 1;
font-size: 13px;
padding: 15px 20px;
color: #a6a6a6;
text-transform: uppercase;
}
#menu li a.active {
color: #000;
}
#menu li a:hover {
background: #000;
color: #fff;
}
#menu .toggle-sub {
font-size: 16px !important;
line-height: 43px !important;
width: 2.5em;
background: #fff;
color: #000;
border: 1px solid #e8e8e8;
}
#menu .sub-heading {
color: #fff;
background: #000;
text-transform: uppercase;
border-top: 1px solid #e8e8e8;
}
#menu .sub-heading:before {
content: none;
}
/* Header END */
/* Front page BEGIN */
.view-secondary-slider .views-field-field-image {
display: none;
}
.view-secondary-slider .views-field-title,
.view-secondary-slider .views-field-body,
.view-secondary-slider .views-field-title-1 {
width: auto;
margin-right: auto;
}
.owl-page {
pointer-events: none;
cursor: default;
}
.main-slider-title {
margin-bottom: 10px;
}
.check-list li + li {
margin-top: 15px;
}
.view-main-slider {
height: 300px;
}
.view-main-slider .views-field-field-background-image img {
width: auto;
max-width: none;
min-width: 100%;
height: 100%;
}
.views-field-field-clients-image {
width: 120px;
margin: 0 auto;
}
/* Front page END */
/* Portfolio BEGIN */
.page-portfolio-column-four .view-portfolio > .view-content > .views-row {
width: 33%;
}
/* Portfolio END */
}
@media only screen and (max-width: 767px) {
/* Common styles BEGIN */
.block-title {
margin-bottom: 10px;
}
#content p {
margin-bottom: 8px;
}
#disqus_thread {
margin-bottom: 15px;
}
.item-list .pager {
text-align: center;
}
#main-content {
padding: 0 10px;
}
body.front #main-content {
padding: 0;
}
/* Common styles END */
.sidebar .form-text {
width: auto;
}
/* Drupal standart blocks END */
/* Front page BEGIN */
.main-slider-image {
display: none;
}
.main-slider-content-wrapper {
padding: 30px 0;
}
.main-slider-text-wrapper {
float: none;
width: 100%;
padding: 0;
}
.main-slider-body {
padding: 0 15px;
}
.view-main-slider .views-field-field-background-image {
height: 100%;
}
.main-slider-text-wrapper {
text-align: center;
}
.main-slider-body {
text-align: left;
}
.main-slider-title {
font-size: 24px;
text-align: center;
}
.view-main-slider .owl-controls .owl-buttons div {
top: 50%;
}
.owl-theme .owl-controls .owl-buttons div {
margin: 0;
}
.view-secondary-slider .owl-carousel {
padding: 40px 50px;
}
.view-secondary-slider .views-field-title {
margin-top: 0;
}
.block-recent-news-block .views-field-field-news-image {
width: auto;
margin-right: 0;
margin-bottom: 20px;
float: none;
}
.block-our-mission {
padding: 25px 10px;
}
.block-our-mission p {
margin-bottom: 10px;
}
.block-our-amazing-team-block {
padding: 30px 0 10px;
}
.views-field-field-clients-image {
width: 95px;
}
.block-social-icons {
text-align: left;
}
/* Front page END */
/* Sidebar BEGIN */
.sidebar .view-popular-tags .views-row {
display: inline-block;
}
.sidebar .view-popular-tags a {
margin-right: 5px;
}
#block-menu-block-2 .menu {
text-align: left;
}
/* Sidebar BEGIN */
/* About us BEGIN */
.about-us-img {
width: auto;
float: none;
margin-right: 0;
margin-bottom: 20px;
}
.section-about-us .view-our-amazing-team .views-row {
width: 45%;
}
.view-our-amazing-team .views-field-title {
margin: 10px 0;
}
#node-3 {
margin-bottom: 20px;
}
/* About us END */
/* Portfolio BEGIN */
.page-portfolio-column-three .view-portfolio > .view-content > .views-row,
.page-portfolio-column-four .view-portfolio > .view-content > .views-row {
width: 49.6%;
}
/* Portfolio END */
/* Contact us BEGIN */
body.section-contact-us #content > * {
width: 100%;
display: block;
}
body.section-contact-us #content > * > * {
max-width: none;
}
body.section-contact-us .colorized-gmap-common {
height: 300px;
}
/* Contact us END */
}
@media only screen and (max-width: 600px) {
/* Common styles BEGIN */
#block-delta-blocks-page-title {
padding-left: 0;
padding-right: 0;
}
.item-list .pager {
padding-top: 30px;
}
/* Common styles END */
/* Footer BEGIN */
.region-tertiary-content .block {
width: 100%;
padding: 0 10px;
margin-bottom: 40px;
}
.block-instagram-block .content {
margin-left: -5px;
margin-right: -5px;
}
.block-instagram-block .content a {
margin: 0 5px 10px;
}
.region-tertiary-content .block-instagram-block img {
width: 70px !important;
height: 70px !important;
}
.region-tertiary-content .block-instagram-block .content a {
margin: 0 5px 10px;
}
/* Footer END */
/* Front page BEGIN */
.view-our-amazing-team .views-row {
display: block;
width: 100%;
margin-left: 0;
margin-right: 0;
}
.view-dignities .views-row {
float: none;
width: 100%;
text-align: center;
}
.main-slider-title {
padding: 15px;
font-size: 24px;
}
/* Front page END */
/* About us BEGIN */
.section-about-us .view-our-amazing-team .views-row {
width: 100%;
}
/* About us END */
/* Blog BEGIN */
.view-blog .views-field-field-blog-image,
.view-blog .views-field-nothing {
width: auto;
float: none;
margin: 0;
}
.view-blog .views-field-field-blog-image {
margin-bottom: 15px;
}
.view-blog .views-row {
padding: 15px 0 30px;
}
/* Blog END */
/* Portfolio BEGIN */
.view-portfolio > .view-content {
margin-left: -5px;
margin-right: -5px;
}
.view-portfolio > .view-content > .views-row {
padding: 0 5px;
}
/* Portfolio END */
}
@media (max-width: 579px) {
#primary-menu-bar .menu a,
#menu-bar .menu a,
#superfish-1 .active-trail > a {
padding-left: 10px !important;
padding-right: 10px !important;
}
}
@media (max-width: 480px) {
/* Portfolio BEGIN */
.view-portfolio > .view-content > .views-row,
.page-portfolio-column-three .view-portfolio > .view-content > .views-row,
.page-portfolio-column-four .view-portfolio > .view-content > .views-row {
width: 100%;
float: none;
display: block;
}
/* Portfolio END */
/* Contact us BEGIN */
body.section-contact-us .colorized-gmap-common {
height: 250px;
}
/* Contact us END */
}
@media only screen and (max-width:320px) {
/*
* Important Information about this CSS File
*
* - Do not delete or rename this file, if you do not use it leave it blank (delete
* everything) and the file will be skipped when you enable Production Mode in
* the Global theme settings.
*
* - Read the _README file in this directory, it contains useful help and other information.
*/
/* =============================================================================
* Mobile Menu Toggle
* See your theme settings extensions for how to enable the menu toggle.
* These are example styles for the menu toggle menu, you can use these in the
* relevant responsive stylesheets as required. Modify to suit your design.
* ========================================================================== */
/* The toggle link */
.at-mt .at-menu-toggle h2 {
margin-bottom: 5px;
}
.at-mt .at-menu-toggle h2 a {
background: #eee;
border: 2px solid #ccc;
padding: 2px 10px;
}
/* Menu items */
.at-mt .at-menu-toggle ul.menu li a {
background: #eee;
border-bottom: 1px solid #fff;
}
}
@media only screen and (min-width:321px) and (max-width:580px) {
/*
* Important Information about this CSS File
*
* - Do not delete or rename this file, if you do not use it leave it blank (delete
* everything) and the file will be skipped when you enable Production Mode in
* the Global theme settings.
*
* - Read the _README file in this directory, it contains useful help and other information.
*/
/* =============================================================================
* Mobile Menu Toggle
* See your theme settings extensions for how to enable the menu toggle.
* These are example styles for the menu toggle menu, you can use these in the
* relevant responsive stylesheets as required. Modify to suit your design.
* ========================================================================== */
/* The toggle link */
.at-mt .at-menu-toggle h2 {
margin-bottom: 5px;
}
.at-mt .at-menu-toggle h2 a {
background: #eee;
border: 2px solid #ccc;
padding: 2px 10px;
}
/* Menu items */
.at-mt .at-menu-toggle ul.menu li a {
background: #eee;
border-bottom: 1px solid #fff;
}
}
@media only screen and (min-width:581px) and (max-width:768px) {
/*
* Important Information about this CSS File
*
* - Do not delete or rename this file, if you do not use it leave it blank (delete
* everything) and the file will be skipped when you enable Production Mode in
* the Global theme settings.
*
* - Read the _README file in this directory, it contains useful help and other information.
*/
/* Common BEGIN */
#branding,
.region-inner,
body.front .view-content,
body.front .block-title,
.block-our-amazing-team-block-1 .block-title,
.view-header,
.copyright-container,
.view-main-slider .views-field-nothing,
#columns,
#secondary-menu-bar,
.block-our-mission p {
padding-left: 25px;
padding-right: 25px;
}
.region-tertiary-content .view-content {
padding: 0;
}
.front .block-title {
padding-left: 0;
padding-right: 0;
}
/* Common END */
/* Footer BEGIN */
.region-tertiary-content .block {
width: 50%;
margin-bottom: 55px;
padding: 0 25px;
}
/* Footer END */
/* Main slider BEGIN */
.view-main-slider .view-content {
padding: 0;
}
/* Main slider END */
/* Front page BEGIN */
.view-dignities .views-row {
width: 50%;
}
/* Front page END */
}
@media only screen and (min-width:769px) and (max-width:1024px) {
/*
* Important Information about this CSS File
*
* - Do not delete or rename this file, if you do not use it leave it blank (delete
* everything) and the file will be skipped when you enable Production Mode in
* the Global theme settings.
*
* - Read the _README file in this directory, it contains useful help and other information.
*/
/* Common BEGIN */
#branding,
.region-inner,
body.front .view-content,
body.front .block-title,
.block-our-amazing-team-block-1 .block-title,
.view-header,
.copyright-container,
.view-main-slider .views-field-nothing,
#columns,
#secondary-menu-bar,
.block-our-mission p {
padding-left: 25px;
padding-right: 25px;
}
.front .block-title {
padding-left: 0;
padding-right: 0;
}
/* Common END */
/* Front page BEGIN */
.view-main-slider {
height: 250px;
}
.view-main-slider .view-content {
padding: 0;
}
.main-slider-text-wrapper {
padding: 10px 10px 30px 40px;
width: 67%;
}
.main-slider-image {
width: 33%;
}
.view-dignities {
padding: 50px 0;
}
.view-dignities .view-content {
margin-bottom: 30px;
}
.view-secondary-slider .owl-carousel {
padding-left: 135px;
padding-right: 135px;
}
.view-secondary-slider .views-field-title,
.view-secondary-slider .views-field-body,
.view-secondary-slider .views-field-title-1 {
float: none;
}
.view-secondary-slider .views-field-title {
margin-top: 15px;
}
.block-recent-news-block .views-field-field-news-image {
margin-right: 25px;
}
.block-our-mission p {
width: auto;
}
.block-our-amazing-team-block {
padding-top: 45px;
padding-bottom: 35px;
}
/* Front page END */
/* Main slider END */
.views-field-field-main-slider-image {
display: none;
}
/* Main slider END */
/* Footer BEGIN */
.region-tertiary-content .view-content {
padding: 0;
}
.region-tertiary-content .block {
width: 50%;
margin-bottom: 55px;
padding: 0 25px;
}
.view-popular-tags .view-content {
padding: 0;
}
/* Footer END */
}
@media only screen and (min-width:1025px) {
/*
* Important Information about this CSS File
*
* - Do not delete or rename this file, if you do not use it leave it blank (delete
* everything) and the file will be skipped when you enable Production Mode in
* the Global theme settings.
*
* - Read the _README file in this directory, it contains useful help and other information.
*/
/* Header BEGIN */
/* Navigation */
#menu.responsive-menu-block {
display: none;
}
#block-superfish-1 {
float: right;
margin: 0;
}
#superfish-1 li.sf-depth-1 {
border-left: 1px solid transparent;
border-right: 1px solid transparent;
}
#superfish-1 li.sf-depth-1:hover {
border-left-color: #e8e8e8;
border-right-color: #e8e8e8;
}
#superfish-1 .sf-depth-1 > a {
text-transform: uppercase;
padding: 33px 20px 34px;
}
#superfish-1 .sf-depth-1 > a:hover,
#superfish-1 .sf-depth-1.active-trail > a {
color: #000;
}
#superfish-1 .sf-depth-1 > ul {
position: absolute;
padding: 10px 0 !important;
width: auto !important;
right: 0 !important;
background: #fff;
top: 80px;
min-width: 190px;
border-radius: 0;
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
}
#superfish-1 .sf-depth-2 > a {
padding: 10px 20px;
}
#superfish-1 .sf-depth-2 > a:hover {
background: #000;
color: #fff;
}
.btn-mobile-menu {
display: none;
}
/* Header END */
}
File
node_export_assets/adaptivetheme/corporate_theme_files/corporate_theme.responsive.styles.css
View source
- /*
- * responsive.custom.css is for custom media queries that are not set via the
- * theme settings, such as cascading media queries.
- *
- * By default all the other responsive stylesheets used in Adaptivetheme use a
- * "stacking method", however cascading media queries use a waterfall method so
- * you can leverage the cascade and inheritance for all browsers that support
- * media queries.
- *
- * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
- *
- * NOTE: this file loads by default, to disable go to your theme settings and
- * look under the "CSS" settings tab.
- */
-
- /*
- * Really small screens and up
- */
- /* @media only screen and (min-width: 220px) {} */
-
- /*
- * Smalltouch sizes and up
- */
- /* @media only screen and (min-width: 320px) {} */
-
- /*
- * Smalltouch sizes and down
- */
- @media only screen and (max-width: 480px) {
- /*
- * Float Region Blocks - custom media query CSS example:
- *
- * Float regions blocks is an Extension you can enable in the appearance
- * settings for your theme. This feature allows you to automatically float
- * blocks in regions, you can switch it on and off depending on your
- * requirements. For design purposes you many want to remove the floats for
- * devices where the entire theme is just one column - for example small
- * mobile phones. The following CSS is inside the custom media query:
- *
- * @media only screen and (max-width: 480px){}
- *
- * This will target devices with a maximum width of 480px - most small phones.
- * In these smaller screen sizes we can remove the float and widths so all
- * blocks stack instead of displaying horizonally. The selector used is an
- * "attribute selector" which will match on any float block class. Use your
- * inspector or Firebug to get the classes from the page output if you need
- * more granular control over block alignment and stacking.
- */
- .region[class*="float-blocks"] .block {
- float: none;
- width: 100%;
- }
- }
-
- /*
- * Tablet sizes and up
- */
- /*@media only screen and (min-width: 768px) {
-
- }*/
-
- /*
- * Desktops/laptops and up
- */
- /* @media only screen and (min-width: 1025px) {} */
-
- @media (min-width: 768px) {
- .section-contact-us.not-logged-in #block-system-main {
- margin-top: -55px;
- }
- }
- @media (max-width: 768px) {
- .sf-menu li:hover > ul, .sf-menu li.sfHover > ul {
- left: 35%;
- top: -100%;
- }
- }
-
- @media (max-width: 1200px) {
-
- /* Footer BEGIN */
- .region-tertiary-content .block-instagram-block .content {
- margin-left: -10px;
- margin-right: -10px;
- }
- .region-tertiary-content .block-instagram-block .content a {
- margin: 0 10px 15px;
- }
- .region-tertiary-content .block-instagram-block img {
- width: 100px !important;
- height: 100px !important;
- }
- /* Footer END */
- /* Main slider BEGIN */
- .view-main-slider .owl-controls .owl-buttons div {
- top: 50%;
- }
- /* Main slider BEGIN */
- }
-
- @media (max-width: 1024px) {
- /* Header BEGIN */
- #menu-bar nav,
- #primary-menu-bar nav {
- border-top: 1px solid #e8e8e8;
- padding: 0;
- }
- #primary-menu-bar nav > .menu,
- #menu-bar nav > .menu {
- float: none;
- margin: 0;
- }
- #primary-menu-bar .menu .menu,
- #menu-bar .menu .menu {
- display: block;
- position: static;
- box-shadow: none;
- border-left: 1px solid #E8E8E8;
- border-bottom: 1px solid #E8E8E8;
- }
- #primary-menu-bar .menu .menu .menu,
- #menu-bar .menu .menu .menu {
- border-bottom: none;
- }
- #primary-menu-bar > nav > .menu > li,
- #menu-bar .menu-depth-1 {
- float: none;
- }
- #primary-menu-bar .menu a,
- #menu-bar .menu a {
- border-left: none;
- border-right: none;
- padding: 15px 20px !important;
- text-transform: uppercase;
- border-bottom: 1px solid #e8e8e8;
- }
- #primary-menu-bar .menu li:last-child a,
- #menu-bar .menu li:last-child a {
- border-bottom: none;
- }
- #primary-menu-bar .menu .menu li,
- #menu-bar .menu .menu li {
- padding-left: 30px;
- }
- #primary-menu-bar > nav > .menu > li > a:hover,
- #menu-bar .menu-depth-1 > a:hover,
- #primary-menu-bar > nav > .menu > li > a.active,
- #menu-bar .menu-depth-1 > a.active,
- #primary-menu-bar .menu .menu a:hover,
- #menu-bar .menu .menu a:hover {
- background: #000;
- color: #fff;
- }
-
-
- #block-superfish-1 {
- display: none;
- margin-bottom: 5%;
- width: 50%
- }
-
- .sf-menu, .sf-menu li {
- width: 20em;
- }
-
- .sf-menu li {
- float: left;
- position: relative;
- z-index: 498;
- display: block;
- width: 100%;
- }
-
- .sf-menu a {
- display: block;
- position: relative;
- height: 40px;
- line-height: 40px;
- padding: 0 1%;
- text-transform: uppercase;
- padding: 33px 0px 34px;
- }
-
- #main-nav-check:checked + #menu,
- #menu .sub-nav-check:checked + .sub-nav,
- #main-nav-check:checked ~ .l-responsive-page-container,
- #main-nav-check:checked + #menu:only-of-type + .l-responsive-page-container,
- #main-nav-check:checked + #menu:nth-child(n) + .l-responsive-page-container {
- -webkit-transform: translate(100%, 0);
- -ms-transform: translate(100%, 0);
- transform: translate(100%, 0);
- }
- #menu.responsive-menu-block,
- #menu.responsive-menu-block .sub-nav {
- width: 100%;
- left: -100%;
- background: #fff;
- border-right: 1px solid #e8e8e8;
- }
- #menu label {
- color: #000;
- }
- #menu label:hover {
- color: #3f9ae8;
- }
- #menu ul {
- background: #fff;
- border-top: 1px solid #e8e8e8;
- }
- #menu li {
- border-bottom: 1px solid #e8e8e8;
- }
- #menu li a {
- line-height: 1;
- font-size: 13px;
- padding: 15px 20px;
- color: #a6a6a6;
- text-transform: uppercase;
- }
- #menu li a.active {
- color: #000;
- }
- #menu li a:hover {
- background: #000;
- color: #fff;
- }
- #menu .toggle-sub {
- font-size: 16px !important;
- line-height: 43px !important;
- width: 2.5em;
- background: #fff;
- color: #000;
- border: 1px solid #e8e8e8;
- }
- #menu .sub-heading {
- color: #fff;
- background: #000;
- text-transform: uppercase;
- border-top: 1px solid #e8e8e8;
- }
- #menu .sub-heading:before {
- content: none;
- }
- /* Header END */
-
- /* Front page BEGIN */
- .view-secondary-slider .views-field-field-image {
- display: none;
- }
- .view-secondary-slider .views-field-title,
- .view-secondary-slider .views-field-body,
- .view-secondary-slider .views-field-title-1 {
- width: auto;
- margin-right: auto;
- }
- .owl-page {
- pointer-events: none;
- cursor: default;
- }
- .main-slider-title {
- margin-bottom: 10px;
- }
- .check-list li + li {
- margin-top: 15px;
- }
- .view-main-slider {
- height: 300px;
- }
- .view-main-slider .views-field-field-background-image img {
- width: auto;
- max-width: none;
- min-width: 100%;
- height: 100%;
- }
- .views-field-field-clients-image {
- width: 120px;
- margin: 0 auto;
- }
- /* Front page END */
-
- /* Portfolio BEGIN */
- .page-portfolio-column-four .view-portfolio > .view-content > .views-row {
- width: 33%;
- }
- /* Portfolio END */
- }
- @media only screen and (max-width: 767px) {
- /* Common styles BEGIN */
- .block-title {
- margin-bottom: 10px;
- }
- #content p {
- margin-bottom: 8px;
- }
- #disqus_thread {
- margin-bottom: 15px;
- }
- .item-list .pager {
- text-align: center;
- }
- #main-content {
- padding: 0 10px;
- }
- body.front #main-content {
- padding: 0;
- }
- /* Common styles END */
-
-
- .sidebar .form-text {
- width: auto;
- }
- /* Drupal standart blocks END */
-
- /* Front page BEGIN */
- .main-slider-image {
- display: none;
- }
- .main-slider-content-wrapper {
- padding: 30px 0;
- }
- .main-slider-text-wrapper {
- float: none;
- width: 100%;
- padding: 0;
- }
- .main-slider-body {
- padding: 0 15px;
- }
- .view-main-slider .views-field-field-background-image {
- height: 100%;
- }
- .main-slider-text-wrapper {
- text-align: center;
- }
- .main-slider-body {
- text-align: left;
- }
- .main-slider-title {
- font-size: 24px;
- text-align: center;
- }
- .view-main-slider .owl-controls .owl-buttons div {
- top: 50%;
- }
- .owl-theme .owl-controls .owl-buttons div {
- margin: 0;
- }
- .view-secondary-slider .owl-carousel {
- padding: 40px 50px;
- }
- .view-secondary-slider .views-field-title {
- margin-top: 0;
- }
- .block-recent-news-block .views-field-field-news-image {
- width: auto;
- margin-right: 0;
- margin-bottom: 20px;
- float: none;
- }
- .block-our-mission {
- padding: 25px 10px;
- }
- .block-our-mission p {
- margin-bottom: 10px;
- }
- .block-our-amazing-team-block {
- padding: 30px 0 10px;
- }
- .views-field-field-clients-image {
- width: 95px;
- }
- .block-social-icons {
- text-align: left;
- }
- /* Front page END */
-
- /* Sidebar BEGIN */
- .sidebar .view-popular-tags .views-row {
- display: inline-block;
- }
- .sidebar .view-popular-tags a {
- margin-right: 5px;
- }
- #block-menu-block-2 .menu {
- text-align: left;
- }
- /* Sidebar BEGIN */
-
- /* About us BEGIN */
- .about-us-img {
- width: auto;
- float: none;
- margin-right: 0;
- margin-bottom: 20px;
- }
- .section-about-us .view-our-amazing-team .views-row {
- width: 45%;
- }
- .view-our-amazing-team .views-field-title {
- margin: 10px 0;
- }
- #node-3 {
- margin-bottom: 20px;
- }
- /* About us END */
-
- /* Portfolio BEGIN */
- .page-portfolio-column-three .view-portfolio > .view-content > .views-row,
- .page-portfolio-column-four .view-portfolio > .view-content > .views-row {
- width: 49.6%;
- }
- /* Portfolio END */
-
- /* Contact us BEGIN */
- body.section-contact-us #content > * {
- width: 100%;
- display: block;
- }
- body.section-contact-us #content > * > * {
- max-width: none;
- }
- body.section-contact-us .colorized-gmap-common {
- height: 300px;
- }
- /* Contact us END */
- }
- @media only screen and (max-width: 600px) {
- /* Common styles BEGIN */
- #block-delta-blocks-page-title {
- padding-left: 0;
- padding-right: 0;
- }
- .item-list .pager {
- padding-top: 30px;
- }
- /* Common styles END */
-
- /* Footer BEGIN */
- .region-tertiary-content .block {
- width: 100%;
- padding: 0 10px;
- margin-bottom: 40px;
- }
- .block-instagram-block .content {
- margin-left: -5px;
- margin-right: -5px;
- }
- .block-instagram-block .content a {
- margin: 0 5px 10px;
- }
- .region-tertiary-content .block-instagram-block img {
- width: 70px !important;
- height: 70px !important;
- }
- .region-tertiary-content .block-instagram-block .content a {
- margin: 0 5px 10px;
- }
- /* Footer END */
-
- /* Front page BEGIN */
- .view-our-amazing-team .views-row {
- display: block;
- width: 100%;
- margin-left: 0;
- margin-right: 0;
- }
- .view-dignities .views-row {
- float: none;
- width: 100%;
- text-align: center;
- }
- .main-slider-title {
- padding: 15px;
- font-size: 24px;
- }
- /* Front page END */
-
- /* About us BEGIN */
- .section-about-us .view-our-amazing-team .views-row {
- width: 100%;
- }
- /* About us END */
-
- /* Blog BEGIN */
- .view-blog .views-field-field-blog-image,
- .view-blog .views-field-nothing {
- width: auto;
- float: none;
- margin: 0;
- }
- .view-blog .views-field-field-blog-image {
- margin-bottom: 15px;
- }
- .view-blog .views-row {
- padding: 15px 0 30px;
- }
- /* Blog END */
-
- /* Portfolio BEGIN */
- .view-portfolio > .view-content {
- margin-left: -5px;
- margin-right: -5px;
- }
- .view-portfolio > .view-content > .views-row {
- padding: 0 5px;
- }
- /* Portfolio END */
- }
-
- @media (max-width: 579px) {
- #primary-menu-bar .menu a,
- #menu-bar .menu a,
- #superfish-1 .active-trail > a {
- padding-left: 10px !important;
- padding-right: 10px !important;
- }
- }
-
- @media (max-width: 480px) {
- /* Portfolio BEGIN */
- .view-portfolio > .view-content > .views-row,
- .page-portfolio-column-three .view-portfolio > .view-content > .views-row,
- .page-portfolio-column-four .view-portfolio > .view-content > .views-row {
- width: 100%;
- float: none;
- display: block;
- }
- /* Portfolio END */
-
- /* Contact us BEGIN */
- body.section-contact-us .colorized-gmap-common {
- height: 250px;
- }
- /* Contact us END */
-
- }
-
- @media only screen and (max-width:320px) {
- /*
- * Important Information about this CSS File
- *
- * - Do not delete or rename this file, if you do not use it leave it blank (delete
- * everything) and the file will be skipped when you enable Production Mode in
- * the Global theme settings.
- *
- * - Read the _README file in this directory, it contains useful help and other information.
- */
-
- /* =============================================================================
- * Mobile Menu Toggle
- * See your theme settings extensions for how to enable the menu toggle.
- * These are example styles for the menu toggle menu, you can use these in the
- * relevant responsive stylesheets as required. Modify to suit your design.
- * ========================================================================== */
- /* The toggle link */
- .at-mt .at-menu-toggle h2 {
- margin-bottom: 5px;
- }
-
- .at-mt .at-menu-toggle h2 a {
- background: #eee;
- border: 2px solid #ccc;
- padding: 2px 10px;
- }
-
- /* Menu items */
- .at-mt .at-menu-toggle ul.menu li a {
- background: #eee;
- border-bottom: 1px solid #fff;
- }
- }
- @media only screen and (min-width:321px) and (max-width:580px) {
- /*
- * Important Information about this CSS File
- *
- * - Do not delete or rename this file, if you do not use it leave it blank (delete
- * everything) and the file will be skipped when you enable Production Mode in
- * the Global theme settings.
- *
- * - Read the _README file in this directory, it contains useful help and other information.
- */
-
- /* =============================================================================
- * Mobile Menu Toggle
- * See your theme settings extensions for how to enable the menu toggle.
- * These are example styles for the menu toggle menu, you can use these in the
- * relevant responsive stylesheets as required. Modify to suit your design.
- * ========================================================================== */
- /* The toggle link */
- .at-mt .at-menu-toggle h2 {
- margin-bottom: 5px;
- }
-
- .at-mt .at-menu-toggle h2 a {
- background: #eee;
- border: 2px solid #ccc;
- padding: 2px 10px;
- }
-
- /* Menu items */
- .at-mt .at-menu-toggle ul.menu li a {
- background: #eee;
- border-bottom: 1px solid #fff;
- }
- }
- @media only screen and (min-width:581px) and (max-width:768px) {
- /*
- * Important Information about this CSS File
- *
- * - Do not delete or rename this file, if you do not use it leave it blank (delete
- * everything) and the file will be skipped when you enable Production Mode in
- * the Global theme settings.
- *
- * - Read the _README file in this directory, it contains useful help and other information.
- */
- /* Common BEGIN */
- #branding,
- .region-inner,
- body.front .view-content,
- body.front .block-title,
- .block-our-amazing-team-block-1 .block-title,
- .view-header,
- .copyright-container,
- .view-main-slider .views-field-nothing,
- #columns,
- #secondary-menu-bar,
- .block-our-mission p {
- padding-left: 25px;
- padding-right: 25px;
- }
- .region-tertiary-content .view-content {
- padding: 0;
- }
- .front .block-title {
- padding-left: 0;
- padding-right: 0;
- }
- /* Common END */
-
- /* Footer BEGIN */
- .region-tertiary-content .block {
- width: 50%;
- margin-bottom: 55px;
- padding: 0 25px;
- }
- /* Footer END */
-
- /* Main slider BEGIN */
- .view-main-slider .view-content {
- padding: 0;
- }
- /* Main slider END */
-
- /* Front page BEGIN */
- .view-dignities .views-row {
- width: 50%;
- }
- /* Front page END */
- }
- @media only screen and (min-width:769px) and (max-width:1024px) {
- /*
- * Important Information about this CSS File
- *
- * - Do not delete or rename this file, if you do not use it leave it blank (delete
- * everything) and the file will be skipped when you enable Production Mode in
- * the Global theme settings.
- *
- * - Read the _README file in this directory, it contains useful help and other information.
- */
-
- /* Common BEGIN */
- #branding,
- .region-inner,
- body.front .view-content,
- body.front .block-title,
- .block-our-amazing-team-block-1 .block-title,
- .view-header,
- .copyright-container,
- .view-main-slider .views-field-nothing,
- #columns,
- #secondary-menu-bar,
- .block-our-mission p {
- padding-left: 25px;
- padding-right: 25px;
- }
- .front .block-title {
- padding-left: 0;
- padding-right: 0;
- }
- /* Common END */
-
- /* Front page BEGIN */
- .view-main-slider {
- height: 250px;
- }
- .view-main-slider .view-content {
- padding: 0;
- }
- .main-slider-text-wrapper {
- padding: 10px 10px 30px 40px;
- width: 67%;
- }
- .main-slider-image {
- width: 33%;
- }
- .view-dignities {
- padding: 50px 0;
- }
- .view-dignities .view-content {
- margin-bottom: 30px;
- }
- .view-secondary-slider .owl-carousel {
- padding-left: 135px;
- padding-right: 135px;
- }
- .view-secondary-slider .views-field-title,
- .view-secondary-slider .views-field-body,
- .view-secondary-slider .views-field-title-1 {
- float: none;
- }
- .view-secondary-slider .views-field-title {
- margin-top: 15px;
- }
- .block-recent-news-block .views-field-field-news-image {
- margin-right: 25px;
- }
- .block-our-mission p {
- width: auto;
- }
- .block-our-amazing-team-block {
- padding-top: 45px;
- padding-bottom: 35px;
- }
- /* Front page END */
-
- /* Main slider END */
- .views-field-field-main-slider-image {
- display: none;
- }
- /* Main slider END */
-
- /* Footer BEGIN */
- .region-tertiary-content .view-content {
- padding: 0;
- }
- .region-tertiary-content .block {
- width: 50%;
- margin-bottom: 55px;
- padding: 0 25px;
- }
- .view-popular-tags .view-content {
- padding: 0;
- }
- /* Footer END */
- }
- @media only screen and (min-width:1025px) {
- /*
- * Important Information about this CSS File
- *
- * - Do not delete or rename this file, if you do not use it leave it blank (delete
- * everything) and the file will be skipped when you enable Production Mode in
- * the Global theme settings.
- *
- * - Read the _README file in this directory, it contains useful help and other information.
- */
-
- /* Header BEGIN */
- /* Navigation */
- #menu.responsive-menu-block {
- display: none;
- }
- #block-superfish-1 {
- float: right;
- margin: 0;
- }
- #superfish-1 li.sf-depth-1 {
- border-left: 1px solid transparent;
- border-right: 1px solid transparent;
- }
- #superfish-1 li.sf-depth-1:hover {
- border-left-color: #e8e8e8;
- border-right-color: #e8e8e8;
- }
- #superfish-1 .sf-depth-1 > a {
- text-transform: uppercase;
- padding: 33px 20px 34px;
- }
- #superfish-1 .sf-depth-1 > a:hover,
- #superfish-1 .sf-depth-1.active-trail > a {
- color: #000;
- }
- #superfish-1 .sf-depth-1 > ul {
- position: absolute;
- padding: 10px 0 !important;
- width: auto !important;
- right: 0 !important;
- background: #fff;
- top: 80px;
- min-width: 190px;
- border-radius: 0;
- -webkit-box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
- -moz-box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
- box-shadow: inset 0px 0px 0px 1px rgba(232,232,232,1);
- }
- #superfish-1 .sf-depth-2 > a {
- padding: 10px 20px;
- }
- #superfish-1 .sf-depth-2 > a:hover {
- background: #000;
- color: #fff;
- }
- .btn-mobile-menu {
- display: none;
- }
- /* Header END */
- }