/*

VECTOR communication SaRL
Puits-Godet 10a
2000 Neuchatel
www.vector.ch

*/

@media only screen and (max-width: 1024px) {

	/* fix min size for 1024 and below */
	body{
		font-size:18px;
		line-height:20px;
	}

	header nav #menu-top .dropdown {
		top: calc(7.08vw - 0px);
		font-size:.85em;
	}

	#crumbs ul {
		margin-bottom: .4em;
	}
	#crumbs ul li a {
		height: 1.6em;
	}

	#c3352 .slick-slider {
		margin-bottom: -7px;
	}

	#itineraire-form span.toggle-iti{
		padding:0;
		padding-top: calc(2.604vw - 18px);
	}
	#itineraire-form table input[type="submit"]{
		padding:0;
		padding-top: calc(2.604vw - 24px);
	}

	.row.detail-ligne .select-line-zone div.card-header .btn-link{
		font-size: 1.2em;
	}

	.row.detail-ligne .select-line-zone em {
    	padding-right: .5em;
	}
	.row.detail-ligne .select-line-zone ul{
		margin-top: -1.2em;
		margin: -1.2em 0 -.8em 0;
	}
	.row.detail-ligne .select-line-zone ul.mobicite-list{
		margin: .2em 0 -.8em 0;
	}
	.row.detail-ligne .select-line-zone ul li {
    	padding: 2px 10px 4px 0;
	}
	.display-line-info::before, .white-zone-with-mark::before{
		line-height: 2.5em;	
	}
	.display-line-info .info-trafic-item {
		font-size:.9em;
	}

	#info-trafic-popup #info-trafic-list {
		width: 32.25vw;
	}
	#info-trafic-popup #info-trafic-detail {
		width: 50.66vw;
		margin-left: calc(100% - 51.66vw - 32.25vw);
	}

	.dce-accroche-agenda h3, 
	.sommaire-agenda .accroche-placeholder .dce-accroche-agenda h3{
		padding-top: 3vw;
	}

	.dce.horaire-form .horaire-form-select h3, .dce.plan-cantonal .plan-cantonal-link h3 {
		width:auto;
	}
	
	
	.dce-highlight h3 {
		font-size: 2.257em;
		margin-top: 5.1vw;
		height: 9.54vw;
	}
	
	
	.dce.accroche-libre.rapport-gestion,
	.dce.rapport-gestion{
		height: 22.4vw;
	}

	

}

@media only screen and (min-width: 993px) {

	.sf-menu > li > a:after {
		display:none;
	}
	.sf-menu > li.active > a:after,
	.sf-menu > li:hover > a:after {
		display:none;
	}
	
}

