Commit 0d215268 by gema

1. eliminadas vistas y controladores de usauarios

2. añadidas librerias: inputs, selects molones y checkboxees
3. ajustes en layout principal
4. añadida vista "mi perfil"
parent 15177bb6
<?php
/**
* Created by JetBrains PhpStorm.
* User: Luis
* Date: 16/12/13
* Time: 20:55
* To change this template use File | Settings | File Templates.
*/
use Auth\Model_Auth_Role;
use Auth\Model_Auth_GroupRole;
use Auth\Model_Auth_Group;
use Fuel\Core\Response;
use \Parser\View;
class Controller_Administracion_Grupos_Index extends \Controller_App{
//Variable para guardar las migas de pan que van a aparecer en las vistas
private $_bc = array();
//Array con los elementos del menu que se deben marcar con la clase "active" para que esten seleccionados en el menu.
private $_option_menu=array('maestras','grupos');
public function before(){
//Se cargan funciones de javascript especificas de esta funcionalidad
Casset::js('administracion/grupos/index.js');
//Se marca la navegación en forma de migas de pan. Cada miga de pan la forman dos variables:
// ds : String a mostrar
// url : url del enlace en modo absoluto
$this->_bc[] = array('ds'=>'Inicio','url'=>'/dashboard');
$this->_bc[] = array('ds'=>'Maestras','url'=>'/dashboard');
$this->_bc[] = array('ds'=>'Perfiles','url'=>'/grupos','class'=>'active');
parent::before();
}
public function get_index()
{
$view = View::forge('administracion/grupos/index.twig');
$view->grupos = Model_Auth_Group::query()->get();
$view->roles = Model_Auth_Role::query()->order_by('orden','asc')->get();
//Titulo de la vista
$view->title = "Gestión de Perfiles";
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function get_show($id)
{
//Se recuperan los datos a mostrar en la vista que peuden cambair en función de como se llame a esa vista
$grupo = Model_Auth_Group::query()->where('id', $id)->get_one();
return $this->load_show($grupo);
}
public function load_show($grupo){
//Se selecciona la vista a devolver
$view = View::forge('administracion/grupos/form.twig');
//En funcion del tipo, cambia el titulo
$view->title = "Detalle de Perfil";
//Se recuperan los datos de los desplegables de la vista
$view->roles = Model_Auth_Role::query()->order_by('orden','asc')->get();
//Se añaden los datos a la vista
$view->grupo = $grupo;
//Se añade una miga de pan a la vista
$this->_bc[] = array('ds'=>$view->title,'url'=>'','class'=>'active');
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function get_update($id)
{
//Se recuperan los datos a mostrar en la vista que peuden cambair en función de como se llame a esa vista
$grupo = Model_Auth_Group::query()->where('id',$id)->get_one();
// A : Alta || M : Modificacion
if($id == 0){
return $this->load_form($grupo, 'A');
}else{
return $this->load_form($grupo, 'M');
}
}
public function post_update()
{
$name = Input::post('nombre','');
$roles = Input::post('roles');
$id = Input::post('id','');
$found = Model_Auth_Group::query()->where('nombre' , $name)->get_one();
//nombre no existente
if (((is_null($found) || $found == "" ) && count($roles) > 0))
{
//grupo no existente
$grupo = Model_Auth_Group::forge();
if($id != '')//grupo existente
{
$grupo = Model_Auth_Group::query()->where("id",$id)->get_one();
//elimina roles que el grupo tuviera
foreach($grupo->roles as $role) $role->delete();
$grupo->roles = null;
}
//establece nombre grupo
$grupo->nombre = $name;
//crea fila en GroupRole con roles selecionados para el grupo
foreach($roles as $role)
{
$grupoRole = Model_Auth_GroupRole::forge();
$grupoRole->role_id = $role;
$grupo->roles[] = $grupoRole;
}
//guarda grupo
$grupo->save();
Session::set_flash('message',array('type'=>'success','text'=>'Modificaciones realizadas con éxito'));
Response::redirect('grupos');
}
//nombre existente
else if(($found) && count($roles) > 0)
{
if($id != '')//grupo existente
{
$grupo = Model_Auth_Group::query()->where("id",$id)->get_one();
//grupo existente
//si el 'id' del grupo es igual al 'id' de la fila encontrada, estamos editando
if($grupo->id == $found->id)
{
//elimina roles que el grupo tuviera
foreach($grupo->roles as $role) $role->delete();
$grupo->roles = null;
//el nombre del grupo no ha cambiado, no lo sobreescribimos
//crea fila en GroupRole con roles selecionados para el grupo
foreach($roles as $role)
{
$grupoRole = Model_Auth_GroupRole::forge();
$grupoRole->role_id = $role;
$grupo->roles[] = $grupoRole;
}
//guarda grupo
$grupo->save();
Session::set_flash('message',array('type'=>'success','text'=>'Modificaciones realizadas con éxito'));
Response::redirect('grupos');
}
//grupo existente y nombre existente en otro grupo
else
{
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación con éxito. El nombre de grupo ya está en uso.'));
Response::redirect('grupos');
}
}
//grupo no existente
else
{
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación con éxito. El nombre de grupo ya está en uso.'));
Response::redirect('grupos');
}
}
else
{
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación con éxito. Debes seleccionar algún rol.'));
Response::redirect('grupos');
}
}
public function load_form($grupo, $tipo){
//Se selecciona la vista a devolver
$view = View::forge('administracion/grupos/form.twig');
//En funcion del tipo, cambia el titulo
$view->title = (($tipo=='A')?"Alta":"Modificación")." de Perfiles";
//Se recuperan los datos de los desplegables de la vista
$view->roles = Model_Auth_Role::query()->get();
//Se añaden los datos a la vista
$view->grupo = $grupo;
//Se añade una miga de pan a la vista
$this->_bc[] = array('ds'=>$view->title,'url'=>'','class'=>'active');
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function post_delete()
{
$id = Input::post('id','');
$grupo = Model_Auth_Group::query()->where("id",$id)->get_one();
if ($grupo && $grupo != "" )
{
//elimina roles que el grupo tuviera
foreach($grupo->roles as $role) $role->delete();
$grupo->roles = null;
$grupo->delete();
}
Session::set_flash('message',array('type'=>'success','text'=>'Modificaciones realizadas con éxito'));
Response::redirect('grupos');
}
}
\ No newline at end of file
<?php
/**
* Created by JetBrains PhpStorm.
* User: Luis
* Date: 16/12/13
* Time: 20:55
* To change this template use File | Settings | File Templates.
*/
use Auth\Model_Auth_User;
use Auth\Model_Auth_Group;
use Fuel\Core\Response;
use \Parser\View;
use Auth\Auth;
class Controller_Administracion_Usuarios_Index extends \Controller_App{
//Variable para guardar las migas de pan que van a aparecer en las vistas
private $_bc = array();
//Array con los elementos del menu que se deben marcar con la clase "active" para que esten seleccionados en el menu.
private $_option_menu=array('maestras','usuarios');
public function before(){
//Se cargan funciones de javascript especificas de esta funcionalidad
Casset::js('administracion/usuarios/index.js');
//Se marca la navegación en forma de migas de pan. Cada miga de pan la forman dos variables:
// ds : String a mostrar
// url : url del enlace en modo absoluto
$this->_bc[] = array('ds'=>'Inicio','url'=>'/dashboard');
$this->_bc[] = array('ds'=>'Maestras','url'=>'/dashboard');
$this->_bc[] = array('ds'=>'Usuarios','url'=>'/usuarios','class'=>'active');
parent::before();
}
public function get_index()
{
$view = View::forge('administracion/usuarios/index.twig');
$view->usuarios = Model_Auth_User::query()->get();
$view->grupos = Model_Auth_Group::query()->where('id','!=',1)->get();
//Titulo de la vista
$view->title = "Gestión de Usuarios";
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function get_update($id){
//Se recuperan los datos a mostrar en la vista que peuden cambair en función de como se llame a esa vista
$usuario = Model_Auth_User::query()->where('id',$id)->get_one();
// A : Alta || M : Modificacion
if($id == 0){
return $this->load_form($usuario, 'A');
}else{
return $this->load_form($usuario, 'M');
}
}
public function get_profile()
{
$view = View::forge('administracion/usuarios/profile.twig');
$user_logged = Auth::get_user_id();
$auth_user = \Auth\Model_Auth_User::query()->where('id',$user_logged)->get_one();
$view->usuario = $auth_user;
//Titulo de la vista
$view->title = "My profile";
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function post_update(){
$usuario = Model_Auth_User::forge();
if(Input::post('id','')!=''){
$usuario = Model_Auth_User::query()->where('id',Input::post('id',''))->get_one();
}
$usuario->nombre = Input::post('nombre','');
$usuario->apellidos = Input::post('apellidos','');
$usuario->email = Input::post('email','');
$usuario->username = Input::post('user','');
if(Input::post('grupo','')!=''){
$usuario->group_id = Input::post('grupo','');
}
if(Input::post('id','')!='' and Input::post('password','') != ''){
$usuario->set_password(Input::post('password',''));
}else if(Input::post('id','')==''){
$usuario->set_password(Input::post('password',''));
}
//Comprobamos si ya existe en la BBDD un usuario con el mismo codigo y si es así, devolvemos un error.
$found = Model_Auth_User::query()->where('username' , $usuario->username )->get_one();
//no existe username o existe pero es del propio usuario
if ((is_null($found) || $found == "") || ($found != "" and $usuario->id != '' and $found->id == $usuario->id)){
try{
$usuario->save();
Session::set_flash('message',array('type'=>'success','text'=>'Grabación realizada con éxito.'));
return $this->load_form($usuario,'M');
}
catch(Exception $e){
Log::error('administracion/usuarios/controller/index/post_update--->'.$e->getMessage());
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación.'));
}
}
else{
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación. El nombre de usuario ya está en uso.'));
}
// A : Alta de usuario || M : Modificacion de usuario
return $this->load_form($usuario,'M');
}
public function load_form($usuario, $tipo){
//Se selecciona la vista a devolver
$view = View::forge('administracion/usuarios/form.twig');
//En funcion del tipo, cambia el titulo
$view->title = (($tipo=='A')?"Alta":"Modificación")." de Usuarios";
//Se recuperan los datos de los desplegables de la vista
$view->grupos = Model_Auth_Group::query()->where('is_assignable','S')->get();
//Se añaden los datos a la vista
$view->usuario = $usuario;
//Se añade una miga de pan a la vista
$this->_bc[] = array('ds'=>$view->title,'url'=>'','class'=>'active');
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
public function post_active(){
$id = Input::post('id','');
$usuario = Model_Auth_User::query()->where('id',$id)->get_one();
if ($usuario){
try{
$usuario->is_active = $usuario->is_active=="S"?"N":"S";
$usuario->save();
Session::set_flash('message',array('type'=>'success','text'=>'Modificaciones realizadas con éxito.'));
return true;
}
catch(Exception $e){
Log::error('administracion/controller/index/post_update--->'.$e->getMessage());
}
}
Session::set_flash('message',array('type'=>'error','text'=>'No se ha podido realizar la grabación.'));
return false;
}
}
\ No newline at end of file
<?php
/**
* Created by JetBrains PhpStorm.
* User: Luis
* Date: 16/12/13
* Time: 20:55
* To change this template use File | Settings | File Templates.
*/
use Fuel\Core\DB;
use Fuel\Core\Response;
use \Parser\View;
use Auth\Auth;
class Controller_Perfil_Index extends \Controller_App{
//Variable para guardar las migas de pan que van a aparecer en las vistas
private $_bc = array();
//Array con los elementos del menu que se deben marcar con la clase "active" para que esten seleccionados en el menu.
private $_option_menu=array('Mi Perfil');
public function before(){
//Se cargan funciones de javascript especificas de esta funcionalidad
Casset::js('dashboard/index.js');
//Se marca la navegación en forma de migas de pan. Cada miga de pan la forman dos variables:
// ds : String a mostrar
// url : url del enlace en modo absoluto
$this->_bc[] = array('ds'=>'Inicio','url'=>'/dashboard');
parent::before();
}
public function action_index(){
$view = View::forge('perfil/index.twig');
//Titulo de la vista
$view->title = "Mi Perfil";
//Paso de las migas de pan a la vista
$view->bc = $this->_bc;
//Paso de las opciones de menu que deben aparecer seleccionadas
$view->option_menu = $this->_option_menu;
return Response::forge($view);
}
}
\ No newline at end of file
......@@ -9,7 +9,7 @@ return array(
'auth/login' => 'login/index/login',
'auth/logout' => 'login/index/logout',
'recover' => 'login/index/recover',
'dashboard' => 'dashboard/index',
'app/locale' => 'app/locale',
......@@ -22,4 +22,9 @@ return array(
'grupos' =>'administracion/grupos/index',
'grupos/update' =>'administracion/grupos/index/update',
'grupos/show/:id' =>'administracion/grupos/index/show/$1',
/*HOME*/
'dashboard' => 'dashboard/index',
'perfil' =>'perfil/index',
);
\ No newline at end of file
<?php defined('COREPATH') or exit('No direct script access allowed'); ?>
INFO - 2018-11-29 08:07:56 --> Fuel\Core\Request::__construct - Creating a new main Request with URI = "assets/img/favicon"
INFO - 2018-11-29 08:07:56 --> Fuel\Core\Request::execute - Called
INFO - 2018-11-29 08:07:56 --> Fuel\Core\Request::execute - Setting main Request
INFO - 2018-11-29 14:26:39 --> Fuel\Core\Request::__construct - Creating a new main Request with URI = ""
INFO - 2018-11-29 14:26:39 --> Fuel\Core\Request::execute - Called
INFO - 2018-11-29 14:26:39 --> Fuel\Core\Request::execute - Setting main Request
INFO - 2018-11-29 14:26:41 --> Fuel\Core\Request::__construct - Creating a new main Request with URI = "assets/img/favicon"
INFO - 2018-11-29 14:26:41 --> Fuel\Core\Request::execute - Called
INFO - 2018-11-29 14:26:41 --> Fuel\Core\Request::execute - Setting main Request
{% extends 'layout/template.twig' %}
{% block action_zone %}
{% endblock %}
{% block content %}
<div class="container">
<div class="container pt-container-ppal">
<div class="row">
<div class="col-md-7">
{#fila 1#}
<div class="col-container">
<div class="col bg-color-menu-personalizado">
<h2>Column 1</h2>
<p>Hello World</p>
</div>
<div class="col-container mt20">
<div class="col bg-color-perfil">
<h2>Column 2</h2>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<div class="col bg-color-menu-personalizado border-box btn-home">
<div class="text-center">
<img src="assets/img/home/menu_personalizado.png" class="img-responsive-custom " />
</div>
<div class="p-text-btn-home">
<p class="whitecolor">Menú Personalizado</p>
</div>
</div>
<div class="col bg-color-perfil border-box btn-home">
<a href="perfil">
<div class="text-center">
<img src="assets/img/home/perfil.png" class="img-responsive-custom btn-home"/>
</div>
<div class="p-text-btn-home">
<p class="whitecolor">Mi Perfil</p>
</div>
</a>
</div>
</div>
{#fila 2#}
<div class="col-container">
<div class="col bg-color-menus-saludables">
<h2>Column 1</h2>
<p>Hello World</p>
</div>
<div class="col bg-color-trivial">
<h2>Column 2</h2>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<div class="col bg-color-menus-saludables border-box btn-home">
<div class="text-center">
<img src="assets/img/home/menus_saludables.png" class="img-responsive-custom btn-home"/>
</div>
<div class="p-text-btn-home">
<p class="whitecolor">Menús Saludables</p>
</div>
</div>
{#<div class="col bg-color-trivial border-box">#}
{#<img src="assets/img/home/trivial.png" class="img-responsive-custom"/>#}
{#<div class="p-text-btn-home">#}
{#<p class="whitecolor">Trivial</p>#}
{#</div>#}
{#</div>#}
</div>
</div>
<div class="col-md-5"></div>
<div class="col-md-5">
<hr>
<div class="row">
<div class="col-xs-10"> Inicio</div>
<div class="col-xs-2"><i class="fa fa-angle-right"></i></div>
</div>
<hr>
<div class="row">
<div class="col-xs-10"> Recetario</div>
<div class="col-xs-2"><i class="fa fa-angle-right"></i></div>
</div>
<hr>
<div class="row">
<div class="col-xs-10">Boletín saludable</div>
<div class="col-xs-2"><i class="fa fa-angle-right"></i></div>
</div>
<hr>
<div class="row">
<div class="col-xs-10">Lista de la compra </div>
<div class="col-xs-2"><i class="fa fa-angle-right"></i></div>
</div>
</div>
</div>
</div>
......
......@@ -3,9 +3,19 @@
<script src="/assets/js/jquery-2.1.1.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<!--menu principal animacion-->
<!--menu principal animacion: classie.js tambien se usa para input text con efecto-->
<script src="/assets/libraries/menu/classie.js"></script>
<script src="/assets/libraries/menu/demo1.js"></script>
<!--checkboxes-->
<script src="assets/libraries/AnimatedCheckboxes/js/svgcheckbx.js"></script>
<!-- selectores especiales-->
<script src="assets/libraries/SelectInspiration/js/selectFx.js"></script>
<!-- js personalizado ppal-->
<script src="assets/js/main.js"></script>
{{ asset_render_js() }}
\ No newline at end of file
<link href="/assets/css/bootstrap.min.css" rel="stylesheet">
<link href="/assets/font-awesome/css/font-awesome.css" rel="stylesheet">
<link href="/assets/css/animate.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<!--efecto menú principal-->
<link rel="stylesheet" type="text/css" href="/assets/css/menu_effect.css" />
<!-- input text effect-->
<link rel="stylesheet" type="text/css" href="assets/libraries/TextInputEffects/css/set2.css" />
<!-- checkboxes animated-->
<link rel="stylesheet" type="text/css" href="assets/libraries/AnimatedCheckboxes/css/component.css" />
<!-- selectores especiales-->
<link rel="stylesheet" type="text/css" href="assets/libraries/SelectInspiration/css/normalize.css" />
{#<link rel="stylesheet" type="text/css" href="assets/libraries/SelectInspiration/css/demo.css" />#}
<link rel="stylesheet" type="text/css" href="assets/libraries/SelectInspiration/css/cs-select.css" />
<link rel="stylesheet" type="text/css" href="assets/libraries/SelectInspiration/css/cs-skin-underline.css" />
<!--custom generic css-->
<link href="/assets/css/custom.css" rel="stylesheet">
......@@ -9,7 +9,7 @@
</a>
</div>
<div class="col-xs-10 text-right">
<a href="#home" class="smooth"><img src="assets/img/logos/inutralia.png" class="img-responsive-custom"/></a>
<a href="dashboard" class="smooth"><img src="assets/img/logos/inutralia.png" class="img-responsive-custom"/></a>
</div>
</div>
</div>
......@@ -20,8 +20,8 @@
<button type="button" class="overlay-close">Close</button>
<nav>
<ul>
<li><a href="#home" class="smooth">Inicio</a></li>
<li><a href="#aboutus" class="smooth">Mi Perfil</a></li>
<li><a href="dashboard" class="smooth">Inicio</a></li>
<li><a href="perfil" class="smooth">Mi Perfil</a></li>
<li><a href="#boxes" class="smooth">Menú Personalizado</a></li>
<li><a href="#boxes" class="smooth">Menús Saludables</a></li>
<li><a href="#boxes" class="smooth">Recetario</a></li>
......
......@@ -10,7 +10,7 @@
<base href="{{ base_url(false) }}">
<title>
{% block title %}
{{ session_get('empresa').nombre_largo }}
APP| {{ session_get('empresa').nombre_largo }}
{% endblock %}
</title>
......@@ -37,7 +37,7 @@
{% include 'layout/menu.twig' %}
<!--content-->
<div class="pt-container-ppal">
<div>
{% block content %}
{% endblock %}
</div>
......
......@@ -2,7 +2,7 @@
/*-*--*-*-*-*-*-**--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*--*--**-*estilos generales-*-*--*-*-*-*-*-*-*-*-*-*---*-*-*-*-*-*-*-*-*-*-*-*-**/
body{
font-family: 'Playfair Display', serif;
font-family: 'Montserrat', sans-serif;
font-size:1.5em;
letter-spacing: 0.01em;
color: #333;
......@@ -18,8 +18,103 @@ body{
.bg-color-menu-personalizado{background-color:#c966cd; }
.bg-color-perfil{background-color:#87cdde; }
.bg-color-menus-saludables{background-color:#92bb00 }
.bg-color-trivial{background-color: #b3b3b3}
.bg-color-menus-saludables{background-color:#92bb00;}
.bg-color-trivial{background-color: #b3b3b3;}
.border-menu-personalizado{border:2px solid #c966cd!important; }
.border-perfil{border:2px solid #87cdde!important; }
.border-menus-saludables{border:2px solid #92bb00!important; }
.border-trivial{border:2px solid #b3b3b3!important;}
/*-----------------------------------------------------*/
/*----------- DIVS, CAJAS , ESTILOS GENÉRICOS-----------*/
/*------------------------------------------------------*/
/*TOGGLE SWITCHES STYLE*/
.switch {
display: inline-block;
height: 34px;
position: relative;
width: 60px;
}
.switch input {
display:none;
}
.slider {
background-color: #ccc;
bottom: 0;
cursor: pointer;
left: 0;
position: absolute;
right: 0;
top: 0;
transition: .4s;
}
.slider:before {
background-color: #fff;
bottom: 4px;
content: "";
height: 26px;
left: 4px;
position: absolute;
transition: .4s;
width: 26px;
}
input:checked + .slider {
background-color: #66bb6a;
}
input:checked + .slider:before {
transform: translateX(26px);
}
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}
.mt-label-switch{
margin-top:10px;
}
/*END TOGGLE SWITCHES STYLE
*/
.solid-box{
padding:20px;
color:#fff;
margin-top:20px;
}
.border-box{
position:relative;
padding:20px;
margin-top:40px;
}
.title-box-border-box{
position:absolute;
left:60px;
top:-20px;
padding:15px;
color:#fff;
}
.container-box-border-box{
margin-top:40px;
}
/*----------------------------------------------------*/
/*--------------BOTONES CORPORATIVOS------------------*/
......@@ -27,6 +122,11 @@ body{
.btn-custom{
color:#fff;
width: 100%;
font-size:20px;
text-transform: uppercase;
}
.btn i{
font-size:20px!important;
}
.btn-custom:hover{
opacity:0.8;
......@@ -67,6 +167,9 @@ h1{
.mt20{
margin-top:20px;
}
.p10{
padding:10px;
}
.ptpb50{
padding-bottom: 50px;
padding-top: 50px;
......@@ -79,7 +182,12 @@ h1{
padding-bottom: 200px;
padding-top: 200px;
}
.pb40{
padding-bottom:40px;
}
.pb50{
padding-bottom:50px;
}
.pt-container-ppal{
padding-top:80px;
}
......@@ -95,7 +203,9 @@ h1{
.mb60{
margin-bottom:60px;
}
.mt10{
margin-top:10px;
}
.mauto{
margin:auto!important;
}
......@@ -142,21 +252,44 @@ a:focus {
margin-top:60px;
}
/************************************************DIV TITULO DE TODAS PAGINAS MENOS HOME**********************************************/
.div-title{
padding:20px;
color:#fff;
margin-top:40px;
}
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-DASHBOARD, HOME*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
.p-text-btn-home{
padding:10px 10px 10px 30px;
}
.btn-home:hover img{
-webkit-animation: bounce 1s;
animation: bounce 1s;
}
.btn-home:hover {
opacity:0.8;
}
/*----------------------------------------*/
/*----------CUADRÍCULA CUADRADOS MISMA ALTURA HOME--------------*/
.col-container {
display: table; /* Make the container element behave like a table */
width: 100%; /* Set full-width to expand the whole page */
display: table;
width: 100%;
}
.col {
display: table-cell; /* Make elements inside the container behave like table cells */
display: table-cell;
cursor:pointer;
}
.border-box{
border:10px solid #fff;
}
/* If the browser window is smaller than 600px, make the columns stack on top of each other */
@media only screen and (max-width: 600px) {
.col {
display: block;
......@@ -165,6 +298,13 @@ a:focus {
}
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-MI PERFIL*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/
/*-*-*-*---*-*-*--*-*-*--*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*RESPONSIVE-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*---*-*-*-*-*-*/
......
......@@ -62,6 +62,8 @@
color: #fff;
-webkit-transition: color 0.2s;
transition: color 0.2s;
font-family: 'Montserrat', sans-serif;
}
.overlay ul li a:hover,
......
/**
* Created by Luis on 2/7/15.
*/
$('#btn_frm_grupo_admin_submit').on('click', function(){
if(!$('#frm_principal').valid()){
return false;
}
$('#frm_principal').submit();
});
/**
* Created by Luis on 2/7/15.
*/
$('#btn_frm_usuario_admin_submit').on('click', function(){
if(!$('#frm_principal').valid()){
return false;
}
$('#frm_principal').submit();
});
/*----------------------------------------------------*/
/* Text imput effects
/*----------------------------------------------------*/
(function() {
// trim polyfill : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim
if (!String.prototype.trim) {
(function() {
// Make sure we trim BOM and NBSP
var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
String.prototype.trim = function() {
return this.replace(rtrim, '');
};
})();
}
[].slice.call( document.querySelectorAll( 'input.input__field' ) ).forEach( function( inputEl ) {
// in case the input is already filled..
if( inputEl.value.trim() !== '' ) {
classie.add( inputEl.parentNode, 'input--filled' );
}
// events:
inputEl.addEventListener( 'focus', onInputFocus );
inputEl.addEventListener( 'blur', onInputBlur );
} );
function onInputFocus( ev ) {
classie.add( ev.target.parentNode, 'input--filled' );
}
function onInputBlur( ev ) {
if( ev.target.value.trim() === '' ) {
classie.remove( ev.target.parentNode, 'input--filled' );
}
}
})();
/*----------------------------------------------------------------*/
/* SELECTORES ESPECIALES------------------------*/
/*-----------------------------------------------------------------*/
(function() {
[].slice.call( document.querySelectorAll( 'select.cs-select' ) ).forEach( function(el) {
new SelectFx(el);
} );
})();
Animated Checkboxes and Radio Buttons with SVG
=========
[Article on Codrops](http://tympanus.net/codrops/?p=16637)
[Demo](http://tympanus.net/Development/AnimatedCheckboxes/)
Integrate or build upon it for free in your personal or commercial projects. Don't republish, redistribute or sell "as-is".
Read more here: [License](http://tympanus.net/codrops/licensing/)
[© Codrops 2013](http://www.codrops.com)
\ No newline at end of file
*,
*:after,
*::before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.ac-custom {
padding: 0 3em;
max-width: 900px;
margin: 0 auto;
}
.ac-custom h2 {
font-size: 3em;
font-weight: 300;
padding: 0 0 0.5em;
margin: 0 0 30px;
}
.ac-custom ul,
.ac-custom ol {
list-style: none;
padding: 0;
margin: 0 auto;
max-width: 800px;
}
.ac-custom li {
margin: 0 auto;
padding: 2em 0;
position: relative;
}
.ac-custom label {
display: inline-block;
position: relative;
font-size: 2em;
padding: 0 0 0 80px;
vertical-align: top;
color: rgba(0,0,0,0.2);
cursor: pointer;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.ac-custom input[type="checkbox"],
.ac-custom input[type="radio"],
.ac-custom label::before {
width: 50px;
height: 50px;
top: 50%;
left: 0;
margin-top: -25px;
position: absolute;
cursor: pointer;
}
.ac-custom input[type="checkbox"],
.ac-custom input[type="radio"] {
opacity: 0;
-webkit-appearance: none;
display: inline-block;
vertical-align: middle;
z-index: 100;
}
.ac-custom label::before {
content: '';
border: 4px solid #fff;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.ac-radio label::before {
border-radius: 50%;
}
.ac-custom input[type="checkbox"]:checked + label,
.ac-custom input[type="radio"]:checked + label {
color: #fff;
}
.ac-custom input[type="checkbox"]:checked + label::before,
.ac-custom input[type="radio"]:checked + label::before {
opacity: 0.8;
}
/* General SVG and path styles */
.ac-custom svg {
position: absolute;
width: 40px;
height: 40px;
top: 50%;
margin-top: -20px;
left: 5px;
pointer-events: none;
}
.ac-custom svg path {
stroke: #fdfcd3;
stroke-width: 13px;
stroke-linecap: round;
stroke-linejoin: round;
fill: none;
}
/* Specific input, SVG and path styles */
/* Circle */
.ac-circle input[type="checkbox"],
.ac-circle input[type="radio"],
.ac-circle label::before {
width: 30px;
height: 30px;
margin-top: -15px;
left: 10px;
position: absolute;
}
.ac-circle label::before {
background-color: #fff;
border: none;
}
.ac-circle svg {
width: 70px;
height: 70px;
margin-top: -35px;
left: -10px;
}
.ac-circle svg path {
stroke-width: 5px;
}
/* Box Fill */
.ac-boxfill svg path {
stroke-width: 8px;
}
/* Swirl */
.ac-swirl svg path {
stroke-width: 8px;
}
/* List */
.ac-list ol {
list-style: decimal;
list-style-position: inside;
}
.ac-list ol li {
font-size: 2em;
padding: 1em 1em 0 2em;
text-indent: -40px;
}
.ac-list ol li label {
font-size: 1em;
text-indent: 0;
padding-left: 30px;
}
.ac-list label::before {
display: none;
}
.ac-list svg {
width: 100%;
height: 80px;
left: 0;
top: 1.2em;
margin-top: 0px;
}
.ac-list svg path {
stroke-width: 4px;
}
/* Media Queries */
@media screen and (max-width: 50em) {
section {
font-size: 80%;
}
}
\ No newline at end of file
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@font-face {
font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
font-weight: normal;
font-style: normal;
}
body {
background: #fb887c;
color: #fff;
font-family: 'Lato', Arial, sans-serif;
}
body {
margin: 0;
}
.container > header {
margin: 0 auto;
padding: 4em 2em;
text-align: center;
background: rgba(0,0,0,.05);
}
.container > header h1 {
font-size: 2.625em;
line-height: 1.3;
margin: 0;
font-weight: 300;
}
.container > header span {
display: block;
font-size: 60%;
color: rgba(0,0,0,.2);
font-weight: 400;
padding: 0 0 0.6em 0.1em;
}
section:nth-child(even) {
background: rgba(0,0,0,.05);
}
section.related {
text-align: center;
font-size: 1.6em;
}
.related p {
margin: 0;
padding: 1.1em;
}
/* To Navigation Style */
.codrops-top {
text-transform: uppercase;
width: 100%;
font-size: 0.69em;
line-height: 2.2;
font-weight: 700;
}
.codrops-top a {
text-decoration: none;
padding: 0 1em;
letter-spacing: 0.1em;
display: inline-block;
}
.codrops-top span.right {
float: right;
}
.codrops-top span.right a {
float: left;
display: block;
}
.codrops-icon:before {
font-family: 'codropsicons';
margin: 0 4px;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
content: "\e001";
}
.codrops-icon-prev:before {
content: "\e004";
}
@media screen and (max-width: 25em) {
.codrops-icon span {
display: none;
}
}
\ No newline at end of file
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
This is a custom SVG font generated by IcoMoon.
<iconset grid="14"></iconset>
</metadata>
<defs>
<font id="codropsicons" horiz-adv-x="448" >
<font-face units-per-em="448" ascent="384" descent="-64" />
<missing-glyph horiz-adv-x="448" />
<glyph unicode="&#xe001;" d="M 221.657,359.485 ,m0.00,0.00,c 0.00,0.00 -132.984-182.838 -132.205-286.236 0.515-68.522 61.089-123.688 135.314-123.218 74.202,0.479 133.943,56.421 133.428,124.943 C 357.414,178.368 221.657,359.485 221.657,359.485 z" />
<glyph unicode="&#xe004;" d="M 384.00,160.00l0.00-32.00 q0.00-13.25 -8.125-22.625t-21.125-9.375l-176.00,0.00 l 73.25-73.50q 9.50-9.00 9.50-22.50t-9.50-22.50l-18.75-19.00q-9.25-9.25 -22.50-9.25q-13.00,0.00 -22.75,9.25l-162.75,163.00q-9.25,9.25 -9.25,22.50q0.00,13.00 9.25,22.75l 162.75,162.50q 9.50,9.50 22.75,9.50q 13.00,0.00 22.50-9.50l 18.75-18.50q 9.50-9.50 9.50-22.75t-9.50-22.75l-73.25-73.25l 176.00,0.00 q 13.00,0.00 21.125-9.375 t 8.125-22.625z" horiz-adv-x="384" />
<glyph unicode="&#xe002;" d="M 407.273-23.273c0.00,0.00-325.818,0.00-366.545,0.00s-40.727,40.727-40.727,40.727l0.00,142.545 l 101.818,183.273l 244.364,0.00 l 101.818-183.273c0.00,0.00,0.00-101.818,0.00-142.545S 407.273-23.273, 407.273-23.273z M 325.818,302.545L 122.182,302.545
l-71.273-142.545L 142.545,160.00 c0.00,0.00, 40.727,0.00, 40.727-40.727l0.00-20.364 l 81.455,0.00 l0.00,20.364 c0.00,0.00,0.00,40.727, 40.727,40.727l 91.636,0.00 L 325.818,302.545z M 407.273,119.273l-96.911,0.00 C 307.532,113.917, 305.455,107.503, 305.455,98.909c0.00-40.727-40.727-40.727-40.727-40.727L 183.273,58.182 c0.00,0.00-40.727,0.00-40.727,40.727
c0.00,8.593-2.077,15.008-4.908,20.364L 40.727,119.273 l0.00-101.818 l 366.545,0.00 L 407.273,119.273 z M 132.364,221.091l 183.273,0.00 L 325.818,200.727L 122.182,200.727 L 132.364,221.091z M 152.727,261.818l 142.545,0.00 L 305.455,241.455L 142.545,241.455 L 152.727,261.818z" />
<glyph unicode="&#xe000;" d="M 368.00,144.00q0.00-13.50 -9.25-22.75l-162.75-162.75q-9.75-9.25 -22.75-9.25q-12.75,0.00 -22.50,9.25l-18.75,18.75q-9.50,9.50 -9.50,22.75t 9.50,22.75l 73.25,73.25l-176.00,0.00 q-13.00,0.00 -21.125,9.375t-8.125,22.625l0.00,32.00 q0.00,13.25 8.125,22.625t 21.125,9.375l 176.00,0.00 l-73.25,73.50q-9.50,9.00 -9.50,22.50t 9.50,22.50l 18.75,18.75q 9.50,9.50 22.50,9.50q 13.25,0.00 22.75-9.50l 162.75-162.75q 9.25-8.75 9.25-22.50z" horiz-adv-x="384" />
<glyph unicode="&#xe003;" d="M 224.00-64.00C 100.291-64.00,0.00,36.291,0.00,160.00S 100.291,384.00, 224.00,384.00s 224.00-100.291, 224.00-224.00S 347.709-64.00, 224.00-64.00z
M 224.00,343.273c-101.228,0.00-183.273-82.045-183.273-183.273s 82.045-183.273, 183.273-183.273s 183.273,82.045, 183.273,183.273S 325.228,343.273, 224.00,343.273z M 244.364,122.164C 244.364,111.005, 244.364,98.909, 244.364,98.909l-40.727,0.00 c0.00,0.00,0.00,29.466,0.00,40.727
s 9.123,20.364, 20.364,20.364l0.00,0.00c 22.481,0.00, 40.727,18.246, 40.727,40.727s-18.246,40.727-40.727,40.727S 183.273,223.209, 183.273,200.727c0.00-7.453, 2.138-14.356, 5.641-20.364L 145.437,180.364 C 143.727,186.90, 142.545,193.661, 142.545,200.727
c0.00,44.983, 36.471,81.455, 81.455,81.455s 81.455-36.471, 81.455-81.455C 305.455,162.831, 279.45,131.247, 244.364,122.164z M 244.364,37.818l-40.727,0.00 l0.00,40.727 l 40.727,0.00 L 244.364,37.818 z" />
<glyph unicode="&#x20;" horiz-adv-x="224" />
<glyph class="hidden" unicode="&#xf000;" d="M0,384L 448 -64L0 -64 z" horiz-adv-x="0" />
</font></defs></svg>
\ No newline at end of file
Icon Set: Font Awesome -- http://fortawesome.github.com/Font-Awesome/
License: SIL -- http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Icon Set: Eco Ico -- http://dribbble.com/shots/665585-Eco-Ico
License: CC0 -- http://creativecommons.org/publicdomain/zero/1.0/
\ No newline at end of file
/* Modernizr 2.6.2 (Custom Build) | MIT & BSD
* Build: http://modernizr.com/download/#-touch-shiv-cssclasses-teststyles-prefixes-load
*/
;window.Modernizr=function(a,b,c){function w(a){j.cssText=a}function x(a,b){return w(m.join(a+";")+(b||""))}function y(a,b){return typeof a===b}function z(a,b){return!!~(""+a).indexOf(b)}function A(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:y(f,"function")?f.bind(d||b):f}return!1}var d="2.6.2",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n={},o={},p={},q=[],r=q.slice,s,t=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},u={}.hasOwnProperty,v;!y(u,"undefined")&&!y(u.call,"undefined")?v=function(a,b){return u.call(a,b)}:v=function(a,b){return b in a&&y(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=r.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(r.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(r.call(arguments)))};return e}),n.touch=function(){var c;return"ontouchstart"in a||a.DocumentTouch&&b instanceof DocumentTouch?c=!0:t(["@media (",m.join("touch-enabled),("),h,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(a){c=a.offsetTop===9}),c};for(var B in n)v(n,B)&&(s=B.toLowerCase(),e[s]=n[B](),q.push((e[s]?"":"no-")+s));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)v(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},w(""),i=k=null,function(a,b){function k(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function l(){var a=r.elements;return typeof a=="string"?a.split(" "):a}function m(a){var b=i[a[g]];return b||(b={},h++,a[g]=h,i[h]=b),b}function n(a,c,f){c||(c=b);if(j)return c.createElement(a);f||(f=m(c));var g;return f.cache[a]?g=f.cache[a].cloneNode():e.test(a)?g=(f.cache[a]=f.createElem(a)).cloneNode():g=f.createElem(a),g.canHaveChildren&&!d.test(a)?f.frag.appendChild(g):g}function o(a,c){a||(a=b);if(j)return a.createDocumentFragment();c=c||m(a);var d=c.frag.cloneNode(),e=0,f=l(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function p(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return r.shivMethods?n(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+l().join().replace(/\w+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(r,b.frag)}function q(a){a||(a=b);var c=m(a);return r.shivCSS&&!f&&!c.hasCSS&&(c.hasCSS=!!k(a,"article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}")),j||p(a,c),a}var c=a.html5||{},d=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,e=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,f,g="_html5shiv",h=0,i={},j;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",f="hidden"in a,j=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){f=!0,j=!0}})();var r={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,supportsUnknownElements:j,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:q,createElement:n,createDocumentFragment:o};a.html5=r,q(b)}(this,b),e._version=d,e._prefixes=m,e.testStyles=t,g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+q.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
\ No newline at end of file
/* Default custom select styles */
div.cs-select {
display: inline-block;
vertical-align: middle;
position: relative;
text-align: left;
background: #fff;
z-index: 100;
width: 100%;
max-width: 500px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
div.cs-select:focus {
outline: none; /* For better accessibility add a style for this in your skin */
}
.cs-select select {
display: none;
}
.cs-select span {
display: block;
position: relative;
cursor: pointer;
padding: 1em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Placeholder and selected option */
.cs-select > span {
padding-right: 3em;
}
.cs-select > span::after,
.cs-select .cs-selected span::after {
speak: none;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.cs-select > span::after {
content: '\25BE';
right: 1em;
}
.cs-select .cs-selected span::after {
content: '\2713';
margin-left: 1em;
}
.cs-select.cs-active > span::after {
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
}
div.cs-active {
z-index: 200;
}
/* Options */
.cs-select .cs-options {
position: absolute;
overflow: hidden;
width: 100%;
background: #fff;
visibility: hidden;
}
.cs-select.cs-active .cs-options {
visibility: visible;
}
.cs-select ul {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.cs-select ul span {
padding: 1em;
}
.cs-select ul li.cs-focus span {
background-color: #ddd;
}
/* Optgroup and optgroup label */
.cs-select li.cs-optgroup ul {
padding-left: 1em;
}
.cs-select li.cs-optgroup > span {
cursor: default;
}
@font-face {
font-family: 'icomoon';
src:url('../fonts/icomoon/icomoon.eot?-rdnm34');
src:url('../fonts/icomoon/icomoon.eot?#iefix-rdnm34') format('embedded-opentype'),
url('../fonts/icomoon/icomoon.woff?-rdnm34') format('woff'),
url('../fonts/icomoon/icomoon.ttf?-rdnm34') format('truetype'),
url('../fonts/icomoon/icomoon.svg?-rdnm34#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'icomoon2';
src:url('../fonts/icomoon/icomoon/icomoon.eot?-rdnm34');
src:url('../fonts/icomoon/icomoon/icomoon.eot?#iefix-rdnm34') format('embedded-opentype'),
url('../fonts/icomoon/icomoon/icomoon.woff?-rdnm34') format('woff'),
url('../fonts/icomoon/icomoon/icomoon.ttf?-rdnm34') format('truetype'),
url('../fonts/icomoon/icomoon/icomoon.svg?-rdnm34#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
div.cs-skin-underline {
background: transparent;
font-size: 1em;
max-width: 400px;
}
@media screen and (max-width: 30em) {
div.cs-skin-underline { font-size: 1.2em; }
}
.cs-skin-underline > span {
padding: 0.5em 3em 0.5em 0.5em;
border-bottom: 1px solid #000;
border-color: inherit;
font-weight: normal;
}
.cs-skin-underline > span::after {
font-family: 'icomoon';
content: '\e003';
right: 0.25em;
-webkit-transform: translate3d(0,-50%,0) rotate3d(0,0,1,45deg);
transform: translate3d(0,-50%,0) rotate3d(0,0,1,45deg);
-webkit-transition: -webkit-transform 0.5s;
transition: transform 0.5s;
}
.cs-skin-underline.cs-active > span::after {
-webkit-transform: translate3d(0,-50%,0) rotate3d(0,0,1,270deg);
transform: translate3d(0,-50%,0) rotate3d(0,0,1,270deg);
}
.cs-skin-underline .cs-options {
background: #ccc;
opacity: 0;
-webkit-transition: opacity 0.3s 0.4s, visibility 0s 0.7s;
transition: opacity 0.3s 0.4s, visibility 0s 0.7s;
}
.cs-skin-underline.cs-active .cs-options {
opacity: 1;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.cs-skin-underline ul span {
position: relative;
text-transform: uppercase;
font-size: 66%;
font-weight: 700;
letter-spacing: 1px;
padding: 1.2em 0.8em;
opacity: 0;
-webkit-transform: translate3d(100%,0,0);
transform: translate3d(100%,0,0);
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
transition: opacity 0.3s, transform 0.3s;
}
.cs-select ul span::after {
content: '';
opacity: 0;
}
.cs-select .cs-selected span::after {
font-family: 'icomoon2';
content: '\e902';
opacity: 1;
-webkit-transition: opacity 0.3s 0.7s;
transition: opacity 0.3s 0.7s;
}
.cs-skin-underline ul span::before {
content: '';
position: absolute;
bottom: 1px;
left: 0;
height: 1px;
width: 100%;
background-color: #fff;
-webkit-transform: translate3d(200%,0,0);
transform: translate3d(200%,0,0);
-webkit-transition: -webkit-transform 0.3s;
transition: transform 0.3s;
}
.cs-skin-underline.cs-active ul span,
.cs-skin-underline.cs-active ul span::before {
opacity: 1;
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.cs-skin-underline li:nth-child(5) span,
.cs-skin-underline li:nth-child(5) span::before,
.cs-skin-underline.cs-active li:first-child span,
.cs-skin-underline.cs-active li:first-child span::before {
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.cs-skin-underline li:nth-child(4) span,
.cs-skin-underline li:nth-child(4) span::before,
.cs-skin-underline.cs-active li:nth-child(2) span,
.cs-skin-underline.cs-active li:nth-child(2) span::before {
-webkit-transition-delay: 0.05s;
transition-delay: 0.05s;
}
.cs-skin-underline li:nth-child(3) span,
.cs-skin-underline li:nth-child(3) span::before {
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
.cs-skin-underline li:nth-child(2) span,
.cs-skin-underline li:nth-child(2) span::before,
.cs-skin-underline.cs-active li:nth-child(4) span,
.cs-skin-underline.cs-active li:nth-child(4) span::before {
-webkit-transition-delay: 0.15s;
transition-delay: 0.15s;
}
.cs-skin-underline li:first-child span,
.cs-skin-underline li:first-child span::before,
.cs-skin-underline.cs-active li:nth-child(5) span,
.cs-skin-underline.cs-active li:nth-child(5) span::before {
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
} /* more items require more delay declarations */
.cs-skin-underline .cs-options li span:hover,
.cs-skin-underline .cs-options li.cs-focus span,
.cs-skin-underline li.cs-selected span {
color: #566473;
background: transparent;
}
@font-face {
font-weight: normal;
font-style: normal;
font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-user:before {
content: "\e900";
}
.icon-star-empty:before {
content: "\e902";
}
.icon-star-full:before {
content: "\e903";
}
.icon-checkmark:before {
content: "\e901";
}
*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }
body {
/*background: #3498db;*/
/*color: #fff;*/
font-weight: 400;
font-size: 1em;
/*padding: 35px 10px;*/
border-right: 25px solid #fff;
border-left: 25px solid #fff;
/*font-family: 'Raleway', Arial, sans-serif;*/
}
body::before,
body::after {
content: '';
position: fixed;
left: 0;
top: 0;
width: 100%;
/*height: 25px;*/
background: #fff;
z-index: 1001;
}
body::after {
top: auto;
bottom: 0;
}
a {
color: #1e6fa4;
text-decoration: none;
outline: none;
}
a:hover, a:focus {
color: #125480;
outline: none;
}
/* Demo themes */
.color-2 { background: #bbc7c8; color: #fff; }
.color-2 a { color: #566473; }
.color-2 a:hover, .color-2 a:focus { color: #34495e; }
.color-3 { background: #00b6ad; color: #fff; }
.color-3 a { color: #04706b; }
.color-3 a:hover, .color-3 a:focus { color: #03514d; }
.color-4 { background: #3b3f45; color: #f9f9f9; }
.color-4 a { color: #eb7e7f; }
.color-4 a:hover, .color-4 a:focus { color: #c56667; }
.color-5 { background: #f06d54; color: #fff; }
.color-5 a { color: #a35749; }
.color-5 a:hover, .color-5 a:focus { color: #6d3126; }
.color-6 { background: #f9f9f9; border-color: #f9f9f9; color: #62706c; }
.color-6::before, .color-6::after { background: #f9f9f9; }
.color-6 a { color: #1ecd97; }
.color-6 a:hover, .color-6 a:focus { color: #1ab585; }
.color-7 { background: #fffed8; color: #6bccb4; }
.color-7 a { color: #eb7e7f; }
.color-7 a:hover, .color-6 a:focus { color: #c36263; }
.color-8 { background: #415c71; color: #fefef8; }
.color-8 a { color: #7ad7ee; }
.color-8 a:hover, .color-8 a:focus { color: #539eb1; }
section {
/*padding: 4% 1em 10%;*/
text-align: center;
}
label.select-label {
display: block;
text-transform: uppercase;
padding: 1em 0 1.5em;
font-size: 75%;
letter-spacing: 1px;
font-weight: 700;
width: 300px;
text-align: left;
margin: 0 auto;
color: #c0c6c4;
}
.color-4 label.select-label {
color: #282b30;
font-size: 1em;
}
/* Header */
.codrops-header {
margin: 0 auto;
padding: 2em;
text-align: center;
}
.codrops-header h1 span {
display: block;
font-size: 30%;
text-transform: uppercase;
letter-spacing: 2px;
opacity: 0.8;
}
.codrops-header h1 {
margin: 0;
font-weight: 700;
font-size: 3.5em;
line-height: 1.3;
}
/* To Navigation Style */
.codrops-top {
width: 100%;
text-transform: uppercase;
font-weight: 700;
font-size: 0.69em;
line-height: 2.2;
}
.codrops-top a {
display: inline-block;
padding: 0 1em;
text-decoration: none;
letter-spacing: 1px;
}
.codrops-top span.right {
float: right;
}
.codrops-top span.right a {
display: block;
float: left;
}
.codrops-icon:before {
margin: 0 4px;
text-transform: none;
font-weight: normal;
font-style: normal;
font-variant: normal;
font-family: 'codropsicons';
line-height: 1;
speak: none;
-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
content: "\e001";
}
.codrops-icon-prev:before {
content: "\e004";
}
/* Demo Buttons Style */
.codrops-demos {
padding-top: 1em;
font-size: 0.9em;
}
.codrops-demos a {
display: inline-block;
margin: 0.5em;
padding: 0.7em 1.1em;
outline: none;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
}
.codrops-demos a.current-demo {
color: inherit;
}
/* Related demos */
.related {
padding-top: 20em;
}
.related p {
font-size: 1.6em;
}
.related > a {
border: 3px solid;
border-color: initial;
display: inline-block;
vertical-align: top;
text-align: center;
margin: 20px 10px;
padding: 25px;
}
.related a img {
max-width: 100%;
opacity: 0.8;
}
.related a:hover img,
.related a:active img {
opacity: 1;
}
.related a h3 {
margin: 0;
padding: 0.5em 0 0.3em;
max-width: 300px;
text-align: left;
}
.wrap {
padding: 1em 0;
}
@media screen and (max-width: 30em) {
body::before,
body::after {
display: none !important;
}
body {
border: none !important;
padding: 0 !important;
}
.codrops-header h1 {
font-size: 2em;
}
.codrops-icon span {
display: none;
}
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
This is a custom SVG font generated by IcoMoon.
<iconset grid="14"></iconset>
</metadata>
<defs>
<font id="codropsicons" horiz-adv-x="448" >
<font-face units-per-em="448" ascent="384" descent="-64" />
<missing-glyph horiz-adv-x="448" />
<glyph unicode="&#xe001;" d="M 221.657,359.485 ,m0.00,0.00,c 0.00,0.00 -132.984-182.838 -132.205-286.236 0.515-68.522 61.089-123.688 135.314-123.218 74.202,0.479 133.943,56.421 133.428,124.943 C 357.414,178.368 221.657,359.485 221.657,359.485 z" />
<glyph unicode="&#xe004;" d="M 384.00,160.00l0.00-32.00 q0.00-13.25 -8.125-22.625t-21.125-9.375l-176.00,0.00 l 73.25-73.50q 9.50-9.00 9.50-22.50t-9.50-22.50l-18.75-19.00q-9.25-9.25 -22.50-9.25q-13.00,0.00 -22.75,9.25l-162.75,163.00q-9.25,9.25 -9.25,22.50q0.00,13.00 9.25,22.75l 162.75,162.50q 9.50,9.50 22.75,9.50q 13.00,0.00 22.50-9.50l 18.75-18.50q 9.50-9.50 9.50-22.75t-9.50-22.75l-73.25-73.25l 176.00,0.00 q 13.00,0.00 21.125-9.375 t 8.125-22.625z" horiz-adv-x="384" />
<glyph unicode="&#xe002;" d="M 407.273-23.273c0.00,0.00-325.818,0.00-366.545,0.00s-40.727,40.727-40.727,40.727l0.00,142.545 l 101.818,183.273l 244.364,0.00 l 101.818-183.273c0.00,0.00,0.00-101.818,0.00-142.545S 407.273-23.273, 407.273-23.273z M 325.818,302.545L 122.182,302.545
l-71.273-142.545L 142.545,160.00 c0.00,0.00, 40.727,0.00, 40.727-40.727l0.00-20.364 l 81.455,0.00 l0.00,20.364 c0.00,0.00,0.00,40.727, 40.727,40.727l 91.636,0.00 L 325.818,302.545z M 407.273,119.273l-96.911,0.00 C 307.532,113.917, 305.455,107.503, 305.455,98.909c0.00-40.727-40.727-40.727-40.727-40.727L 183.273,58.182 c0.00,0.00-40.727,0.00-40.727,40.727
c0.00,8.593-2.077,15.008-4.908,20.364L 40.727,119.273 l0.00-101.818 l 366.545,0.00 L 407.273,119.273 z M 132.364,221.091l 183.273,0.00 L 325.818,200.727L 122.182,200.727 L 132.364,221.091z M 152.727,261.818l 142.545,0.00 L 305.455,241.455L 142.545,241.455 L 152.727,261.818z" />
<glyph unicode="&#xe000;" d="M 368.00,144.00q0.00-13.50 -9.25-22.75l-162.75-162.75q-9.75-9.25 -22.75-9.25q-12.75,0.00 -22.50,9.25l-18.75,18.75q-9.50,9.50 -9.50,22.75t 9.50,22.75l 73.25,73.25l-176.00,0.00 q-13.00,0.00 -21.125,9.375t-8.125,22.625l0.00,32.00 q0.00,13.25 8.125,22.625t 21.125,9.375l 176.00,0.00 l-73.25,73.50q-9.50,9.00 -9.50,22.50t 9.50,22.50l 18.75,18.75q 9.50,9.50 22.50,9.50q 13.25,0.00 22.75-9.50l 162.75-162.75q 9.25-8.75 9.25-22.50z" horiz-adv-x="384" />
<glyph unicode="&#xe003;" d="M 224.00-64.00C 100.291-64.00,0.00,36.291,0.00,160.00S 100.291,384.00, 224.00,384.00s 224.00-100.291, 224.00-224.00S 347.709-64.00, 224.00-64.00z
M 224.00,343.273c-101.228,0.00-183.273-82.045-183.273-183.273s 82.045-183.273, 183.273-183.273s 183.273,82.045, 183.273,183.273S 325.228,343.273, 224.00,343.273z M 244.364,122.164C 244.364,111.005, 244.364,98.909, 244.364,98.909l-40.727,0.00 c0.00,0.00,0.00,29.466,0.00,40.727
s 9.123,20.364, 20.364,20.364l0.00,0.00c 22.481,0.00, 40.727,18.246, 40.727,40.727s-18.246,40.727-40.727,40.727S 183.273,223.209, 183.273,200.727c0.00-7.453, 2.138-14.356, 5.641-20.364L 145.437,180.364 C 143.727,186.90, 142.545,193.661, 142.545,200.727
c0.00,44.983, 36.471,81.455, 81.455,81.455s 81.455-36.471, 81.455-81.455C 305.455,162.831, 279.45,131.247, 244.364,122.164z M 244.364,37.818l-40.727,0.00 l0.00,40.727 l 40.727,0.00 L 244.364,37.818 z" />
<glyph unicode="&#x20;" horiz-adv-x="224" />
<glyph class="hidden" unicode="&#xf000;" d="M0,384L 448 -64L0 -64 z" horiz-adv-x="0" />
</font></defs></svg>
\ No newline at end of file
Icon Set: Font Awesome -- http://fortawesome.github.com/Font-Awesome/
License: SIL -- http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Icon Set: Eco Ico -- http://dribbble.com/shots/665585-Eco-Ico
License: CC0 -- http://creativecommons.org/publicdomain/zero/1.0/
\ No newline at end of file
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by Fontastic.me</metadata>
<defs>
<font id="icomoon" horiz-adv-x="512">
<font-face font-family="icomoon" units-per-em="512" ascent="480" descent="-32"/>
<missing-glyph horiz-adv-x="512" />
<glyph unicode="&#57344;" d="M256 459c6 0 11-2 15-7 4-4 6-9 6-15l0-332 113 113c4 4 9 6 15 6 6 0 12-2 16-6 4-4 6-9 6-15 0-6-2-11-6-16l-150-149c-4-4-9-6-15-6-6 0-11 2-15 6l-149 149c-5 5-7 10-7 16 0 6 2 11 6 15 4 4 10 6 16 6 6 0 11-2 15-6l113-113 0 332c0 6 2 11 6 15 4 5 9 7 15 7z"/>
<glyph unicode="&#57349;" d="M26 290c0 5 2 9 5 13l48 47c3 3 7 5 12 5 5 0 10-2 13-5l152-152 152 152c3 3 8 5 13 5 5 0 9-2 12-5l48-47c3-4 5-8 5-13 0-5-2-10-5-13l-212-212c-4-4-8-6-13-6-5 0-9 2-13 6l-212 212c-3 3-5 8-5 13z"/>
<glyph unicode="&#57350;" d="M114 261c0 2 0 4 2 6l15 14c2 2 4 3 6 3 3 0 5-1 7-3l112-112 112 112c2 2 4 3 7 3 2 0 5-1 7-3l14-14c2-2 3-4 3-6 0-3-1-5-3-7l-133-133c-2-2-4-3-7-3-2 0-5 1-6 3l-134 133c-2 2-2 4-2 7z m0 109c0 3 0 5 2 7l15 14c2 2 4 3 6 3 3 0 5-1 7-3l112-112 112 112c2 2 4 3 7 3 2 0 5-1 7-3l14-14c2-2 3-4 3-7 0-2-1-4-3-6l-133-133c-2-2-4-3-7-3-2 0-5 1-6 3l-134 133c-2 2-2 4-2 6z"/>
<glyph unicode="&#57351;" d="M114 297c0 3 0 5 2 7l15 14c2 2 4 3 6 3 3 0 5-1 7-3l112-112 112 112c2 2 4 3 7 3 2 0 5-1 7-3l14-14c2-2 3-4 3-7 0-2-1-5-3-6l-133-134c-2-1-4-2-7-2-2 0-5 1-6 2l-134 134c-2 1-2 4-2 6z"/>
<glyph unicode="&#57352;" d="M503 343l-160 160c-8 8-20 11-31 8-5-1-11-4-15-8-3-4-6-9-8-14-7-23-19-43-38-62-25-25-57-43-91-63-36-21-74-43-104-74-26-26-44-55-55-89-3-11 0-23 8-32l160-160c8-8 20-11 31-8 5 1 11 4 15 8 3 4 6 8 8 14 7 23 19 43 38 62 25 25 57 43 91 63 36 21 74 43 104 74 26 26 44 55 55 89 3 11 0 23-8 32z m-311-311c-53 53-107 107-160 160 45 147 243 141 288 288 53-53 107-107 160-160-45-147-243-141-288-288z m121 242c-5 4-10 7-16 8-5 2-10 2-16 2-5 0-10-2-16-4-5-2-10-4-16-7-8 10-17 20-26 29 4 4 8 5 12 6 3 0 7-1 10-2 3 0 7-1 9-2 3 0 6 0 8 2 2 2 4 5 4 8 0 3-1 6-4 9-3 4-7 6-12 7-5 1-10 1-15 0-5-1-10-3-15-6-4-3-8-5-10-8-2 1-3 2-4 3-1 1-2 2-4 2-2 0-3-1-4-3-1-1-2-2-2-4 0-2 1-3 2-4 1-1 2-2 3-3-4-5-7-10-10-16-2-6-4-11-5-17 0-6 0-11 2-15 2-5 5-9 10-13 7-6 16-9 26-8 11 0 22 3 33 10 10-11 19-22 29-32-4-4-8-6-11-6-3-1-6-1-8 0-3 1-5 2-7 3-2 2-4 3-6 4-2 1-5 2-7 2-2 0-4-1-7-3-2-3-4-5-4-8 0-3 2-6 4-9 3-4 7-6 11-8 4-2 9-3 14-4 6 0 11 1 17 3 6 2 12 6 18 12 2-3 5-6 8-8 1-1 3-2 4-2 2 1 4 1 5 3 1 1 1 3 1 4 0 2-1 3-2 4-3 3-5 5-8 7 5 6 8 12 11 19 3 6 5 12 5 17 1 6 0 11-1 15-2 5-5 9-10 13z m-89-11c-5 0-9 1-12 4-2 2-3 4-4 6 0 2 0 4 0 6 0 3 1 5 2 8 1 2 3 5 5 7 8-8 16-17 25-26-7-3-12-5-16-5z m75-32c-1-3-3-5-5-7-9 9-18 19-27 29 2 1 5 2 7 3 3 1 6 2 8 2 3 1 5 1 8 0 3-1 5-2 7-4 3-3 4-5 5-7 0-3 0-6 0-8-1-3-2-6-3-8z m-64-74l0 0c-10-8-19-16-28-25-9-8-17-18-24-27l-11-15 0 0c-2-3-1-7 1-10 4-3 9-3 12 0 0 1 1 1 1 2l10 14c7 8 14 17 22 25 9 9 17 16 27 24l0 0c1 0 1 0 1 0 3 3 3 8 0 12-3 3-7 3-11 0z m59 232c-8-9-17-16-27-24 0 0-1 0-2-1-3-3-3-8 0-11 3-3 8-3 12-1l0 0c10 8 19 16 28 25 9 9 17 18 24 27l11 15 0 0c2 4 2 8-1 11-3 4-8 4-11 0-1 0-1-1-2-2l-10-14c-7-9-14-17-22-25z"/>
<glyph unicode="&#57353;" d="M472 176l-43 0c-1 4-2 8-3 11l77 39c8 4 11 13 7 21-4 8-13 11-21 7l-73-36c-28 60-89 102-160 102-86 0-158-62-173-144l-43 0c-22 0-40-18-40-40 0-8 3-15 8-21l56-63 0-12c0-22 18-40 40-40l304 0c22 0 40 18 40 40l0 12 56 63c5 6 8 13 8 21 0 22-18 40-40 40z m-59 0l-9 0 8 4c0-1 0-3 1-4z m-157 128c64 0 120-38 145-93l-14-8c-23 50-73 85-131 85-69 0-126-48-140-112l-17 0c15 73 80 128 157 128z m73-128c-12 28-40 48-73 48-33 0-61-20-73-48l-17 0c13 37 48 64 90 64 39 0 73-24 88-58l-12-6z m-73 16c-14 0-27-6-36-16l-19 0c11 19 31 32 55 32 24 0 44-13 55-32l-20 0c-8 10-21 16-35 16z m0 64c-51 0-93-34-107-80l-17 0c14 55 64 96 124 96 52 0 97-31 117-76l-15-7c-17 39-56 67-102 67z m160-192l0-24c0-4-4-8-8-8l-304 0c-4 0-8 4-8 8l0 24-64 72c0 4 4 8 8 8l432 0c4 0 8-4 8-8z m-288 261c0 0 0-1 0-1 0 0 0 0 0 0 1-2 4-4 7-4 4 0 8 4 8 8 0 1 0 1 0 2 0 0 0 0 0 0-6 14-1 30 6 47 8 18 16 38 7 58-1 3-4 5-7 5-5 0-8-4-8-8 0-1 0-2 0-3 0 0 0 0 0 0 0 0 1 0 1 0 0 0 0 0 0 0 6-15 0-29-7-46-8-18-16-38-8-58 0 0 1 0 1 0z m194 2c1 0 1 0 1 0l0 0c1-3 4-5 7-5 4 0 8 4 8 8 0 1 0 2-1 2 1 0 1 1 0 1-6 14 0 29 7 46 8 18 16 38 7 58-1 3-4 5-7 5-5 0-8-3-8-8 0 0 0-1 0-2 0 0 0 0 0 0 0 0 0 0 0 0 0-1 0-1 0-1 7-14 1-29-6-46-8-18-16-37-8-57 0-1 0-1 0-1z m-82 70c0 0 0-1 0-1 0 0 0 0 0 0 2-2 4-4 8-4 4 0 8 4 8 8 0 1-1 1-1 2 0 0 0 0 0 0-6 14 0 30 7 47 8 18 16 38 7 58-1 3-4 5-8 5-4 0-7-4-7-8 0-1 0-2 0-3 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 7-15 0-29-7-46-7-18-15-38-7-58 0 0 0 0 0 0z"/>
<glyph unicode="&#57354;" d="M467 428c-58 57-151 58-211 4-60 54-153 53-211-4-60-60-60-156 0-215 17-17 177-175 177-175 19-19 49-19 68 0 0 0 175 173 177 175 60 59 60 155 0 215z m-23-192l-177-175c-6-7-16-7-22 0l-177 175c-47 46-47 122 0 169 45 45 118 47 166 4l22-20 22 20c48 43 121 41 166-4 47-47 47-123 0-169z m-296 156c0 0 0 0 0 0-38 0-68-30-68-68 0-4 4-8 8-8 4 0 8 4 8 8l0 0c0 29 23 52 52 52l0 0c4 0 8 4 8 8 0 4-4 8-8 8z"/>
<glyph unicode="&#57355;" d="M256 352c-71 0-128-57-128-128 0-71 57-128 128-128 71 0 128 57 128 128 0 71-57 128-128 128z m73-190c-35-41-95-45-135-11-41 35-45 95-11 135 35 41 95 45 135 11 41-35 45-95 11-135z m-73 126c-35 0-64-29-64-64l0 0c0-4 4-8 8-8 4 0 8 4 8 8l0 0c0 26 21 48 48 48 4 0 8 4 8 8 0 4-4 8-8 8z m216 79l-69 12-22 55c-8 18-25 30-45 30l-160 0c-20 0-37-12-45-30l-22-55-69-12c-23-4-40-23-40-47l0-240c0-26 22-48 48-48l416 0c26 0 48 22 48 48l0 240c0 24-17 43-40 47z m8-287c0-9-7-16-16-16l-416 0c-9 0-16 7-16 16l0 240c0 8 6 14 13 16l87 14 29 72c3 6 8 10 15 10l160 0c7 0 12-4 15-10l29-72 87-14c7-2 13-8 13-16z"/>
<glyph unicode="&#57356;" d="M500 409l-80 64c-6 5-13 7-20 7l-288 0c-7 0-14-2-20-7l-80-64c-10-8-15-22-10-35l32-96c3-10 10-17 20-20 3-1 7-2 10-2 6 0 11 1 16 4l0-196c0-18 14-32 32-32l288 0c18 0 32 14 32 32l0 196c5-3 10-4 16-4 4 0 7 1 10 2 10 3 17 10 20 20l32 96c5 13 0 27-10 35z m-184 39c-9-19-32-32-60-32-28 0-51 13-60 32z m132-160l-48 32 0-256-288 0 0 256-48-32-32 96 80 64 67 0c9-28 40-48 77-48 37 0 68 20 77 48l67 0 80-64z"/>
<glyph unicode="&#57357;" d="M176 48l-176 176 80 83 112-107 248 248 72-72z"/>
<glyph unicode="&#57358;" d="M227 182c-2-2-6-4-9-4-3 0-7 2-9 4l-56 56 18 18 47-47 125 126 17-18z"/>
<glyph unicode="&#57359;" d="M475 128l0-37c0-5-1-9-5-12-4-4-8-6-13-6l-402 0c-5 0-9 2-13 6-4 3-5 7-5 12l0 37c0 5 1 9 5 13 4 3 8 5 13 5l402 0c5 0 9-2 13-5 4-4 5-8 5-13z m0 146l0-36c0-5-1-10-5-13-4-4-8-6-13-6l-402 0c-5 0-9 2-13 6-4 3-5 8-5 13l0 36c0 5 1 10 5 13 4 4 8 6 13 6l402 0c5 0 9-2 13-6 4-3 5-8 5-13z m0 147l0-37c0-5-1-9-5-13-4-3-8-5-13-5l-402 0c-5 0-9 2-13 5-4 4-5 8-5 13l0 37c0 5 1 9 5 12 4 4 8 6 13 6l402 0c5 0 9-2 13-6 4-3 5-7 5-12z"/>
<glyph unicode="&#57360;" d="M267 128l0 171c42-2 85 20 85 64l0 42c0 10-1 22-6 22-5 0-10-5-15-11l-32-32-32 36c-4 4-6 7-11 7-5 0-7-3-11-7l-32-36-32 32c-5 6-10 11-15 11-5 0-6-12-6-22l0-42c0-44 43-66 85-64l0-171c-21 43-85 107-149 85 0 0 53-128 160-128 107 0 160 128 160 128-64 22-128-42-149-85z"/>
<glyph unicode="&#57361;" d="M402 201c0-5-2-9-5-13l-128-128c-4-3-8-5-13-5-5 0-9 2-13 5l-128 128c-3 4-5 8-5 13 0 5 2 9 5 13 4 4 8 5 13 5l256 0c5 0 9-1 13-5 3-4 5-8 5-13z m0 110c0-5-2-9-5-13-4-4-8-5-13-5l-256 0c-5 0-9 1-13 5-3 4-5 8-5 13 0 5 2 9 5 13l128 128c4 3 8 5 13 5 5 0 9-2 13-5l128-128c3-4 5-8 5-13z"/>
<glyph unicode="&#57362;" d="M402 311c0-5-2-9-5-13l-128-128c-4-4-8-5-13-5-5 0-9 1-13 5l-128 128c-3 4-5 8-5 13 0 5 2 9 5 13 4 3 8 5 13 5l256 0c5 0 9-2 13-5 3-4 5-8 5-13z"/>
<glyph unicode="&#57363;" d="M235 459c-11 0-11-11-11-11l0-96c0 0 0-11-11-11-10 0-10 11-10 11l0 96c0 0 0 11-11 11-11 0-11-11-11-11l0-96c0 0 0-11-10-11-11 0-11 11-11 11l0 96c0 0 0 11-11 11-10 0-10-11-10-11l0-128c0-11 5-21 16-32 10-11 5-21 5-32l0-32-5-139c-1-10 13-32 34-32 22 0 29 22 28 32l-14 139 0 32c0 10 5 21 16 32 10 10 26 21 26 32l0 128c0 0 0 11-10 11z m64-32c-11-22-11-75-11-96l0-107c0-11 11-21 21-21l22 0 0-128c0-11 10-22 21-22 11 0 21 11 21 22l0 384c-21 0-61-5-74-32z"/>
<glyph unicode="&#57364;" d="M21 469l0-448 448 0 0 448z m405-149l-106 0 0 107 106 0z m0-128l-106 0 0 107 106 0z m0-128l-106 0 0 107 106 0z m-362 107l107 0 0-107-107 0z m0 128l107 0 0-107-107 0z m0 128l107 0 0-107-107 0z m234-107l-106 0 0 107 106 0 0-107z m0-128l-106 0 0 107 106 0 0-107z m-106-21l106 0 0-107-106 0z"/>
<glyph unicode="&#57365;" d="M119 375c0 10-3 18-10 25-6 6-14 10-24 10-9 0-17-4-24-10-6-7-10-15-10-25 0-9 4-17 10-24 7-6 15-10 24-10 10 0 18 4 24 10 7 7 10 15 10 24z m285-153c0-10-3-18-10-24l-131-131c-7-7-15-10-24-10-9 0-17 3-24 10l-191 191c-6 6-12 15-17 27-5 11-7 21-7 31l0 111c0 9 3 17 10 24 7 6 15 10 24 10l111 0c9 0 20-3 31-7 12-5 21-11 27-17l191-191c7-7 10-15 10-24z m102 0c0-10-3-18-9-24l-131-131c-7-7-15-10-25-10-6 0-11 1-15 4-4 2-9 6-15 12l126 125c6 6 10 14 10 24 0 9-4 17-10 24l-191 191c-7 6-16 12-27 17-11 4-22 7-31 7l59 0c10 0 20-3 32-7 11-5 20-11 27-17l191-191c6-7 9-15 9-24z"/>
<glyph unicode="&#57345;" d="M256 459c6 0 11-2 15-7 4-4 6-9 6-15l0-170 171 0c6 0 11-2 15-7 4-4 6-9 6-15 0-6-2-11-6-15-4-4-9-6-15-6l-171 0 0-171c0-6-2-11-6-15-4-4-9-6-15-6-6 0-11 2-15 6-4 4-6 9-6 15l0 171-171 0c-6 0-11 2-15 6-4 4-6 9-6 15 0 6 2 11 6 15 4 5 9 7 15 7l171 0 0 170c0 6 2 11 6 15 4 5 9 7 15 7z"/>
<glyph unicode="&#57347;" d="M426 134c0-7-3-14-8-19l-39-39c-5-5-12-8-20-8-7 0-14 3-19 8l-84 84-84-84c-5-5-12-8-19-8-8 0-15 3-20 8l-39 39c-5 5-8 12-8 19 0 8 3 14 8 20l84 84-84 84c-5 5-8 12-8 19 0 8 3 14 8 20l39 38c5 6 12 8 20 8 7 0 14-2 19-8l84-84 84 84c5 6 12 8 19 8 8 0 15-2 20-8l39-38c5-6 8-12 8-20 0-7-3-14-8-19l-84-84 84-84c5-6 8-12 8-20z"/>
</font></defs></svg>
Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures.
To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/#docs/local-fonts
You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects.
You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection.
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="icomoon" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="user" d="M576 253.388v52.78c70.498 39.728 128 138.772 128 237.832 0 159.058 0 288-192 288s-192-128.942-192-288c0-99.060 57.502-198.104 128-237.832v-52.78c-217.102-17.748-384-124.42-384-253.388h896c0 128.968-166.898 235.64-384 253.388z" />
</font></defs></svg>
\ No newline at end of file
{
"IcoMoonType": "selection",
"icons": [
{
"icon": {
"paths": [
"M576 706.612v-52.78c70.498-39.728 128-138.772 128-237.832 0-159.058 0-288-192-288s-192 128.942-192 288c0 99.060 57.502 198.104 128 237.832v52.78c-217.102 17.748-384 124.42-384 253.388h896c0-128.968-166.898-235.64-384-253.388z"
],
"attrs": [],
"tags": [
"user",
"profile",
"avatar",
"person",
"member"
],
"grid": 16
},
"attrs": [],
"properties": {
"order": 2,
"id": 1628,
"prevSize": 32,
"ligatures": "user, profile2",
"name": "user",
"code": 59648
},
"setIdx": 0,
"setId": 0,
"iconIdx": 113
},
{
"icon": {
"paths": [
"M1024 397.050l-353.78-51.408-158.22-320.582-158.216 320.582-353.784 51.408 256 249.538-60.432 352.352 316.432-166.358 316.432 166.358-60.434-352.352 256.002-249.538zM512 753.498l-223.462 117.48 42.676-248.83-180.786-176.222 249.84-36.304 111.732-226.396 111.736 226.396 249.836 36.304-180.788 176.222 42.678 248.83-223.462-117.48z"
],
"attrs": [],
"tags": [
"star-empty",
"rate",
"star",
"favorite",
"bookmark"
],
"grid": 16
},
"attrs": [],
"properties": {
"id": 863,
"order": 6,
"prevSize": 32,
"ligatures": "star-empty, rate",
"name": "star-empty",
"code": 59650
},
"setIdx": 0,
"setId": 0,
"iconIdx": 215
},
{
"icon": {
"paths": [
"M1024 397.050l-353.78-51.408-158.22-320.582-158.216 320.582-353.784 51.408 256 249.538-60.432 352.352 316.432-166.358 316.432 166.358-60.434-352.352 256.002-249.538z"
],
"attrs": [],
"tags": [
"star-full",
"rate",
"star",
"favorite",
"bookmark"
],
"grid": 16
},
"attrs": [],
"properties": {
"id": 865,
"order": 7,
"prevSize": 32,
"ligatures": "star-full, rate3",
"name": "star-full",
"code": 59651
},
"setIdx": 0,
"setId": 0,
"iconIdx": 217
},
{
"icon": {
"paths": [
"M864 128l-480 480-224-224-160 160 384 384 640-640z"
],
"attrs": [],
"tags": [
"checkmark",
"tick",
"correct",
"accept",
"ok"
],
"grid": 16
},
"attrs": [],
"properties": {
"id": 980,
"order": 5,
"prevSize": 32,
"ligatures": "checkmark, tick",
"name": "checkmark",
"code": 59649
},
"setIdx": 0,
"setId": 0,
"iconIdx": 272
}
],
"height": 1024,
"metadata": {
"name": "icomoon"
},
"preferences": {
"showGlyphs": true,
"showQuickUse": true,
"showQuickUse2": true,
"showSVGs": true,
"fontPref": {
"prefix": "icon-",
"metadata": {
"fontFamily": "icomoon"
},
"metrics": {
"emSize": 1024,
"baseline": 6.25,
"whitespace": 50
},
"embed": false
},
"imagePref": {
"prefix": "icon-",
"png": true,
"useClassSelector": true,
"color": 4473924,
"bgColor": 16777215
},
"historySize": 100,
"showCodes": true
}
}
\ No newline at end of file
@font-face {
font-family: 'icomoon';
src:url('../fonts/icomoon/icomoon.eot?-rdnm34');
src:url('../fonts/icomoon/icomoon.eot?#iefix-rdnm34') format('embedded-opentype'),
url('../fonts/icomoon/icomoon.woff?-rdnm34') format('woff'),
url('../fonts/icomoon/icomoon.ttf?-rdnm34') format('truetype'),
url('../fonts/icomoon/icomoon.svg?-rdnm34#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-user:before {
content: "\e900";
}
.icon-star-empty:before {
content: "\e902";
}
.icon-star-full:before {
content: "\e903";
}
.icon-checkmark:before {
content: "\e901";
}
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="800" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0" height="500">
<rect width="800" fill="#74acdf" height="500"/>
<rect y="166.67" width="800" fill="#fff" height="166.67"/>
<g id="rays">
<path id="ray1" stroke-width="1.1116" stroke="#85340a" fill="#f6b40e" d="m396.84 251.31l28.454 61.992s0.4896 1.185 1.28 0.8586c0.7902-0.3267 0.2988-1.5116 0.2988-1.5116l-23.715-63.956m-0.68 24.12c-0.3465 9.4278 5.4526 14.613 4.6943 23.032-0.7569 8.42 3.8673 13.18 4.9396 16.454 1.0733 3.2744-1.16 5.2323-0.198 5.6982 0.96336 0.4662 3.07-2.1207 2.3833-6.7756-0.68675-4.6549-4.2204-6.0368-3.3898-16.32 0.83-10.283-4.206-12.678-2.98-22.058"/>
<use xlink:href="#ray1" transform="rotate(22.5 400,250)"/>
<use xlink:href="#ray1" transform="rotate(45 400,250)"/>
<use xlink:href="#ray1" transform="rotate(67.5 400,250)"/>
<path id="ray2" fill="#85340a" d="m404.31 274.41c0.45334 9.0538 5.5867 13.063 4.5787 21.314 2.2133-6.5249-3.1233-11.583-2.82-21.22m-7.6487-23.757l19.487 42.577-16.329-43.887"/>
<use xlink:href="#ray2" transform="rotate(22.5 400,250)"/>
<use xlink:href="#ray2" transform="rotate(45 400,250)"/>
<use xlink:href="#ray2" transform="rotate(67.5 400,250)"/>
</g>
<use xlink:href="#rays" transform="rotate(90 400,250)"/>
<use xlink:href="#rays" transform="rotate(180 400,250)"/>
<use xlink:href="#rays" transform="rotate(270 400,250)"/>
<circle r="27.778" stroke="#85340a" cy="250" cx="400" stroke-width="1.5" fill="#f6b40e"/>
<path id="loweyecontour" fill="#843511" d="m409.47 244.06c-1.8967 0.00003-3.7131 0.82183-4.7812 2.5312 2.1367 1.9227 6.8565 2.1318 10.062-0.21875-1.3883-1.4954-3.3845-2.3125-5.2812-2.3125zm-0.0312 0.4375c1.8462-0.0335 3.5717 0.81446 3.8125 1.6562-2.1367 2.3504-5.5508 2.1463-7.6875 0.4375 0.9348-1.4957 2.4391-2.0677 3.875-2.0938z"/>
<use xlink:href="#uppalpebra" transform="matrix(-1 0 0 1 800.25 0)"/>
<use xlink:href="#eyebrow_nose" transform="matrix(-1 0 0 1 800.25 0)"/>
<use xlink:href="#pupil" transform="translate(18.862)"/>
<use xlink:href="#lowpalpebra" transform="matrix(-1 0 0 1 800.25 0)"/>
<path d="m395.75 253.84c-0.91341 0.16668-1.5625 0.97727-1.5625 1.9062 0 1.0614 0.87748 1.9062 1.9375 1.9062 0.62667 0 1.2025-0.2968 1.5625-0.8125 0.73952 0.55614 1.7646 0.61511 2.3125 0.625 0.0843 0.002 0.19312 0 0.25 0 0.54791-0.01 1.573-0.0689 2.3125-0.625 0.36 0.5157 0.93583 0.8125 1.5625 0.8125 1.06 0 1.9375-0.84488 1.9375-1.9062 0-0.92898-0.64918-1.7396-1.5625-1.9062 0.513 0.1809 0.84375 0.6765 0.84375 1.2188 0 0.7074-0.57124 1.2812-1.2812 1.2812-0.6804 0-1.2413-0.54015-1.2812-1.2188-0.20862 0.41637-1.0341 1.6551-2.6562 1.7188-1.6222-0.0636-2.4476-1.3024-2.6562-1.7188-0.04 0.6786-0.60085 1.2188-1.2812 1.2188-0.71001 0-1.2812-0.57385-1.2812-1.2812 0-0.54225 0.33075-1.0378 0.84375-1.2188z" fill="#85340a"/>
<path d="m397.84 259.53c-2.138 0-2.9829 1.9368-4.9062 3.2188 1.0687-0.42633 1.9096-1.2693 3.4062-2.125 1.496-0.85442 2.7717 0.1875 3.625 0.1875h0.0312c0.8532 0 2.129-1.0416 3.625-0.1875 1.4967 0.8559 2.3688 1.6987 3.4375 2.125-1.9233-1.282-2.7996-3.2188-4.9375-3.2188-0.4266 0-1.2716 0.23055-2.125 0.65625h-0.0312c-0.85334-0.42642-1.6983-0.65625-2.125-0.65625z" fill="#85340a"/>
<path d="m397.12 262.06c-0.8439 0.0374-1.9596 0.20675-3.5625 0.6875 3.8473-0.85434 4.6962 0.4375 6.4062 0.4375h0.0312c1.71 0 2.5588-1.292 6.4062-0.4375-4.2744-1.282-5.1242-0.4375-6.4062-0.4375h-0.0312c-0.80125 0-1.4372-0.3124-2.8438-0.25z" fill="#85340a"/>
<path d="m393.75 262.72c-0.24819 0.003-0.51871 0.005-0.8125 0.0312 4.488 0.42766 2.3306 3 7.0312 3h0.0312c4.7007 0 2.5745-2.5724 7.0625-3-4.7007-0.4266-3.2146 2.3438-7.0625 2.3438h-0.0312c-3.6075 0-2.4959-2.4215-6.2188-2.375z" fill="#85340a"/>
<path d="m403.85 269.66c0-2.1234-1.7233-3.8465-3.8463-3.8465-2.1233 0-3.8463 1.723-3.8463 3.8465 0.423-1.781 2.0166-3.0393 3.8463-3.0393 1.8333 0 3.424 1.2586 3.8463 3.0393v0 0z" fill="#85340a"/>
<path id="eyebrow_nose" fill="#85340a" d="m382.73 244.02c4.9146-4.2729 11.11-4.9147 14.53-1.7086 0.837 1.1207 1.3733 2.319 1.5934 3.5696 0.4302 2.433-0.3303 5.0617-2.2367 7.7559 0.2151-0.001 0.6435 0.2124 0.8568 0.4266 1.6967-3.244 2.2967-6.5761 1.74-9.7454-0.1458-0.828-0.3735-1.643-0.6696-2.4357-4.7007-3.8452-11.11-4.2729-15.811 2.1377z"/>
<path id="uppalpebra" fill="#85340a" d="m390.42 242.74c2.7767 0 3.4186 0.6417 4.7007 1.71 1.2833 1.0683 1.9233 0.8541 2.1367 1.0683 0.2124 0.2142 0 0.8541-0.4266 0.6399s-1.2833-0.6399-2.5633-1.7086c-1.2833-1.0696-2.5633-1.0683-3.8463-1.0683-3.8463 0-5.983 3.2046-6.4094 2.9907-0.4266-0.2142 2.1367-3.6325 6.4094-3.6325z"/>
<use xlink:href="#loweyecontour" transform="translate(-19.181)"/>
<circle id="pupil" cy="246.15" cx="390.54" r="1.923" fill="#85340a"/>
<path id="lowpalpebra" fill="#85340a" d="m385.29 247.44c3.6327 2.7783 7.265 2.5644 9.4017 1.282 2.1367-1.282 2.1367-1.7086 1.71-1.7086-0.4266 0-0.8532 0.4266-2.5633 1.281-1.71 0.8559-4.273 0.8559-8.546-0.8541z"/>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" height="504" width="720" version="1.0" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-2100 -1470 4200 2940">
<defs>
<path id="D" fill-rule="evenodd" d="m-31.5 0h33a30 30 0 0 0 30 -30v-10a30 30 0 0 0 -30 -30h-33zm13-13h19a19 19 0 0 0 19 -19v-6a19 19 0 0 0 -19 -19h-19z"/>
<path id="E" transform="translate(-31.5)" d="m0 0h63v-13h-51v-18h40v-12h-40v-14h48v-13h-60z"/>
<path id="e" d="m-26.25 0h52.5v-12h-40.5v-16h33v-12h-33v-11h39.25v-12h-51.25z"/>
<g id="G">
<clipPath id="gcut">
<path d="m-31.5 0v-70h63v70zm31.5-47v12h31.5v-12z"/>
</clipPath>
<use xlink:href="#O" clip-path="url(#gcut)"/>
<rect y="-35" x="5" height="10" width="26.5"/>
<rect y="-35" x="21.5" height="35" width="10"/>
</g>
<path id="M" d="m-31.5 0h12v-48l14 48h11l14-48v48h12v-70h-17.5l-14 48-14-48h-17.5z"/>
<path id="O" fill-rule="evenodd" d="m0 0a31.5 35 0 0 0 0 -70 31.5 35 0 0 0 0 70m0-13a18.5 22 0 0 0 0 -44 18.5 22 0 0 0 0 44"/>
<path id="P" fill-rule="evenodd" d="m-31.5 0h13v-26h28a22 22 0 0 0 0 -44h-40zm13-39h27a9 9 0 0 0 0 -18h-27z"/>
<g id="R">
<use xlink:href="#P"/>
<path d="m28 0c0-10 0-32-15-32h-19c22 0 22 22 22 32"/>
</g>
<path id="S" d="m-15.75-22c0 7 6.75 10.5 16.75 10.5s14.74-3.25 14.75-7.75c0-14.25-46.75-5.25-46.5-30.25 0.25-21.5 24.75-20.5 33.75-20.5s26 4 25.75 21.25h-15.25c0-7.5-7-10.25-15-10.25-7.75 0-13.25 1.25-13.25 8.5-0.25 11.75 46.25 4 46.25 28.75 0 18.25-18 21.75-31.5 21.75-11.5 0-31.55-4.5-31.5-22z"/>
<g id="star" fill="#fff">
<g id="c">
<path id="t" transform="rotate(18 0,-1)" d="m0-1v1h0.5"/>
<use xlink:href="#t" transform="scale(-1,1)"/>
</g>
<use xlink:href="#c" transform="rotate(72)"/>
<use xlink:href="#c" transform="rotate(-72)"/>
<use xlink:href="#c" transform="rotate(144)"/>
<use xlink:href="#c" transform="rotate(216)"/>
</g>
<use id="star1" xlink:href="#star" transform="scale(31.5)"/>
<use id="star2" xlink:href="#star" transform="scale(26.25)"/>
<use id="star3" xlink:href="#star" transform="scale(21)"/>
<use id="star4" xlink:href="#star" transform="scale(15)"/>
<use id="star5" xlink:href="#star" transform="scale(10.5)"/>
</defs>
<rect y="-50%" x="-50%" height="100%" fill="#009b3a" width="100%"/>
<path d="m-1743 0 1743 1113 1743-1113-1743-1113z" fill="#fedf00"/>
<circle r="735" fill="#002776"/>
<clipPath id="band">
<circle r="735"/>
</clipPath>
<path fill="#fff" d="m-2205 1470a1785 1785 0 0 1 3570 0h-105a1680 1680 0 1 0 -3360 0z" clip-path="url(#band)"/>
<g transform="translate(-420,1470)" fill="#009b3a">
<use y="-1697.5" xlink:href="#O" transform="rotate(-7)"/>
<use y="-1697.5" xlink:href="#R" transform="rotate(-4)"/>
<use y="-1697.5" xlink:href="#D" transform="rotate(-1)"/>
<use y="-1697.5" xlink:href="#E" transform="rotate(2)"/>
<use y="-1697.5" xlink:href="#M" transform="rotate(5)"/>
<use y="-1697.5" xlink:href="#e" transform="rotate(9.75)"/>
<use y="-1697.5" xlink:href="#P" transform="rotate(14.5)"/>
<use y="-1697.5" xlink:href="#R" transform="rotate(17.5)"/>
<use y="-1697.5" xlink:href="#O" transform="rotate(20.5)"/>
<use y="-1697.5" xlink:href="#G" transform="rotate(23.5)"/>
<use y="-1697.5" xlink:href="#R" transform="rotate(26.5)"/>
<use y="-1697.5" xlink:href="#E" transform="rotate(29.5)"/>
<use y="-1697.5" xlink:href="#S" transform="rotate(32.5)"/>
<use y="-1697.5" xlink:href="#S" transform="rotate(35.5)"/>
<use y="-1697.5" xlink:href="#O" transform="rotate(38.5)"/>
</g>
<use id="αCMi" y="-132" x="-600" xlink:href="#star1"/>
<use id="αCMa" y="177" x="-535" xlink:href="#star1"/>
<use id="βCMa" y="243" x="-625" xlink:href="#star2"/>
<use id="γCMa" y="132" x="-463" xlink:href="#star4"/>
<use id="δCMa" y="250" x="-382" xlink:href="#star2"/>
<use id="εCMa" y="323" x="-404" xlink:href="#star3"/>
<use id="αVir" y="-228" x="228" xlink:href="#star1"/>
<use id="αSco" y="258" x="515" xlink:href="#star1"/>
<use id="βSco" y="265" x="617" xlink:href="#star3"/>
<use id="εSco" y="323" x="545" xlink:href="#star2"/>
<use id="θSco" y="477" x="368" xlink:href="#star2"/>
<use id="ιSco" y="551" x="367" xlink:href="#star3"/>
<use id="κSco" y="419" x="441" xlink:href="#star3"/>
<use id="λSco" y="382" x="500" xlink:href="#star2"/>
<use id="μSco" y="405" x="365" xlink:href="#star3"/>
<use id="αHya" y="30" x="-280" xlink:href="#star2"/>
<use id="γHya" y="-37" x="200" xlink:href="#star3"/>
<use id="αCru" y="330" xlink:href="#star1"/>
<use id="βCru" y="184" x="85" xlink:href="#star2"/>
<use id="γCru" y="118" xlink:href="#star2"/>
<use id="δCru" y="184" x="-74" xlink:href="#star3"/>
<use id="εCru" y="235" x="-37" xlink:href="#star4"/>
<use id="αTrA" y="495" x="220" xlink:href="#star2"/>
<use id="βTrA" y="430" x="283" xlink:href="#star3"/>
<use id="γTrA" y="412" x="162" xlink:href="#star3"/>
<use id="αCar" y="390" x="-295" xlink:href="#star1"/>
<use id="σOct" y="575" xlink:href="#star5"/>
</svg>
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="900" height="600"><rect width="900" height="600" fill="#ED2939"/><rect width="600" height="600" fill="#fff"/><rect width="300" height="600" fill="#002395"/></svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="900" height="600" viewBox="0 0 9 6">
<clipPath id="Z">
<path d="M0,0 4.5,3 0,6" id="X"/>
</clipPath>
<clipPath id="A">
<path d="M0,0H9V6H0z"/>
</clipPath>
<g clip-path="url(#A)">
<path d="M0,0V6H9V0z" fill="#002395"/>
<path d="M0,0V3H9V0z" fill="#de3831"/>
<g stroke-width="2" stroke="#fff">
<path d="M0,0 4.5,3 0,6M4.5,3H9" id="W"/>
<use xlink:href="#X" stroke="#ffb612" clip-path="url(#Z)"/>
</g>
<use xlink:href="#W" fill="none" stroke="#007a4d" stroke-width="1.2"/>
</g>
</svg>
\ No newline at end of file
/*!
* classie - class helper functions
* from bonzo https://github.com/ded/bonzo
*
* classie.has( elem, 'my-class' ) -> true/false
* classie.add( elem, 'my-new-class' )
* classie.remove( elem, 'my-unwanted-class' )
* classie.toggle( elem, 'my-class' )
*/
/*jshint browser: true, strict: true, undef: true */
/*global define: false */
( function( window ) {
'use strict';
// class helper functions from bonzo https://github.com/ded/bonzo
function classReg( className ) {
return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
}
// classList support for class management
// altho to be fair, the api sucks because it won't accept multiple classes at once
var hasClass, addClass, removeClass;
if ( 'classList' in document.documentElement ) {
hasClass = function( elem, c ) {
return elem.classList.contains( c );
};
addClass = function( elem, c ) {
elem.classList.add( c );
};
removeClass = function( elem, c ) {
elem.classList.remove( c );
};
}
else {
hasClass = function( elem, c ) {
return classReg( c ).test( elem.className );
};
addClass = function( elem, c ) {
if ( !hasClass( elem, c ) ) {
elem.className = elem.className + ' ' + c;
}
};
removeClass = function( elem, c ) {
elem.className = elem.className.replace( classReg( c ), ' ' );
};
}
function toggleClass( elem, c ) {
var fn = hasClass( elem, c ) ? removeClass : addClass;
fn( elem, c );
}
var classie = {
// full names
hasClass: hasClass,
addClass: addClass,
removeClass: removeClass,
toggleClass: toggleClass,
// short names
has: hasClass,
add: addClass,
remove: removeClass,
toggle: toggleClass
};
// transport
if ( typeof define === 'function' && define.amd ) {
// AMD
define( classie );
} else {
// browser global
window.classie = classie;
}
})( window );
/**
* selectFx.js v1.0.0
* http://www.codrops.com
*
* Licensed under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*
* Copyright 2014, Codrops
* http://www.codrops.com
*/
;( function( window ) {
'use strict';
/**
* based on from https://github.com/inuyaksa/jquery.nicescroll/blob/master/jquery.nicescroll.js
*/
function hasParent( e, p ) {
if (!e) return false;
var el = e.target||e.srcElement||e||false;
while (el && el != p) {
el = el.parentNode||false;
}
return (el!==false);
};
/**
* extend obj function
*/
function extend( a, b ) {
for( var key in b ) {
if( b.hasOwnProperty( key ) ) {
a[key] = b[key];
}
}
return a;
}
/**
* SelectFx function
*/
function SelectFx( el, options ) {
this.el = el;
this.options = extend( {}, this.options );
extend( this.options, options );
this._init();
}
/**
* SelectFx options
*/
SelectFx.prototype.options = {
// if true all the links will open in a new tab.
// if we want to be redirected when we click an option, we need to define a data-link attr on the option of the native select element
newTab : true,
// when opening the select element, the default placeholder (if any) is shown
stickyPlaceholder : true,
// callback when changing the value
onChange : function( val ) { return false; }
}
/**
* init function
* initialize and cache some vars
*/
SelectFx.prototype._init = function() {
// check if we are using a placeholder for the native select box
// we assume the placeholder is disabled and selected by default
var selectedOpt = this.el.querySelector( 'option[selected]' );
this.hasDefaultPlaceholder = selectedOpt && selectedOpt.disabled;
// get selected option (either the first option with attr selected or just the first option)
this.selectedOpt = selectedOpt || this.el.querySelector( 'option' );
// create structure
this._createSelectEl();
// all options
this.selOpts = [].slice.call( this.selEl.querySelectorAll( 'li[data-option]' ) );
// total options
this.selOptsCount = this.selOpts.length;
// current index
this.current = this.selOpts.indexOf( this.selEl.querySelector( 'li.cs-selected' ) ) || -1;
// placeholder elem
this.selPlaceholder = this.selEl.querySelector( 'span.cs-placeholder' );
// init events
this._initEvents();
}
/**
* creates the structure for the select element
*/
SelectFx.prototype._createSelectEl = function() {
var self = this, options = '', createOptionHTML = function(el) {
var optclass = '', classes = '', link = '';
if( el.selectedOpt && !this.foundSelected && !this.hasDefaultPlaceholder ) {
classes += 'cs-selected ';
this.foundSelected = true;
}
// extra classes
if( el.getAttribute( 'data-class' ) ) {
classes += el.getAttribute( 'data-class' );
}
// link options
if( el.getAttribute( 'data-link' ) ) {
link = 'data-link=' + el.getAttribute( 'data-link' );
}
if( classes !== '' ) {
optclass = 'class="' + classes + '" ';
}
return '<li ' + optclass + link + ' data-option data-value="' + el.value + '"><span>' + el.textContent + '</span></li>';
};
[].slice.call( this.el.children ).forEach( function(el) {
if( el.disabled ) { return; }
var tag = el.tagName.toLowerCase();
if( tag === 'option' ) {
options += createOptionHTML(el);
}
else if( tag === 'optgroup' ) {
options += '<li class="cs-optgroup"><span>' + el.label + '</span><ul>';
[].slice.call( el.children ).forEach( function(opt) {
options += createOptionHTML(opt);
} );
options += '</ul></li>';
}
} );
var opts_el = '<div class="cs-options"><ul>' + options + '</ul></div>';
this.selEl = document.createElement( 'div' );
this.selEl.className = this.el.className;
this.selEl.tabIndex = this.el.tabIndex;
this.selEl.innerHTML = '<span class="cs-placeholder">' + this.selectedOpt.textContent + '</span>' + opts_el;
this.el.parentNode.appendChild( this.selEl );
this.selEl.appendChild( this.el );
}
/**
* initialize the events
*/
SelectFx.prototype._initEvents = function() {
var self = this;
// open/close select
this.selPlaceholder.addEventListener( 'click', function() {
self._toggleSelect();
} );
// clicking the options
this.selOpts.forEach( function(opt, idx) {
opt.addEventListener( 'click', function() {
self.current = idx;
self._changeOption();
// close select elem
self._toggleSelect();
} );
} );
// close the select element if the target it´s not the select element or one of its descendants..
document.addEventListener( 'click', function(ev) {
var target = ev.target;
if( self._isOpen() && target !== self.selEl && !hasParent( target, self.selEl ) ) {
self._toggleSelect();
}
} );
// keyboard navigation events
this.selEl.addEventListener( 'keydown', function( ev ) {
var keyCode = ev.keyCode || ev.which;
switch (keyCode) {
// up key
case 38:
ev.preventDefault();
self._navigateOpts('prev');
break;
// down key
case 40:
ev.preventDefault();
self._navigateOpts('next');
break;
// space key
case 32:
ev.preventDefault();
if( self._isOpen() && typeof self.preSelCurrent != 'undefined' && self.preSelCurrent !== -1 ) {
self._changeOption();
}
self._toggleSelect();
break;
// enter key
case 13:
ev.preventDefault();
if( self._isOpen() && typeof self.preSelCurrent != 'undefined' && self.preSelCurrent !== -1 ) {
self._changeOption();
self._toggleSelect();
}
break;
// esc key
case 27:
ev.preventDefault();
if( self._isOpen() ) {
self._toggleSelect();
}
break;
}
} );
}
/**
* navigate with up/dpwn keys
*/
SelectFx.prototype._navigateOpts = function(dir) {
if( !this._isOpen() ) {
this._toggleSelect();
}
var tmpcurrent = typeof this.preSelCurrent != 'undefined' && this.preSelCurrent !== -1 ? this.preSelCurrent : this.current;
if( dir === 'prev' && tmpcurrent > 0 || dir === 'next' && tmpcurrent < this.selOptsCount - 1 ) {
// save pre selected current - if we click on option, or press enter, or press space this is going to be the index of the current option
this.preSelCurrent = dir === 'next' ? tmpcurrent + 1 : tmpcurrent - 1;
// remove focus class if any..
this._removeFocus();
// add class focus - track which option we are navigating
classie.add( this.selOpts[this.preSelCurrent], 'cs-focus' );
}
}
/**
* open/close select
* when opened show the default placeholder if any
*/
SelectFx.prototype._toggleSelect = function() {
// remove focus class if any..
this._removeFocus();
if( this._isOpen() ) {
if( this.current !== -1 ) {
// update placeholder text
this.selPlaceholder.textContent = this.selOpts[ this.current ].textContent;
}
classie.remove( this.selEl, 'cs-active' );
}
else {
if( this.hasDefaultPlaceholder && this.options.stickyPlaceholder ) {
// everytime we open we wanna see the default placeholder text
this.selPlaceholder.textContent = this.selectedOpt.textContent;
}
classie.add( this.selEl, 'cs-active' );
}
}
/**
* change option - the new value is set
*/
SelectFx.prototype._changeOption = function() {
// if pre selected current (if we navigate with the keyboard)...
if( typeof this.preSelCurrent != 'undefined' && this.preSelCurrent !== -1 ) {
this.current = this.preSelCurrent;
this.preSelCurrent = -1;
}
// current option
var opt = this.selOpts[ this.current ];
// update current selected value
this.selPlaceholder.textContent = opt.textContent;
// change native select element´s value
this.el.value = opt.getAttribute( 'data-value' );
// remove class cs-selected from old selected option and add it to current selected option
var oldOpt = this.selEl.querySelector( 'li.cs-selected' );
if( oldOpt ) {
classie.remove( oldOpt, 'cs-selected' );
}
classie.add( opt, 'cs-selected' );
// if there´s a link defined
if( opt.getAttribute( 'data-link' ) ) {
// open in new tab?
if( this.options.newTab ) {
window.open( opt.getAttribute( 'data-link' ), '_blank' );
}
else {
window.location = opt.getAttribute( 'data-link' );
}
}
// callback
this.options.onChange( this.el.value );
}
/**
* returns true if select element is opened
*/
SelectFx.prototype._isOpen = function(opt) {
return classie.has( this.selEl, 'cs-active' );
}
/**
* removes the focus class from the option
*/
SelectFx.prototype._removeFocus = function(opt) {
var focusEl = this.selEl.querySelector( 'li.cs-focus' )
if( focusEl ) {
classie.remove( focusEl, 'cs-focus' );
}
}
/**
* add to global namespace
*/
window.SelectFx = SelectFx;
} )( window );
@import url(http://fonts.googleapis.com/css?family=Raleway:200,500,700,800);
@font-face {
font-weight: normal;
font-style: normal;
font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}
*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }
body {
background: #f9f7f6;
color: #404d5b;
font-weight: 500;
font-size: 1.05em;
font-family: 'Raleway', Arial, sans-serif;
}
a {
color: #2fa0ec;
text-decoration: none;
outline: none;
}
a:hover, a:focus {
color: #404d5b;
}
.container {
margin: 0 auto;
text-align: center;
overflow: hidden;
}
.content {
font-size: 150%;
padding: 3em 0;
}
.content h2 {
margin: 0 0 2em;
opacity: 0.1;
}
.content p {
margin: 1em 0;
padding: 5em 0 0 0;
font-size: 0.65em;
}
.bgcolor-1 { background: #f0efee; }
.bgcolor-2 { background: #f9f9f9; }
.bgcolor-3 { background: #e8e8e8; }
.bgcolor-4 { background: #2f3238; color: #fff; }
.bgcolor-5 { background: #df6659; color: #521e18; }
.bgcolor-6 { background: #2fa8ec; color: #fff;}
.bgcolor-7 { background: #d0d6d6; }
.bgcolor-8 { background: #3d4444; color: #fff; }
.bgcolor-9 { background: #8781bd; color: #fff; }
.bgcolor-10 { background: #6C6C6C; }
body .nomargin-bottom {
margin-bottom: 0;
}
/* Header */
.codrops-header {
padding: 3em 190px 4em;
letter-spacing: -1px;
}
.codrops-header h1 {
font-weight: 800;
font-size: 4em;
line-height: 1;
margin: 0.25em 0 0;
}
.codrops-header h1 span {
display: block;
font-size: 50%;
font-weight: 400;
padding: 0.325em 0 1em 0;
color: #c3c8cd;
}
/* Demos nav */
.codrops-demos a {
text-transform: uppercase;
letter-spacing: 1px;
font-weight: bold;
font-size: 0.85em;
display: inline-block;
margin: 0 1em;
font-family: "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.codrops-demos a.current-demo {
border-bottom: 2px solid;
color: #404d5b;
}
/* Top Navigation Style */
.codrops-links {
position: relative;
display: inline-block;
white-space: nowrap;
font-size: 1.25em;
text-align: center;
}
.codrops-links::after {
position: absolute;
top: 0;
left: 50%;
margin-left: -1px;
width: 2px;
height: 100%;
background: #dbdbdb;
content: '';
-webkit-transform: rotate3d(0,0,1,22.5deg);
transform: rotate3d(0,0,1,22.5deg);
}
.codrops-icon {
display: inline-block;
margin: 0.5em;
padding: 0em 0;
width: 1.5em;
text-decoration: none;
}
.codrops-icon span {
display: none;
}
.codrops-icon:before {
margin: 0 5px;
text-transform: none;
font-weight: normal;
font-style: normal;
font-variant: normal;
font-family: 'codropsicons';
line-height: 1;
speak: none;
-webkit-font-smoothing: antialiased;
}
.codrops-icon--drop:before {
content: "\e001";
}
.codrops-icon--prev:before {
content: "\e004";
}
/* Related demos */
.content--related {
text-align: center;
color: #D8DADB;
font-weight: bold;
}
.media-item {
display: inline-block;
padding: 1em;
vertical-align: top;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.media-item__img {
opacity: 0.8;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.media-item:hover .media-item__img,
.media-item:focus .media-item__img {
opacity: 1;
}
.media-item__title {
font-size: 0.75em;
margin: 0;
padding: 0.5em;
}
@media screen and (max-width: 50em) {
.codrops-header {
padding: 3em 10% 4em;
}
}
@media screen and (max-width: 40em) {
.codrops-header h1 {
font-size: 2.8em;
}
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
This is a custom SVG font generated by IcoMoon.
<iconset grid="14"></iconset>
</metadata>
<defs>
<font id="codropsicons" horiz-adv-x="448" >
<font-face units-per-em="448" ascent="384" descent="-64" />
<missing-glyph horiz-adv-x="448" />
<glyph unicode="&#xe001;" d="M 221.657,359.485 ,m0.00,0.00,c 0.00,0.00 -132.984-182.838 -132.205-286.236 0.515-68.522 61.089-123.688 135.314-123.218 74.202,0.479 133.943,56.421 133.428,124.943 C 357.414,178.368 221.657,359.485 221.657,359.485 z" />
<glyph unicode="&#xe004;" d="M 384.00,160.00l0.00-32.00 q0.00-13.25 -8.125-22.625t-21.125-9.375l-176.00,0.00 l 73.25-73.50q 9.50-9.00 9.50-22.50t-9.50-22.50l-18.75-19.00q-9.25-9.25 -22.50-9.25q-13.00,0.00 -22.75,9.25l-162.75,163.00q-9.25,9.25 -9.25,22.50q0.00,13.00 9.25,22.75l 162.75,162.50q 9.50,9.50 22.75,9.50q 13.00,0.00 22.50-9.50l 18.75-18.50q 9.50-9.50 9.50-22.75t-9.50-22.75l-73.25-73.25l 176.00,0.00 q 13.00,0.00 21.125-9.375 t 8.125-22.625z" horiz-adv-x="384" />
<glyph unicode="&#xe002;" d="M 407.273-23.273c0.00,0.00-325.818,0.00-366.545,0.00s-40.727,40.727-40.727,40.727l0.00,142.545 l 101.818,183.273l 244.364,0.00 l 101.818-183.273c0.00,0.00,0.00-101.818,0.00-142.545S 407.273-23.273, 407.273-23.273z M 325.818,302.545L 122.182,302.545
l-71.273-142.545L 142.545,160.00 c0.00,0.00, 40.727,0.00, 40.727-40.727l0.00-20.364 l 81.455,0.00 l0.00,20.364 c0.00,0.00,0.00,40.727, 40.727,40.727l 91.636,0.00 L 325.818,302.545z M 407.273,119.273l-96.911,0.00 C 307.532,113.917, 305.455,107.503, 305.455,98.909c0.00-40.727-40.727-40.727-40.727-40.727L 183.273,58.182 c0.00,0.00-40.727,0.00-40.727,40.727
c0.00,8.593-2.077,15.008-4.908,20.364L 40.727,119.273 l0.00-101.818 l 366.545,0.00 L 407.273,119.273 z M 132.364,221.091l 183.273,0.00 L 325.818,200.727L 122.182,200.727 L 132.364,221.091z M 152.727,261.818l 142.545,0.00 L 305.455,241.455L 142.545,241.455 L 152.727,261.818z" />
<glyph unicode="&#xe000;" d="M 368.00,144.00q0.00-13.50 -9.25-22.75l-162.75-162.75q-9.75-9.25 -22.75-9.25q-12.75,0.00 -22.50,9.25l-18.75,18.75q-9.50,9.50 -9.50,22.75t 9.50,22.75l 73.25,73.25l-176.00,0.00 q-13.00,0.00 -21.125,9.375t-8.125,22.625l0.00,32.00 q0.00,13.25 8.125,22.625t 21.125,9.375l 176.00,0.00 l-73.25,73.50q-9.50,9.00 -9.50,22.50t 9.50,22.50l 18.75,18.75q 9.50,9.50 22.50,9.50q 13.25,0.00 22.75-9.50l 162.75-162.75q 9.25-8.75 9.25-22.50z" horiz-adv-x="384" />
<glyph unicode="&#xe003;" d="M 224.00-64.00C 100.291-64.00,0.00,36.291,0.00,160.00S 100.291,384.00, 224.00,384.00s 224.00-100.291, 224.00-224.00S 347.709-64.00, 224.00-64.00z
M 224.00,343.273c-101.228,0.00-183.273-82.045-183.273-183.273s 82.045-183.273, 183.273-183.273s 183.273,82.045, 183.273,183.273S 325.228,343.273, 224.00,343.273z M 244.364,122.164C 244.364,111.005, 244.364,98.909, 244.364,98.909l-40.727,0.00 c0.00,0.00,0.00,29.466,0.00,40.727
s 9.123,20.364, 20.364,20.364l0.00,0.00c 22.481,0.00, 40.727,18.246, 40.727,40.727s-18.246,40.727-40.727,40.727S 183.273,223.209, 183.273,200.727c0.00-7.453, 2.138-14.356, 5.641-20.364L 145.437,180.364 C 143.727,186.90, 142.545,193.661, 142.545,200.727
c0.00,44.983, 36.471,81.455, 81.455,81.455s 81.455-36.471, 81.455-81.455C 305.455,162.831, 279.45,131.247, 244.364,122.164z M 244.364,37.818l-40.727,0.00 l0.00,40.727 l 40.727,0.00 L 244.364,37.818 z" />
<glyph unicode="&#x20;" horiz-adv-x="224" />
<glyph class="hidden" unicode="&#xf000;" d="M0,384L 448 -64L0 -64 z" horiz-adv-x="0" />
</font></defs></svg>
\ No newline at end of file
Icon Set: Font Awesome -- http://fortawesome.github.com/Font-Awesome/
License: SIL -- http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Icon Set: Eco Ico -- http://dribbble.com/shots/665585-Eco-Ico
License: CC0 -- http://creativecommons.org/publicdomain/zero/1.0/
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="612px" height="612px" viewBox="0 0 612 612" xml:space="preserve">
<path fill="#fff" d="M5.817,606.299c7.729,7.614,20.277,7.614,28.007,0L192.448,450.2c44.267,35.333,100.622,56.586,162.067,56.586c142.211,0,257.487-113.439,257.487-253.393C612.003,113.439,496.727,0,354.516,0S97.028,113.439,97.009,253.393c0,65.424,25.424,124.879,66.802,169.834L5.8,578.714C-1.929,586.328-1.929,598.686,5.817,606.299z"/>
</svg>
/*!
* classie - class helper functions
* from bonzo https://github.com/ded/bonzo
*
* classie.has( elem, 'my-class' ) -> true/false
* classie.add( elem, 'my-new-class' )
* classie.remove( elem, 'my-unwanted-class' )
* classie.toggle( elem, 'my-class' )
*/
/*jshint browser: true, strict: true, undef: true */
/*global define: false */
( function( window ) {
'use strict';
// class helper functions from bonzo https://github.com/ded/bonzo
function classReg( className ) {
return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
}
// classList support for class management
// altho to be fair, the api sucks because it won't accept multiple classes at once
var hasClass, addClass, removeClass;
if ( 'classList' in document.documentElement ) {
hasClass = function( elem, c ) {
return elem.classList.contains( c );
};
addClass = function( elem, c ) {
elem.classList.add( c );
};
removeClass = function( elem, c ) {
elem.classList.remove( c );
};
}
else {
hasClass = function( elem, c ) {
return classReg( c ).test( elem.className );
};
addClass = function( elem, c ) {
if ( !hasClass( elem, c ) ) {
elem.className = elem.className + ' ' + c;
}
};
removeClass = function( elem, c ) {
elem.className = elem.className.replace( classReg( c ), ' ' );
};
}
function toggleClass( elem, c ) {
var fn = hasClass( elem, c ) ? removeClass : addClass;
fn( elem, c );
}
var classie = {
// full names
hasClass: hasClass,
addClass: addClass,
removeClass: removeClass,
toggleClass: toggleClass,
// short names
has: hasClass,
add: addClass,
remove: removeClass,
toggle: toggleClass
};
// transport
if ( typeof define === 'function' && define.amd ) {
// AMD
define( classie );
} else {
// browser global
window.classie = classie;
}
})( window );
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment