/*!
 * Bootstrap  THEME - Basics
 *  *
 * Copyright 2015 Atelier 26
 *
 */

/* Colors

TA Dach Blue
  
RGB	15/63/147
HEX	#0f3f93

TA Dach Green

RGB	33/154/52
HEX	#069a32
   
 * 
 * * 
 * */


/* Grid visualisation & debuging */
/* .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{
	 border: 1px solid red;
}
*/

/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
	font-weight: 400;
	line-height: 1.5;
}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
	color:#0f3f93;
	margin-bottom: 10px;
    margin-top: 0px;
    font-weight: 700;
}

br {line-height: 0.85;}
p { margin: 0px;}
strong, b { font-weight: 700;}


/* Typo default */

h1, .h1 {font-size: 30px; color: #069a32; margin-bottom: 25px;}
h2, .h2 {font-size: 22px;}
h3, .h3 {font-size: 16px; margin-bottom: 5px;}
h4, .h4 {font-size: 16px; margin-bottom: 25px;text-transform: uppercase; letter-spacing: 0.02em; font-weight: 400;}
h6, .h6 {font-weight: 400; line-height: 1.5; padding-top:0px; 	color: #808080;	font-size: 13px;}

lead, .lead, h5, .h5 {font-size: 18px; line-height: 1.6; font-weight: 700; margin-bottom: 30px; color: #0f3f93; display: block;}

blockquote {border-left: 0px solid #eee; border-top: 1px solid #0f3f93; border-bottom: 1px solid #0f3f93; margin: 20px 0px 10px 0px;} 
blockquote p {font-size: 20px; line-height: 1.6em; color: #808080; text-align: center; padding: 25px 60px 25px 60px;} 
blockquote strong, blockquote p strong {font-weight: 400; color:#0f3f93;}

/* Extra small devices (phones, less than 768px) default */
@media (max-width: 767px) {
p, div, ul, li {font-size: 14px;}
h1, .h1 {font-size: 24px; margin-bottom: 20px;}
h2, .h2 {font-size: 20px;}
h3, .h3 {font-size: 14px;}
h4, .h4 {font-size: 14px;}
h6, .h6 {}
lead, .lead, h5, .h5  {font-size: 16px;}
blockquote p {font-size: 15px; padding: 20px 0px 20px 0px; } 
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
p, div, ul, li {font-size: 14px;}
h1, .h1 {font-size: 28px;}
h2, .h2 {font-size: 20px;}
h3, .h3 {font-size: 14px;}
h4, .h4 {font-size: 14px;}
h6, .h6 {}
lead, .lead, h5, .h5  {font-size: 16px;}
blockquote p {font-size: 16px; padding: 20px 0px 20px 0px; } 
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
p, div, ul, li {font-size: 14px;}
h1, .h1 {font-size: 30px;}
h2, .h2 {font-size: 22px;}
h3, .h3 {font-size: 15px;}
h4, .h4 {font-size: 15px;}
h6, .h6 {}
lead, .lead, h5, .h5  {font-size: 18px;}
blockquote p {font-size: 18px; padding: 20px 0px 20px 0px; } 
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
p, div, ul, li {font-size: 15px;}
h1, .h1 {font-size: 30px;}
h2, .h2 {font-size: 24px;}
h3, .h3 {font-size: 16px;}
h4, .h4 {font-size: 16px;}
h6, .h6 {}
blockquote p {font-size: 20px; padding: 25px 60px 25px 60px;}  
}










/* List Style (reset) */

.csc-default ol li {
  border-top: 1px solid #ddd;
  padding: 0px;
  list-style: none;
  }

.csc-default ol {
  border-bottom: 1px solid #ddd;
  padding: 0px;
  margin: 0px;
}

.subpage ul{
  margin-left: 0;
  padding-left: 0;
}

.subpage ul {
 list-style: none;
 margin-left: 0;
 padding-left: 0.8em;
 text-indent: -0.8em;
 }
 
.subpage ul li {
  list-style: none;
}

.subpage li:before {
    content: "– ";
}


div.csc-textpic div li:before {
  content: none;
}


/* Typo Link */

a {text-decoration: none; color:#0f3f93;}
a:focus, a:hover, a:active {text-decoration: none; color: #0a3379;}

/* delite line around image FF */
a:active, a:focus{outline: none}







/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
.navbar-brand {
	height: 66px;
	width: 213px;
    margin-top: 16px;
    margin-bottom: 16px;
    margin-left: 16px;
	display: block;
	border: 0px solid red;
	background: url(http://www.t-a-dach.ch/fileadmin/templates/tadach/img/logo_tuescher.svg) no-repeat;
 }
@media (min-width: 768px) {
	.navbar-brand {
		height: 112px;
		width: 251px;
		margin-top: 30px;
	}
}
@media (min-width: 997px) {
	.navbar-brand {
		margin-left: 0px;
	}
}
@media (min-width: 768px){
	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
		margin-left: 0px;
	}
}
.brand-name {
  display: none;
}

/* Navbar Background */

/* Extra small devices (phones, less than 768px) */
.navbar-default {
	background-repeat:no-repeat;
	background-position: left top;
	background-size: 800px 85px;
	border: none;
	background-color: #FFFFFF;
}
.navbar {
    margin-bottom: 7px;
}

.navbar-default:after{
	content: "";
	height: 55px;
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: -1;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #355ba4 0%, #ffffff 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #355ba4 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #355ba4 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#355ba4', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
@media (min-width: 768px) {
	.navbar-default:after {
		height: 100px;
	}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
 	.navbar-default {
	background-size: 3000px auto;
	background-position: center;
	}
.navbar-default .navbar-nav {
	margin: 120px 0px 10px 0px;
	}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.navbar-default .navbar-nav {
		margin: 120px 0px 0px 0px;
	}
}

/* NAVBAR (Navigation)
-------------------------------------------------- */


/* Navbar Desktop */
@media (min-width: 768px) {
.navbar-default .navbar-nav {
	
	}

.navbar-default .navbar-nav > li {
	padding: 0px 0px 0px 30px;
}

.navbar-default .navbar-nav > li > a {
	font-size: 16px;
	letter-spacing: 0.03em;
	font-weight: 700;
	color: #0f3f93;
	padding: 0px 0px 10px 0px;

}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	color: #069a32;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	color: #069a32;
	background-color: transparent;
}

}


/* Dropdown Navigation */


.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    background-color: transparent;
    color: #069a32;

}

.navbar-nav > li > .dropdown-menu {
	background: #0f3f93; /* #0f3f93 #069a32 */
	border: 0px solid rgba(0, 0, 0, 0.15);
	margin: 0px;
	padding: 15px 15px 15px 15px; 
	border-radius: 0;
}

.dropdown-menu > li > a {
	border-bottom: 1px solid #FFFFFF;
	color: #FFFFFF; 
	padding: 10px 10px 10px 10px;
	font-size: 14px; 
}

.dropdown-menu > li > a:hover {
	border-bottom: 1px solid #FFFFFF;
	color: #FFFFFF;
	background: rgba(0,0,0, 0.1); 
}



/* Dropdown Phone */
@media (max-width: 767px) {

.navbar-default .navbar-nav .open .dropdown-menu{
	padding: 0px;
	}
	
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
	color: #0f3f93;
	border-bottom: 1px solid #0f3f93;
	padding: 10px 30px 10px 30px;
	font-size: 16px; 
	}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
	color: #069a32;
}

}

/* Enable Hover for Bootstrap Nav Dropdowns */


@media (min-width: 768px) {
.dropdown:hover .dropdown-menu {display: block;
	}
}



/* Navbar Phone */

@media (max-width: 767px) {
.navbar-default .navbar-collapse, .navbar-default .navbar-form{
	background: #FFFFFF;
	border-top: 2px solid #0f3f93;
	border-bottom: 2px solid #0f3f93;
	padding-bottom: 20px;
	}
.navbar-default .navbar-nav {
	padding-top: 10px;

}
		
.navbar-default .navbar-nav > li {
	padding: 0px 15px 0px 15px;
}

.navbar-default .navbar-nav > li > a {
	font-size: 16px;
	letter-spacing: 0.03em;
	font-weight: 500;
	color: #0f3f93;
	padding: 15px 10px 15px 10px;
	border-bottom: 1px solid #0f3f93;

}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	color: #069a32;
	border-bottom: 1px solid #0f3f93;
	background-color: transparent;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	color: #069a32;
	border-bottom: 1px solid #0f3f93;
	background-color: transparent;
}

}

/* Toggle Navbar Icon */

.navbar-toggle {
    margin-bottom: 5px;
    margin-right: 5px;
    margin-top: 10px;
}

.navbar-toggle .icon-bar {
    border-radius: 0px;
    display: block;
    height: 3px;
    width: 30px;
    margin-bottom: 2px ;
}

.navbar-default .navbar-toggle {
    border-color: transparent;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFFFFF;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: transparent;
  
}

.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar{
    background-color: rgba(255,255,255,0.5);
}



/* Navbar Tablet hoch */
@media (max-width: 991px) {

}

/* WRAP - Page wrap (distance to Navigation) 
 ---------------------------------------------- */
#wrap {	margin-top: -20px; }

/* Extra small devices (phones, less than 768px) default */
@media (max-width: 767px) {
#wrap {	margin-top: -20px; }
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
#wrap {	margin-top: 0px; }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
#wrap {	margin-top: 0px; }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
#wrap {	margin-top: 0px; }
}

/* ELEMENT Spacing
 ---------------------------------------------- */
.row .col-xs-1, .row .col-sm-1, .row .col-md-1, .row .col-lg-1, .row .col-xs-2, .row .col-sm-2, .row .col-md-2, .row .col-lg-2, .row .col-xs-3, .row .col-sm-3, .row .col-md-3, .row .col-lg-3, .row .col-xs-4, .row .col-sm-4, .row .col-md-4, .row .col-lg-4, .row .col-xs-5, .row .col-sm-5, .row .col-md-5, .row .col-lg-5, .row .col-xs-6, .row .col-sm-6, .row .col-md-6, .row .col-lg-6, .row .col-xs-7, .row .col-sm-7, .row .col-md-7, .row .col-lg-7, .row .col-xs-8, .row .col-sm-8, .row .col-md-8, .row .col-lg-8, .row .col-xs-9, .row .col-sm-9, .row .col-md-9, .row .col-lg-9, .row .col-xs-10, .row .col-sm-10, .row .col-md-10, .row .col-lg-10, .row .col-xs-11, .row .col-sm-11, .row .col-md-11, .row .col-lg-11, .row .col-xs-12, .row .col-sm-12, .row .col-md-12, .row .col-lg-12 {
    margin-bottom: 30px;
}
/*
.dummy {
    margin-top: 40px;
}
*/
/* STICKY FOOTER - Footer style
-------------------------------------------------- */

html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 100px;
}

.copy-container {
  position: absolute;
  bottom: 120px;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 20px;
  padding: 25px 0px 0px 0px;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 100px;
  padding: 25px 0px 0px 0px;
}

.footer .container {
	padding: 0px 0px 0px 0px;
}

/* Custom footer */

.footer, .footer div, .footer p, .address  {
	background-color: #f3f3f3;
  	color: #0f3f93;
	font-size: 12px;
}


.address {
	height: 50px;
}
.dmr, .gbh {
	height: 50px;
  	width: 100%;
  	margin-top: 5px;
  	display: block;
	background-repeat:no-repeat;
}

.dmr {
	background-image: url(../img/diemeister.svg); /* all browser */
	background-image: url(../img/diemeister.png)\9; /* IE 8 and below */
}

.gbh{
	background-image: url(../img/gebeudehuelle.svg); /* all browser */
	background-image: url(../img/gebeudehuelle.png)\9; /* IE 8 and below */
}
.copy-container .col-md-12 {margin-bottom: 0px;}
.copy {text-align: center; position: relative; margin-bottom: 10px; text-transform:none;}
.copy, .copy a {color:#cccccc; font-size: 10px;}

/* Footer Phone */ 
@media (max-width: 767px) {
	.footer {
	padding: 15px 0px 0px 0px;
	height: 150px;
	}
	.copy-container {
		bottom: 90px;
		padding-left: 20px;
	}

	.footer, .footer div, .footer p, .address {
	height: 70px;
	}
	.footer .col-md-4{ width: 100%; text-align: center;}
	.dmr, .gbh {background-position: center;}
}


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	body {
  	/* Margin bottom by footer height */
 	 margin-bottom: 180px;
	}
	.footer, .footer div, .footer p, .address {
	height: 70px;
	}
	.footer {
	height: 180px;
	}
	.copy-container {
		bottom: 200px;
	}
	
	.footer .col-md-4{text-align: center;}
	.dmr, .gbh {background-position: center;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.dmr, .gbh {background-position: left;}
	body {
  	/* Margin bottom by footer height */
 	 margin-bottom: 100px;
	}
	.footer, .footer div, .footer p, .address {
	height: 70px;
	}
	.footer .col-md-4{text-align: left;}
	.footer {
	height: 100px;
	}
	.copy-container {
		bottom: 120px;
	}
	
}

/* BUTTON COLOR 
 ------------------------------ */

/* default
.btn-primary {
    color: #ffffff;
  	background-color: #6D0046;
    border-color: #510030;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
 	color: #ffffff;
 	background-color: #510030;
 	border-color: #2e0010;
}
*/






/* 
 SCROLL (Scrolly)
-------------------------------------------------- */

.scroll-top  {
  position:relative;
  height: 30px;
  margin-top:60px;
  margin-bottom: -110px;
  text-align:center;
  padding-top: 0px;
}

.scroll-top a{
  background: url(../img/pfeil.svg) no-repeat center center; /* all browser */
  background: url(../img/pfeil.png)no-repeat center center\9; /* IE 8 and below */
  width: 30px;
  height: 30px;
  overflow:hidden;
  display:inline-block;
}


.scroll-top a:hover{
  visibility: visible;
    opacity: 1;
    /* Firefox */
    -moz-transition: opacity 0.8s linear;
    /* WebKit */
    -webkit-transition: opacity 0.8s linear;
    /* Opera */
    -o-transition: opacity 0.8s linear;
    /* Standard */
    transition: opacity 0.8s linear;
     filter: alpha(opacity = 100);

}

.scroll-top a {
  visibility: visible;
    opacity: 0.3;
    /* Firefox */
    -moz-transition: visibility 0s 2s, opacity 1s linear;
    /* WebKit */
    -webkit-transition: visibility 0s 2s, opacity 1s linear;
    /* Opera */
    -o-transition: visibility 0s 2s, opacity 1s linear;
    /* Standard */
    transition: visibility 0s 2s, opacity 1s linear;
  filter: alpha(opacity = 30);

}

/* Subpage (distanz to scrolly)
-------------------------------------------------- */
.subpage {
    padding-top: 170px;
}



/* BORDER ELEMENTS
-------------------------------------------------- */

.border, .border-top, .border-bottom, .border-top-bottom  {   
  overflow: hidden;
  display:block;
}
 
.border {
   border-top: 1px solid #0068b4;
   border-bottom: 1px solid #0068b4;
   padding: 20px;
   margin-bottom: 20px;
   background-color: #0068b4;
}
 
.border-top {
   border-top: 1px solid #0068b4;
   padding-top: 20px;
   margin-bottom: 0px;
}

.border-bottom {
   border-bottom: 1px solid #0068b4;
   padding-bottom: 0px;
   margin-bottom: 20px;
}

.border-top-bottom {
   border-top: 1px solid #0068b4;
   border-bottom: 1px solid #0068b4;
   padding-top: 20px;
   padding-bottom: 20px;
   margin-bottom: 20px;

}



/* THEME ELEMENTS
-------------------------------------------------- */


/* Topic (Home) */


/* Extra small devices (phones, less than 768px) default */
@media (max-width: 767px) {
.topic-container{min-height: 85px;}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.topic-container{min-height: 100px;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.topic-container{min-height: 100px;}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.topic-container{min-height: 100px;}
}
	

.topic-container a:hover, .topic-container a:hover h2 {
	color: #069a32;
}

.topic-icon{
	display: table-cell;
	width: 60px;
	vertical-align: middle;
}

.topic-text {
	display: table-cell;
	vertical-align: middle;
	font-size: 13px;
}

.roof, .flatroof, .solar, .lightning, .facade, .maintenance, .roof2, .flatroof2, .solar2, .lightning2, .lightning3, .facade2, .maintenance2, .greening, .insulation {
  background-size: 49px;
  display:block;
  width: 50px;
  height: 50px;
}

.roof {
  background: url(../img/roof.svg) no-repeat center center; /* all browser */
  background: url(../img/roof.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .roof {
  background: url(../img/roof-g.svg) no-repeat center center; /* all browser */
  background: url(../img/roof-g.png)no-repeat center center\9; /* IE 8 and below */
}

.roof2 {
  background: url(../img/roof2.svg) no-repeat center center; /* all browser */
  background: url(../img/roof2.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .roof2 {
  background: url(../img/roof2-g.svg) no-repeat center center; /* all browser */
  background: url(../img/roof2-g.png)no-repeat center center\9; /* IE 8 and below */
}

.flatroof {
  background: url(../img/flatroof.svg) no-repeat center center; /* all browser */
  background: url(../img/flatroof.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .flatroof {
  background: url(../img/flatroof-g.svg) no-repeat center center; /* all browser */
  background: url(../img/flatroof-g.png)no-repeat center center\9; /* IE 8 and below */
}

.flatroof2 {
  background: url(../img/flatroof2.svg) no-repeat center center; /* all browser */
  background: url(../img/flatroof2.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .flatroof2 {
  background: url(../img/flatroof2-g.svg) no-repeat center center; /* all browser */
  background: url(../img/flatroof2-g.png)no-repeat center center\9; /* IE 8 and below */
}

.solar {
  background: url(../img/solar.svg) no-repeat center center; /* all browser */
  background: url(../img/solar.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .solar {
  background: url(../img/solar-g.svg) no-repeat center center; /* all browser */
  background: url(../img/solar-g.png)no-repeat center center\9; /* IE 8 and below */
}

.lightning {
  background: url(../img/lightning.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .lightning {
  background: url(../img/lightning-g.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning-g.png)no-repeat center center\9; /* IE 8 and below */
}

.lightning2 {
  background: url(../img/lightning2.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning2.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .lightning2 {
  background: url(../img/lightning2-g.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning2-g.png)no-repeat center center\9; /* IE 8 and below */
}

.lightning3 {
  background: url(../img/lightning3.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning3.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .lightning3 {
  background: url(../img/lightning3-g.svg) no-repeat center center; /* all browser */
  background: url(../img/lightning3-g.png)no-repeat center center\9; /* IE 8 and below */
}

.facade {
  background: url(../img/facade.svg) no-repeat center center; /* all browser */
  background: url(../img/facade.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .facade {
  background: url(../img/facade-g.svg) no-repeat center center; /* all browser */
  background: url(../img/facade-g.png)no-repeat center center\9; /* IE 8 and below */
}

.facade2 {
  background: url(../img/facade2.svg) no-repeat center center; /* all browser */
  background: url(../img/facade2.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .facade2 {
  background: url(../img/facade2-g.svg) no-repeat center center; /* all browser */
  background: url(../img/facade2-g.png)no-repeat center center\9; /* IE 8 and below */
}

.maintenance {
  background: url(../img/maintenance.svg) no-repeat center center; /* all browser */
  background: url(../img/maintenance.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .maintenance {
  background: url(../img/maintenance-g.svg) no-repeat center center; /* all browser */
  background: url(../img/maintenance-g.png)no-repeat center center\9; /* IE 8 and below */

}

.insulation {
  background: url(../img/insulation.svg) no-repeat center center; /* all browser */
  background: url(../img/insulation.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .insulation {
  background: url(../img/insulation-g.svg) no-repeat center center; /* all browser */
  background: url(../img/insulation-g.png)no-repeat center center\9; /* IE 8 and below */
}

.greening {
  background: url(../img/greening.svg) no-repeat center center; /* all browser */
  background: url(../img/greening.png) no-repeat center center\9; /* IE 8 and below */
}

.topic-container a:hover .greening {
  background: url(../img/greening-g.svg) no-repeat center center; /* all browser */
  background: url(../img/greening-g.png)no-repeat center center\9; /* IE 8 and below */
}

/* Reference (Home) */
.reference-container {
	margin-bottom: 30px;
}

.reference-container .col-sm-4 {
	margin-bottom: 20px;
}

.reference-text p {
	padding-top: 10px;
	color: #808080;
	font-size: 13px;
}

.reference-image { overflow:hidden; border: 0px solid red;}
.reference-image a {
	background-color:#0f3f93 ; /* #808080  #f3f3f3*/
	display: block;
}
.reference-image img:hover {
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}

/* Extra small devices (phones, less than 768px) default */
@media (max-width: 767px) {
.reference-image {height: auto;}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.reference-image {height: 140px;}
.reference-text p {font-size: 11px;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.reference-image{height: 185px;}
.reference-text p {font-size: 12px;}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.reference-image {height: 230px;}
.reference-text p {font-size: 13px;}
}


/* Page Main (Page) */
.sidenav {
	border-top: 1px solid #CCCCCC;
	margin-top: 30px;
}
.sidenav > li > a {
	color: #0f3f93;
	border-bottom: 1px solid #CCCCCC;
	padding: 10px 30px 10px 0px;
	font-size: 16px; 
	}
	
.sidenav > li > a:hover, .sidenav > li > a:focus {
	color: #069a32;
	background: transparent;
}

.sidenav > li > a.active, .sidenav > li > a.active:hover, .sidenav > li > a.active:focus {
	color: #069a32;
	font-weight: 700;
	background: transparent;
}


.sidecontent {
	margin-top:30px;
}

/* FANCY BOX  */
.fancybox-title-float-wrap {
	 bottom: -30px;
}


/* RESPONSIVE FIX
-------------------------------------------------- */

/* Extra small devices (phones, less than 768px) default */
// @media (max-width: 767px) {
// .navbar-brand {height: 80px; width: 250px;}
// }

/* Small devices (tablets, 768px and up) */
// @media (min-width: 768px) {
// }

/* Medium devices (desktops, 992px and up) */
// @media (min-width: 992px) {
// }

/* Large devices (large desktops, 1200px and up) */
// @media (min-width: 1200px) {
// }