_specifics.scss 33.2 KB
Newer Older
1
/* COLORS */
Simon Daron's avatar
Simon Daron committed
2

3 4
$black: #000000;
$white: #FFFFFF;
5 6
$primary: #FF7E83;
$secondary: #0062CB;
fred's avatar
fred committed
7

8
/****************************************************/
Simon Daron's avatar
Simon Daron committed
9
/* FONTS */
10

11
.resymbol:hover,.control:hover{    opacity:0.5;    }
12
.date, .dateBloc {
Simon Daron's avatar
Simon Daron committed
13 14
	font-family: "Reglo";
	text-transform: uppercase;
Simon Daron's avatar
Simon Daron committed
15
}
16 17 18
.inline .date, .resume .date{
	text-align: center;
}
19
.dateBloc{width:4em;
20 21
	text-align: center;}
.dateBloc{display:inline-block;}
Simon Daron's avatar
Simon Daron committed
22
.dateBloc *{line-height: 100%;}
Simon Daron's avatar
Simon Daron committed
23 24
.dateBloc  .day {font-size: 1.8em;}
.dateBloc .number {font-size: 1.8em;}
Simon Daron's avatar
Simon Daron committed
25
.dateBloc  .month {font-size: 0.8em;}
Simon Daron's avatar
Simon Daron committed
26
.dateBloc .time {font-size: 1.2em;margin: 0.2em 0;}
Simon Daron's avatar
Simon Daron committed
27

28
.dateBloc.small{
29
	font-size: 80%;
30
}
31

32 33 34 35 36 37
.date.smooth {
	text-transform: none;
	font-size: 100%;
	font-family: RegloNormal;
}

Simon Daron's avatar
Simon Daron committed
38 39 40 41
.tabs .ui-tabs-nav {
    font-family: "Reglo";
    text-transform: uppercase;
}
42
.legend{
43
	font-family: "Reglo";
44 45 46 47 48
	font-size:1.2em;
	border-bottom:3px solid black;
	padding: 0.2em 0 0.2em 0;
	margin: 0.2em 0 0.2em 0;
}
Simon Daron's avatar
Simon Daron committed
49
#Main .sectionLabel{
50 51
	margin-bottom:1em;
}
Simon Daron's avatar
Simon Daron committed
52

Simon Daron's avatar
Simon Daron committed
53
.sectionLabel, .label {
Simon Daron's avatar
Simon Daron committed
54 55 56
    text-transform: uppercase;
    font-family: "Reglo";
    font-size:1.3em;
57
}
58 59 60 61 62 63 64

.rightPart .right.sectionLabel {
	text-transform: none;
	border-bottom: 1px solid black;
	padding-bottom: 3px;
}

65
h5.focus-title {
66
	color: $secondary;
67 68
}

69 70 71 72 73
.rightPart #search-form {
	text-align: right;
	margin-bottom: 2em;
}

74
.label.relative{
Simon Daron's avatar
Simon Daron committed
75 76 77 78 79 80 81
    background-color:black;
    position: absolute;
    left:10px;
    top:-5px;
    color:white;
    padding:5px 7px 0px 7px;
}
Simon Daron's avatar
Simon Daron committed
82

83 84 85 86 87 88 89 90
#RefreshWhatsOnAir {
	opacity: 0.2;
}

#RefreshWhatsOnAir.spinning {
	opacity: 0.8;
}

Simon Daron's avatar
Simon Daron committed
91 92 93
/****************************************************/
/* WRAPPER */
/****************************************************/
94
.wrapper {max-width: 1560px; padding:0 1%;}
Simon Daron's avatar
Simon Daron committed
95
.wrapper.text {max-width: 780px; margin:auto;}
96
.wrapper .rightPart{margin-top:1em;}
Simon Daron's avatar
Simon Daron committed
97

98
@media screen and (min-width: 760px) {
99 100 101 102 103
	#player-container.fixed {
		position: fixed;
		top: 50px;
		width: calc(0% + 235px);
	}
104 105 106
	.wrapper .rightPart{
        margin-top:0;
	}
Simon Daron's avatar
Simon Daron committed
107
	.wrapper.sided .leftPart,
108
	.wrapper.sided .rightPart{
Simon Daron's avatar
Simon Daron committed
109 110
		width:45%;
	}
111 112 113 114
	.wrapper.navigation .leftPart{
		width:60%;
	}
	.wrapper.navigation .rightPart{
115
		width:35%;
116 117
	}
	.wrapper .leftPart{
Simon Daron's avatar
Simon Daron committed
118 119
		float:left;
	}
120
	.wrapper .rightPart{
Simon Daron's avatar
Simon Daron committed
121 122
		float:right;
	}
123 124 125
	#specialHome {
		padding-left: 0;
	}
126
    /*
127 128
	#specialHome .leftPart,
	#specialHome .rightPart {
129 130
		width: 100%;
	}
131
    */
fred's avatar
fred committed
132
	p.intro {
133 134
		padding-top: 0px;
		padding-bottom: 40px;
fred's avatar
fred committed
135
	}
136 137 138
}


139 140 141 142 143 144 145 146 147
button.control, button.symbol{background:transparent;border:none;margin:0;padding:0;}
nav.menu{
	width:100%;
	text-align: justify;
	text-justify: distribute-all-lines;
}
nav.menu li{
	display: inline-block;
	margin-right:2em;
Simon Daron's avatar
Simon Daron committed
148 149
}

