Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /*
- Theme Name: Mountain(MNTN)
- Version: 1.2
- Theme URI: -
- Description: Responsive One Page theme from Fragrance
- Author: Fragrance
- Author URI: http://themeforest.net/user/Lesya/portfolio
- License: NU General Public License version 3.0
- License URI: -
- */
- /*------------------------------------------------*/
- /*-----------------[RESET]------------------------*/
- /*------------------------------------------------*/
- /* http://meyerweb.com/eric/tools/css/reset/ */
- /* v1.0 | 20080212 */
- html, body, div, span, applet, object, iframe,
- h1, h2, h3, h4, h5, h6, p, blockquote, pre,
- a, abbr, acronym, address, big, cite, code,
- del, dfn, em, font, img, ins, kbd, q, s, samp,
- small, strike, strong, sub, sup, tt, var,
- b, u, i, center,
- dl, dt, dd, ol, ul, li,
- fieldset, form, label, legend { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
- body { line-height: 1;}
- ol, ul { list-style: none; }
- blockquote, q { quotes: none; }
- blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
- .single blockquote{
- font-size: 18px;
- color: #fff;
- background-color: #444;
- border-radius: 3px;
- padding: 20px;
- margin-right: 20px;
- margin-bottom: 20px;
- }
- /* remember to define focus styles! */
- :focus { outline: 0; }
- /* remember to highlight inserts somehow! */
- ins { text-decoration: none; }
- del { text-decoration: line-through; }
- /* tables still need 'cellspacing="0"' in the markup */
- table { border-collapse: collapse; border-spacing: 0; display: block; padding: 5px 20px; margin-bottom: 20px; }
- td, th, thead, tbody { border: 1px solid #ededed; padding: 5px 10px;}
- th a{ color: #8F8F8F; }
- article, aside, footer, header, hgroup, nav, section { display: block; }
- @font-face {
- font-family: 'brandon';
- src: url('css/fonts/brandon/brandon_med-webfont.eot');
- src: url('css/fonts/brandon/brandon_med-webfont.eot?#iefix') format('embedded-opentype'),
- url('css/fonts/brandon/brandon_med-webfont.woff') format('woff'),
- url('css/fonts/brandon/brandon_med-webfont.ttf') format('truetype'),
- url('css/fonts/brandon/brandon_med-webfont.svg#brandon_grotesquemedium') format('svg');
- font-weight: normal;
- font-style: normal;
- }
- /*****************************************/
- /************* BASIC STYLES **************/
- /*****************************************/
- body {
- line-height: 21px;
- font-family: "Muli", "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
- font-weight: 500;
- font-size: 12px;
- color: #444;
- background-color: #fff;
- text-rendering: optimizelegibility;
- }
- p{ font-family: "Muli", Arial, sans-serif; }
- a, #reply-title a {
- text-decoration: none;
- color: #fff;
- }
- .post-edit-link{
- color: #444;
- margin-top: 20px;
- }
- a:hover {
- text-decoration:none;
- color: #777;
- transition: all 0.3s ease;
- }
- .clear { clear: both; }
- .ui-tabs-hide { display: none; }
- br.clear {
- margin: 0px;
- padding: 0px;
- }
- h1, h2, h3, h4, h5, h6 {
- padding-bottom: 2px;
- color: #3e3e3e;
- line-height: 1em;
- font-weight: normal;
- font-family: "brandon", Arial, sans-serif;
- }
- h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #656464; font-family: brandon; }
- h1 { font-size: 30px; }
- h2 { font-size: 24px; }
- h3 { font-size: 22px; }
- h4 { font-size: 18px; }
- h5 { font-size: 16px; }
- h6 { font-size: 14px; }
- p {
- padding-bottom: 7px;
- line-height: 1.5;
- }
- strong {
- font-weight: bold;
- }
- cite, em, i {font-style: italic; }
- pre, code {
- background-color: #f5f5f5;
- border: 1px solid #ddd;
- border-radius: 5px;
- font-family: Courier New, monospace;
- margin-bottom: 10px;
- }
- ins { text-decoration: none; }
- sup, sub {
- height: 0;
- line-height: 1;
- position: relative;
- vertical-align: baseline;
- }
- sup { bottom: 0.8em; }
- sub { top: 0.3em; }
- dl { margin: 0 0 1.5em 0; }
- dl dt { font-weight: bold; }
- dd { margin-left: 1.5em;}
- hr{
- color: #ccc;
- background-color:#ccc;
- border:0px none;
- height:1px;
- clear:both;
- }
- input[type=text],input[type=FR_EMAIL],input.text, input.title, textarea, select {
- background-color: #F5F5F5;
- border: 1px solid #ddd;
- padding: 2px;
- color: #777;
- font-family: 'Muli', Arial, sans-serif;
- font-size: 14px;
- }
- input[type=text]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus {
- border-color:#2D3940;
- color: #777;
- }
- input[type=text], input.text, input.title, textarea, select { margin:0.5em 0; }
- textarea { padding: 4px; }
- img#about-image {
- float: left;
- margin: 3px 8px 8px 0px;
- }
- .gallery-caption, .bypostauthor{ font-family: inherit;}
- .clearfix:after {
- visibility: hidden;
- display: block;
- font-size: 0;
- content: " ";
- clear: both;
- height: 0;
- }
- .sticky .post-content{
- padding-top: 20px;
- }
- /*------------------------------------------------*/
- /*------------[CAPTIONS AND ALIGNMENTS]-----------*/
- /*------------------------------------------------*/
- div.post .new-post .aligncenter, .aligncenter { display: block; margin-left: auto; margin-right: auto; }
- .wp-caption { text-align: center; background-color: #f3f3f3; margin-bottom: 10px; max-width: 100% !important; }
- .wp-caption.alignleft { margin: 0px 10px 10px 0px; }
- .wp-caption.alignright { margin: 0px 0px 10px 10px; }
- .wp-caption img { margin: 0; padding: 0; border: 0 none; }
- .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }
- .alignright { float: right; }
- .alignleft { float: left }
- img.alignleft { display:inline; float:left; margin-right:15px;}
- img.alignright { display:inline; float:right; margin-left:15px; }
- /*****************************************/
- /************ MAIN LAYOUT INFO ***********/
- /*****************************************/
- #container {
- text-align: left;
- position: relative;
- }
- .sizers{
- width: 960px;
- height: 100%;
- margin: 0 auto;
- position: relative;
- }
- .section_head { margin-bottom: 50px; }
- /*****************************************/
- /************** BASIC STYLE **************/
- /*****************************************/
- .one_half, .one_third, .two_third, .one_fourth , .three_fourth {
- float:left;
- margin-right:4%;
- position:relative;
- }
- .last { margin-right: 0px !important; clear:right; }
- /*****************************************/
- /***************** HEADER ****************/
- /*****************************************/
- #main_header{
- background-color: #5d5d5d;
- background-size: cover;
- background-image: url(images/slider.jpg);
- background-attachment: fixed;
- background-position: 0 95%;
- position: relative;
- height: 100%;
- z-index: 100;
- }
- #logo {
- position: absolute;
- top: -3px;
- left: 0;
- display: none;
- }
- #logo_wrapper{
- padding-top: 20%;
- }
- #logo_wrapper h1 a{
- font-size: 65px;
- text-shadow: 1px 1px 0 #888888;
- text-transform: uppercase;
- line-height: 1.3;
- color: #fff;
- }
- #logo_wrapper p{
- color: #FFFFFF;
- display: inline-block;
- font-size: 25px;
- font-weight: 300;
- padding: 20px 0;
- }
- #logo_wrapper #purchase{
- font-family: Lato;
- font-size: 15px;
- border: 1px solid #fff;
- border-radius: 3px;
- padding: 15px 20px;
- margin-top: 10px;
- display: inline-block;
- transition: all ease 0.3s;
- background-color: rgba(255,255,255,0.1);
- text-transform: uppercase;
- }
- #logo_wrapper #purchase:hover{
- background-color: rgba(255,255,255,0.4);
- color: #fff;
- }
- .small_header {
- position: fixed !important;
- z-index: 100;
- background-color: rgba(255, 255, 255, 0.9);
- height: 40px;
- margin: 0 !important;
- float: none !important;
- transition: all ease 0.5s;
- padding: 15px 0 10px;
- }
- .small_header .nav a{
- color: #555 !important;
- font-size: 11px !important;
- height: 28px !important;
- line-height: 2.5 !important;
- }
- .small_header .nav a:hover{ border-color: #555; }
- .small_header #logo{ display: block !important;}
- .small_header #social{ margin-top: 18px; }
- .small_header .submenu{ top: 30px; }
- /*****************************************/
- /***************** MENU ******************/
- /*****************************************/
- #menu {
- font-size: 20px;
- margin-top: 30px;
- box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
- font-family: "Muli", "Lato", "Helvetica Neue",Helvetica,Arial,sans-serif;
- float: right;
- position: absolute;
- width: 100%;
- }
- #menu #main-menu {
- height: 60px;
- width: 960px;
- margin: 0 auto;
- position: relative;
- z-index: 999;
- }
- .small_header #main-menu{ top: 4px; }
- #menu #main-menu ul{
- float: right;
- visibility: visible !important;
- }
- #menu .nav li {
- float:left;
- border-right: none;
- }
- #menu .nav a {
- font-size: 13px;
- font-family: brandon;
- text-transform: uppercase;
- color: #fff;
- text-decoration: none;
- display: block;
- line-height: 2.5;
- padding: 0 12px;
- overflow: hidden;
- font-weight: 300;
- border-radius: 3px;
- -webkit-transition: background-color 0.2s ease-in;
- -moz-transition: background-color 0.2s ease-in;
- transition: all 0.2s ease-in;
- }
- #menu .nav a:hover{
- background-color: #444;
- color: #fff !important;
- }
- #menu .nav li{
- background-position: right center;
- background-repeat: no-repeat;
- margin-right: 10px;
- }
- #menu .nav li:last-child { background-image: none; }
- #menu .nav a > span { padding: 12px 12px 12px; }
- #menu .nav ul li a > span { padding: 0; }
- #menu ul.nav ul, ul#mobile_menu {
- background: #444;
- -webkit-box-shadow: 3px 3px 0px rgba(0,0,0,0.4);
- -moz-box-shadow: 3px 3px 0px rgba(0,0,0,0.4);
- box-shadow: 1px 1px 0px rgba(0,0,0,0.4);
- border-radius: 0 0 3px 3px;
- }
- #menu .nav ul li { border: none; }
- #menu .nav ul a, ul#mobile_menu a {
- padding: 14px 5px 14px 25px;
- height: auto;
- overflow: visible;
- width: 195px;
- }
- #menu .nav ul a:hover, ul#mobile_menu a:hover {
- background: #fff;
- color: #555;
- text-decoration: none;
- }
- ul#mobile_menu a {
- display: block;
- padding-left: 5px;
- padding-right: 5px;
- width: auto;
- }
- .sfHover{
- background-color: #444;
- border-radius: 3px 3px 0 0;
- }
- .nav li ul {
- width: 225px;
- z-index: 1000;
- position: absolute;
- }
- #menu ul.nav ul a{
- line-height: 1.3;
- border-radius: 0;
- }
- #menu ul.nav ul li a:hover{ color: #444 !important; }
- /*li>.sub-menu:hover .sub-menu{ float: left; display:block !important; }*/
- .sfHover > ul{
- transition: all o.3s ease;
- display:block !important;
- }
- .sub-menu .sub-menu{
- opacity: 1;
- position: absolute;
- left: 225px;
- top: 44px;
- }
- .small_header .sub-menu li a, .small_header .sfHover a{ color: #fff !important; }
- #mobile_nav { display: none; }
- ul#mobile_menu {
- width: 225px;
- position: absolute;
- top: 40px;
- left: -43px;
- z-index: 1000;
- display: none;
- }
- #mobile_nav.opened {
- background: #fff;
- color: #444;
- }
- /*****************************************/
- /***************** LAYOUT ****************/
- /*****************************************/
- h3.section_name{
- font-size: 48px;
- font-weight: 300;
- position: relative;
- }
- h3.section_name:after{
- content: "";
- position: absolute;
- bottom: -20px;
- left: 47%;
- width: 60px;
- height: 2px;
- background-color: #555;
- }
- #content {
- margin: 0 auto;
- width: inherit;
- z-index: 1000;
- }
- #content div{
- position: relative;
- }
- /*****************************************/
- /***************** SERVICE ***************/
- /*****************************************/
- #services {
- padding: 100px 0 80px;
- position: relative;
- }
- .section_name{
- text-transform: uppercase;
- margin-bottom: 100px;
- text-align: center;
- font-size: 48px;
- }
- .servise_items{
- width: inherit;
- float: left;
- }
- .service {
- width: 280px;
- height: 300px;
- margin-right: 40px;
- margin-bottom: 80px;
- float:left;
- position:relative;
- letter-spacing: 0.1px;
- }
- .service img.icon{
- margin: 0 auto 40px;
- display: block;
- }
- .last{
- margin-right: 0px !important;
- clear: right;
- }
- .service h3 {
- text-transform: uppercase;
- margin-bottom: 40px;
- text-align: center;
- }
- .service h3 a{
- color: #3E3E3E;
- }
- .service h3 i{
- color: #d43b3b;
- }
- .service p {
- font-size: 15px;
- line-height: 1.5;
- text-align: center;
- }
- .service span{
- width: 21px;
- height: 26px;
- position: absolute;
- top: 0;
- left: -38px;
- }
- .service h3 a, .service span{
- font-size: 21px;
- font-weight: bold;
- }
- /*****************************************/
- /**************** FUN FUCTS **************/
- /*****************************************/
- .fixed_block{
- position: relative;
- width: 100%;
- padding: 60px 0 120px;
- background: url(images/fucts_bg.jpg) no-repeat fixed;
- background-size: cover;
- }
- .fun_fucts h3, .fun_fucts h6{ color: #fff; }
- .fun_fucts h3.section_name{
- text-align: center;
- text-transform: uppercase;
- padding: 50px 0 70px;
- font-size: 30px;
- margin-bottom: 0;
- }
- .fun_fucts h3.section_name:after{
- background-color: transparent;
- }
- .fixed_block .four.columns{
- width: 220px;
- float: left;
- margin-left: 10px;
- margin-right: 10px;
- text-align: center;
- text-transform: uppercase;
- color: #fff;
- }
- .fucts_counter i{
- display: block;
- }
- .fucts_count{
- font-size: 70px;
- color: #fff;
- letter-spacing: -0.02em;
- line-height: 1.2;
- margin-bottom: 20px;
- padding: 0;
- position: relative;
- }
- h6.fucts_name{
- font-size: 18px;
- }
- /*****************************************/
- /**************** PORTFOLIO **************/
- /*****************************************/
- #recent-work {
- width: 100%;
- position: relative;
- background-color: #fff;
- padding: 100px 0 80px;
- }
- #recent-work h3.section_name{
- color: #F5F5F5;
- text-transform: uppercase;
- text-align: center;
- }
- #recent-work h3.section_name:after{ background-color: #F5F5F5; }
- #recent-work .thumb{
- float:left;
- line-height:0;
- position: relative;
- }
- #recent-work .thumb .portfolio_overlay{ display: block; }
- #recent-work .last { margin-right:0; }
- #about h3 span{ padding-left: 10px; }
- #recent-work a.readmore{
- position: static;
- height: auto;
- width: auto;
- border: 2px solid #fff;
- border-radius: 5px;
- margin-right: 0;
- font-weight: 500;
- transition: all 0.3s ease;
- }
- #recent-work a.readmore:hover{
- border: 2px solid #bbb;
- color: #bbb !important;
- }
- /*** Carousel ***/
- #fr_clients_carousel{
- position: relative;
- }
- #fr_clients_carousel ul{
- padding: 0;
- }
- #fr_clients_carousel li{
- width: 200px;
- height: auto;
- float: left;
- list-style: none;
- }
- #fr_clients_carousel li img{ width: 200px; }
- .recent_work_item{
- width: 25%;
- height: auto;
- text-align: center;
- position: relative;
- float: left;
- }
- .recent_work_item p, .recent_work_item a{
- color: #ccc;
- display: block;
- position: relative;
- }
- .recent_work_item img{
- max-width: 100%;
- }
- .recent_work_item img{
- /* filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); */
- filter: gray;
- -webkit-filter: grayscale(100%);
- -webkit-transition: all .6s ease;
- -webkit-backface-visibility: hidden;
- }
- .recent_work_item img:hover {
- filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
- -webkit-filter: grayscale(0%);
- filter: none;
- }
- .item_description{
- position: absolute;
- z-index: 2;
- background-color: #3b393b;
- width: 100%;
- }
- .caroufredsel_wrapper{
- width: 100% !important;
- }
- .portfolio_overlay{
- /*background-color: rgba(52, 73, 94, 0.5);*/
- background-color: rgba(0, 0, 0, 0.5);
- background-image: none;
- background-position: 50% 50%;
- filter:alpha(opacity=40);
- height: 100%;
- left: 0;
- top: 0;
- position: absolute;
- width: 100%;
- display: block;
- transition: all 0.5s ease;
- }
- .portfolio_overlay:hover{ background-color:transparent; }
- /*****************************************/
- /***************** QUOTE *****************/
- /*****************************************/
- #fr_converse{
- padding: 40px 0;
- font-size: 30px;
- text-transform: uppercase;
- position: relative;
- }
- #fr_converse:before{
- content: "";
- position: absolute;
- height: 10px;
- border: 15px solid;
- border-color: transparent transparent #fff transparent;
- top: -40px;
- left: 50%;
- }
- #fr_converse p{
- text-align: right;
- padding-right: 20px;
- }
- #fr_converse .one_third { width: auto !important; }
- .fr_simple_btn, .more-link, #commentform input#submit{
- padding: 10px 20px;
- background-color: #444;
- color: #fff;
- font-size: 13px;
- line-height: 3.5;
- border-radius: 3px;
- font-weight: bold;
- text-transform: uppercase
- }
- .fr_simple_btn:hover, .more-link:hover{
- background-color: #777;
- color: #fff;
- }
- .fr_converse_gray{
- background-color: #F5F5F5;
- font-size: 20px !important;
- text-align: center;
- letter-spacing: 0.3px;
- }
- .fr_converse_gray:before{
- border-color: #fff #fff #F5F5F5 #fff !important;
- background-color: #fff;
- }
- /*****************************************/
- /***************** QUOTE *****************/
- /*****************************************/
- .quote{
- background-image: url(images/quote_bg2.jpg) !important;
- background-color: #409996;
- text-align:center;
- font-size: 33px;
- font-family: Brandon, sans-serif;
- color: #fff;
- padding: 80px 0;
- background-size: cover;
- height: auto;
- font-weight: 300;
- text-transform: uppercase;
- }
- .quote blockquote{
- line-height: 1.5;
- text-align: center;
- padding: 40px 100px;
- }
- .quote p.author{
- color: #F3F3F3;
- font-family: Muli, sans-serif;
- font-size: 25px;
- font-weight: 300;
- }
- /*****************************************/
- /***************** BLOG ******************/
- /*****************************************/
- .fr_cols{
- overflow:hidden;
- _zoom:1;/*
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement