web/static/res/css/style_1024.css
changeset 36 6cd5bc3dc7a2
child 37 1f10a9688c1b
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/web/static/res/css/style_1024.css	Sun Dec 09 19:59:03 2012 +0100
@@ -0,0 +1,675 @@
+/*----------------------------------------------*/
+/*	Summary					*/
+/*----------------------------------------------*/
+
+/*	1- Mentions	*/
+/*	2- Color codes	*/
+/*	3- Reset	*/
+/*	4- Base styles	*/
+/*	5- Video	*/
+/*	6- Controls 	*/
+/*	7- Sidebar	*/
+/*	8- Contact	*/
+/*	9- Footer	*/
+
+/*----------------------------------------------*/
+/*	1- Mentions				*/
+/*----------------------------------------------*/
+
+/* @client : The End	*/
+/* @date : octobre 2012	*/
+
+/*----------------------------------------------*/
+/*	2- Color codes				*/
+/*----------------------------------------------*/
+
+/*----------------------------------------------*/
+/*	3- Reset				*/
+/*----------------------------------------------*/
+
+html,body,div,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,legend,input,button,textarea,select,figure,p,blockquote,th,td {
+	margin:0;
+	padding:0;
+}
+
+/* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using  `em` units */
+/* 2. Prevents iOS text size adjust after orientation change, without disabling user zoom.*/ 
+html {
+	font-size: 100%; /* 1 */
+	-webkit-text-size-adjust: 100%; /* 2 */
+	-ms-text-size-adjust: 100%; /* 2 */
+}
+h1,h2,h3,h4,h5,h6 {
+	font-size: 100%;
+	font-weight: normal;
+	font-style: normal;
+}
+li {
+	list-style: none;
+}
+textarea, table, td, th, code, pre {
+	word-wrap: break-word;
+	white-space: pre-wrap; 
+}
+table {
+	border-spacing: 0;
+	border-collapse: collapse; 
+}
+caption, th {
+	text-align: left;
+} 
+/* 1. Corrects alignment displayed oddly in IE 6/7 */
+legend {
+	color: #000;
+	*margin-left: -7px; /* 1 */
+}
+blockquote:before, blockquote:after, q:before, q:after {
+	content: '';
+	content: none;
+}
+label, input[type="submit"], input[type="button"], button {
+	cursor: pointer;
+}
+input, button, select {
+	vertical-align: middle;
+	font-size: 100%;
+}
+
+/* 1. Removes default vertical scrollbar in IE 6/7/8/9 */
+/* 2. Improves readability and alignment in all browsers */
+/* 2. Allow only vertical resizing of textareas */
+textarea {
+    overflow: auto; /* 1 */
+    vertical-align: top; /* 2 */
+    resize: vertical; /* 3 */
+}
+
+fieldset, img, button {
+	border: 0;
+}
+img, table, td, blockquote, code, pre, textarea, input, object, embed/*, video */ {   /*edwin*/
+	max-width: 100%;
+}
+
+/* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3 */
+audio, canvas, video {
+    display: inline-block;
+    *display: inline;
+    *zoom: 1;
+}
+
+/* Prevents `sub` and `sup` affecting `line-height` in all browsers */
+sub,
+sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+}
+sup {
+    top: -0.5em;
+}
+sub {
+    bottom: -0.25em;
+}
+
+/* HTML5 - Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3 */
+header, footer, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, figure, figcaption, time, dialog {
+	display: block;
+}
+
+/*----------------------------------------------*/
+/*	4- Base styles				*/
+/*----------------------------------------------*/
+body {
+	background-color: black; 
+	font-size: 1em;
+	line-height: 1;	
+}
+h1 {
+	font-family: "Arial Black", sans-serif;  
+	font-size: 43px;
+	color: #ffffff;
+	text-transform: uppercase;
+}
+
+h2 {
+	font-family: Arial, sans-serif;  
+	font-size: 24px;
+	color: #bfbfbf;
+	text-transform: uppercase;
+}
+
+h3 {
+
+}
+
+h4 {
+
+}
+
+h5 {
+
+}
+
+h6 {
+
+}
+p,
+pre {
+    margin: 1em 0;
+}
+dl,
+menu,
+ol,
+ul {
+    margin: 1em 0;
+}
+
+b,
+strong,
+.bold  {
+    font-weight: bold;
+}
+.uppercase{
+	text-transform:uppercase;
+	}	
+a,
+a:link,
+a:visited,
+a:active {
+	text-decoration: none;
+	}
+a:hover,
+a:focus {
+	}
+	
+/* Clearfix: contain floats For modern browsers */
+/* 1. The space content is one way to avoid an Opera bug when the `contenteditable` attribute is included anywhere else in the document.
+ *    Otherwise it causes space to appear at the top and bottom of elements that receive the `clearfix` class */
+/* 2. The use of `table` rather than `block` is only necessary if using `:before` to contain the top-margins of child elements */
+
+.clearfix:before,
+.clearfix:after {
+    content: " "; /* 1 */
+    display: table; /* 2 */
+}
+.clearfix:after {
+    clear: both;
+}
+
+/* For IE 6/7 only. Include this rule to trigger hasLayout and contain floats */
+.clearfix {
+    *zoom: 1;
+}
+.txt_hidden {
+	text-indent: -9999em;
+}
+a.link_img,
+a.link_img:link,
+a.link_img:visited,
+a.link_img:active {
+	opacity: 0.586;
+}
+a.link_img:hover,
+a.link_img:focus {
+	opacity: 1;
+}
+.floatL {
+	float: left;
+}
+.floatR {
+	float: right;
+}
+/*----------------------------------------------*/
+/*	site takes all the space of the browser	*/
+/*----------------------------------------------*/
+html, body {	
+	height: 100%;
+}
+#content{
+	width: 98%;
+	min-height: 100%;
+	position: relative;
+	margin: 0 auto;
+}
+#content #content_top {
+	margin-top: 0;
+	margin-bottom: 0;
+	padding-bottom: 70px; /*  height of <footer> + some margin */
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box; 
+}
+footer {
+
+	position: absolute;
+	bottom: 0; 
+	left: 0;
+	width: 100%;
+	
+	height: 66px; /*  height of <footer>  */
+	padding: 0 0 20px 0;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box; 
+} 
+/*----------------------------------------------*/
+/*	the elements takes the full height of "content_top"	*/
+/*----------------------------------------------*/
+.container_vcentering {
+  text-align:center; 
+}
+.box_vcentering {
+  vertical-align: middle;
+  display: inline-block;
+  line-height: 1; 
+  text-align: center;
+}
+/*----------------------------------------------*/
+/*	4- Main	HP		*/
+/*----------------------------------------------*/
+section a,
+section a:link,
+section a:visited,
+section a:active {
+	color: #ffffff;
+	}
+section a:hover,
+section a:focus {
+	color: #bfbfbf;
+	}
+#title_hp {
+	text-align : center;
+	padding: 11px 0 11px 0;
+	margin-left: -13px; /* 53px */ 
+}
+#title_hp h1 {
+    margin: 0 0 5px 0;
+    font-size: 43px;
+}
+#title_hp .h2_exeption{
+		margin-left: -170px; /* 86px */
+}
+.h2_exeption {
+	font-size: 25px;
+}
+#main {
+	display:block;  
+	margin: 0 auto;
+}
+.big_link {
+	font-family: "Arial Black", sans-serif;  
+	font-size: 21px;
+	text-align: center;
+	padding: 14px 0 16px 0;
+	margin: 0;
+}
+/*----------------------------------------------*/
+/*	9- Footer HP				*/
+/*----------------------------------------------*/
+
+footer a,
+footer a:link,
+footer a:visited,
+footer a:active {
+	color: #bfbfbf;
+	}
+footer a:hover,
+footer a:focus {
+	color: #ffffff;
+	}
+footer ul {
+	margin: 0;
+
+	font-family: "Arial Bold", sans-serif; 
+	font-size: 9px;
+	color: #b9b9b9;
+	text-transform: uppercase;
+}
+footer ul li{
+	display: inline;
+}
+footer ul li a{
+	display: inline-block;
+}
+img{
+	min-width: 100%;
+}
+footer #logo_partners>li {
+	display: inline-block;
+	padding-right: 22px;
+}
+footer #logo_partners li a{
+	padding-top: 10px;
+	height: 28px;
+	line-height: 28px;
+	text-align:bottom;
+}
+footer #logo_partners li a img {
+	vertical-align:bottom;
+}
+footer #logo_partners li:first-child li a{
+	width: 39px;
+}
+footer #logo_partners li:first-child li+li a{
+	width: 40px;
+	padding-left: 18px;
+}
+footer #logo_partners li+li li a{
+	width: 42px;
+}
+footer #logo_partners li+li li+li a{
+	width: 62px;
+	padding-left: 16px;
+}
+footer #logo_partners li+li li+li+li a{
+	width: 56px;
+	padding-left: 16px;
+}
+
+footer #socialMedia {
+	margin-top: 24px; 
+}
+footer #socialMedia li a{
+	display: inline-block;
+	vertical-align: middle;
+}
+footer #socialMedia li+li a{
+	width: 20px;
+	height: 20px;
+}
+footer #socialMedia li+li {
+	padding-left: 22px;
+}
+
+/*----------------------------------------------*/
+/*	5- Video Page			*/
+/*----------------------------------------------*/
+.link_prev{
+	display: inline-block;
+	width: 17px;
+	height: 20px;
+    margin-left: 6px;
+	vertical-align: baseline;
+}
+#title_vp {
+	padding: 19px 0 5px 0;
+}
+#title_vp h1{
+    display: inline-block;
+    margin-left: 12px;
+    font-size: 27px;
+}
+
+/*----------------------------------------------*/
+/*	Video 			*/
+/*----------------------------------------------*/
+.float_sequence {
+	white-space: nowrap;
+	overflow: hidden;
+}
+.float_sequence ul{
+	margin: 0;
+	padding: 7px 36px;
+}
+.float_sequence  li {
+	display: inline;
+}
+.float_sequence  li a {
+	display: inline-block;
+}
+#title_sequence {
+	width: 100%;
+	margin-bottom: 9px;
+
+	font-family: "Arial Black", sans-serif;  
+	font-size: 16px;
+	color: #777777;
+}
+#title_sequence a,
+#title_sequence a:link,
+#title_sequence a:visited,
+#title_sequence a:active{
+	font-family: "Arial Black", sans-serif;  
+	font-size: 16px;
+	color: #777777;
+}
+#title_sequence a:hover,
+#title_sequence a:focus {
+	color: #ffffff;
+}
+#title_sequence .here a{
+	color: #ffffff;
+}
+#tag_container {
+	margin: 9px 0;
+}
+#tag_sequence {
+	width: 78%;
+	float: left;
+	
+	font-family: "Arial Bold", sans-serif;  
+	font-size: 13px;
+}
+#tag_sequence ul {
+	padding: 7px 6px;
+}
+/*----------------------------------------------*/
+/*	Search/Tag 			*/
+/*----------------------------------------------*/
+input {
+	font-family: Arial, sans-serif; 
+	font-size: 13px;
+	color: #000000;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box; 
+}
+input[name="tag"],
+input[name="search"] {
+	width: 158px;
+	height: 24px;
+	background-color: #808080;
+	border: none;
+	border-radius: 7px 0 0 7px;
+	margin-right: 5px; 
+	padding:0 8px;
+}
+input[type="submit"] {
+	width: 33px;
+	height: 24px;
+	background-color: #636363;
+	border: none;
+	font-family: "Arial Bold", sans-serif; 
+	font-weight: bold;
+	font-size: 15px;
+}
+input[type="submit"]:hover,
+input[type="submit"]:focus{
+	background-color: #ffffff;
+}
+input:focus {
+/*	outline: medium;
+	border: 1px solid rgba(255,255,255, 0.5);	
+*/	}
+#form_tag,
+#form_search {
+	float: right;
+	margin-left: 13px; 
+}
+/*----------------------------------------------*/
+/*	Video Controls				*/
+/*----------------------------------------------*/
+#controlContainer{
+overflow: hidden;
+}
+#controlbar {
+    position: absolute;
+	bottom: 0px;
+	/* bottom: -50px; */
+    left: 0;
+    right: 0;
+    height: 66px;
+}
+.container_hcentering {
+	margin: 0 auto;
+	width: 530px;
+}
+#progressContainer {
+	width: 240px;
+	display: inline-block;
+	vertical-align: top;
+	padding-top: 6px;
+	margin: 0 25px; 	
+}
+ /* 
+   	-webkit-transition: all 0.3s ease-in-out;
+    -moz-transition: all 0.3s ease-in-out;
+    -o-transition: all 0.3s ease-in-out;    
+    transition: all 0.3s ease-in-out;
+}
+footer:hover #controlbar {
+    bottom: 0;
+}
+*/
+.progress_bar {
+	height: 5px;
+	border-radius: 2px;
+}
+#progressBar {
+	position: relative;
+	z-index: 1;
+	width: 240px;
+	background-color: #777777;
+}
+#progress {
+	position: absolute;
+	z-index: 2;
+	top: 0;
+	left: 0;
+	width: 40px; /* to change with JS */
+	background-color: #ffffff;
+}
+#btnPlayPause {
+	position: absolute;
+	z-index: 3;
+	top: -6px;
+	left: 33px; /* to change with JS */
+	width: 21px; 
+	height: 22px;
+	background-position: -72px 0;	
+}
+#btnPlayPause:hover,
+#btnPlayPause:focus {
+    background-position: -72px -22px;
+}
+
+footer ul#progressTime{
+	margin: 10px 0;
+	width: 240px;
+	font-size: 11px;
+}
+.txt_white {
+	color: #ffffff;
+}
+
+.btn {
+	text-indent: -99999px;  
+	background: transparent url(../img/footer/controls.png) no-repeat top left;
+	cursor: pointer;
+}
+#btnSDHD {
+    background-position: 0 0;
+    width: 55px;
+    height: 12px;	
+} 
+#btnSDHD:hover,
+ #btnSDHD:focus {
+    background-position: 0 -12px;
+    width: 55px;
+    height: 12px;	
+}  
+#btnBck {
+    background-position: -55px 0;
+    width: 16px;
+    height: 16px;
+    margin-left: 30px;
+}
+#btnBck:hover,
+#btnBck:focus {
+    background-position: -55px -16px;   
+}
+#btnFwd {
+    background-position: -93px 0;
+    width: 16px;
+    height: 16px;  
+    margin-right: 30px; 
+}
+#btnFwd:hover,
+#btnFwd:focus {
+    background-position: -93px -16px;
+}
+#btnInfo {
+    background-position: -109px 0;
+    width: 21px;
+    height: 21px;
+    margin-right: 30px; 
+}
+#btnInfo:hover,
+#btnInfo:focus {
+    background-position: -109px -21px;
+}
+#btnChoice {
+    background-position: -130px 0;
+    width: 21px;
+    height: 21px;
+}
+#btnChoice:hover,
+#btnChoice:focus {
+    background-position: -130px -21px;
+}
+/*----------------------------------------------*/
+/*	5- HP level2			*/
+/*----------------------------------------------*/
+#header_hpn2 {
+	margin: 25px 0 9px 0;
+}
+#btnMenu {
+	float:left;
+	padding: 0 18px;
+}
+#table_tag {
+	position: relative;
+	height: 100%;
+}
+#arrowTop,
+#arrowBottom {
+	width: 11px;
+	height: 7px;
+}
+#arrowLeft,
+#arrowRight {
+	width: 7px;
+	height: 11px;
+}
+#arrowTop{
+	position: absolute;
+	top:0;
+	left: 50%;
+}
+#arrowBottom{
+	position: absolute;
+	bottom:0;
+	left: 50%;
+}
+#arrowLeft {
+	position: absolute;
+	top:50%;
+	left: 0;
+}
+#arrowRight{
+	position: absolute;
+	top:50%;
+	right: 0;
+}
\ No newline at end of file