@font-face{
    font-family: 'CartoVistaIcons';
    src: url('../fonts/CartoVistaIcons.woff') format('woff');
}
@font-face{
    font-family: 'WebPortalIcons';
    src: url('../fonts/Icons/WebPortalIcons.woff') format('woff');
}
@font-face{
    font-family: 'OpenSans-Bold';
    src: url('../fonts/Open_Sans/OpenSans-Bold.woff') format('woff');
}
@font-face{
    font-family: 'OpenSans-Regular';
    src: url('../fonts/Open_Sans/OpenSans-Regular.woff') format('woff');
}
@font-face{
    font-family: 'OpenSans-Light';
    src: url('../fonts/Open_Sans/OpenSans-Light.woff') format('woff');
}
.cartoVista{
    clear:both;
}

/*Header*/
header{
    font-family: 'OpenSans-Regular';       
    color: #6D6E71;
    height: 110px;
}
.content{
    height: calc(100% - 160px);
}
header .firstColumn{
    height: 100%;
    padding-left:2%;
}
header .firstColumn img, header .secondColumn img{
    position: absolute;
      top: 50%;
      transform: translateY(-50%);
      -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    float: left;
}



header .logoDesktop {
	position: absolute;
    height: 95px;
    left: 0;
    top: 8px;
}
.container-fluid .logoDesktop {
	left: 30px;
}

header .logoMobile {
	height: 40px;
	margin: 5px;
	display: none;
}
header .logoVilleGatineau {
	position: absolute;
    left: 140px;
    top: 70px;
    width: 175px;
}

header .logoPortrait{
	position: absolute;
    left: 370px;
    top: 50px;
    width: 160px;
}

.container-fluid .logoVilleGatineau {
	left: 170px;
}

header .secondColumn{
    height: 100%;
    float: left;
    padding: 0px;
}

header h1{
    /*float: left;*/

    font-size: 1.7em;
    font-style:italic;
}
header .thirdColumn{
    padding-right: 2%;
	margin-top: 50px;
}

header .thirdColumn .row{
	margin: 0;
}
/*Search Navigation Bar*/
header .searchGroup{
    float: right;
    padding-top: 10px;
}


header .searchBarContainer {
	border: 1px solid #ced4da;
	background-color: #fff;
}
header .searchBarContainer .k-select {
	display: none;
}
header .searchBarContainer .k-dropdown-wrap{
	box-shadow: none;
}
header .searchBarContainer .form-control {
	background-color: white;
	display: inline-block;
	width: calc(100% - 45px);
	border: 0px;
	box-shadow: none;
	color: #333;
	font-size: 14px;
	height: auto;
}
header .searchBarContainer .k-input.form-control {
	background-color: white;
	display: inline-block;
	color: #333;
	width: 75%;
	padding: 0;
	padding-left: 10px;
	border: 0px;
	box-shadow: none;
	margin: 7px;
	font-size: 14px;
	height: 21px;
	outline: none;
	box-shadow: none;
}
header .searchBarContainer .k-i-close {
	display: none !important;
}
header .searchBarContainer .input-group-btn {
	float: right;
	margin: 7px;
	width: 28px;
}
header .searchBarContainer .input-group-btn #btnSearch {
	width: 20px;
	background-color: white;
	height: 24px;
	background-image: url(../images/search_icon.png);
	background-repeat: no-repeat;
	background-position: center;
	border: none;
	outline: none;
}
header .searchBarContainer .input-group-btn #btnSearch .glyphicon:before {
	content: "";
}
header .searchBarContainer .k-dropdown-wrap.k-state-default {
	background-image: none;
	background-color: #fff;
	border-color: #fff;
	display: inline-block;
	width: 100%;
	outline: none;
}

