/*

  Theme Name: Romeu Pacheco vCard 
  Theme Owner: Purple
  License: GNU General Public License version 3.0
  License URI: http://www.gnu.org/licenses/gpl-3.0.html
  Version: 0.1

*/

/* Colors *************************************************************** */
.panel, .panel a, .profile .label, .colorbg, header#notext a:hover, .da-thumbs article a div, .da-thumbs article a div i, #filter a.active, #filter a.active:hover {color:white}
.main, #filter a, .main .contact a, .main .contact i {color: #333}
.panel a:hover, .main a, .main a:hover, #filter a:hover, .main i, .tweet a, .colorfont {color: #eb5b5e}
.panel header a {color:black}

.main .wrap, .gmap, .profile h4 strong {background: #eee}
.profile .label, .colorbg, header#notext a:hover, .da-thumbs article a div, .nav-pills > li > a.active {background: #eb5b5e}


/* Global *************************************************************** */

body { background: #eee}
.tcenter { text-align: center }
.tright { text-align: right }
.tleft { text-align: left }
input, textarea {font-size: .9em}
a:hover {text-decoration: none}
.colorbg {text-shadow: none; color:white}


/* Header *************************************************************** */

header nav { margin-bottom: 10px}
header#text ul {margin:0; padding: 0}
header#text li {float:left; text-align: center; width:25%}
	
	/* Text navigation */
	a.button { text-transform: uppercase; font-size: .8em; display: block; position: relative; height: 30px; width: 98%; margin: 0 auto; line-height: 30px; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; }
	a.button:before, a.button:after { content: ''; position: absolute; left: -1px; height: 30px; width: 100%; bottom: -1px; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; }
	a.button:before { height: 25px; bottom: -4px; border: 0; -webkit-border-radius: 0 0 2px 2px; -moz-border-radius: 0 0 2px 2px; border-radius: 0 0 2px 2px; }
	a.gray, a.gray:hover, a.gray:visited { border-bottom: 4px solid #b2b1b1; text-shadow: 0px 1px 0px #fafafa; background: #eee; background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#e2e2e2)); background: -moz-linear-gradient(top,  #eee,  #e2e2e2); }
	.gray:hover { background: #e2e2e2; background: -webkit-gradient(linear, left top, left bottom, from(#e2e2e2), to(#eee)); background: -moz-linear-gradient(top,  #e2e2e2,  #eee); }
	a.button:active, a.button.active { border: none; bottom: -4px; background: #ddd; -webkit-box-shadow: 0 1px 1px #eee; -moz-box-shadow: 0 1px 1px #eee; box-shadow: 0 0 1px #fff, inset 0 1px 1px rgba(0, 0, 0, 0.3); }
	a.button:active:before, a.button:active:after { border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
	
header#notext ul {margin-bottom:0; padding:0; margin-left: 0; margin-bottom: 10px}
header#notext li {float:left; margin-left: 10px}
header#notext li:first-child {margin-left: 0}
header#notext li a {color: #ccc; text-shadow: 0 1px 1px black}	
	
	/* Icon navigation */
	a.nobutton {cursor: pointer; padding:10px; border-radius: 5px; background: -moz-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.7)), color-stop(100%,rgba(0,0,0,0.7))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000',GradientType=0 );}



/* Panel *************************************************************** */

.main {background: white}
.main { padding: 10px; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; }
.main .wrap { border-radius: 10px; box-shadow: inset 0 1px 1px #999; }
.panel { max-width: 720px; margin: 5% auto 0; }
section { display: none }
section:first-child { display: block }
.avatar {border-radius: 50%; border: 10px solid white; overflow: hidden; box-shadow: 0 1px 1px #999}


/* Home *************************************************************** */

.home { padding: 30px }
.home .avatar { margin: 0 auto; width: 200px; height: 200px }
.home .name { font-size: 2em; line-height: 1em; padding: 30px 0 15px; }


/* Tweet *************************************************************** */

.tweet {margin-top:20px; padding:10px; font-size: .85em; border-radius: 5px;}
.tweet ul {padding:0; margin:0} 
.tweet ul li {padding-top: 0}
.tweet a {font-style: italic}
.arrow_box { position: relative; background: white; border: 1px solid #ccc; color: #333}
.arrow_box:after, .arrow_box:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;}
.arrow_box:after { border-color: rgba(242, 242, 242, 0); border-bottom-color: white; border-width: 10px; left: 50%; margin-left: -10px;}
.arrow_box:before { border-color: rgba(204, 204, 204, 0); border-bottom-color: #ccc; border-width: 11px; left: 50%; margin-left: -11px;}


/* Profile *************************************************************** */

.profile article {margin-bottom: 40px}
.profile article.education {margin-bottom: 20px}
.profile .avatar {width:150px; height: 150px; margin: 0 auto}
.profile .label {width:25%; margin-right:5%; text-shadow: none}
.profile .data {width: 65%}
.biowrap { padding: 30px; overflow: hidden}
.biowrap ul, li { list-style-type: none}
.biowrap .chart {float: left; margin: 5px}
.profile hr {border-top:1px solid #ccc}
.profile .experience, .profile .education {padding-bottom: 15px}
.profile h4 {margin-top:-32px; font-size: 0.9em}
.profile h4 strong {padding-right: 15px}



/* Portfolio *************************************************************** */

.portfolio img { border-bottom: white 1px solid}
.portfolio hr { border-top:1px solid #ccc; width: 98%; margin: 0, auto}
.portfolio article { float: left; width: 31%; margin-bottom: 10px; padding: 0 1%; position: relative; overflow: hidden}
.da-thumbs span { position: relative; display: block; line-height: 1em; top:40%; text-align: center}
.da-thumbs article a,
.da-thumbs article a img { display: block; position: relative; margin: 0 auto; max-width: 100%}
.da-thumbs article a { overflow: hidden}
.da-thumbs article a h6 {background: white; color: black; font-weight: normal; margin: 0; padding: 5px 0; border-bottom: 1px solid #ccc; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;}
.da-thumbs article a div { position: absolute; width: 100%; height: 100%; opacity: .8; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;}
.da-thumbs article a div.da-animate { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.da-thumbs article a div i {font-size: 1.2em}

/* Initial state classes: *************************************************************** */

.da-slideFromTop { left: 0px; top: -100%; }
.da-slideFromBottom { left: 0px; top: 100%; }
.da-slideFromLeft { top: 0px; left: -100%; }
.da-slideFromRight { top: 0px; left: 100%; }


/* Final state classes: *************************************************************** */

.da-slideTop { top: 0px }
.da-slideLeft { left: 0px }
.da-thumbs li a div span { display: block; padding: 10px 0; margin: 40px 20px 20px 20px; text-transform: uppercase; font-weight: normal; color: rgba(255,255,255,0.9); text-shadow: 1px 1px 1px rgba(0,0,0,0.2); border-bottom: 1px solid rgba(255,255,255,0.5); box-shadow: 0 1px 0 rgba(0,0,0,0.1), 0 -10px 0 rgba(255,255,255,0.3); }


/* Contact *************************************************************** */

.gmap { width: 100%; height: 180px; border-bottom: 1px solid #a7a7a7; }
.gmap img { vertical-align: top; max-width: 100%; }

.contact input { width:90% }
.contact input[type="submit"] {width: inherit;}
.contact textarea { width: 90% }
.success_box, .error_box {font-size: .9em; display: none}

.contact .pull-left { width: 8%; padding-right: 2%; }
.contact .pull-right { text-align: left; width: 90%; }
.contact form {margin-bottom: 0}


/* Footer *************************************************************** */

footer { background: url(../img/footer-slice.png) top center no-repeat; height: 9px; }
.copyright {font-weight:normal; margin-top:5px; font-size: .85em; margin: 5px 0 50px}
.copyright .social a {float:right; margin-left: 5px; height: 24px; text-indent: -9999px;}


/* Pie Chart *************************************************************** */

.easyPieChart { position: relative; text-align: center;}
.easyPieChart canvas { position: absolute; top: 0; left: 0;}


/* Fancybox *************************************************************** */

#fancybox-loading { position: fixed; top: 50%; left: 50%; width: 40px; height: 40px; margin-top: -20px; margin-left: -20px; cursor: pointer; overflow: hidden; z-index: 1104; display: none; }
#fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url('../img/fancy/fancybox.png'); }
#fancybox-overlay { position: absolute; top: 0; left: 0; width: 100%; z-index: 1100; display: none; }
#fancybox-tmp { padding: 0; margin: 0; border: 0; overflow: auto; display: none; }
#fancybox-wrap { position: absolute; top: 0; left: 0; padding: 20px; z-index: 1101; outline: none; display: none; }
#fancybox-outer { position: relative; width: 100%; height: 100%; background: #fff; }
#fancybox-content { width: 0; height: 0; padding: 0; outline: none; position: relative; overflow: hidden; z-index: 1102; border: 0px solid #fff; }
#fancybox-hide-sel-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; z-index: 1101; }
#fancybox-close { position: absolute; top: -15px; right: -15px; width: 30px; height: 30px; background: transparent url('../img/fancy/fancybox.png') -40px 0px; cursor: pointer; z-index: 1103; display: none; }
#fancybox-error { color: #444; font: normal 12px/20px Arial; padding: 14px; margin: 0; }
#fancybox-img { width: 100%; height: 100%; padding: 0; margin: 0; border: none; outline: none; line-height: 0; vertical-align: top; }
#fancybox-frame { width: 100%; height: 100%; border: none; display: block; }
#fancybox-left,
#fancybox-right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; outline: none; background: transparent url('blank.html'); z-index: 1102; display: none; }
#fancybox-left { left: 0px }
#fancybox-right { right: 0px }
#fancybox-left-ico,
#fancybox-right-ico { position: absolute; top: 50%; left: -9999px; width: 30px; height: 30px; margin-top: -15px; cursor: pointer; z-index: 1102; display: block; }
#fancybox-left-ico { background-image: url('../img/fancy/fancybox.png'); background-position: -40px -30px; }
#fancybox-right-ico { background-image: url('../img/fancy/fancybox.png'); background-position: -40px -60px; }
#fancybox-left:hover,
#fancybox-right:hover { visibility: visible; /* IE6 */ }
#fancybox-left:hover span { left: 20px }
#fancybox-right:hover span { left: auto; right: 20px; }
.fancybox-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }
#fancybox-bg-n { top: -20px; left: 0; width: 100%; background-image: url('../img/fancy/fancybox-x.png'); }
#fancybox-bg-ne { top: -20px; right: -20px; background-image: url('../img/fancy/fancybox.png'); background-position: -40px -162px; }
#fancybox-bg-e { top: 0; right: -20px; height: 100%; background-image: url('../img/fancy/fancybox-y.png'); background-position: -20px 0px; }
#fancybox-bg-se { bottom: -20px; right: -20px; background-image: url('../img/fancy/fancybox.png'); background-position: -40px -182px; }
#fancybox-bg-s { bottom: -20px; left: 0; width: 100%; background-image: url('../img/fancy/fancybox-x.png'); background-position: 0px -20px; }
#fancybox-bg-sw { bottom: -20px; left: -20px; background-image: url('../img/fancy/fancybox.png'); background-position: -40px -142px; }
#fancybox-bg-w { top: 0; left: -20px; height: 100%; background-image: url('../img/fancy/fancybox-y.png'); }
#fancybox-bg-nw { top: -20px; left: -20px; background-image: url('../img/fancy/fancybox.png'); background-position: -40px -122px; }
#fancybox-title { font-family: Helvetica; font-size: 12px; z-index: 1102; }
.fancybox-title-inside { padding-bottom: 10px; text-align: center; color: #333; background: #fff; position: relative; }
.fancybox-title-outside { padding-top: 10px; color: #fff; }
.fancybox-title-over { position: absolute; bottom: 0; left: 0; color: #FFF; text-align: left; }
#fancybox-title-over { padding: 10px; background-image: url('../img/fancy/fancy_title_over.png'); display: block; }
.fancybox-title-float { position: absolute; left: 0; bottom: -20px; height: 32px; }
#fancybox-title-float-wrap { border: none; border-collapse: collapse; width: auto; }
#fancybox-title-float-wrap td { border: none; white-space: nowrap; }
#fancybox-title-float-left { padding: 0 0 0 15px; background: url('../img/fancy/fancybox.png') -40px -90px no-repeat; }
#fancybox-title-float-main { color: #FFF; line-height: 29px; font-weight: bold; padding: 0 0 3px 0; background: url('../img/fancy/fancybox-x.png') 0px -40px; }
#fancybox-title-float-right { padding: 0 0 0 15px; background: url('../img/fancy/fancybox.png') -55px -90px no-repeat; }
.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_close.html', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_nav_left.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_nav_right.html', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_title_over.html', sizingMethod='scale'); zoom: 1; }
.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_title_left.html', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_title_main.html', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_title_right.html', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-bg-w,
.fancybox-ie6 #fancybox-bg-e,
.fancybox-ie6 #fancybox-left,
.fancybox-ie6 #fancybox-right,
#fancybox-hide-sel-frame { height: expression(this.parentNode.clientHeight + "px") }
#fancybox-loading.fancybox-ie6 { position: absolute; margin-top: 0; top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px'); }
#fancybox-loading.fancybox-ie6 div { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_loading.html', sizingMethod='scale'); }
.fancybox-ie .fancybox-bg { background: transparent !important }
.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_n.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_ne.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_e.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_se.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_s.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_sw.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_w.html', sizingMethod='scale') }
.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/fancy/fancybox/fancy_shadow_nw.html', sizingMethod='scale') }


/* Social sprites *************************************************************** */

.behance:hover, .behance, .delicious:hover, .delicious, .deviantart:hover, .deviantart, .digg:hover, .digg, .dribbble:hover, .dribbble, .facebook:hover, .facebook, .flickr:hover, .flickr, .forrst:hover, .forrst, .google:hover, .google, .grooveshark:hover, .grooveshark, .lastfm:hover, .lastfm, .linkedin:hover, .linkedin, .myspace:hover, .myspace, .pinterest:hover, .pinterest, .rss:hover, .rss, .skype:hover, .skype, .tumblr:hover, .tumblr, .twitter:hover, .twitter, .vimeo:hover, .vimeo, .youtube:hover, .youtube { background: url(../img/sprites.png) no-repeat; -webkit-transition: background-position 0.2s ease; -moz-transition: background-position 0.2s ease; -o-transition: background-position 0.2s ease; }

.behance:hover{background-position:-494px -26px;width:24px;height:24px}
.behance{background-position:-494px 0;width:24px;height:24px}
.delicious:hover{background-position:-468px -26px;width:24px;height:24px}
.delicious{background-position:-468px 0;width:24px;height:24px}
.deviantart:hover{background-position:-442px -26px;width:24px;height:24px}
.deviantart{background-position:-442px 0;width:24px;height:24px}
.digg:hover{background-position:-416px -26px;width:24px;height:24px}
.digg{background-position:-416px 0;width:24px;height:24px}
.dribbble:hover{background-position:-390px -26px;width:24px;height:24px}
.dribbble{background-position:-390px 0;width:24px;height:24px}
.facebook:hover{background-position:-364px -26px;width:24px;height:24px}
.facebook{background-position:-364px 0;width:24px;height:24px}
.flickr:hover{background-position:-338px -26px;width:24px;height:24px}
.flickr{background-position:-338px 0;width:24px;height:24px}
.forrst:hover{background-position:-312px -26px;width:24px;height:24px}
.forrst{background-position:-312px 0;width:24px;height:24px}
.google:hover{background-position:-286px -26px;width:24px;height:24px}
.google{background-position:-286px 0;width:24px;height:24px}
.grooveshark:hover{background-position:-260px -26px;width:24px;height:24px}
.grooveshark{background-position:-260px 0;width:24px;height:24px}
.lastfm:hover{background-position:-234px -26px;width:24px;height:24px}
.lastfm{background-position:-234px 0;width:24px;height:24px}
.linkedin:hover{background-position:-208px -26px;width:24px;height:24px}
.linkedin{background-position:-208px 0;width:24px;height:24px}
.myspace:hover{background-position:-182px -26px;width:24px;height:24px}
.myspace{background-position:-182px 0;width:24px;height:24px}
.pinterest:hover{background-position:-156px -26px;width:24px;height:24px}
.pinterest{background-position:-156px 0;width:24px;height:24px}
.rss:hover{background-position:-130px -26px;width:24px;height:24px}
.rss{background-position:-130px 0;width:24px;height:24px}
.skype:hover{background-position:-104px -26px;width:24px;height:24px}
.skype{background-position:-104px 0;width:24px;height:24px}
.tumblr:hover{background-position:-78px -26px;width:24px;height:24px}
.tumblr{background-position:-78px 0;width:24px;height:24px}
.twitter:hover{background-position:-52px -26px;width:24px;height:24px}
.twitter{background-position:-52px 0;width:24px;height:24px}
.vimeo:hover{background-position:-26px -26px;width:24px;height:24px}
.vimeo{background-position:-26px 0;width:24px;height:24px}
.youtube:hover{background-position:0 -26px;width:24px;height:24px}
.youtube{background-position:0 0;width:24px;height:24px}


/* Isotope Filtering *************************************************************** */

.isotope-item { z-index: 2 }
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1; }
.isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; }
.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; }
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }

/* Pre Style */

.pre-style { background: white; width: 130px; font-size: .9em; padding: 10px; position: fixed; top: 15%; left: -150px; }
INPUT.miniColors { margin-right: 4px; margin-bottom: 0; border-radius: 0; height: auto; padding: 0 5px; font-size: 12px; }
.miniColors-selector { position: absolute; width: 175px; height: 150px; background: white; border: solid 1px #bababa; -moz-box-shadow: 0 0 6px rgba(0, 0, 0, .25); -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .25); box-shadow: 0 0 6px rgba(0, 0, 0, .25); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 5px; z-index: 999999; }
.miniColors.opacity.miniColors-selector { width: 200px }
.miniColors-selector.black { background: black; border-color: black; }
.miniColors-colors { position: absolute; top: 5px; left: 5px; width: 150px; height: 150px; background: url(http://labs.abeautifulsite.net/jquery-miniColors/images/colors.png) -40px 0 no-repeat; cursor: crosshair; }
.miniColors.opacity .miniColors-colors { left: 30px }
.miniColors-hues { position: absolute; top: 5px; left: 160px; width: 20px; height: 150px; background: url(http://labs.abeautifulsite.net/jquery-miniColors/images/colors.png) 0 0 no-repeat; cursor: crosshair; }
.miniColors.opacity .miniColors-hues { left: 185px }
.miniColors-opacity { position: absolute; top: 5px; left: 5px; width: 20px; height: 150px; background: url(http://labs.abeautifulsite.net/jquery-miniColors/images/colors.png) -20px 0 no-repeat; cursor: crosshair; }
.miniColors-colorPicker { position: absolute; width: 11px; height: 11px; border: 1px solid black; -moz-border-radius: 11px; -webkit-border-radius: 11px; border-radius: 11px; }
.miniColors-colorPicker-inner { position: absolute; top: 0; left: 0; width: 7px; height: 7px; border: 2px solid white; -moz-border-radius: 9px; -webkit-border-radius: 9px; border-radius: 9px; }
.miniColors-huePicker, .miniColors-opacityPicker { position: absolute; left: -2px; width: 22px; height: 2px; border: 1px solid black; background: white; margin-top: -1px; border-radius: 2px; }
.miniColors-trigger, .miniColors-triggerWrap { width: 22px; height: 22px; display: inline-block; }
.miniColors-triggerWrap { background: url(http://labs.abeautifulsite.net/jquery-miniColors/images/trigger.png) -22px 0 no-repeat }
.miniColors-triggerWrap.disabled { filter: alpha(opacity=50); opacity: .5; }
.miniColors-trigger { vertical-align: middle; outline: none; background: url(http://labs.abeautifulsite.net/jquery-miniColors/images/trigger.png) 0 0 no-repeat; }
.miniColors-triggerWrap.disabled .miniColors-trigger { cursor: default }
.bg-picker { margin: 0; padding: 0; }
.bg-picker a { width: 24px; height: 24px; display: block; float: left; border: 1px solid black; margin: 3px; }
.setting { background: #eb5b5e; color: black; font-size: 1em; right: -35px; top: 0; padding: 5px 10px; position: absolute; cursor: pointer}
select#nav {width: 100%; border-radius: 0; background: white; font-size: .95em}


/* Smartphones (portrait and landscape) *************************************************************** */

@media (max-width: 767px) { 
	.home .avatar { width: 150px; height: 150px; }
	.panel {margin-top:8%}
	.profile .avatar {margin-bottom: 30px}
	.profile h4 {text-align: center}
	.profile h4 strong {padding: 0 5px}
	.experience .tright, .education .tright {text-align: left}
	.portfolio article { width: 100%; margin-bottom: 10px; }
	.contact form { margin-top: 30px }
	.gmap {height: 380px !important}
	.contactform {padding-top:20px}
	#filter li {width: 100%}
	.copyright {margin-bottom:30px}
	.biowrap .chart {float: none; margin:0 auto}
	button.print {display: none}
}

@media print {
  header {display: none}
  .download, .print {display: none}
  hr.visible-phone {display: block}
}