Simon Daron's avatar
Simon Daron committed
150
button.tag, a.tag{
Simon Daron's avatar
Simon Daron committed
151 152
	font-size:0.9em;
	background:white;
153
	font-family: "RegloBold";
Simon Daron's avatar
Simon Daron committed
154
	text-transform: uppercase;
155
	display:inline-block;
Simon Daron's avatar
Simon Daron committed
156
	border: 1px solid #CCC !important;
Simon Daron's avatar
Simon Daron committed
157
	color:#342E2E;
Simon Daron's avatar
Simon Daron committed
158 159 160 161 162
	margin: 0.2em;
	padding: 0.3em;
	border-radius: 0.7em;
	-moz-border-radius: 0.7em;
	-webkit-border-radius: 0.7em;
Simon Daron's avatar
Simon Daron committed
163
}
Simon Daron's avatar
Simon Daron committed
164
button.check, a.check {
Simon Daron's avatar
Simon Daron committed
165 166 167 168
	font-size:0.9em;
	text-transform: none;
	display:inline-block;
	margin: 0.2em;
169
	padding: 0.3em;
Simon Daron's avatar
Simon Daron committed
170
}
fred's avatar
fred committed
171

Simon Daron's avatar
Simon Daron committed
172 173 174 175
.category{
	font-family: "RegloBold";
	text-transform: uppercase;
}
Simon Daron's avatar
Simon Daron committed
176
button.check:before, a.check:before {
Simon Daron's avatar
Simon Daron committed
177 178 179
	display:inline-block;
	width:1.5em;
}
180 181 182 183 184 185 186 187
.box{
	padding:0.2em 0.5em 0.2em 0.5em;
	border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	-webkit-border-radius: 0.2em;
	background:#222;
	color:#fff;
}
188
.ui-tooltip {
189
	border:1px solid white;
190 191 192 193 194 195 196
	position:absolute;
	margin:0;	
	padding: 0.5em;
	background:#222;
	color: white;
	z-index: 9999;
	max-width: 50%;
197 198 199
	background: white;
	color: #222;
	border-color: #222;
200
}
Simon Daron's avatar
Simon Daron committed
201 202
/****************************************************/
/**** BODY ****/
203 204
/****************************************************/
body{
205
	background: white;
206
	color: #333;
207
}
Simon Daron's avatar
Simon Daron committed
208 209 210 211
/****************************************************/
/**** metaNAV ****/
/****************************************************/

Simon Daron's avatar
Simon Daron committed
212
#metaNav {
213 214
	color: #e8e8e8;
	background-color: #3a3a3a;
Simon Daron's avatar
Simon Daron committed
215
	position:fixed;
laron's avatar
laron committed
216
	z-index:1000;
Simon Daron's avatar
Simon Daron committed
217 218
	top:0px;
	width:100%;
fred's avatar
fred committed
219
	font-size: 90%;
Simon Daron's avatar
Simon Daron committed
220
}
Simon Daron's avatar
Simon Daron committed
221 222
#metaNav ul{
}
Simon Daron's avatar
Simon Daron committed
223
#metaNav ul li{
224 225
	float: left;
	padding: 0 1em;
Simon Daron's avatar
Simon Daron committed
226 227 228 229
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow:hidden;
}
230 231 232 233 234

#metaNav ul li#nav-search {
	float: right;
}

Simon Daron's avatar
Simon Daron committed
235
#metaNav ul li a{
236 237
	height: 2em;
	display:block;
Simon Daron's avatar
Simon Daron committed
238
}
239

fred's avatar
fred committed
240 241 242 243 244 245 246 247 248 249
#metaNav ul li#nav-language span {
	cursor: pointer;
	padding:0.4em 0 0.5em 0;
	display: inline-block;
}

#metaNav ul li#nav-language span.lang-on {
	color: white;
}

250
#metaNav ul li a span{
251
    padding:0.4em 0 0.5em 0;
252 253
	display:inline-block;
}
254

255 256 257
#metaNav ul li a span.nav-icon {
}

Simon Daron's avatar
Simon Daron committed
258 259 260 261
#metaNav a:focus, #metaNav a:hover{
    opacity:0.8;
}
#metaNav ul li.active, #metaNav ul li.active a{
262
	color: white;
263
}
264 265 266 267

#metaNav ul li.active span.iconLabel {
}

fred's avatar
fred committed
268 269 270 271 272
#metaNav li#nav-search a {
	display: inline;
}

#metaNav form {
fred's avatar
fred committed
273 274
	display: inline-block;
	padding-top: 0.2em;
fred's avatar
fred committed
275 276 277 278
}

#metaNav input {
	border: 1px solid #ececec;
fred's avatar
fred committed
279
	width: 10em;
fred's avatar
fred committed
280 281
}

fred's avatar
fred committed
282 283 284 285
.icon-rss {
	color: orange;
}

286
@media screen and (max-width:760px){
287
	#bg-title { display: none; }
Simon Daron's avatar
Simon Daron committed
288
	#metaNav .iconLabel {display:none;}
289
	#metaNav ul li a span.nav-icon { display: inline-block; }
290 291 292 293 294 295
	#metaNav ul li {
		padding: 0;
	}
	#metaNav ul li a {
		padding: 0 1em;
	}
fred's avatar
fred committed
296 297 298
	#metaNav form {
		display: none;
	}
299 300 301
	#metaNav ul li#nav-language {
		padding: 0.2em 0 0 1em;
	}
302 303 304
	div#Changing {
		margin: 0 5px;
	}