@media only screen and (max-width: 992px) {

    html, body {
        overflow-x: hidden;
    }

	h1{
		font-size:2.214285714285714em;
		line-height:1em;
	}
	h2 {
		font-size:1.857142857142857em;
	}

	h3 {
		font-size:1.142857142857143em;
	}

	h4{
	}
	
	/* hide specific element on sm screen */
	.content-container.main-wrapper #info-trafic-btn,
	#info-trafic-mark{
		display:none !important;
	}

	header#header-top {
		height: 65px;
	}
	header#header-top #logo-top {
	    width: 120px;
    	margin-top: 0px;
	}
	header#header-top #header-left {
		padding-left: 0vw;
	}
	header#header-top #header-left .logo-top{
		margin-left:2em;
	}
	header#header-top #header-left, header#header-top #header-left > div, header#header-top #header-right, header#header-top #header-right > div {
		float: none;
	}
	header#header-top #header-right{
		position:absolute;
		right:0;
		top:15px;
		
	}
	header#header-top .info-trafic-mark{
		color:#fff;
		background:#ff4d19;
	}

	header#header-top #burger,
	header#header-top .info-trafic-mark{
		display:block;
	}	
	header#header-top #header-right table td{
		padding:0 5px;
	}
	#burger { 
	}
	header#header-top #nav-container{
		padding:0vw;
		display:none;
		background:#fff;
	}

	header #menu-top-domain ul {
		padding:1em;
	}
	header #menu-top-domain ul li {
		/*width: 33%;*/
		padding-left:30px;
	}
	header #menu-top-domain ul li:first-child {
		padding-left:0px !important;
	}

	header#header-top nav{
		overflow-y:auto;
	}
	header#header-top #nav-container #menu-top ul li{
		float:none;
		width:100%;
		background:#fff;
		padding:0;
	}
	header#header-top #nav-container #menu-top ul li a{
		color:#464646;
	}
	header#header-top #nav-container #menu-top ul li.parent{
		background:#7bb600;
		color:#fff;
		padding-bottom:0;
		position:relative;
	}
	header#header-top #nav-container #menu-top ul li.parent a{
		color:#fff;
		display: inline-block;
		border-bottom: 1px solid #fff;
		width: 100%;
		padding:1em;
	}
	
	header#header-top #nav-container #menu-top ul li.parent .dropdown header.has-submenu{
		position: relative;
	}
	header#header-top #nav-container #menu-top ul li.parent .dropdown header.has-submenu::after,
	header#header-top #nav-container #menu-top ul li.parent::after {
		content: "\e918";
	}
	header#header-top #nav-container #menu-top ul li.parent .dropdown header.has-submenu::after,
	header#header-top #nav-container #menu-top ul li.parent::after {
		position: absolute;
		right: 1em;
		font-family: 'icon-transn' !important;
		content: "";
		display: inline-block;
		opacity: .8;
		top:1em;
	}
	header#header-top #nav-container #menu-top ul li.parent.next .dropdown header.has-submenu::after,
	header#header-top #nav-container #menu-top ul li.parent.next::after {
		content: "\e919";
	}

	header#header-top nav #menu-top .dropdown {
		position: relative;
		left:auto;
		top:auto;
		width: 100%;
		background:#fff;
		font-size:1em;
	}
	header#header-top nav #menu-top .dropdown .row,
	header#header-top nav #menu-top .dropdown .row .col{
		margin:0;
		padding:0 !important;
	}
	header#header-top nav #menu-top .dropdown .row .row .col:first-child{
		margin-top:-20px;
	}
	
	header nav #menu-top ul li .dropdown h5 {
		margin: 0;
		border-bottom:1px solid #fff;
	}	

	header#header-top #nav-container #menu-top ul li.parent .dropdown a {
		color: #464646;
		border-bottom: 1px solid #464646;
		width: 100%;
		padding: 1em;
	}

	header#header-top #nav-container #menu-top ul li.parent .dropdown ul {
	    padding: 2em 2em 0em 2em;
		display:none;
		line-height:1.5;
	}
	header#header-top #nav-container #menu-top ul li.parent .dropdown ul li,
	header#header-top #nav-container #menu-top ul li.parent .dropdown ul li a {
		color: #464646;
		padding:0;
		border:0;
		font-size:.92em;
	}
	header#header-top #nav-container #menu-top ul li.parent .dropdown ul li a::before {
		font-family: 'icon-transn' !important;
		content: "\e906";
		padding-right:10px;
	}
	header#header-top #nav-container #menu-top ul li.parent .dropdown header.has-submenu > h5 a{
		color:#fff;
		background:#464646;
	}

	header#header-top #menu-top-domain ul li:after {
		display: none;
	}
	header nav #menu-top ul li { 
		font-size: .5m;
	}

	.content-container.main-wrapper {
		padding-top: 70px;
	}
	
