select.materialSelect {
    display: block;
    width: 100%;
    max-width: 100%; 
    padding: .4375rem 1.4em .4375rem 0;
    font-size: .875rem;
    height: 2.25rem;
    line-height: 1.5;
    color: #495057;

    margin: 0;
    border: 0 solid;
    border-radius: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    
    background-color: rgba(0, 0, 0, 0);
    background-clip: border-box, border-box, border-box;
    
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='292.4' height='292.4'%3E%3Cpath fill='%236c757d' d='M287 69.4a17.6 17.6 0 0 0-13-5.4H18.4c-5 0-9.3 1.8-12.9 5.4A17.6 17.6 0 0 0 0 82.2c0 5 1.8 9.3 5.4 12.9l128 127.9c3.6 3.6 7.8 5.4 12.8 5.4s9.2-1.8 12.8-5.4L287 95c3.5-3.5 5.4-7.8 5.4-12.8 0-5-1.9-9.2-5.5-12.8z'/%3E%3C/svg%3E")
        ,linear-gradient(0deg, rgb(0, 163, 224) 2px, rgba(156, 39, 176, 0) 0px), linear-gradient(0deg, rgb(210, 210, 210) 1px, rgba(209, 209, 209, 0) 0px);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: right .7em top 50%, 50% calc(100% - 2px), 50% calc(100% - 1px);
    background-size: .65em auto, 0% .125rem, 100% .125rem;
    
    -webkit-transition: background-size 0.0s cubic-bezier(0, 0, 0.58, 1);
	-moz-transition: background-size 0.0s cubic-bezier(0, 0, 0.58, 1);
	-o-transition: background-size 0.0s cubic-bezier(0, 0, 0.58, 1);
	-ms-transition: background-size 0.0s cubic-bezier(0, 0, 0.58, 1);
	transition: background-size 0.0s cubic-bezier(0, 0, 0.58, 1);
}

select.materialSelect:focus {
    color: #495057;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='292.4' height='292.4'%3E%3Cpath fill='%2300A3E0' d='M287 69.4a17.6 17.6 0 0 0-13-5.4H18.4c-5 0-9.3 1.8-12.9 5.4A17.6 17.6 0 0 0 0 82.2c0 5 1.8 9.3 5.4 12.9l128 127.9c3.6 3.6 7.8 5.4 12.8 5.4s9.2-1.8 12.8-5.4L287 95c3.5-3.5 5.4-7.8 5.4-12.8 0-5-1.9-9.2-5.5-12.8z'/%3E%3C/svg%3E")
        ,linear-gradient(0deg, #00A3E0 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, rgb(210, 210, 210) 1px, rgba(209, 209, 209, 0) 0);
    background-size: .65em auto, 100% .125rem, 100% .125rem;
    transition-duration: 0.3s;
}

select.materialSelect:disabled {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='292.4' height='292.4'%3E%3Cpath fill='%236c757d' style='opacity:0.2' d='M287 69.4a17.6 17.6 0 0 0-13-5.4H18.4c-5 0-9.3 1.8-12.9 5.4A17.6 17.6 0 0 0 0 82.2c0 5 1.8 9.3 5.4 12.9l128 127.9c3.6 3.6 7.8 5.4 12.8 5.4s9.2-1.8 12.8-5.4L287 95c3.5-3.5 5.4-7.8 5.4-12.8 0-5-1.9-9.2-5.5-12.8z'/%3E%3C/svg%3E")
        ,linear-gradient(0deg, #00A3E0 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, rgb(210, 210, 210) 1px, rgba(209, 209, 209, 0) 0);
}

/* Igualar comportamiento en distintos navegadores */
select.materialSelect::-ms-expand { display: none; }
select.materialSelect:-moz-focusring { color: transparent; text-shadow: 0 0 0 #495057; }