305 306 307 308 309 310 311 312
}
@media screen and (max-width:400px){
	#metaNav ul li#nav-language {
		padding: 0.2em 0 0 1ex;
	}
	#metaNav ul li a {
		padding: 0 1ex;
	}
Simon Daron's avatar
Simon Daron committed
313
}
314 315 316 317 318

/****************************************************/
/**** Commons ****/
/****************************************************/

319
.audio button {color:$primary !important;}
320 321 322
/****************************************************/
/**** HEADER ****/
/****************************************************/
Simon Daron's avatar
Simon Daron committed
323

324
/* PANIK LOGO */
325
#Commons{
326 327
	position: relative;
	z-index: 5;
328
}
329
#Commons .wrapper{
Simon Daron's avatar
Simon Daron committed
330
}
331
#mainHeader {
Simon Daron's avatar
Simon Daron committed
332
	padding-bottom:1em;
333 334 335
}
#mainHeader {
    font-size:70%;
336 337 338 339
}
#mainHeader *{color:black !important;line-height:1em;}
#mainHeader #radioPanik{}

340
#Panik img{display:block;margin:auto;max-height:200px;}
341
#mainHeader h1{
Simon Daron's avatar
Simon Daron committed
342
	padding-left:75px;
343 344 345
}
#player-container #player{
    padding:0 0 0 0;
346
    min-width: 240px;
347
}
348

349 350 351
#Changing h1.top a:hover {
	opacity: 1.0;
}
352

353
@media screen and (max-width: 760px) {
354 355
	#All h1.top {
		font-size: 60px;
356 357 358
		padding: 0;
		padding-top: 10px;
		text-align: center;
359 360 361 362
	}
	#specialHome .leftPart h1.top {
		display: none;
	}
363 364 365 366
	#specialHome .leftPart h2 {
		padding-top: 10px;
		text-align: center;
	}
367
}
368

369
@media screen and (min-width: 760px) {
370 371 372
	#Commons {
		float: left;
		width: 20%;
373 374
		width: -webkit-calc(0% + 240px);
		width: -moz-calc(0% + 240px);
375
		width: calc(0% + 240px);
376 377
	}
	#Changing {
378
		position: relative;
379 380
		float: right;
		width: 78%;
381 382
		width: -webkit-calc(100% - 280px);
		width: -moz-calc(100% - 280px);
383
		width: calc(100% - 280px);
384 385 386
	}
	#All h1.top {
		font-size: 120px;
387
		font-family: RegloScale;
388 389
		text-transform: uppercase;
		padding-left: 0;
390
		padding-top: 40px;
391
		padding-bottom: 0;
392 393
	}

fred's avatar
fred committed
394 395 396 397 398 399 400
	#metaNav {
		padding-top: 2px;
	}
	#metaNav .nav-icon {
		display: none !important;
	}

401 402 403 404
	ul#ticker {
		margin-bottom: 10px;
	}

fred's avatar
fred committed
405
	#News div.mainSub,
406 407 408
	#About div.mainSub,
	#Emissions div.mainSub {
		position: absolute;
409
		top: 50px;
410
		left: 320px;
411
		width: 60%;
412
		width: calc(98% - 320px);
413 414
	}

fred's avatar
fred committed
415
	#News div.mainSub ul,
416 417 418 419 420 421 422
	#About div.mainSub ul,
	#Emissions div.mainSub ul {
		padding: 0;
		font-family: Reglo;
		font-weight: normal;
	}

fred's avatar
fred committed
423
	#News div.mainSub ul li,
424 425 426 427
	#About div.mainSub ul li,
	#Emissions div.mainSub ul li {
	}

fred's avatar
fred committed
428 429 430 431 432 433 434 435
	#News .news.wrapper {
		padding: 0;
	}

	#News .news.wrapper li a {
		margin-left: 0;
		padding-left: 0;
	}
436 437 438 439 440 441

	#Nav header.marged,
	#Main > .marged {
		margin: 0;
	}

442
	#Related .wrapper,
443
	#Main > .wrapper,
444
	#Main > .soundfiles > .wrapper,
fred's avatar
fred committed
445
	#Main > .news > .wrapper,
446 447 448 449 450 451 452 453
	#Nav > .wrapper {
		padding-left: 0;
	}

	#All #Nav nav ul {
		margin-top: 0;
	}

454
	#Related .padded,
455 456 457 458 459
	div.program.padded {
		padding-top: 0;
		padding-left: 0;
	}

fred's avatar
fred committed
460 461 462 463
	div.program.padded {
		padding-top: 1.5em;
	}

464 465 466 467 468
	#fiber-content h2.title {
		margin-top: 0;
		padding-top: 0;
	}

469
}
470

471
#backgroundBox {
472
	background: transparent center 40px no-repeat url(../img/Radio_Panik_Logo_2016-01.png);
473
}
474

475 476 477 478 479 480 481
#All #backgroundBox h1.top {
	font-size: 50px;
	padding-left: 10px;
	width: 200%;
}

#backgroundBox h1 {
482
	color: $primary !important;
483 484
}

485 486 487
#All h1.top#radiopanik {
	padding-top: 0;
	color: black !important;
fred's avatar
fred committed
488 489 490 491 492 493
	padding-bottom: 30px;
        height: 130px;
}

#All #backgroundBox h1 {
	visibility: hidden;
494 495 496
}


497
#specialHome div.rightPart h1,
498
div.focus {
499
	color: $secondary;
500 501
}