/*
	header nav #menu-top ul { margin-left: 50px; }
	header nav #menu-top ul li { font-size: 1.6vw; }
	header nav #menu-top ul li .dropdown > .csc-frame { padding-left: calc(50px - 15px); padding-right: calc(100px - 15px); }
	header nav #menu-top ul li .dropdown > .csc-frame::before { left: 50px; padding-left: 0; width: calc(100% - 50px - 100px); }
	header nav #menu-top ul li .dropdown .row .col { float: left; }
*/

	.row.liste-info-trafic .liste-ligne .card-header button{
		white-space: normal;
	}
	.row.liste-info-trafic .liste-ligne .card-body{
		width: 105% !important;
	}
	
	.full-info-trafic-list div.row-info .linenr span.ligne {
	    font-size: .7em;
	}
	.row.detail-ligne.liste-info-trafic .collier-perle .gridWrap:before {
		line-height: 2em;
	}
	
	#info-trafic-popup #info-trafic-list {
		width: 36.25vw;
	}
	#info-trafic-popup #info-trafic-detail {
		width: 55.66vw;
		margin-left: calc(100% - 56.66vw - 36.25vw);
	}

	.first-block-with-info-trafic .bloc-with-top-margin {
		margin-top:0;	
	}
	#itineraire-form-container,
	.dce.dce-accroche-agenda, .dce.horaire-form, .dce.plan-cantonal {
		height: 32vw;
		width: 100%;
	}
	body#page-6 .dce.horaire-form, body#page-6 .dce.plan-cantonal {
		height: 36vw;
	}
	.dce.horaire-form .horaire-form-select, .dce.horaire-form .horaire-form-top, .dce.plan-cantonal .plan-cantonal-link, .dce.plan-cantonal .plan-cantonal-map {
		height: 16vw;
	}
	body#page-6 .dce.horaire-form .horaire-form-select, 
	body#page-6 .dce.horaire-form .horaire-form-top,
	body#page-6 .dce.plan-cantonal .plan-cantonal-link, 
	body#page-6 .dce.plan-cantonal .plan-cantonal-map {
		height: 18vw;
	}
	.actu-home-image-row .news-latest-item ,
	.actu-home-single-image {
		width: 100%;
	}
	.actu-home::after {
		left: 4vw;
	}
	.actu-home.actu-home-single-image::after {
		left:2vw;
	}

	.liste-ligne{
		margin-top:2em;
		max-width: 50%;
	}
	
	.dce-highlight h3 {
		font-size: 1.857em;
		margin-top: 4.1vw;
		height: 10.54vw;
	}
	
	.faq-sommaire ul li {
		width:9em;
		height: 9em;
	}
	
	.card-body .ce-intext .ce-gallery {
    	max-width: 50%;
	}
	
}
	
footer .footer-left .footer-left-container {
    width:100%;
    padding: 3em 0;
}
footer .footer-right .footer-right-container {
    width:100%;
    padding: 0;
}
.footer-right-container table{
	margin:2em 0;
}
footer .logo-footer img {
    width:100%;
}
			
}




@media (max-width:1024px) and (min-width:993px) {

}

@media (max-width:992px) and (min-width:768px) {

body#page-6 #itineraire-form-container {
    width: 24vw;
}
body#page-6 .dce-illustration .slider .legende {
    top: 8.25vw;
    left: 14.25vw;	
}
#itineraire-form table input[type="submit"],
#itineraire-form span.toggle-iti,
#itineraire-form table input[type="text"] {
    height: 2em;
    border-radius: 1em/50%;
}
#itineraire-form span.toggle-iti {
    line-height: 2em;
}
body#page-6 #itineraire-form #ffdate, 
body#page-6 #itineraire-form #ftime{
	padding:1em 0;
	text-align:center;
}
#itineraire-form em.icon-transn-reverse {
    right: .8em;
}

}


