PHP Classes

File: public/assets/css/site/index.site.css

Recommend this page to a friend!
  Classes of harold rita   Coloftech PHP Multiple Sites Blog System   public/assets/css/site/index.site.css   Download  
File: public/assets/css/site/index.site.css
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: Coloftech PHP Multiple Sites Blog System
CMS to Manage multiple blog sites
Author: By
Last change:
Date: 2 years ago
Size: 16,483 bytes
 

Contents

Class file image Download
html,body,header,footer{ padding: 0; margin: 0; font-size: 12px; color: #000; background-color: #fff; min-width: 300px; } html, body { overflow-x: hidden; /* Prevent scroll on narrow devices */ } body { padding-top: 100px; } img{width: 100%;} /* * Custom styles */ nav#header{ background-color: #094dfa; min-width: 300px; } #navbar{ text-align: right; float: right; } #navbar .home{ font-size: 34px; } .navbar-brand { font-size: 24px; color: #000; padding: 0px; } .navbar-brand > .logo{ padding: 5px; border-radius: 0 0 50% 50%; background-color: #094dfa; } .navbar-brand > .title{ font-size: 28px; padding-top: 20px; padding-left: 20px; color: #fff; } .navbar-brand > .title > .subtitle{ font-size: 13px; } .navbar-brand.fixed-theme > .logo{ background-color: #0d42cb; padding: 5px; margin-top: 0px; border-radius: 0 0 50% 50%; } .navbar-brand > .title{ font-size: 28px; padding-top: 20px; padding-left: 20px; color: #fff; } .fixed-theme .title{ font-size: 24px; padding-top: 5px; padding-left: 20px; color: #fff; } .navbar-brand img{ max-width: 80px; max-height: 80px; } .navbar-brand.fixed-theme img{ max-width: 70px; max-height: 70px; } .navbar-container { padding: 20px 0 20px 0; } .navbar.navbar-fixed-top.fixed-theme { background-color: #222; border-color: #080808; box-shadow: 0 0 5px rgba(0,0,0,.8); } .navbar-brand.fixed-theme { font-size: 18px; color: #fff; } .navbar #navbar > ul li a{ font-size: 16px; color: #fff; } .navbar #navbar > ul > li > ul.dropdown-menu a { font-size: 14px; color: #000; } .navbar #navbar > ul li a:hover{ font-size: 16px; color: #000; } .navbar.navbar-fixed-top.fixed-theme #navbar > ul li a{ font-size: 14px; color: #fff; } .navbar.navbar-fixed-top.fixed-theme #navbar > ul li a:hover{ font-size: 14px; color: #000; } .navbar.navbar-fixed-top.fixed-theme #navbar > ul > li > ul.dropdown-menu a { font-size: 14px; color: #000; } .navbar-container.fixed-theme { padding: 0; text-align: left; } .navbar-container.fixed-theme .navbar-header button .icon-bar{ background-color: #fff; } .navbar-brand.fixed-theme, .navbar-container.fixed-theme, .navbar.navbar-fixed-top.fixed-theme, .navbar-brand, .navbar-container{ transition: 0.8s; -webkit-transition: 0.8s; } /* ------------------------------------- */ .site > .site-body > .site-wrapper > .site-container{ min-height: 300px; padding: 0; } .site > .site-body > .site-wrapper > .site-container label{ color: #000; } .site .subsite-name{ text-transform: uppercase; color: #0d42cb; } .site > .site-body > .site-wrapper > .site-container > .post-index{ margin: 0; padding:0; margin-top: 50px; background-color: #fff; padding-top: 10px; } .post{ height: 300px; background-color: #fff; display: block; margin-bottom: 50px; overflow: hidden; } .post > .post-featured-img{ height: 250px !important; display: block; cursor: pointer; overflow: hidden; background-color: #fff; margin-left: -15px; } .post > .post-featured-img > .blured > a > img{ width: 100%; height: 100%; overflow: hidden; } .post > .post-featured-img > .blured > a > img:hover{ -moz-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); z-index: -9; } .post > .post-featured-img > .blured{ height: 250px !important; width: 100%; display: block; background-color:rgba(0,0,0,0.5); position: absolute; } .post > .post-featured-img > .blured{ } .post > .post-featured-img > .year{ position: absolute; background-color: #12387e; display: block; width: 50px; z-index: 999; padding: 10px; margin-bottom: 40px; text-align: center; color: #fff; font-size: 14px; } .post > .post-featured-img > .month{ position: absolute; background-color: #1d6ea2; display: block; width: 50px; z-index: 999; padding: 10px; margin-top: 35px; text-align: center; color: #fff; font-size: 14px; } .post > .post-featured-img > .day{ position: absolute; background-color: #1d6ea2; display: block; width: 50px; z-index: 999; padding: 4px; margin-top: 65px; text-align: center; color: #fff; font-size: 12px; } .post > .post-content >.post-title > a{ text-decoration: none; color: #000; } .post > .post-content >.post-title > a:hover{ text-decoration: none; color: #1d6ea2; } .post > .post-content >.post-title > a > h4{ font-size: 20px; text-transform: uppercase; } .post > .post-content >.post-title > a > h4::first-letter{ font-size: 25px; } .post > .post-content > .post-content-desc{ max-height: 150px; display: block; overflow: hidden; } .post > .post-content > .post-content-desc::first-letter{ font-size: 18px; } .post > .post-content > .post-options{ display: block; padding: 5px 0; } .post > .post-content > .post-options > .posted-by{ display: inline-block; padding: 5px 0; } .post > .post-content > .post-options > .post-category{ display: inline-block; margin-left: 15px; color: #1d6ea2; } .post > .post-content > .post-options > .post-details{ display: block; padding: 5px 0; } .post > .post-content > .post-options > .post-details .btn{ border-radius: 0; } .tiles { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .tile { position: relative; float: left; width: 100%; height: 100%; overflow: hidden; } .photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; transition: transform .5s ease-out; } .txt { position: absolute; z-index: 2; right: 0; bottom: 10%; left: 0; font-family: 'Roboto Slab', serif; font-size: 9px; line-height: 12px; text-align: center; cursor: default; } .x { font-size: 32px; line-height: 32px; } .post-read > .post-featured-img{ display: block; cursor: pointer; overflow: hidden; background-color: #fff; } .post-read > .post-featured-img > a > img{ width: 100%; height: 100%; } .post-read > .post-content{ line-height: 20px; font-size: 13px; color: #555; padding: 0; } .post-read > .post-content > .post-content-desc{ line-height: 20px; padding: 0; } .post-read > .post-content > .post-title > h3{ text-transform: uppercase; font-size: 24px; margin: 25px 0; } .post-read > .post-content > .post-options{ font-size: 8px; margin: 50px 0; display: block; padding: 15px 0; border:1px solid #e5e5e5; border-left: none; border-right: none; text-transform: uppercase; padding: 0; } .post-read > .post-content .post-gallery{ margin-top: 50px; padding: 0; display: block; } .side-bar .panel-search i.fa.fa-search{ display: inline-block; position: absolute; float: right; right: 40px; padding-top: 10px; font-size: 15px; } .side-bar .panel-search input#search{ display: inline-block; padding-right: 30px; border-radius: 0; } .side-bar .panel{ border-radius: 0; } .side-bar .panel > .panel-heading{ padding: 5px; margin:0; background-color: #094dfa; color: #fff; } .side-bar .panel h1, .side-bar .panel h2, .side-bar .panel h3, .side-bar .panel h4{ padding: 0; margin: 0; } .side-bar .panel ul{ text-decoration: none; list-style: none; margin: 0; padding: 0; line-height: 20px; } .side-bar .panel ul > li > a{ text-transform: uppercase; text-decoration: none; } .side-bar .panel ul > li > a:hover{ color: #0000ff; } .side-bar .panel ul > li{ margin-bottom: 10px; } #gallery_img { border-radius: 5px; cursor: pointer; transition: 0.3s; } #gallery_img:hover {opacity: 0.7;} /* The Modal (background) */ .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 9999; /* Sit on top */ padding-top: 100px; /* Location of the box */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.9); /* Black w/ opacity */ } /* Modal Content (Image) */ .modal-content { margin: auto; display: block; width: 80%; max-width: 700px; } /* Caption of Modal Image (Image Text) - Same Width as the Image */ #caption { margin: auto; display: block; width: 80%; max-width: 700px; text-align: center; color: #ccc; padding: 10px 0; height: 150px; } /* Add Animation - Zoom in the Modal */ .modal-content, #caption { animation-name: zoom; animation-duration: 0.6s; } @keyframes zoom { from {transform:scale(0)} to {transform:scale(1)} } /* The Close Button */ .close { position: absolute; top: 15px; right: 35px; color: #f1f1f1; font-size: 40px; font-weight: bold; transition: 0.3s; } .close:hover, .close:focus { color: #bbb; text-decoration: none; cursor: pointer; } /* 100% Image Width on Smaller Screens */ @media only screen and (max-width: 700px){ .modal-content { width: 100%; } } footer{ padding: 30px 0; background-color: #12387e; color: #fff; } footer > .container > .footer-top{ } footer > .container > .footer-top .menu-campuses-menu li{ text-decoration: none; list-style: none; font-size: 16px; color: #fff; } footer > .container > .footer-top a:link,footer > .container > .footer-top a:active,footer > .container > .footer-top a:hover{ text-decoration: none; list-style: none; font-size: 16px; color: #fff; } footer > .container > .footer-center{ } footer > .container > .footer-center > .btn{ } footer > .container > .footer-center > .btn:hover{ color: #555; background-color: #fff; } footer > .container > .footer-bottom{ } /* ------------------------------------- */ /**************start of carousel******************/ .skyblue-vw{ background-size:100% 100%; background-repeat:no-repeat; position:relative;display:block; text-align:left; background-color: rgba(254,254,254,0.8); } .skyblue-vh{ background-size:100% 100%; background-repeat:no-repeat; position:relative; display:block;text-align:left; background-color: rgba(254,254,254,0.8); } .skyblue-vw > img, .skyblue-vh > img{ height: 100vh; height: 500px !important; width: 100%; } .carousel-indicators { bottom: 0; } .carousel-control.right, .carousel-control.left { background-image: none; display: none; } .carousel-control.left{ left: 0px; font-size: 12px; } .carousel-control.right{ right: 0px; font-size: 12px; } /* #carousel:hover .carousel-control{ display: inline-block; max-width: 50px; background: rgba(0,0,0,.5); } */ .carousel-caption{ width: 50%; text-align: left; margin-left: -100px; padding: 10px; top: 10px; z-index: 999; } .carousel-caption h1, .carousel-caption h2, .carousel-caption h3, .carousel-caption h4{ font-size: 20px; } .carousel-caption .caption-title-top{ font-size: 25px; background: rgba(0,0,0,.8); max-width:400px; padding: 10px; font-weight: bold; } .carousel-caption .caption-title-top > .campus{ font-size: 53px; font-weight: bold; } .carousel-caption .caption-title-top:hover{ background: #222; max-width:400px; } .carousel-caption p{ font-size: 14px; width: 100%; height: 100%; max-height: 165px; max-width: 50%; overflow: hidden; text-overflow: ellipsis; padding: 5px; } .carousel p:hover{ background: rgba(0,0,0,.5); border-radius: 10px; } } .carousel button:hover, .carousel a:hover{ cursor: pointer; } /* .carousel-caption h3, .carousel .icon-container{ background-color: rgba(250,250,250,.5); border-radius: 5px; padding: 10px; font-size: 20px; color: green; text-align: left; } .carousel-caption h3:hover, .carousel-caption .icon-container:hover{ background-color: rgba(0,0,0,.7); color: #fff; } */ .carousel-caption button { background-color: rgba(250,250,250,.5); color: green; border: none; padding: 5px 10px; font-size: 16px; } .carousel .icon-container{ background-color: rgba(254,254,254,.4); } .carousel .icon-container > img{ width: 100%; min-width: 100px; min-height: 175px; max-height: 180px; max-width: 150px; } .carousel .icon-container { display: inline-block; border-radius: 50%; } /* Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x) CSS from: http://codepen.io/transportedman/pen/NPWRGq and: http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide Inspired from: http://codepen.io/Rowno/pen/Afykb */ /* Fade transition for carousel items */ .carousel .item { left: 0 !important; -webkit-transition: opacity .7s; /*adjust timing here */ -moz-transition: opacity .7s; -o-transition: opacity .7s; transition: opacity .7s; } .carousel-control { background-image: none !important; /* remove background gradients on controls */ } /* Fade controls with items */ .next.left, .prev.right { opacity: 1; z-index: 1; } .active.left, .active.right { opacity: 0; z-index: 2; } /* end of carousel fade */ @media only screen and (max-width: 908px){ .side-bar .panel-search input#search{ } .side-bar .panel-search i{ } .post{ height: 500px; background-color: #fff; display: block; margin-bottom: 50px; overflow: hidden; } .post > .post-content > .post-content-desc{ max-height: 100px; display: block; overflow: hidden; } } @media only screen and (max-width: 768px){ .navbar-container .navbar-header button .icon-bar{ background-color: #000; } .navbar #navbar{ width: 100%; font-size: 14px; color: #000; float: left; text-align: left; padding-left: 40px; background-color: #fff; } .navbar #navbar > ul li a{ font-size: 14px; color: #000; } .navbar.navbar-fixed-top.fixed-theme #navbar{ width: 100%; font-size: 14px; color: #fff; float: left; text-align: left; padding-left: 40px; background-color: #000; } .navbar-brand { padding-left: 40px; } .navbar-brand img{ max-width: 60px; max-height: 60px; z-index: 999999999; } .navbar-brand > .logo{ background-color: #094dfa; padding: 5px; padding-top: 15px; border-radius: 0 0 45% 45%; } .navbar-brand.fixed-theme > .logo{ background-color: #0d42cb; padding: 5px; border-radius: 0 0 50% 50%; } .navbar-brand.fixed-theme img{ max-width: 60px; max-height: 60px; } .side-bar .panel-search input#search{ } .side-bar .panel-search i{ } .post{ height: 500px; background-color: #fff; display: block; margin-bottom: 50px; overflow: hidden; } .post > .post-content > .post-content-desc{ max-height: 100px; display: block; overflow: hidden; } #carousel{display: none;} .site > .site-body > .site-wrapper > .site-container > .post-index{ margin-top: 0; } } /* end of 768 */ @media only screen and (max-width: 365px){ .site > .site-body > .site-wrapper > .site-container{ margin-top: 50px; } } @media only screen and (max-width: 468px){ }