header .searchBarContainer .k-dropdown-wrap.k-state-focused {
	box-shadow:none;
}
header .searchGroup .k-combobox {
	border-color: #6D6E71;
	max-width: 400px;
	float: right;
}
header .searchGroup .k-input{
    height: 100%;
    background-color: white;
}
header .searchGroup .k-dropdown-wrap .k-icon:before{
    content: "6";
    font-size: 36px;
    font-family: 'WebPortalIcons';
    position: relative;
    bottom: 8px;
    float: right;
    padding-right: 2px;
    width: 22px;
}
header .searchGroup .k-dropdown-wrap.k-state-active .k-icon:before{
    content: "5";
    font-size: 36px;
    font-family: 'WebPortalIcons';
    position: relative;
    bottom: 8px;
    float: right;
    padding-right: 2px;
    width: 22px;
}
header .searchGroup .k-dropdown-wrap .k-select{
    display: none;
}
header .searchGroup .k-icon{
    font-size: 0;
    /*font-family: 'CartoVistaIcons';*/
}
header .searchGroup #btnSearch{
    border-color: #6D6E71;   
    margin: 0px; 
}
#searchInput_listbox{
    background-color: white;
    padding-left: 0px;
    list-style-type: none;
}
#searchInput_listbox li{
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 10px;
    font-size: 1.1em;
    line-height: 16px;
    /*height: 30px;*/
}
#searchInput_listbox li.k-state-hover, #searchInput_listbox li.k-state-selected{
    background-color: #395928;
    color: #fff;
}
.k-popup.k-group #searchInput_listbox .k-item.k-state-focused{
	background-color: #496F34;
	border-color: #496F34;
	color: #fff;
}

.k-popup.k-group #searchInput_listbox .k-item.k-state-focused.k-state-hover{
	background-color: #395928;
	border-color: #395928;
	color: #fff;
}
/*End Search Navigation Bar*/

header .form-control{
    background-color: #f2f2f2;
    border-radius: 0px;
    padding: 0px;
    border-right: 0;
}
header .k-input.form-control{
    padding-left:10px;
    border:0px;
    /*width:calc(100% - 24px) !important;*/
    box-shadow: none;
}
header .searchGroup .btn{
    background-color:#f2f2f2;   
}
header .searchGroup .btn:hover{
    background-color: #d1d3d4;
}
header .glyphicon{ 
    color: #58595b;
    font-size: 1em;
}
header .linksContainer {
	float: right;
	display: inline-block;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: right;
}
header .searchContainer{
	float: right;
}
header .linksContainer :first-child {
	padding-right: 5px;
}
header .linksContainer :nth-child(3){
    padding-right: 5px;
    padding-left: 5px;
}
header .linksContainer :nth-child(5){
    padding-left: 5px;
}

header .linksContainer .link:hover {
    color: blue;
    text-decoration: underline;
    background-color: transparent;
}
header .linksContainer .link{
    color: #58595B;
}
header .linksContainer .link:hover{
    color: #2a83c6;
    text-decoration: none;
}
header .linksContainer .link:visited{
    text-decoration: none;
    color: #58595B;
}
header .linksContainer .link:focus{
    text-decoration: none;
    color: #58595B;
}
/*End Header*/


/*Begin Footer*/
footer{    
    font-family: 'OpenSans-Regular';       
    background-color: #333;
    color: #d1d3d4;
    font-size: 0.9em;
    padding-left:  15px;
    padding-right: 15px;
}
footer .copyright{
    margin-bottom: 0px;
    display: inline-block;
}
footer .linksContainer{
    margin-bottom: 0px;
    display: inline-block;
    float: right;
}
footer .linksContainer a{
    margin-left: 20px;
    color: #d1d3d4;
}
footer .linksContainer a:hover{
    text-decoration: none;
    cursor: pointer;
}
footer h1{
    font-size: 1.4em;
    font-family: "OpenSans-Bold";
}
footer h2{
    font-size: 1.1em;
    font-family: "OpenSans-Bold";
}

footer .topFooterSection{
    display: block;
    height: auto;
    max-width: 1400px;
    margin: auto;
    margin-bottom: 0px;
}
footer .bottomFooterSection {
	padding-top: 10px;
	padding-bottom: 10px;
	border-top: 1px solid #ccc;
}

footer .footerBlock {
	padding: 20px 0;
}

footer .footerBlock p {
	margin-bottom: 2px;
	font-size: 1em;
}

footer .footerBlock a {
	color: #d1d3d4;
	text-decoration: none;
}

footer .footerBlock h1 {
	margin-top: 10px;
}

footer .footerBlock h2 {
	margin-top: 10px;
	margin-bottom: 5px;
}

footer .footerBlock .dbxLink, footer .footerBlock .partenaireLink {
	padding-top: 15px;
}

.col-xs-4{
    /*height: 50px;*/
}
.responsiveIcons{
    font-family: 'CartoVistaIcons';
    display: none;
    font-size: 3em;
    max-height: 50px;
    height: 50px !important;
    padding:0px;
    color: #13538E;
}

.responsiveIcons button{
    height: 50px;
    line-height: 50px;
    position: absolute;
    background-color: inherit;
    border-width: 0px;
}
.responsiveIcons .responsiveSearchIcon{
    right: 60px;
    display: none;
    padding-right: 6px;
    padding-left: 6px;
}
.responsiveIcons .responsiveMenuIcon {
	position: relative;
	float: right;
	background-image: url(../images/menu_icon.png);
	background-repeat: no-repeat;
	width: 50px;
	background-position: right;
	outline: none;
	cursor: pointer;
}

