482 lines
9.0 KiB
CSS
482 lines
9.0 KiB
CSS
body {
|
|
font-size: 20px;
|
|
}
|
|
|
|
h1{
|
|
padding: 40px 0px 9px 0px;
|
|
border-bottom: 1px solid #eee;
|
|
}
|
|
|
|
.nav a{
|
|
background: none;
|
|
color: #CFD8DC;
|
|
font-size: 14px;
|
|
padding: 5px 0px 5px 25px;
|
|
display: block;
|
|
}
|
|
|
|
|
|
/* Sidebar Styles */
|
|
.contentsidebar {
|
|
margin-left:250px;
|
|
}
|
|
|
|
#sidebar {
|
|
z-index: 1000;
|
|
position: fixed;
|
|
left: 250px;
|
|
width: 250px;
|
|
height: 100%;
|
|
margin-left: -250px;
|
|
overflow-y: auto;
|
|
background: #37474F;
|
|
-webkit-transition: all 0.5s ease;
|
|
-moz-transition: all 0.5s ease;
|
|
-o-transition: all 0.5s ease;
|
|
transition: all 0.5s ease;
|
|
}
|
|
|
|
#sidebar header {
|
|
background-color: #263238;
|
|
font-size: 20px;
|
|
line-height: 52px;
|
|
text-align: center;
|
|
}
|
|
|
|
#sidebar header a {
|
|
color: #fff;
|
|
display: block;
|
|
text-decoration: none;
|
|
}
|
|
|
|
#sidebar header a:hover {
|
|
color: #fff;
|
|
}
|
|
|
|
#sidebar .nav{
|
|
display: block;
|
|
}
|
|
|
|
#sidebar .nav a {
|
|
padding: 0px 10px 5px 10px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
#sidebar .title {
|
|
color: #CFD8DC;
|
|
font-size: 16px;
|
|
padding: 0px 10px 0px 10px;
|
|
display: block;
|
|
text-transform: uppercase;
|
|
margin-left: 0px !important;
|
|
font-weight: bold;
|
|
}
|
|
|
|
#sidebar .nav .last{
|
|
border-bottom: 5px solid #455A64;
|
|
padding-bottom:5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
#sidebar .nav a:hover{
|
|
background: none;
|
|
color: #ECEFF1;
|
|
}
|
|
|
|
#sidebar .nav a .fa{
|
|
margin-right: 5px;
|
|
}
|
|
|
|
#sidebar .nav .select-control {
|
|
padding: 0px 10px 5px 10px;
|
|
margin-top: -12px;
|
|
}
|
|
|
|
.avatar {
|
|
background-color: #343a40;
|
|
width: 35px;
|
|
height: 35px;
|
|
border-radius: 100%;
|
|
margin-top: -5px;
|
|
}
|
|
|
|
.avatar.big{
|
|
width: 90px;
|
|
height: 90px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
@media (max-width: 991px) {
|
|
.contentsidebar {
|
|
margin-left: auto;
|
|
}
|
|
|
|
#sidebar {
|
|
position: static;
|
|
margin:0px -15px;
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
a.btn {
|
|
color:#ffffff;
|
|
}
|
|
|
|
.btn-link {
|
|
padding:0px;
|
|
}
|
|
|
|
.media-body p {
|
|
font-size :12px;
|
|
margin-bottom:0px;
|
|
}
|
|
|
|
@media (min-width: 992px) {
|
|
#sidebar {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
{% if useheader is defined and useheader %}
|
|
#main {
|
|
padding-top:55px;
|
|
}
|
|
{% endif %}
|
|
|
|
|
|
th.dt-center, td.dt-center { text-align: center; }
|
|
|
|
|
|
/* heros */
|
|
.heroheader {
|
|
width:100%;
|
|
height:800px;
|
|
position:relative;
|
|
}
|
|
.heroheader div{
|
|
width:100%;
|
|
height:100%;
|
|
background-size: cover;
|
|
background-position: center;
|
|
color:#fff;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Dots */
|
|
.slick-dotted.slick-slider
|
|
{
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.slick-dots
|
|
{
|
|
position: absolute;
|
|
bottom: -105px;
|
|
|
|
display: block;
|
|
|
|
width: 100%;
|
|
padding: 0;
|
|
margin: 0;
|
|
|
|
list-style: none;
|
|
|
|
text-align: center;
|
|
}
|
|
.slick-dots li
|
|
{
|
|
position: relative;
|
|
|
|
display: inline-block;
|
|
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 0 5px;
|
|
padding: 0;
|
|
|
|
cursor: pointer;
|
|
}
|
|
.slick-dots li button
|
|
{
|
|
font-size: 0;
|
|
line-height: 0;
|
|
|
|
display: block;
|
|
|
|
width: 20px;
|
|
height: 20px;
|
|
padding: 5px;
|
|
|
|
cursor: pointer;
|
|
|
|
color: transparent;
|
|
border: 0;
|
|
outline: none;
|
|
background: transparent;
|
|
}
|
|
.slick-dots li button:hover,
|
|
.slick-dots li button:focus
|
|
{
|
|
outline: none;
|
|
}
|
|
.slick-dots li button:hover:before,
|
|
.slick-dots li button:focus:before
|
|
{
|
|
opacity: 1;
|
|
}
|
|
.slick-dots li button:before
|
|
{
|
|
font-family: 'slick';
|
|
font-size: 6px;
|
|
line-height: 20px;
|
|
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
|
|
width: 20px;
|
|
height: 20px;
|
|
|
|
content: '•';
|
|
text-align: center;
|
|
|
|
opacity: .25;
|
|
color: black;
|
|
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.slick-dots li.slick-active button:before
|
|
{
|
|
opacity: .75;
|
|
color: black;
|
|
}
|
|
|
|
.slick-dotted.slick-slider{margin-bottom:0px;}
|
|
.slick-dots {
|
|
position: absolute;
|
|
top: 135px;
|
|
left:46px;
|
|
text-align:left;
|
|
z-index: 9100;
|
|
bottom:unset;
|
|
width:auto;
|
|
}
|
|
.heroheader-dot { color:#fff; }
|
|
|
|
|
|
.herobox {
|
|
position:absolute;
|
|
float: left;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: -200px;
|
|
z-index: 8000;
|
|
padding: 0;
|
|
text-align: center;
|
|
text-shadow: none;
|
|
background-color: rgba(0,0,0,0.7);
|
|
height: auto;
|
|
width: 45%;
|
|
box-shadow: 0px -1px 2px rgba(0,0,0,0.5);
|
|
margin: 0 auto;
|
|
//opacity: 0.9;
|
|
transform-origin: 50% 50%;
|
|
transform: skew(-20deg);
|
|
-webkit-transform: skew(-20deg);
|
|
-moz-transform: skew(-20deg);
|
|
-o-transform: skew(-20deg);
|
|
-ms-transform: skew(-20deg);
|
|
border-left: 1px solid #fff;
|
|
border-right: 1px solid #fff;
|
|
}
|
|
|
|
.herotitle {
|
|
text-align: left;
|
|
position:absolute;
|
|
top: 80px;
|
|
left:50px;
|
|
z-index: 9000;
|
|
}
|
|
|
|
.herotitle h1 {
|
|
padding:0px;
|
|
border:none;
|
|
}
|
|
|
|
.heromenu {
|
|
padding-top: 30px;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.herofloatmenu .avatar {
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 3px 3px 0px 0px;
|
|
}
|
|
.herofloatmenu a:hover {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.heromenu .linkmenu {
|
|
font-size:16px;
|
|
padding-left: 5px;
|
|
margin-top:25px;
|
|
margin-bottom:25px;
|
|
}
|
|
|
|
.heromenu .linkmenu a {
|
|
margin-right:5px;
|
|
}
|
|
|
|
.herologo {
|
|
position: absolute;
|
|
top: 0px;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.herologo img {
|
|
height:200px;
|
|
width:200px;
|
|
border-radius: 100%;
|
|
}
|
|
|
|
@media (max-width: 980px) {
|
|
.herobox { display: none; }
|
|
.herotitle { width:100%; top: 70px; left:0px; text-align:center; }
|
|
.slick-dots { top: 120px; left: 0px; text-align: center; width: 100%; }
|
|
.heromenu .facatmenu {display: none;}
|
|
.catmenu { display:none }
|
|
.heromenu .linkmenu {zoom:150%; margin-top: 10px;}
|
|
.herologo img { width:100px; height:100px; }
|
|
|
|
.herofloatmenu .avatar {
|
|
height: 40px;
|
|
width:40px;
|
|
margin-top:15px;
|
|
}
|
|
}
|
|
|
|
.grid-sizer { width: 5%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size { width: 10%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-1 { width: 10%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-15 { width: 15%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-2 { width: 20%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-3 { width: 30%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-4 { width: 40%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-5 { width: 50%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-6 { width: 60%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-7 { width: 70%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-8 { width: 80%; margin-bottom: 0%;float:left;}
|
|
.grid-item-size-9 { width: 90%; margin-bottom: 0%;float:left;}
|
|
.grid-item-full { width: 100%; margin-bottom: 0%; font-size:20px;float:left; }
|
|
.grid-item-full h1 {margin: 0; border:none; padding: 20px 0px 0px 10px; }
|
|
.gutter-sizer { width: 0%;float:left; }
|
|
.member{display:flex; flex-direction: column; align-items: center; background-color: var(--colorbgbodydarkdarker); border-radius:10px; padding:10px;}
|
|
.member img{border-radius:100%;width:60px; height: 60px;}
|
|
@media (max-width: 980px) {
|
|
.grid-sizer { width: 5%; margin-bottom: 0%;}
|
|
.grid-item-size { width: 50%; margin-bottom: 0%;}
|
|
.grid-item-size-small-3 { width: 30%}
|
|
.grid-item-mini-50 { width: 50%; margin-bottom: 0%;}
|
|
.grid-item-mini-25 { width: 25%; margin-bottom: 0%;}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.foliomenu {
|
|
position: fixed;
|
|
width:100%;
|
|
height:60px;
|
|
background-color: var(--colorbgbodydark) ;
|
|
z-index: 100000;
|
|
display:none;
|
|
padding-left:10px;
|
|
border-bottom: 1px solid var(--colorftbodydark);
|
|
}
|
|
|
|
.foliomenu .logo { float:left; height:40px; margin-top:7px; border-radius: 100%; }
|
|
.foliomenu .avatar { height: 20px; margin: 0px 3px 0px 0px; width: 20px; }
|
|
.foliomenu div { padding: 10px; line-height:35px; float:left;}
|
|
.foliomenu a {
|
|
color: var(--colorftbodydark);
|
|
font-size: 15px;
|
|
}
|
|
.foliomenu .float-right a:hover {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.foliomenu .fa { font-size: 14px; color: var(--colorftbodydark);}
|
|
|
|
.foliotop {
|
|
float:right;
|
|
position:fixed;
|
|
bottom: 10px;
|
|
right:10px;
|
|
z-index: 100000;
|
|
background-color: var(--colorbgbodydark) ;
|
|
padding:10px;
|
|
border-radius: 100%;
|
|
width:55px;
|
|
height:55px;
|
|
text-align: center;
|
|
line-height: 28px;
|
|
border: 1px solid var(--colorbgbodylight);
|
|
display:none;
|
|
}
|
|
.foliotop a {
|
|
color: var(--colorftbodydark);
|
|
font-size: 25px;
|
|
}
|
|
|
|
.herofloatmenu {
|
|
padding: 5px;
|
|
background: var(--colorbgbodydarkdarker);
|
|
border-radius: 0px 0px 6px 6px
|
|
}
|
|
|
|
@media (max-width: 980px) {
|
|
|
|
.herofloatmenu {
|
|
display:none;
|
|
}
|
|
|
|
.foliomenu {
|
|
display: block!important;
|
|
}
|
|
|
|
.foliomenu .fa-circle {
|
|
display:none;
|
|
}
|
|
|
|
.foliomenu .float-right a {
|
|
margin-top: -8px;
|
|
}
|
|
.foliomenu .float-right img {
|
|
height:35px;
|
|
width:35px;
|
|
margin-top:-10px;
|
|
}
|
|
.foliomenu .float-right .fa, .foliomenu .float-right .fas {
|
|
font-size:30px!important;
|
|
}
|
|
}
|
|
|
|
.linkurl a {
|
|
background-color: var(--colorbgbodylight) ;
|
|
color: var(--colorftbodylight)!important;
|
|
font-size: 14px;
|
|
padding: 5px;
|
|
display: inline-block;
|
|
margin: 0px 10px 10px 0px;
|
|
}
|
|
|
|
.contactdescription {
|
|
max-width:300px;
|
|
text-align:justify;
|
|
} |