@media only screen and (max-width: 767px) {

	body {
		font-size: 20px;
		line-height: 22px;
	}

	h1{
		font-size:2.214285714285714em;
	}
	h2 {
		font-size:1.657142857142857em;
	}

	h3 {
		font-size:1.042857142857143em;
		font-weight: 700;
	}

	h4{
	}
	
	section > div.frame-layout-10 {
		min-height:auto;
	}
	
	.row .col.margin-bottom-xs {
		margin-bottom: 2em;
	}
	
	.row .col.xs-no-padding-left {
		padding-left:0;
	}
	.row .col.xs-no-padding-right {
		padding-right:0;
	}
	
	.row.align-items-center > div.col > div {
		top: auto;
		transform: none;
	}
	
	#cookieman-modal .modal-content {
    	padding: 5px 0 10px;
	}
	
	
	#searchbox-zone-mobile{
		position:relative;
		height:60px;
		display:none;
		background:#fff;
	}
	#searchbox-zone-mobile #ovsearchbox{
		width:100%;
		float:none;
		padding:0 15px;
	}
	#searchbox-zone-mobile input{
		width: 100%;
		border: 0;
		border-bottom: 1px solid;
		padding-top: 15px;
		padding-bottom: 5px;	
	}
	#searchbox-zone #ovsearchbox{
		display:none;
	}

	#info-trafic-popup {
		top: 50px;
		height: calc(100% + 50px);
	}

	#info-trafic-popup #info-trafic-list {
		float:none;
		width: calc(100% - 2em);
		margin-left:2em;
	}
	#info-trafic-popup #info-trafic-detail {
		float:none;
		width: calc(100% - 2em);
		margin-left: 2em;
		margin-right:0;
		margin-top:1em;
	}

	.dce-illustration .slider .legende {
		width:95%;
		top:5.25vw;
		left:5.25vw; 
		
	}
	.dce-illustration .slider .legend-logo{
		float: none;
	}
	.dce-illustration .slider .legende {
		bottom: auto;
	}
	.dce-illustration .slider .vvisible-xs {	
		border:2px solid #ff0;
	}
	
	
	.dce-illustration3zone .col-illustration .legende h2 {
	    font-size: 1.457142857142857em;
	}
	.dce-illustration3zone .col-bloc-right {
	    font-size: .52em;
		line-height: 1;
	}
	.dce-illustration3zone table {
    	min-height: auto;
	}
	
	
	.agenda-heading-container .col-next-event{
	    font-size: .52em;
		line-height: 1;
	}
	.agenda-heading-container table {
		min-height:auto;
	}
	.agenda-heading-container .col-next-event table table {
		height: 85%;
		width: 85%;
	}
	
	.powermail_fieldset #powermail_field_npacodepostal,
	.Tx-Formhandler #npa,
	.powermail_fieldset #powermail_field_localite,
	.Tx-Formhandler #city{
		width:100%;
		float: none;
	}	

	[type="radio"]:checked + label, [type="radio"]:not(:checked) + label {
		padding-right: 1em;
	}
	
.content-container.main-wrapper {
    padding-top: 50px;
}

body#page-6 #itineraire-form-container {
    margin-top:auto;
    position: relative;
    width: 100%;
	padding:1%;
}

#itineraire-form-container {
    height: auto;
}
#itineraire-form {
	font-size: 0.8em;
}
#itineraire-form em.icon-transn-position {
    top: .5em;
}
#itineraire-form em.icon-transn-reverse {
    top: 1.1em;
}
#itineraire-form table input[type="text"] {
	border-radius: 1.5em/50%;
    padding: 1em;
    height: 3em;
}
#itineraire-form table input[type="submit"],
#itineraire-form span.toggle-iti {
	border-radius: 1.5em/50%;
    padding: 1em;
    height: 3em;
}

.social-home {
    position: relative;
    float: none;
    margin-bottom: 1em;
	width: auto;
/*
    margin-left: calc(100% - 8em);
*/
	background-color:transparent;
	text-align:right;
    margin-right: 0;
    padding: 0;
}
.social-home a {
    background: #464646;
    padding: .5em;
}

section div.frame-layout-11 hr.ce-div {
    border-top: 0 !important;
    margin: 1.25em 0 !important;
}

body#page-6 .dce.horaire-form .horaire-form-select, body#page-6 .dce.horaire-form .horaire-form-top, body#page-6 .dce.plan-cantonal .plan-cantonal-link, body#page-6 .dce.plan-cantonal .plan-cantonal-map {
    height: 100%;
}


section > div.frame-layout-0 {
    padding-left:0;
    padding-right:0;
}
section > div.frame-layout-3 {
	width:100%;
    padding-left:15px;
    padding-right:15px;
}
section > div.frame-layout-10 {
    padding-left: 0;
}

section > div .frame-full-width-xs{
	background:yellow;
}
section > div .frame-full-width-xs > .row{
	margin-left:-30px;
	margin-right:-30px;
}

.first-block-with-info-trafic .bloc-with-top-margin {
    margin-top: 0;
}

.actu-home::after {
    left: 6vw;
}
.actu-home.actu-home-single-image::after {
	left:3vw;
}
.actu-home .btn {
    display: none;
}