502
h1.top#frequence {
503
	color: $primary;
504 505
}

506 507
/****************************************************/
/****  SCREEN NAV ****/
Simon Daron's avatar
Simon Daron committed
508
#Nav nav{padding:0.1em;}
509

Simon Daron's avatar
Simon Daron committed
510
#Nav input{color:#333;}
511 512 513 514 515 516 517
#Nav ul li button,
#Nav ul li a {
	border-width:0 0 2px 0;
	border-style: solid;
	border-color: transparent;
}

518
#Nav .current,
Simon Daron's avatar
Simon Daron committed
519
#Nav .active,#Nav .icon-check,#Nav .active *{
520
	font-weight: normal;
521 522
}

fred's avatar
fred committed
523
#Nav .selected a,
524 525
#Nav ul li.current a, #Nav ul a.active, #Nav button.active {
	border-color: #333;
526
}
Simon Daron's avatar
Simon Daron committed
527

Simon Daron's avatar
Simon Daron committed
528 529
#Nav nav{
	margin:0;
530
}
531 532

#specialHome h2,
533 534
#Nav h2{
	margin:0;
535
	padding:0;
536 537 538 539 540
}
#Nav nav ul{
	margin:1em 0 1em 0;
}

541 542 543 544
#Nav li {
	padding-right: 1em;
}

545 546 547
#Nav li a{
	display: inline-block;
}
548
#Nav nav ul.distributed li {padding: 0;}
549

550 551
#fiber-nav{
    font-size:150%;
Simon Daron's avatar
Simon Daron committed
552
	border-width:0 0 2px 0;border-style:solid;
553 554 555 556 557 558 559 560 561 562
}
#fiber-nav li, #fiber-nav li a{
	display:block;
}
#fiber-nav ul{
	padding:0.5em;
}
#fiber-nav li a{
	padding:0.5em;
}
563 564
#fiber-nav .selected > a,
#fiber-nav .current {
565 566
    font-weight:bold;
}
567

Simon Daron's avatar
Simon Daron committed
568 569
/****************************************************/
/**** PLAYER ****/
Simon Daron's avatar
Simon Daron committed
570
/****************************************************/
laron's avatar
laron committed
571
/*#Home #player{   float: left; } */
572 573

#player-container,
574
   #player-container *{border-color:$primary !important;color:$primary !important;}
575

576
#player-container .metas, #player-container img{border-color:#fff;}
577
#player-container .padded{padding:0.3em;}
Simon Daron's avatar
Simon Daron committed
578

Simon Daron's avatar
Simon Daron committed
579
#player-container button,#player-container a{
Simon Daron's avatar
Simon Daron committed
580 581
}
#player-container .metas{
582
    float:right;
Simon Daron's avatar
Simon Daron committed
583
}
Simon Daron's avatar
Simon Daron committed
584 585 586
#DirectStreamPanikControler {
	display:inline !important;
}
587
#chatSymbol,
Simon Daron's avatar
Simon Daron committed
588
#streamSymbol{
Simon Daron's avatar
Simon Daron committed
589
	font-size:3em;
Simon Daron's avatar
Simon Daron committed
590 591
	float:left;
	margin-right:5px;
592 593
	position: relative;
	z-index: 10;
594
	top: -6px;
Simon Daron's avatar
Simon Daron committed
595
}
Simon Daron's avatar
Simon Daron committed
596
#CurrentlyPlaying{
Simon Daron's avatar
Simon Daron committed
597 598
	padding:0 0 0 0;
}
599 600 601

#Player.withPlaylist #player-container #Playlist{
	border-top:2px solid black;
602
}
603
#Player.withPlaylist #player-container #Playlist{
604 605 606 607
	margin-top: 1em;
	padding-top: 1em;
}

608
#player-container #myPlaylist {
609 610 611 612 613
	clear: both;
	padding: 1em 0 0 0;
	height: auto;
}

614
#player-container #myPlaylist a {
615 616 617 618 619
	margin-right: 30px;
	white-space: normal;
	padding-bottom: 1ex;
}

620 621 622 623 624 625 626 627 628 629
#player-container.minimized{
	width:auto;
	border-width:0px 2px 2px 0 !important;
	border-bottom-right-radius:1em;
	-moz-border-bottom-right-radius:1em;
	-webkit-border-bottom-right-radius:1em;
}
#player-container.minimized #player{
	padding:0;
}
Simon Daron's avatar
Simon Daron committed
630

631
/*Playlist*/
632

633
#Playlist #playlistLabel{
634 635 636
	float:right;

}
637 638 639
#Playlist .playListControls{	
}
#Playlist .playListControls button{	
640
	margin-right:0.5em;
641
	display:inline-block;
642
}
643
#Playlist .playListControls .playPause{
Simon Daron's avatar
Simon Daron committed
644
	font-size:3em;
645
	margin-right:5px;
646
	float:left;
647 648
	position: relative;
	top: -8px;
649 650
}

651
#Playlist .playing .icon-pause{
652 653 654 655 656
   -webkit-animation: loading 1s infinite linear;
   -moz-animation: loading 1s infinite linear;
   -o-animation: loading 1s infinite linear;
   animation: loading 1s infinite linear;
}
657
#Playlist .playlistControls button,#Playlist .playlistControls .button{
658
	margin:0 0.1em 0 0.1em;
659
}
660 661 662
#Playlist li{
	clear:right;
}
663
#Playlist .soundControls button{}
664 665

#player-container #Playlist ol{
666
	clear:right;
