Olusesan Ameye
376 lines
7.1 KiB
CSS
Vendored
376 lines
7.1 KiB
CSS
Vendored
/* ==========================================================================
|
|
01. Responsive Options
|
|
========================================================================== */
|
|
|
|
|
|
/* Responsive Boxed Version
|
|
body{ padding-top: 0; }
|
|
.outter-wrapper{ max-width: 1440px; width: auto;}
|
|
.wrapper { max-width: 1140px; width: auto;}
|
|
.feature hr{ opacity: .4; }
|
|
*/
|
|
|
|
|
|
|
|
/* Responsive Full Width Version */
|
|
body{ padding: 0em; }
|
|
.outter-wrapper{ max-width: 100%; width: 100%;}
|
|
.wrapper { max-width: 1140px; width: auto;}
|
|
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
02. Responsive Colors
|
|
========================================================================== */
|
|
|
|
/* Responsive Nav - Dark Grey */
|
|
@media only screen and (max-width: 768px) {
|
|
#nav, #menu-icon.active{
|
|
background: #282D36;
|
|
}
|
|
.widget-footer .widget{
|
|
border-color: #454c58;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
03. Media Queries 768
|
|
========================================================================== */
|
|
@media only screen and (max-width: 768px) {
|
|
body{
|
|
padding: 0;
|
|
}
|
|
.logo{
|
|
padding-bottom: 1em;
|
|
padding-top: .6em;
|
|
}
|
|
#nav{
|
|
display: none;
|
|
}
|
|
#nav-wrap {
|
|
position: relative;
|
|
padding-bottom: .4em;
|
|
}
|
|
#nav li.nav-parent{
|
|
padding-bottom: 0;
|
|
}
|
|
#menu-icon {
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
padding: 10px;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
#menu-icon.active{
|
|
-webkit-border-radius: 3px 3px 0px 0px;
|
|
border-radius: 3px 3px 0px 0px;
|
|
}
|
|
nav #nav{
|
|
margin-top: 0;
|
|
}
|
|
#nav {
|
|
clear: both;
|
|
position: absolute;
|
|
top: 45px;
|
|
min-width: 160px;
|
|
z-index: 10000;
|
|
padding: 5px;
|
|
display: none;
|
|
right: 0px;
|
|
-webkit-border-radius: 3px 0px 3px 3px;
|
|
border-radius: 3px 0px 3px 3px;
|
|
}
|
|
#nav li {
|
|
clear: both;
|
|
float: none;
|
|
}
|
|
#nav a, #nav ul a {
|
|
background: none;
|
|
display: inline;
|
|
padding: 0;
|
|
border: none;
|
|
}
|
|
#nav ul {
|
|
width: auto;
|
|
position: static;
|
|
display: block;
|
|
border: none;
|
|
background: inherit;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
#nav ul li a{
|
|
padding-left: 0;
|
|
}
|
|
#nav li{
|
|
padding: .2em 0!important;
|
|
}
|
|
#nav ul{
|
|
padding: 0!important;
|
|
}
|
|
#nav li > ul li{
|
|
padding-left: 12px!important;
|
|
}
|
|
#nav li > ul li:last-child{
|
|
padding-bottom: 0!important;
|
|
}
|
|
#nav li:hover ul ul{
|
|
display: block!important;
|
|
position: relative;
|
|
left: 0;
|
|
background: transparent;
|
|
}
|
|
#nav li:hover ul ul:before{
|
|
display: none;
|
|
}
|
|
.donate, #nav .donate a:hover{
|
|
background: transparent;
|
|
}
|
|
#masthead{
|
|
display: block;
|
|
height: 100%;
|
|
}
|
|
.header-container header{
|
|
padding: 10px 0 5px;
|
|
}
|
|
.main-content, .right-aside{
|
|
width: 100%;
|
|
float: none;
|
|
border: none;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.main-container{
|
|
padding: 1px 0 30px;
|
|
}
|
|
.right-aside{
|
|
border-top: 1px solid #cad2d7;
|
|
margin-top: 25px;
|
|
}
|
|
.third, .half, .fourth, .two-thirds, ol.icon-lists li, ul.flag-lists li, .three-fourths, .foot.left, .foot.right, input.half, input.full, .fifth, .two-fifths,
|
|
.three-fifths, .four-fifths{
|
|
width: 100%;
|
|
margin-right: 0%;
|
|
float: none;
|
|
}
|
|
.third, .half, .fourths, .two-third, .three-fourths{
|
|
margin-bottom: 30px;
|
|
}
|
|
.right-aside .half, .widget-footer .half, .clearfix.gallery .half, .clearfix.gallery .fourth{
|
|
width: 49%;
|
|
margin-right: 2%;
|
|
float: left;
|
|
}
|
|
.last-fold{
|
|
margin-right: 0!important;
|
|
}
|
|
blockquote.third, blockquote.half, blockquote.fourths, blockquote.two-third{
|
|
width: 100%;
|
|
}
|
|
blockquote, blockquote.right, blockquote.left{
|
|
margin: 0;
|
|
}
|
|
ul.archive li{
|
|
min-width: 28%;
|
|
}
|
|
.foot.left, .foot.right{
|
|
display: block;
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
ul.social-link li{
|
|
border: none;
|
|
}
|
|
|
|
h6.tags.right, h6.date.left{
|
|
float: none!important;
|
|
}
|
|
ul.sitemap{
|
|
display: inline;
|
|
width: 100%;
|
|
}
|
|
ul.sitemap li{
|
|
display: block;
|
|
padding-left: 0;
|
|
padding: 1px;
|
|
}
|
|
.widget-footer .widget{
|
|
margin-bottom: 30px;
|
|
padding-bottom: 30px;
|
|
border-bottom-style: solid;
|
|
border-bottom-width: 1px;
|
|
border-right: none;
|
|
}
|
|
.widget-footer .widget.last{
|
|
border: none;
|
|
margin-bottom: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
.price-feature{
|
|
top: 0;
|
|
}
|
|
.icon-thirds li{
|
|
width: 48%;
|
|
}
|
|
.tab-nav {display: none;}
|
|
h3.v_nav {
|
|
height:45px;
|
|
line-height:45px;
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align:center;
|
|
margin-top: 1px;
|
|
display: block;
|
|
cursor: pointer;
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
-khtml-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
border-bottom-style: solid;
|
|
border-bottom-width: 1px;
|
|
}
|
|
.tab-content-block {
|
|
clear:both;
|
|
position:relative;
|
|
width: 100%;
|
|
background: #fff;
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
}
|
|
h3.v_nav:first-child {
|
|
margin-top: 0;
|
|
}
|
|
h3.v_active {
|
|
background: #FBFBFB;
|
|
z-index:50;
|
|
}
|
|
hr{
|
|
margin: 1.75em 0;
|
|
}
|
|
ul.timeline{
|
|
width: 98%;
|
|
padding-left: 2%;
|
|
}
|
|
ul.timeline > li{
|
|
width: 100%;
|
|
float: none!important;
|
|
}
|
|
.vert-line{
|
|
left: 1px;
|
|
}
|
|
ul.timeline > li:nth-child(2n+1):before{
|
|
border-color:#fff #e2e2e2 #fff #fff!important;
|
|
left: -14px;
|
|
right: 100%;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
04. Media Queries 600
|
|
========================================================================== */
|
|
@media only screen and (max-width: 600px) {
|
|
|
|
.backstretch{
|
|
opacity: 0.2;
|
|
}
|
|
.cta.two-third{
|
|
width: 100%;
|
|
margin-right: 0%;
|
|
float: none;
|
|
}
|
|
.main table{
|
|
border-left: 1px solid #cad2d7;
|
|
border-right: 1px solid #cad2d7;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
.feature-heading{
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
05. Media Queries 480
|
|
========================================================================== */
|
|
@media only screen and (max-width: 480px) {
|
|
|
|
input[type=text], input[type=email], input[type=password], textarea, a.btn, input[type=button], input[type=submit]{
|
|
padding: 10px 2%;
|
|
width: 96%;
|
|
}
|
|
a.btn, input[type=button]{
|
|
text-align: center;
|
|
}
|
|
a.small-btn{
|
|
font-size: 14px;
|
|
padding: .4em 2%;
|
|
}
|
|
a.xsmall-btn{
|
|
font-size: 12px;
|
|
padding: .2em 2%;
|
|
}
|
|
iframe{
|
|
max-height: 320px;
|
|
}
|
|
#menu-icon{
|
|
display: block!important;
|
|
padding-left: 3%!important;
|
|
padding-right: 3%!important;
|
|
width: 94%!important;
|
|
}
|
|
.header-container header{
|
|
text-align: center;
|
|
}
|
|
.logo{
|
|
float: none;
|
|
}
|
|
.header-container nav{
|
|
float: none;
|
|
|
|
}
|
|
#nav{
|
|
padding-left: 3%!important;
|
|
padding-right: 3%!important;
|
|
width: 94%!important;
|
|
left: 0;
|
|
}
|
|
.hide-480{
|
|
display: none;
|
|
}
|
|
.thumb-gallery .third{
|
|
width: 100%;
|
|
}
|
|
.icon-thirds li{
|
|
width: 100%;
|
|
float: none;
|
|
}
|
|
ul.timeline > li:before, .vert-line{
|
|
display: none;
|
|
}
|
|
ul.timeline{
|
|
width: 100%;
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
06. Media Queries 1140
|
|
========================================================================== */
|
|
@media only screen and (max-width: 1140px) {
|
|
.wrapper { width: 100%; }
|
|
} |