2016-04-20 14:57:59 +00:00
@ charset "UTF-8" ;
/ * [ 1 ] COULEURS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) COULEURS DU THEME $DEFAULT */
/* (2) COULEURS DE THEME $DARK */
2016-04-22 08:27:58 +00:00
/* (3) Couleurs du theme pour la timeline */
2016-04-20 14:57:59 +00:00
/ * [ 2 ] DIMENSIONS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) Layout de base */
2016-04-22 08:27:58 +00:00
/ * [ 3 ] Mixins
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-22 09:20:27 +00:00
/ * [ 4 ] Functions
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-20 14:57:59 +00:00
/ * [ 1 ] Panel list ( tokens , utilisateurs , etc )
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-19 15:08:59 +00:00
/ * [ 1 ] COULEURS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) COULEURS DU THEME $DEFAULT */
/* (2) COULEURS DE THEME $DARK */
2016-04-22 08:27:58 +00:00
/* (3) Couleurs du theme pour la timeline */
2016-04-19 15:08:59 +00:00
/ * [ 2 ] DIMENSIONS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) Layout de base */
2016-04-22 08:27:58 +00:00
/ * [ 3 ] Mixins
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-22 09:20:27 +00:00
/ * [ 4 ] Functions
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-19 15:08:59 +00:00
/ * [ 1 ] Panneau d 'ajout/suppression d' elements
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
# WRAPPER > # CONTAINER section [ data-panel-list ] { display : block ; position : relative ; border-radius : 3 px ; border : 1 px solid #ccc ; background-color : #fff ; font-size : .9 em ; color : #000 ; /* (1) Header (titre + ajout) */ /* (2) Description (sous le header) */ /* (3) Liste des elements */ /* (5) Formulaire d'ajout d'un nouvel element */ }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-header ] { display : flex ; position : relative ; flex-direction : row ; flex-wrap : nowrap ; justify-content : space-between ; align-items : center ; padding : .5 em .7 em ; border-radius : 3 px 3 px 0 0 ; border-bottom : 1 px solid #ccc ; background-color : #f5f5f5 ; box-shadow : inset 0 0 5 px #eee ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-header ] > span , # WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-header ] > button { color : #333 ; font-weight : bold ; line-height : 2 em ; }
2016-04-22 08:27:58 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-header ] > button { padding : .1 em .7 em ; border-radius : 3 px ; border : 1 px solid #777 ; background : #ecf0f1 ; -webkit- transition : all 0.1 s ease-in-out ; transition : all 0.1 s ease-in-out ; color : #777 ; }
2016-04-19 15:08:59 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-header ] > button : hover { background : #399ced ; border-color : #1484df ; color : #fff ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-description ] { display : block ; position : relative ; border-bottom : 1 px solid #ccc ; padding : .7 em .7 em ; color : #555 ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] { display : flex ; position : relative ; flex-direction : column ; justify-content : flex-start ; flex-wrap : nowrap ; margin : 0 ; padding : 0 ; list-style : none ; /* (4) Chaque element de la liste */ }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] { display : flex ; flex-direction : row ; justify-content : space-between ; align-items : center ; flex-wrap : nowrap ; padding : 1 em ; /* (4.1) Logo et type d'element */ /* (4.2) Donnees descriptives */ /* (4.3) Bouton de suppression */ }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] : not ( : last-child ) { border-bottom : 1 px solid #ccc ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) { display : flex ; width : 10 em ; height : 6 em ; flex-direction : column ; justify-content : flex-end ; align-items : center ; background-size : auto 50 % ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-token ] { background : url ( "/f/svg/token/st/container/666666" ) center 1 em no-repeat ; }
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-token ] . active { background-image : url ( "/f/svg/token/st/container/${color-str($theme-fg-primary)" ) ; }
2016-04-19 15:08:59 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-user ] { background : url ( "/f/svg/user/st/container/666666" ) center 1 em no-repeat ; }
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-user ] . active { background-image : url ( "/f/svg/user/st/container/${color-str($theme-fg-primary)" ) ; }
2016-04-19 15:08:59 +00:00
2016-04-20 09:59:21 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-number ] { background : url ( "/f/svg/phone_number/st/container/666666" ) center 1 em no-repeat ; }
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) [ data-number ] . active { background-image : url ( "/f/svg/phone_number/st/container/${color-str($theme-fg-primary)" ) ; }
2016-04-20 09:59:21 +00:00
2016-04-19 15:08:59 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( 1 ) > span { display : block ; padding : 0 .4 em ; border-radius : 3 px ; border : 1 px solid #ddd ; font-size : .8 em ; color : #555 ; text-transform : uppercase ; font-weight : bold ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( n + 2 ) { display : flex ; position : relative ; flex : 10 em ; padding : 1 em ; flex-direction : column ; justify-content : flex-start ; align-items : flex-start ; font-size : 1 em ; color : #000 ; font-weight : bold ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > div : nth-child ( n + 2 ) > span [ data-prefix ] : before { content : attr ( data - prefix ) ": " ; font-weight : normal ; }
2016-04-22 08:27:58 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > button { padding : .1 em .7 em ; height : 2 em ; border-radius : 3 px ; border : 1 px solid #de2b08 ; background : #fff ; color : #de2b08 ; font-weight : bold ; -webkit- transition : all 0.2 s ease-in-out ; transition : all 0.2 s ease-in-out ; }
2016-04-19 15:08:59 +00:00
# WRAPPER > # CONTAINER section [ data-panel-list ] > ul [ data-list ] > li [ data-element ] > button : hover { background : #de2b08 ; color : #fff ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] { display : none ; position : relative ; padding : 1 em ; border-bottom : 1 px solid #ccc ; background-color : #ecf0f1 ; /* (5.1) Description du champ de texte */ /* (5.2) Champs de texte */ /* (5.3) Bouton de creation animation de @hover*/ }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] . active { display : block ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > . label { display : inline-block ; width : 18 em ; padding-right : 2 em ; text-align : right ; color : #3b494c ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'text' ] , # WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'email' ] , # WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'password' ] { margin : 1 em 0 ; padding : .5 em .7 em ; border-radius : 3 px ; border : 1 px solid #ddd ; background-color : #fff ; color : #000 ; font-weight : normal ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'text' ] : focus , # WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'email' ] : focus , # WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'password' ] : focus { border-color : #399ced ; box-shadow : inset 0 0 2 px #ddd ; }
# WRAPPER > # CONTAINER section [ data-panel-list ] > div [ data-add ] > input [ type = 'submit' ] : hover { background : #399ced ; border-color : #1484df ; color : #fff ; }
2016-04-20 14:57:59 +00:00
/ * [ 2 ] Formulaire de type 'timeline'
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-21 14:41:11 +00:00
/ * [ 1 ] COULEURS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) COULEURS DU THEME $DEFAULT */
/* (2) COULEURS DE THEME $DARK */
2016-04-22 08:27:58 +00:00
/* (3) Couleurs du theme pour la timeline */
2016-04-21 14:41:11 +00:00
/ * [ 2 ] DIMENSIONS
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
/* (1) Layout de base */
2016-04-22 08:27:58 +00:00
/ * [ 3 ] Mixins
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-22 09:20:27 +00:00
/ * [ 4 ] Functions
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-20 14:57:59 +00:00
/ * [ 1 ] Formulaire de type timeline
= = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = = * /
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] { display : block ; position : relative ; background-color : #fff ; font-size : .9 em ; color : #000 ; /* (1) On ajoute le liseré à droite pour TOUS les éléments */ /* (2) Titres de sections */ /* (3) Titres des sous-sections */ /* (4) Titres genre text message */ /* (5) 'Tags' -> textes sur le liseré gauche */ /* (6) Input d'upload de fichier (css hack) */ /* Contiendra l'input*/ /* Animation de hover*/ /* Animation de .active*/ /* (7) Inputs de type text */ /* (8) Gestion des espacements */ /* (9) <article> sert uniquement à regrouper */ /* (10) Gestion des espacements verticaux */ /* (11) Gestion des custom <select> */ /* (12) Gestion des coloris pour les titres */ }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h5 , # WRAPPER > # CONTAINER section [ data-timeline ] h4 , # WRAPPER > # CONTAINER section [ data-timeline ] h3 , # WRAPPER > # CONTAINER section [ data-timeline ] * . line , # WRAPPER > # CONTAINER section [ data-timeline ] [ data-space ] { display : block ; color : #333 ; margin : 0 40 px ; padding : 5 px 60 px ; border-left : 2 px solid #d8e0e9 ; }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h3 { display : block ; padding : 20 px 40 px ; font-size : 1.4 em ; color : #fff ; font-weight : bold ; background-color : #aaa ; /* TODO: Transformer les background en ::before pour que ca soit juste un cercle avec bg et border*/ /* FIXME: Corriger le liseré pour les autres navigateurs que FF*/ /* Gestion du before (compteur css) //*/ }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h3 [ data-n ] : before { content : attr ( data - n ) ; display : inline-block ; position : absolute ; margin-top : .48 em ; margin-left : -41 px ; padding : 3 px 12 px ; border-radius : 50 % ; /* Contour blanc*/ box-shadow : 0 0 0 3 px #fff ; background-color : #aaa ; font-size : 1.3 em ; color : #fff ; font-weight : bold ; /* On centre sur la ligne*/ transform : translateX ( -50 % ) translateY ( -50 % ) ; -moz- transform : translateX ( -50 % ) translateY ( -50 % ) ; -o- transform : translateX ( -50 % ) translateY ( -50 % ) ; -ms- transform : translateX ( -50 % ) translateY ( -50 % ) ; -webkit- transform : translateX ( -50 % ) translateY ( -50 % ) ; }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h4 { display : block ; padding : 20 px 40 px ; font-size : 1.2 em ; color : #777777 ; font-weight : bold ; /* Gestion du before (compteur css) //*/ }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h4 [ data-icon ] : before { content : attr ( data - icon ) ; display : inline-block ; position : absolute ; margin-top : .8 em ; margin-left : -41 px ; padding : 7 px ; border-radius : 50 % ; /* Contour blanc*/ box-shadow : 0 0 0 2 px #fff ; background-color : #aaa ; font-size : 1 em ; font-family : 'icomoon' ; color : #fff ; font-weight : bold ; /* On centre sur la ligne*/ transform : translateX ( -50 % ) translateY ( -50 % ) ; -moz- transform : translateX ( -50 % ) translateY ( -50 % ) ; -o- transform : translateX ( -50 % ) translateY ( -50 % ) ; -ms- transform : translateX ( -50 % ) translateY ( -50 % ) ; -webkit- transform : translateX ( -50 % ) translateY ( -50 % ) ; }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h5 { display : block ; padding : 20 px 40 px ; font-size : 1.2 em ; color : #777777 ; font-weight : bold ; /* Gestion du before (compteur css) //*/ /* Texte genre text message*/ }
2016-04-21 08:33:03 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h5 : before { content : '' ; display : inline-block ; position : absolute ; margin-top : .7 em ; margin-left : -41 px ; padding : 7 px ; border-radius : 50 % ; /* Contour blanc*/ box-shadow : 0 0 0 2 px #fff ; background-color : #aaa ; /* On centre sur la ligne*/ transform : translateX ( -50 % ) translateY ( -50 % ) ; -moz- transform : translateX ( -50 % ) translateY ( -50 % ) ; -o- transform : translateX ( -50 % ) translateY ( -50 % ) ; -ms- transform : translateX ( -50 % ) translateY ( -50 % ) ; -webkit- transform : translateX ( -50 % ) translateY ( -50 % ) ; }
2016-04-20 14:57:59 +00:00
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h5 [ data-text ] : after { content : attr ( data - text ) ; padding : 6 px 10 px ; border-radius : 3 px ; background : #399ced ; color : #fff ; font-weight : normal ; }
2016-04-20 14:57:59 +00:00
2016-04-21 08:33:03 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] [ data-tag ] { display : block ; padding : 40 px 60 px ; }
2016-04-20 14:57:59 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] [ data-tag ] : before { content : attr ( data - tag ) ; display : inline-block ; position : absolute ; margin-top : .5 em ; margin-left : -41 px ; padding : 2 px ; background-color : #fff ; font-size : 1.2 em ; color : #aaa ; font-weight : bold ; /* On centre sur la ligne*/ transform : translateX ( -50 % ) translateY ( -50 % ) ; -moz- transform : translateX ( -50 % ) translateY ( -50 % ) ; -o- transform : translateX ( -50 % ) translateY ( -50 % ) ; -ms- transform : translateX ( -50 % ) translateY ( -50 % ) ; -webkit- transform : translateX ( -50 % ) translateY ( -50 % ) ; }
2016-04-20 15:06:48 +00:00
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] { position : relative ; opacity : 0 ; z-index : 8 ; cursor : pointer ; }
2016-04-20 20:58:19 +00:00
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] + span . file-input { display : inline-block ; position : absolute ; margin-top : -1 px ; margin-left : -290 px ; width : calc ( 290 px - 2 * 15 px ) ; height : 30 px ; padding : 0 15 px ; border-radius : 3 px ; background : #ddd ; color : #333 ; line-height : 30 px ; font-weight : normal ; z-index : 9 ; cursor : pointer ; pointer-events : none ; /* Icone d'upload*/ -webkit- transition : background 0.1 s ease-in-out ; transition : background 0.1 s ease-in-out ; }
2016-04-20 20:58:19 +00:00
2016-04-21 09:26:21 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] + span . file-input : before { content : 'e ' ; font-size : 1 em ; font-family : 'icomoon' ; color : #333 ; font-weight : bold ; }
2016-04-20 20:58:19 +00:00
2016-04-21 14:41:11 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] : hover + span . file-input { background : #bbb ; box-shadow : inset 0 0 5 px #888 ; }
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] . active + span . file-input { background : #aaa ; color : #fff ; }
2016-04-21 14:41:11 +00:00
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'file' ] . active + span . file-input : before { content : 'v ' ; color : #fff ; }
2016-04-22 12:44:23 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'text' ] , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'password' ] , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'number' ] , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'button' ] , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'submit' ] , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'mail' ] { display : inline ; width : auto ; margin : unset ; padding : 5 px 10 px ; margin-bottom : 5 px ; margin-right : 15 px ; border-radius : 0 ; border : 0 ; border-bottom : 1 px solid #555 ; font-size : .8 em ; font-weight : normal ; color : #333 ; -webkit- transition : border 0.2 s ease-in-out , background 0.2 s ease-in-out ; transition : border 0.2 s ease-in-out , background 0.2 s ease-in-out ; /* Animation de @focus*/ }
2016-04-21 14:41:11 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'text' ] : focus , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'password' ] : focus , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'number' ] : focus , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'button' ] : focus , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'submit' ] : focus , # WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'mail' ] : focus { border-color : #aaa ; }
2016-04-21 09:26:21 +00:00
2016-04-22 12:44:23 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] input [ type = 'submit' ] [ data-store ] : before { /* Icone de sauvegarde */ content : 'y ' ; font-size : 1 em ; font-family : 'icomoon' ; color : #fff ; font-weight : bold ; }
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] label { color : #555 ; }
2016-04-22 09:20:27 +00:00
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] [ data-space ] { padding-top : 20 px ; padding-bottom : 20 px ; }
2016-04-21 09:26:21 +00:00
2016-04-21 14:41:11 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] article { all : unset !important ; }
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] . spacetop , # WRAPPER > # CONTAINER section [ data-timeline ] . spaced { margin-top : 20 px !important ; }
2016-04-22 08:27:58 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] . spacebtm , # WRAPPER > # CONTAINER section [ data-timeline ] . spaced { margin-bottom : 20 px !important ; }
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] . nobold , # WRAPPER > # CONTAINER section [ data-timeline ] . nobold * { font-weight : normal !important ; }
2016-04-22 08:27:58 +00:00
2016-04-22 09:20:27 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] select { width : auto ; display : inline-block ; background : transparent ; border : 0 ; -webkit- appearance : none ; -moz- appearance : none ; text-indent : 1 px ; text-overflow : '' ; font-size : .9 em ; }
2016-04-22 09:48:25 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] . select-container select { display : inline-block ; padding : 2 px ; padding-right : 30 px ; border : none ; border-bottom : 1 px solid #333 ; background : #fff url ( "/f/svg/bottom_arrow/st/container/333333" ) right 10 px center no-repeat ; background-size : 10 px auto ; overflow : hidden ; }
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] . select-container select : focus { border-color : #aaa ; background-image : url ( "/f/svg/bottom_arrow/st/container/aaa" ) ; }
2016-04-22 09:20:27 +00:00
2016-04-25 08:39:04 +00:00
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color1 , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color1 , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color1 { color : #e64e3e ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color1 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h5 . color1 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color1 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color1 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color1 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color1 : after { background-color : #e64e3e ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color2 , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color2 , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color2 { color : #10baa3 ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color2 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h5 . color2 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color2 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color2 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color2 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color2 : after { background-color : #10baa3 ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color3 , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color3 , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color3 { color : #b14be7 ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color3 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h5 . color3 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color3 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color3 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color3 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color3 : after { background-color : #b14be7 ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color4 , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color4 , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color4 { color : #053b5d ; }
# WRAPPER > # CONTAINER section [ data-timeline ] h5 . color4 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h5 . color4 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color4 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h4 . color4 : after , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color4 : before , # WRAPPER > # CONTAINER section [ data-timeline ] h3 . color4 : after { background-color : #053b5d ; }
/ * # sourceMappingURL = data : application / json ; base64 , ewoJInZlcnNpb24iOiAzLAoJImZpbGUiOiAiY29tcGFjdC5jc3MiLAoJInNvdXJjZXMiOiBbCgkJIi4uL2dsb2JhbC5zY3NzIiwKCQkiLi4vY29uc3RhbnRzLnNjc3MiLAoJCSIuLi9wYW5lbC1saXN0LnNjc3MiLAoJCSIuLi90aW1lbGluZS1mb3JtLnNjc3MiCgldLAoJInNvdXJjZXNDb250ZW50IjogWwoJCSJAaW1wb3J0ICdjb25zdGFudHMnO1xuXG4vKiBbMV0gUGFuZWwgbGlzdCAodG9rZW5zLCB1dGlsaXNhdGV1cnMsIGV0Yylcbj09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSovXG5AaW1wb3J0ICdwYW5lbC1saXN0JztcblxuLyogWzJdIEZvcm11bGFpcmUgZGUgdHlwZSAndGltZWxpbmUnXG49PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0qL1xuQGltcG9ydCAndGltZWxpbmUtZm9ybSc7XG4iLAoJCSIvKiBbMV0gQ09VTEVVUlNcbj09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSovXG4vKiAoMSkgQ09VTEVVUlMgRFUgVEhFTUUgJERFRkFVTFQgKi9cbiR0aGVtZS1iZzogICAgICAgICAjZThlOGU4O1xuJHRoZW1lLWJnLXByaW1hcnk6ICNmZmZmZmY7XG4kdGhlbWUtZmc6ICAgICAgICAgIzUxNTE1MTtcbiR0aGVtZS1mZy1wcmltYXJ5OiAjMzk5Y2VkO1xuXG4vKiAoMikgQ09VTEVVUlMgREUgVEhFTUUgJERBUksgKi9cbiRkYXJrLWJnOiAgICAgICAgICMzMTM1NDE7XG4kZGFyay1iZy1wcmltYXJ5OiAjMjkyODJlO1xuJGRhcmstZmc6ICAgICAgICAgIzkzOTM5MztcbiRkYXJrLWZnLXByaW1hcnk6ICNmZmZmZmY7XG5cbiRoZWFkZXItZGFyazogICAgICMzMzMzMzM7XG5cbi8qICgzKSBDb3VsZXVycyBkdSB0aGVtZSBwb3VyIGxhIHRpbWVsaW5lICovXG4kdGltZWxpbmUtY29sb3I6ICNhYWE7XG4kdGltZWxpbmUtMTogI2U2NGUzZTtcbiR0aW1lbGluZS0yOiAjMTBiYWEzO1xuJHRpbWVsaW5lLTM6ICNiMTRiZTc7XG4kdGltZWxpbmUtNDogIzA1M2I1ZDtcblxuXG4vKiBbMl0gRElNRU5TSU9OU1xuPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ki9cbi8qICgxKSBMYXlvdXQgZGUgYmFzZSAqL1xuJG1lbnUtc2lkZS13aWR0aDogMTVlbTtcbiRoZWFkZXItaGVpZ2h0OiAgIDRlbTtcblxuXG5cbi8qIFszXSBNaXhpbnNcbj09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSovXG5AbWl4aW4gdHJhbnNmb3JtKCR2YWx1ZS4uLikge1xuICAgIHRyYW5zZm9ybTogJHZhbHVlO1xuXHQtbW96LXRyYW5zZm9ybTogJHZhbHVlO1xuXHQtby10cmFuc2Zvcm06ICR2YWx1ZTtcblx0LW1zLXRyYW5zZm9ybTogJHZhbHVlO1xuXHQtd2Via2l0LXRyYW5zZm9ybTogJHZhbHVlO1xufVxuXG5cbkBtaXhpbiB0cmFuc2l0aW9uKCR2YWx1ZS4uLikge1xuICAgIC13ZWJraXQtdHJhbnNpdGlvbjogJHZhbHVlO1xuICAgIHRyYW5zaXRpb246ICR2YWx1ZTtcbn1cblxuLyogWzRdIEZ1bmN0aW9uc1xuPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09Ki9cbi8vIFRyYW5zZm9ybWUgdW5lIGNvdWxldXIgaGV4IGVuIHN0cmluZyBzYW5zIGxlICNcbkBmdW5jdGlvbiBjb2xvci1zdHIoJGNvbG9yKXtcbiAgICBAcmV0dXJuIHN0ci1zbGljZSgjeyRjb2xvcn0sIDIsIHN0ci1sZW5ndGgoI3skY29sb3J9KSk7XG59XG4iLAoJCSJAaW1wb3J0ICdjb25zdGFudHMnO1xuXG4vKiBbMV0gUGFubmVhdSBkJ2Fqb3V0L3N1cHByZXNzaW9uIGQnZWxlbWVudHNcbj09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSovXG4jV1JBUFBFUiA + ICNDT05UQUlORVIgc2VjdGlvbltkYXRhLXBhbmVsLWxpc3Rde1xuXHRkaXNwbGF5OiBibG9jaztcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdGJvcmRlci1yYWRpdXM6IDNweDtcblx0Ym9yZGVyOiAxcHggc29saWQgI2NjYztcblxuXHRiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmO1xuXG5cdGZvbnQtc2l6ZTogLjllbTtcblx0Y29sb3I6ICMwMDA7XG5cblxuXHQvKiAoMSkgSGVhZGVyICh0aXRyZSArIGFqb3V0KSAqL1xuXHQmID4gZGl2W2RhdGEtaGVhZGVyXXtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuXHRcdC8vIGZsZXggcHJvcGVydGllc1xuXHRcdGZsZXgtZGlyZWN0aW9uOiByb3c7XG5cdFx0ZmxleC13cmFwOiBub3dyYXA7XG5cdFx0anVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuXHRcdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cblx0XHRwYWRkaW5nOiAuNWVtIC43ZW07XG5cblx0XHRib3JkZXItcmFkaXVzOiAzcHggM3B4IDAgMDtcblx0XHRib3JkZXItYm90dG9tOiAxcHggc29saWQgI2NjYztcblxuXHRcdGJhY2tncm91bmQtY29sb3I6ICNmNWY1ZjU7XG5cdFx0Ym94LXNoYWRvdzogaW5zZXQgMCAwIDVweCAjZWVlO1xuXG5cdFx0Ly8gTGliZWxsZSBkdSBwYW5lbFxuXHRcdCYgPiBzcGFuLFxuXHRcdCYgPiBidXR0b257XG5cdFx0XHRjb2xvcjogIzMzMztcblx0XHRcdGZvbnQtd2VpZ2h0OiBib2xkO1xuXHRcdFx0bGluZS1oZWlnaHQ6IDJlbTtcblx0XHR9XG5cblx0XHQvLyBCb3V0b24gYWpvdXRlclxuXHRcdCYgPiBidXR0b257XG5cdFx0XHRwYWRkaW5nOiAuMWVtIC43ZW07XG5cblx0XHRcdGJvcmRlci1yYWRpdXM6IDNweDtcblx0XHRcdGJvcmRlcjogMXB4IHNvbGlkICM3Nzc7XG5cblx0XHRcdGJhY2tncm91bmQ6ICNlY2YwZjE7XG5cblx0XHRcdEBpbmNsdWRlIHRyYW5zaXRpb24oIGFsbCAuMXMgZWFzZS1pbi1vdXQgKTtcblxuXHRcdFx0Y29sb3I6ICM3Nzc7XG5cblx0XHRcdC8vIEFuaW1hdGlvbiBkZSBAaG92ZXJcblx0XHRcdCY6aG92ZXJ7XG5cdFx0XHRcdGJhY2tncm91bmQ6ICR0aGVtZS1mZy1wcmltYXJ5O1xuXHRcdFx0XHRib3JkZXItY29sb3I6IGRhcmtlbigkdGhlbWUtZmctc