667 668
	padding:0;
	margin-left: 50px;
669 670
}
#player-container #Playlist ol li{
Simon Daron's avatar
Simon Daron committed
671
	line-height:1.3em;
672 673
	padding:0;
	margin:0;
674
}
675 676 677 678 679 680
#Playlist ol li .soundControls{
	line-height:1.5em;
	height:1.5em;
	clear:right;
	float:right;
}
681
#Playlist ol li .title{
682 683
	margin-right:70px;
	display:block;
684 685 686
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
687
}
Simon Daron's avatar
Simon Daron committed
688
#player .active{
689
	text-transform:uppercase;
Simon Daron's avatar
Simon Daron committed
690 691 692 693 694
	font-weight:bold;
}
/*limit height of playlist*/
#player #CurrentlyPlaying,
 #player-container #Playlist ol{
Simon Daron's avatar
Simon Daron committed
695
	opacity:0.9;
Simon Daron's avatar
Simon Daron committed
696
	padding-top:0.2em;
697
	height:auto;
698
	overflow: hidden;
699
}
Simon Daron's avatar
Simon Daron committed
700

701
@media screen and (max-width: 760px) {
fred's avatar
fred committed
702
        #backgroundBox {
fred's avatar
fred committed
703
                background-position: center 30px;
fred's avatar
fred committed
704 705 706 707 708
                background-size: 130px;
        }
        #All h1.top#radiopanik {
                height: 80px;
        }
709
	#Player{
Simon Daron's avatar
Simon Daron committed
710
        margin-top:1em;
711
    }
712 713 714
	#Player.withPlaylist #player-container #audioPlayer,
	  #Player.withPlaylist #player-container #audioPlayer,
	   #Player.withPlaylist #player-container #Playlist{
Simon Daron's avatar
Simon Daron committed
715 716
		float:none !important;
		width:auto !important;
717
        border-right:none !important;
Simon Daron's avatar
Simon Daron committed
718 719
		max-width:auto !important;
	}
720

fred's avatar
fred committed
721 722 723 724
	#player.on-chat-page {
		display: none;
	}

725 726 727 728 729 730 731
	div.chat-page .rightPart {
		font-size: 95%;
		margin-top: 4em;
		padding-top: 1em;
		border-top: 1px solid #777;
	}

Simon Daron's avatar
Simon Daron committed
732
}
733

734 735 736 737
/****************************************************/
/**** #Changing #Footer ... ****/
/****************************************************/
#Changing{
738 739 740
	display: flex;
	flex-direction: column;
	min-height: 97vh;
741
}
742

743
#Main{
744
	flex-grow: 1;
745
	color:#333;
746 747
	position: relative;
	z-index: 1;
748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775
}
#Main >.wrapper{
	padding-bottom:2em;
}
#Home #Main{
	min-height:0;
}
#Changing a:hover,#Changing button:hover {
	opacity:0.6;
	text-decoration:none;
}
/* GLOBAL SITE NAV */
#userLog{
	z-index:2000;
	position: fixed;
	bottom: 0px;
	right: 0px;
}
#userLog .log{
	margin:0.3em;
	-moz-box-shadow: 0px 0px 3px #000;
	-webkit-box-shadow: 0px 0px 3px #000;
	box-shadow: 0px 0px 3px #000;
	border-radius:0.5em;-moz-border-radius:0.5em;-webkit-border-radius:0.5em;
	text-align:center;
	padding: 0.3em;
	font-size:0.9em;
	color:black;
776
	background-color:$primary;
777 778 779 780 781 782 783 784 785 786 787 788 789
	border: 2px solid black;
	background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.04) 50%, rgba(0, 0, 0, 0.04) 75%, transparent 75%, transparent);
}
#userLog .log.info{
	background-color:grey;
	color:white;
}
#userLog .log.ok{
	background-color:green;
	border-color:black;
	color:white;
}
#userLog .log.error{
790
	background-color:$primary;
791 792 793 794 795 796 797 798 799 800 801 802 803
	border-color:yellow;
}
#main {}
#mainLegend{
	width:30%;
	text-align:right;
	float:right;
	padding:1em;
}

#Footer{
	border-top:2px solid #333;
	padding-top: 2em;
804
	padding-bottom: 80px;
805 806
	position: relative;
	z-index: 3;
807 808 809 810 811 812 813 814 815 816 817 818 819
}

#Footer ul {
}

#Footer ul li {
	padding-right: 2em;
}

#Footer a:hover {
	opacity:0.6;
}

Simon Daron's avatar
Simon Daron committed
820

Simon Daron's avatar
Simon Daron committed
821
/****************************************************/
Simon Daron's avatar
Simon Daron committed
822
.inline .link{display:block;padding:1em;}
laron's avatar
laron committed
823
/**** Liste   ****/
Simon Daron's avatar
Simon Daron committed
824
/**** EMISSIONS ****/
825
#Emission .emission-detail .title{}
Simon Daron's avatar
Simon Daron committed
826
/*
827
*/
828 829 830
#Emission-tabs-menu .sub{
	margin-bottom:1em;
}
Simon Daron's avatar
Simon Daron committed
831
/**** Detail	****/
Simon Daron's avatar
Simon Daron committed
832 833
.emission-detail .metas{
	line-height:1.5em;
834
	float: left;
835
	width: 49%;
836
	margin-top: 0;
Simon Daron's avatar
Simon Daron committed
837
}
838 839 840 841 842 843 844