.k-animation-container[aria-hidden="false"]{
	min-width: 300px !important;
}
.k-animation-container #searchInput-list{
	background-color: #fff;
	border: 1px solid #ced4da;
	min-width: 300px !important;
	clear:both; 
}

.k-animation-container #searchInput-list[aria-hidden="false"]{
	display: table-row !important;
}

.k-animation-container #searchInput-list #searchInput_listbox{
	clear:both;
}
.viewAllButtonListItem{
    background-color: #f2f2f2;
    font-family: "OpenSans-Bold";
}
.viewAllButtonListItem.k-state-hover{
    background-color: #d1d3d4 !important;
    color: black !important;
    cursor: pointer;
}

@media(max-width:1200px) {
	header .thirdColumn {
		padding: 1px;
		margin-top: 20px;
	}

}


@media(max-width:991px) {
	header .thirdColumn {
		margin-top: 20px;
		float:	right;
	}
	.sectionImage {
	    margin: 20px auto;
	}
}



@media(max-width:769px) {
	/*.cartoVista {
		display: block !important;
	}*/
	.cartoVista .cv-main{
		position: relative !important;
	}

	header {
		background-image: none;
		height: auto;
		padding: 0 0 7px;
	}

	.content {
		height: 100%;
	}

	header .firstColumn {
		float: left;
		height: 50px;
	}

	header .logoMobile {
		display: inline;
	}

	header .logoDesktop, header .logoVilleGatineau, header .logoPortrait {
		display: none;
	}
	
	header .firstColumn img {
		position: relative;
		top: 50%;
		transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		padding-right: 10px;
	}

	header .secondColumn {
		display: none;
		width: 100%;
	}

	header .thirdColumn {
		padding: 1px;
		margin-top: 10px;
		width: 100%;
	}

	header .responsiveContainer {
		display: none;
	}

	header .searchGroup.visible {
		display: table;
	}

	header .linksContainer.visible {
		display: block;
	}

	header .logoInfoterritoireLabel {
		margin-left: 50px;
		font-size: 1.4em;
	}

	.firstColumn .logoInfoterritoire {
		float: left;
		height: 40px;
		max-width: none;
		width: inherit;
	}

	.thirdColumn .logoVilleGatineau {
		display: none;
	}

	.thirdColumn .searchGroup {
		/*display: none;*/
		padding: 0px;
	}

	header .searchContainer {
	    float: none;
	}

	header .searchBarContainer {
		border: 1px solid #ced4da;
		background-color: #fff;
		margin: 0 10px;
	}

	header .searchGroup .k-combobox {
		max-width: none;
		float: right;
	}

	.thirdColumn .linksContainer {
		margin: 0;
		margin-top: 5px;
		width: 100%;
		background-color: #fff;
		padding: 0;
		border: 1px solid #ced4da;
	}

		.thirdColumn .linksContainer a {
			display: block;
			height: 40px;
			text-align: center;
			line-height: 40px;
			color: #333 !important;
			font-size: 1.2em;
			border-top: 1px solid #ced4da;
		}

			.thirdColumn .linksContainer a:first-child {
				border-top: 0px;
			}

		.thirdColumn .linksContainer span {
			display: none;
		}

	header #searchInput {
		width: 100%;
		float: right;
	}

	.responsiveIcons {
		display: inline-block;
		width: 33.3%;
		float: right;
	}

	.km-scroll-container {
		overflow: auto;
		height: auto;
	}

	footer {
		padding-top: 15px;
	}

		footer .linksContainer {
			float: left;
			margin-top: 5px;
		}

			footer .linksContainer a:first-child {
				margin-left: 0px;
			}

		footer .bottomFooterSection {
			height: 60px;
		}

		footer .footerSectionContainer {
			padding: 0;
			padding-bottom: 10px;
			display: block;
		}

		footer .copyright {
			display: block;
		}
}

@media(max-width:564px) {
	footer .footerBlock {
		padding: 5px 20px;
	}

	footer .copyright {
		margin: 0 20px;
	}
}

@media(max-width: 1100px) {
	header h1 {
		font-size: 1.4em;
	}
}

@media(max-width:320px) {
	header {
		/*min-height: 225px;*/
	}

	.thirdColumn .linksContainer a {
		display: block;
	}

	.thirdColumn .linksContainer span {
		display: none;
	}
}