.dce.horaire-form,
.dce.plan-cantonal {
    height: 40vw;
    width: 100%;
}
.dce.horaire-form .horaire-form-select, 
.dce.horaire-form .horaire-form-top, 
.dce.plan-cantonal .plan-cantonal-link, 
.dce.plan-cantonal .plan-cantonal-map {
	float:left;
	width:50%;
	height:40vw;
}
.dce.horaire-form .horaire-form-select h3, .dce.plan-cantonal .plan-cantonal-link h3 {
	width:auto;
}
input#line-selector {
    max-width: none;
    width: 85%;
    border-radius: 1em/50%;
    border-radius: 1.5em/50%;
}
.easy-autocomplete-container {
    left: -90% !important;
}
.easy-autocomplete-container ul li, 
.easy-autocomplete-container ul .eac-category {
	white-space:normal;
}

	/* ---- line display --- */
	
	.row.detail-ligne .liste-ligne .gridWrap .row .card-body {
		width: 100%;
	}
	
	.display-line-info {
		padding: 0;
		margin-left: 0;
	}
	.line-info-header-mobile table.tbl-line-no {
		margin-left: 0;
	}
	.line-info-header-mobile table.tbl-line-no td{
		font-size: 1.3em;
		padding-top: .3em;
	}
	.white-zone-with-mark {
		display: none;
		width:0;
		margin-left:0;
	}
	
	.line-info-header-mobile{
		
	}
	.line-info-header-mobile.top-row{
		
	}
	.line-info-header-mobile .tbl-line-title{
		margin:15px;
	}
	.reverse-dir-link.mobile .icon-transn-reversev{
/*
		font-size:2em;
		line-height: 1.7;
		margin:0 .6em;
		color:#464646;
		background: #fff;
		border-radius: 50%;
*/
		margin: 0 .6em;
		color: #464646;
		background: #fff;
		border-radius: 50%;
		width: 1.5em;
		height: 1.5em;
		display: inline-block;
		font-size: 1.2em;
		line-height: 1.5;
		padding-left: .35em;
	}
	.reverse-dir-info{
		font-size: .85em;
	}
	
	body#page-729 #itineraire-form-container {
    	clear: both;
	}
	.itineraire-detail .infotrafic-bloc .info-trafic-sommaire-mark {
		display: none;
	}
	.itineraire-detail .itineraire-line-info table{
	}
	.itineraire-line-info .itineraire-titre{
		font-size:1em;
	}
	
	table.itineraire-result tr.hidden-sm{
		display: block;
	}	
	
	.sommaire-agenda .accroche-item {
	    height: 50vw;
	}
	
	.dce.accroche-libre.rapport-gestion, .dce.rapport-gestion {
		height:auto;
		min-height:60vw;
		padding: 5%;
		width: 60vw;
		margin-bottom: 1.2em;
	}
	
	.dce.billet-abo {
		height: auto;
		min-height: 60vw;
		padding: 5%;
		width: 60vw;
		margin-bottom: 1.2em;
	}
	
	
	.frame-type-header h3{
		padding:0 15px;
	}
	.collapse-zone-mobile table{
		width:calc(100% - 30px);
		margin: 0 15px;
	}
	.collapse-zone-mobile table td{
		width:2em;
	}
	.collapse-zone-mobile table td.pdf-download-info{
		width:calc(100% - 7em);
		font-size:0.75em;
		line-height: 1.2;
	}
	.collapse-zone-mobile table td.pdf-download-link-td{
		width:3em;
	}
	.collapse-zone-mobile table td:last-child{
		text-align: right;
	}
	
	.collapse-zone-mobile .header-info-trafic-mark{
		width:2.5em;
	}
	.collapse-zone-mobile .info-trafic-sommaire-mark:after {
		top: .5em;
		left: 1.7em;
	}

	.faq-sommaire ul li a {
		font-size: .75em;
		line-height: 1;
	}	
	.faq-sommaire ul li {
		width: 6em;
		height: 7em;
	}
	.faq-sommaire ul li [class^="icon-"], .faq-sommaire ul li [class*=" icon-"] {
		padding: .45em;
		font-size: 1.5em;
	}
	
	
	.card-body .ce-intext .ce-gallery {
    	max-width: 100%;
		margin-left:0;
		margin-right:0;
		
		float:none;
		margin-bottom:1em;
	}