.emission-detail h4.subtitle {
	margin-top: 1em;
	font-weight: normal;
	font-family: 'Reglo';
	text-transform: none;
	float: left;
Simon Daron's avatar
Simon Daron committed
845
}
846 847 848 849 850 851

.emission-detail ul.schedule {
	margin-top: 0;
	margin-bottom: 1em;
 }

852 853 854 855
.emission-detail ul.schedule .weekdiff {
	font-size: 80%;
}

856 857 858 859
.emission-detail article {
	clear: both;
}

860
.emission-detail .logo{
Simon Daron's avatar
Simon Daron committed
861
	float:right;
862 863
	width: 50%;
	margin-bottom: 1ex;
864
}
Simon Daron's avatar
Simon Daron committed
865 866 867 868 869 870 871 872 873 874 875 876
@media screen and (max-width: 300px) {
	.emission-detail .metas {
		float: none;
		width: auto;
		margin: 0;
	}
	.emission-detail .logo{max-width:100%;}
}
.emission .mainHeader {
    overflow: hidden;
    margin-bottom:1.5em;
}
fred's avatar
fred committed
877 878 879 880 881

.emission .contacts {
	clear: both;
}

Simon Daron's avatar
Simon Daron committed
882
/**** Inline	****/
Simon Daron's avatar
Simon Daron committed
883
.emission.inline, .emission.resume {
Simon Daron's avatar
Simon Daron committed
884
	padding:1em 0 1em 0;
Simon Daron's avatar
Simon Daron committed
885 886
}

Simon Daron's avatar
Simon Daron committed
887
.emission.inline div.date {
Simon Daron's avatar
Simon Daron committed
888 889 890 891 892 893
	min-height: 3em;
	text-align: center;
	display:inline-block;
	float:left;
	margin-right:1em;
}
Simon Daron's avatar
Simon Daron committed
894 895
.emission .archived {
	opacity:0.6;
Simon Daron's avatar
Simon Daron committed
896 897
}

fred's avatar
fred committed
898
.emission .link .description {
Simon Daron's avatar
Simon Daron committed
899 900 901 902 903 904
	margin: 0px 0 5px 0;
	font-family: "RegloMedium";
}


/**** EPISODE ****/
905
/**** Detail  ****/
Simon Daron's avatar
Simon Daron committed
906 907 908

.episode .tag{
}
Simon Daron's avatar
Simon Daron committed
909
.episode.resume, .episode.inline{
Simon Daron's avatar
Simon Daron committed
910 911 912 913
	padding:1em 0.5em 1em;
}
.episode.inline .dateBloc, .episode.resume .dateBloc{
	float:left;
Simon Daron's avatar
Simon Daron committed
914
}
915
.episode.resume img {
Simon Daron's avatar
Simon Daron committed
916 917 918
	border: 2px solid black;
}

919
.episode.resume .title{
920
	margin-bottom:0.5em;
Simon Daron's avatar
Simon Daron committed
921
}
922
.episode.resume .logo{
Simon Daron's avatar
Simon Daron committed
923 924
	float: right;
}
fred's avatar
fred committed
925
.topik.inline .logo,
926
.episode.inline .logo {
927
	min-height: 50px;
928
	float: left;
929
	margin-right: 1em;
930
}
931 932
.episode.resume .sound{
	float:right;
933
	margin:0 0 0.5em 0.5em;
934
}
935 936
.episode.inline .sound.right{
	text-align:center;
937 938 939
	font-size:70%;
	position: relative;
	z-index: 10;
940 941
}
.episode.inline .sound.right button{
942 943
    font-size:1.5em;
	display:inline;
Simon Daron's avatar
Simon Daron committed
944 945
	text-align:center;
	padding-bottom:0.05em;
946
}
947 948 949 950 951 952
.episode.resume .sound.right .icon-download{
	text-align:center;
}
.episode.resume .sound.right .icon-download{
	display:block;
}
953 954 955 956 957 958 959 960

.big.icon-pause,
.big.icon-stop,
.big.icon-share {
	display: inline-block;
	vertical-align: middle;
}

961 962 963
.episode.detail .logo.right{
	max-width:50%;
}
Simon Daron's avatar
Simon Daron committed
964

965
.episode.resume .date .day, .emission-detail .date .day {
Simon Daron's avatar
Simon Daron committed
966 967
}

968
.episode.resume .content {
969
	padding-left: 5em;
Simon Daron's avatar
Simon Daron committed
970
}
971
.episode.resume .content .title {
Simon Daron's avatar
Simon Daron committed
972 973
}

974
.episode.resume .logo {
975
	margin:0 0 1em;
Simon Daron's avatar
Simon Daron committed
976 977
	max-width:20%;
}
978 979
.episode.inline .date{
	font-size:80%;
980
}
981

982 983 984 985 986 987 988 989
#Emission-tabs-menu .emissions-newsitems {
	margin-bottom: 2em;
}

#Emission-tabs-menu .emissions-newsitems ul.list li {
	border: 0;
}

fred's avatar
fred committed
990 991 992 993 994 995 996 997 998
#Emission-tabs-menu .futur-episodes h5,
#Emission-tabs-menu .recent-episodes h5 {
	font-size: 1.2em;
}

#Emission-tabs-menu #search-form {
	margin-bottom: 1em;
}

999 1000 1001 1002 1003 1004
div.extra-soundfiles h3 {
	margin-top: 1em;
	font-size: 2.5em;
}

div.extra-soundfiles ul li {
fred's avatar
fred committed
1005 1006 1007
	position: relative;
}

1008
div.extra-soundfiles ul li div.audio {
fred's avatar
fred committed
1009 1010 1011 1012 1013 1014 1015
	display: inline;
	top: 5px;
	right: 0;
	position: absolute;
	font-size: 60%;
}

1016
div.extra-soundfiles ul strong {
1017 1018 1019
	padding-right: 3em;
}

1020 1021 1022 1023 1024 1025 1026 1027 1028 1029
@media screen and (max-width: 400px) {	
	.episode .dateBloc{
		width:4em;
		font-size:80%
	}

	.episode.resume .content {
		padding-left: 4em;
	}
}
Simon Daron's avatar
Simon Daron committed
1030

1031
/****************************************************/
Simon Daron's avatar
Simon Daron committed
1032
/**** News ****/
Simon Daron's avatar
Simon Daron committed
1033

1034 1035 1036 1037
#newsRoll {
	max-width: 500px;
}

1038 1039 1040 1041
#newsRoll li {
	background: white;
}

Simon Daron's avatar
Simon Daron committed
1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056
.newsRoll .title{
	background:black;
	color:white;
	bottom:0px;
	opacity:0.9;
    width:100%;
	text-align: left;
	font-family: "RegloBold";
	position: absolute;
	left: 0;
}
.newsRoll .title div{
	padding: 1em;
}
.newsRoll a, .newsRoll button img{
1057
    border:3px solid $secondary;
Simon Daron's avatar
Simon Daron committed
1058 1059
}

1060 1061 1062 1063
.newsRoll .by3 button {
	width: 100%;
}

1064
.soundfiles .special a,
1065 1066 1067 1068 1069
.news .special a {
	position: relative;
}

.special .labels .item,
Simon Daron's avatar
Simon Daron committed
1070 1071
.newsRoll .labels .item{
	display:block;
1072
	background: $secondary;
Simon Daron's avatar
Simon Daron committed
1073 1074 1075 1076 1077
	color:white;
	margin:0.1em;
	font-size:0.9em;
	padding:0.3em;
}
1078 1079 1080
.newsList .current a{
    opacity:0.5;
}
Simon Daron's avatar
Simon Daron committed
1081
/****************************************************/
1082 1083
.list.news li {
}
1084 1085

.soundfiles ul.custom li a,
1086
.news ul.custom li a { max-width: 98%; }
1087
.news li.item a {padding:1em;}
1088

1089
.logo img{
1090 1091
	display:block;
	border-style:solid;
fred's avatar
fred committed
1092
	border-width:3px;
1093 1094
}
ul.newsSpecial{
fred's avatar
fred committed
1095
	border-bottom:3px solid #ccc;
1096
}
1097 1098
@media only screen and (max-width: 970px) {
	.columns {column-count: 1;	-webkit-column-count: 1;	-moz-column-count: 1;}
1099 1100
}

1101

1102 1103 1104 1105
/****************************************************/
/**** Home & ****/
/****************************************************/

Simon Daron's avatar
Simon Daron committed
1106 1107 1108 1109 1110 1111
#Home #Nav .wrapper{
	max-width:auto !important;
	width:auto !important;
}

/*
1112
@media screen and (max-width:800px){
Simon Daron's avatar
Simon Daron committed
1113
	#Home .newsRoll .logo{
1114 1115 1116 1117
		max-width:100px;
	}
}
@media screen and (max-width:600px){
Simon Daron's avatar
Simon Daron committed
1118
	#Home .newsRoll .logo{
1119 1120 1121
		max-width:50px;
	}
}
Simon Daron's avatar
Simon Daron committed
1122
*/
Simon Daron's avatar
Simon Daron committed
1123

1124
/****************************************************/
Simon Daron's avatar
Simon Daron committed
1125
/**** PROGRAM ****/
Simon Daron's avatar
Simon Daron committed
1126
/****************************************************/
Simon Daron's avatar
Simon Daron committed
1127

Simon Daron's avatar
Simon Daron committed
1128
.program.tabs nav ul li{
1129 1130 1131 1132
	display:table-cell;
	width:14%;
	text-align:center;
}
1133 1134 1135 1136 1137 1138

.program.tabs nav ul li.week-arrow {
	width: 1%;
	padding-bottom: 5px;
}

Simon Daron's avatar
Simon Daron committed
1139
.program ul .dateBloc {
Simon Daron's avatar
Simon Daron committed
1140 1141
	float:left;
	padding-top:1em;
Simon Daron's avatar
Simon Daron committed
1142
}
Simon Daron's avatar
Simon Daron committed
1143 1144 1145
.program ul .schedule {
	margin-left:5em;
}
1146
.program .nonstop {
1147
	text-align:left;
1148
}
1149 1150
.program-week .programDate{
	float:left;
1151
	width:3em;
Simon Daron's avatar
Simon Daron committed
1152
}
1153
.program-week .programCell{
1154
	margin-left:3.5em;
1155 1156 1157 1158 1159 1160 1161 1162 1163 1164 1165 1166 1167 1168
}
.program-week .nonStop .programDate{
	visibility:hidden;
}
.program-week .nonStop .programCell{
	font-size:0.9em;
	padding-left:50%;
	text-align:right;
}
.program-week a.nonstop{
	font-size:0.9em;
	margin:0.1em;
}
.program-week .inline,.program-week .resume{padding:0;}
1169
.program-week .description{}
Simon Daron's avatar
Simon Daron committed
1170