footer .row.wrapper-outer{
	margin-left:15px;
}
footer .footer-left .footer-left-container {
    width: 100%;
    float: none;
    padding: 2em;
}
footer .footer-left-menu a {
    float: none;
    width: 100%;
    text-align: center;
    margin: .2em;
}
footer .footer-left-menu #menufooter{
	margin-bottom:2em;
}
footer .footer-left-container div.col-xs-12.col-sm-5{
	text-align:center;
}
footer .footer-right .footer-right-container {
	width:100%;
	padding:0;
    max-width: 100%;
}
footer .footer-right table {
	margin:2em 0;
}
footer .logo-footer img {
    width: 60%;
    max-width: none;
}

.col-12{
	width:100%;
}

}

@media only screen and (max-width: 480px) {

	header#header-top {
		height: 50px;
	}
	header#header-top #logo-top {
		width: 110px;
		margin-top: 0px;
	}
	header#header-top #header-left .logo-top {
		margin-left: 15px;
	}
	header#header-top #header-right {
		top: 10px;
		font-size: .8em;
	}
	header.menuOpen{
		overflow-y: initial;
	}
    
	header #menu-top-domain ul {
		padding: .8em 15px;
	}
	header #menu-top-domain ul li {
		/*width: 33%;*/
		padding:0;
		padding-left:10px;
	}
	
	.row.fond-blanc.tableau-abonnement{
		margin-top:1em;
		margin-bottom: 1em;
	}
	
	.fond-blanc.tableau-abonnement.tableau-abonnement-junior-senior::after, 
	.fond-blanc.tableau-abonnement.tableau-abonnement-junior-senior::before, 
	.fond-blanc.tableau-abonnement.tableau-abonnement-adulte::before{
		top:-2em;
		width: 2em;
		height: 2em;
		line-height: 2;
		font-size: 1.4em;
		margin-left: -5%;
	}

	.dce.dce-accroche-image-fd-couleur h3 {
		font-size: 2em;
		max-width: 80%;
	}
	.dce.dce-accroche-image-fd-couleur {
		background-size: 5em !important;
	}
	.dce.dce-accroche-image-fd-couleur {
		height: 10em;
	}
	
	.frame-highlight .slick-slider {
    	padding-bottom: 20vw;
	}
	
	.dce.dce-highlight.row {
    	height: 520px;
	}
	.dce.dce-highlight.row .highlight-left {
    	height: 300px;
		width: calc(100% - 15vw);
		
		
		background-position-x: 140% !important;
		background-position-y: 60% !important;
		background-size: 70% !important;

		width:100%;

	}
	.dce.dce-highlight.row .highlight-right {
    	height: 200px;
		
		background-color: #f2f2f2 !important;
		background-position: 15vw 15vw !important;
		
		background-position: 15vw -20vw !important;
	    margin-top: 15vw;
		
		background-position:center !important;
	    margin-top: 0;
		
	}
	
	.highlight-left-container-content {
    	max-width: 75%;
	}
	.dce-highlight h3 {
		font-size: 1.557em;
		margin-top: 8.1vw;
		height: 50.54vw;
	}
	
	
	.liste-ligne{
		max-width: none;
	}

	td.corresp span.ligne,
	a.fancyboxcorr {
		text-decoration: none;
		color: #fff;
		background: #7bb600;
		height: 1.5em;
		width: 2.5em;
		font-size: .65em;
		line-height: 1.807em;
		height: 1.507em;
		width: 2.187em;
		border-radius: .7857em;
	}
	
	
	.row.detail-ligne.liste-info-trafic .collier-perle .gridWrap {
		margin-left: 35px;
	}
	.row.detail-ligne.liste-info-trafic .collier-perle .gridWrap:before {
		margin-left: -35px;
		width: 35px;
		height: 35px;
	}
	.row.detail-ligne.liste-info-trafic .collier-perle .gridWrap:before {
	    line-height: 1.7em;
	}	
	.row.detail-ligne.liste-info-trafic .collier-perle .gridWrap:after {
		top: .4em;
		left: -2px;
	}
	.full-info-trafic-list div.row-info .linenr {
		width: 30px;
	}
	.full-info-trafic-list div.row-info .info-detail {
		width: calc(95% - 30px);
	}
	.full-info-trafic-list div.row-info .info-detail h3 {
		font-size: 1em;
	}
	
	.detail-itineraire-line-info table tr.title td.symbol{
		min-width: 50px;
	}

	.timeline .minute {
		padding-left: 0em;
	}
	
}