1171 1172 1173 1174 1175 1176 1177 1178 1179 1180 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 1208 1209 1210
.program-week .title {
	color: black;
	display: inline;
}

.program-week .smooth {
	color: #666;
	opacity: 1.0;
	font-size: 80%;
	padding-bottom: 8px;
}

.program-week .emission h5,
.program-week .smooth .title {
	color: #333;
	text-transform: uppercase;
}

.program-week .description {
	color: black;
	font-size: 90%;
}

.program-week .programCell:hover {
	opacity: 0.5;
}

#Changing .program-week .programCell a {
	opacity: 1.0;
}

#Changing .program-week .programCell .smooth a {
	opacity: 0.5;
}

#Changing .program-week .programCell .smooth h5 a {
	opacity: 1.0;
}


Simon Daron's avatar
Simon Daron committed
1211 1212 1213 1214 1215 1216 1217 1218 1219 1220 1221 1222 1223 1224 1225 1226 1227 1228
/****************************************************/
/**** SEARCH ****/
/****************************************************/

.search li.previous-page {
  margin-bottom: 2ex;
  text-align: left;
  margin-left: 0ex;
  font-style: italic;
}

.search li.next-page {
  margin-top: 2ex;
  text-align: right;
  margin-right: 0;
  font-style: italic;
}

fred's avatar
fred committed
1229 1230
.search-filters {
  text-align: justify;
1231
}
fred's avatar
fred committed
1232 1233


1234
/****************************************************/
Simon Daron's avatar
Simon Daron committed
1235
/**** GRILLE ****/
Simon Daron's avatar
Simon Daron committed
1236 1237
/****************************************************/

Simon Daron's avatar
Simon Daron committed
1238 1239
#grid #Main {}
#grid th{
1240
	color:#000;
Simon Daron's avatar
Simon Daron committed
1241
}
Simon Daron's avatar
Simon Daron committed
1242
#grid .heure {
Simon Daron's avatar
Simon Daron committed
1243
	height:50px !important;
1244
}
Simon Daron's avatar
Simon Daron committed
1245
#grid .heure.vertical {
Simon Daron's avatar
Simon Daron committed
1246 1247
	padding:1.5em 0;
}
Simon Daron's avatar
Simon Daron committed
1248
#grid .day {
Simon Daron's avatar
Simon Daron committed
1249 1250
	padding:1em 0 1em 0;
}
Simon Daron's avatar
Simon Daron committed
1251
#grid .nonstop {
Simon Daron's avatar
Simon Daron committed
1252
}
Simon Daron's avatar
Simon Daron committed
1253
#grid .item{
1254
	padding:0.5em 0.2em 0.5em 0.2em;
Simon Daron's avatar
Simon Daron committed
1255
}
Simon Daron's avatar
Simon Daron committed
1256
#grid .cell hr {
Simon Daron's avatar
Simon Daron committed
1257
	border:1px dotted #ddd;
1258
	margin:0.3em;
1259
}
Simon Daron's avatar
Simon Daron committed
1260
#grid .time-label{
1261 1262 1263
	margin-top:0.5em;
}

Simon Daron's avatar
Simon Daron committed
1264
#grid .highlighted,#grid .highlighted  *{
Simon Daron's avatar
Simon Daron committed
1265
	background:#333 !important;
1266
	color:white !important;
Simon Daron's avatar
Simon Daron committed
1267
}
Simon Daron's avatar
Simon Daron committed
1268

Simon Daron's avatar
Simon Daron committed
1269
#grid .highlighted,#grid .highlighted  *{
Simon Daron's avatar
Simon Daron committed
1270 1271 1272 1273 1274 1275 1276 1277 1278
	background:#333 !important;
	color:white !important;
}
#Emissions li.item.normal{
	display:none;
}
#Emissions li.item.hightlighted{
	display:block !important;
}
Simon Daron's avatar
Simon Daron committed
1279

1280 1281 1282 1283
#gridNav span.category {
	text-transform: none;
}

laron's avatar
laron committed
1284

1285 1286 1287 1288 1289 1290 1291 1292 1293 1294 1295 1296 1297 1298 1299
/**** Navigation for static pages ****/

#fiber-nav {
	font-size: 150%;
}
#fiber-nav li, #fiber-nav li a {
	display: block;
}
#fiber-nav ul{
	padding: 0.5em;
}
#fiber-nav li a{
	padding:0.5em;
}

1300 1301 1302 1303
#fiber-content a {
	text-decoration: underline;
}

fred's avatar
fred committed
1304
#fiber-content .episode a,
fred's avatar
fred committed
1305 1306 1307 1308
#fiber-content ul.list a {
	text-decoration: none;
}

1309 1310 1311
#fiber-content a:hover {
	text-decoration: none;
}
1312

1313 1314 1315 1316 1317 1318 1319 1320
.intro,
.userContent,
#fiber-content,
.content,
.content h5 {
	line-height: 120%;
}

1321
.userContent strong,
1322 1323 1324 1325 1326 1327
#fiber-content strong {
	text-transform: none;
	font-family: "RegloBold";
	font-style: normal;
}

1328
.userContent em,
1329 1330 1331 1332 1333
#fiber-content em {
	font-family: inherit;
	font-style: italic;
}

1334 1335
/**** SCREEN SIZE ADAPTATIONS ****/
    html #main{ font-size: 70%; }
fred's avatar
fred committed
1336
body { font-size: 18px;}
1337
@media (max-width: 300px){
1338
    body #All{ font-size: 80%; }