body{background:#EAEAEA;font-family:'Open Sans',Arial,sans-serif;line-height:1.5;max-width:1500px;margin:0px auto}
h1,h2,h3,h4,h5,h6{font-family:'JF Flat Regular';font-weight:600}
b,strong{font-weight:700}
.scolor-facebook{color:#3971B6}
.scolor-twitter{color:#A0D6E2}
.scolor-google-plus{color:#CE443E}
.scolor-rss{color:#EFB758}
.scolor-email{color:#BBB}
.scolor-facebook:hover{color:#5A99E6}
.scolor-twitter:hover{color:#93E7FA}
.scolor-google-plus:hover{color:#F74840}
.scolor-rss:hover{color:#F5C779}
.scolor-email:hover{color:#CCC}
.sbg-facebook{background:#3971B6}
.sbg-twitter{background:#A0D6E2}
.sbg-google-plus{background:#CE443E}
.sbg-rss{background:#808080}
.sbg-email{background:#BBB}
.sbg-stumbleupon{background:#EB4823}
.sbg-facebook:hover{background:#5A99E6}
.sbg-twitter:hover{background:#93E7FA}
.sbg-google-plus:hover{background:#F74840}
.sbg-rss:hover{background:#a6a6a6}
.sbg-email:hover{background:#CCC}
.sbg-stumbleupon:hover{background:#ff6e49}
.no-gutter>[class*='col-']{padding-left:0;padding-right:0}
.jumbotron{border-bottom:2px solid #DDD;border-radius:5px;margin-top:15px;font-family:'JF Flat Regular'}
.tooltip.top{width:150px}
#sidebar-main{background:#3c3f41;height:100%;position:fixed;width:150px;z-index:9999}
#up-logo{font-family:'JF Flat Regular';letter-spacing:1px;margin:10px;text-align:center}
#up-logo a{border-radius:5px;display:block;moz-transition:0.3s ease all;padding:30px 10px 20px;transition:0.3s ease all;webkit-transition:0.3s ease all}
#up-logo a:hover{background:#f4f4f4;text-decoration:none}
#up-logo img{background:url(logo.png);height:102px;width:118px;background-position:0px -102px;background-repeat:no-repeat}
#up-logo img:hover{height:102px;width:118px;background-position:0px 0px;background-repeat:no-repeat}
#up-logo .img-logo{background:url(logo.png);height:102px;width:102px;background-position:0px -102px;background-repeat:no-repeat;margin:0px auto 0px auto}
#up-logo .img-logo-hover{background:url(logo.png);height:102px;width:102px;background-position:0px 0px;background-repeat:no-repeat;margin:0px auto 0px auto}
#up-logo h1{color:#FFF;font-size:23px;font-weight:300;margin-bottom:0}
#up-logo h1.h1-hover{color:#232323}
#up-logo p{color:#AAA;font-size:8px;margin-bottom:0}
#up-logo p.p.hover{color:#848484}
.main-nav{font-family:'JF Flat Regular';position:relative}
.main-nav li{position:relative}
.main-nav .nav-text{list-style:none;margin:0;padding-right:0}
.main-nav .nav-text li{}
.main-nav .nav-text li.divider{color:#FFF;display:block;font-size:15px;padding:20px 10px 5px;text-transform:uppercase}
.main-nav .nav-text li.divider:first-child{padding-top:10px}
.main-nav .nav-text a{color:#999;display:block;font-size:17px;font-weight:300;moz-transition:0.3s ease all;padding:2px 20px 2px;transition:0.3s ease all;webkit-transition:0.3s ease all}
.main-nav .nav-text li:hover .submenu{display:block}
.main-nav .nav-text li:hover>a{color:#FFF;text-decoration:none}
.main-nav .nav-icons{margin-left:40px;margin-right:40px}
.main-nav .nav-icons li{}
.main-nav .nav-icons a{float:left;padding:5px 8px 5px 0;width:50%}
.main-nav .submenu{background:#111;border-bottom-left-radius:5px;border-top-left-radius:5px;display:none;right:100%;moz-transform:translateY(-40%);moz-transition:0.3s ease all;ms-transform:translateY(-40%);o-transform:translateY(-40%);padding:20px 10px;position:absolute;text-align:center;top:-50%;transform:translateY(-40%);transition:0.3s ease all;webkit-transform:translateY(-40%);webkit-transition:0.3s ease all;width:250%}
.main-nav .submenu li{display:inline-block}
.main-nav .submenu a{display:block;margin-bottom:20px}
.main-nav .submenu img{display:block;margin-bottom:8px;width:80px}
#site-header{background:#FFF;display:block;height:50px;moz-transform:translate3d(0,0,0);moz-transition:all ease 150ms;ms-transform:translate3d(0,0,0);o-transform:translate3d(0,0,0);padding-right:150px;position:relative;transform:translate3d(0,0,0);transition:all ease 150ms;webkit-transform:translate3d(0,0,0);webkit-transition:all ease 150ms;width:100%;z-index:999}
#site-header .container-fluid{position:relative}
#site-header form{right:0;position:absolute;top:0;width:100%}
#site-header form input{background:#eee;border:none;moz-transition:all ease 150ms;outline:none;padding:14px 55px 15px 0;transition:all ease 150ms;webkit-transition:all ease 150ms;width:100%;font-family:'JF Flat Regular'}
#site-header form span.ti-search{color:#003E6B;cursor:pointer;font-size:27px;right:15px;moz-transition:all ease 150ms;opacity:1;position:absolute;top:11px;transition:all ease 150ms;webkit-transition:all ease 150ms}
#site-header.is-focused form span.ti-search,#site-header.is-hovering form span.ti-search{color:#149CFF}
#site-header.is-focused form span.ti-search{opacity:0}
#site-header.is-focused form input{font-size:19px;padding:23px 25px 24px 0px}
#site-header.is-hovering form input,#site-header.is-focused form input{background:#fff}
#site-header .social,#site-header .grid-changer{height:50px;line-height:50px;moz-transition:all ease 225ms;opacity:1;text-align:center;transition:all ease 225ms;webkit-transition:all ease 225ms}
#site-header.is-hovering .social,#site-header.is-hovering .grid-changer,#site-header.is-focused .social,#site-header.is-focused .grid-changer{opacity:0}
#site-header.is-focused{height:75px}
#site-header .fb_iframe_widget{position:absolute;left:175px;top:-17px}
#site-header #twitter-widget-0{height:20px;position:absolute;left:0;top:13px;width:160px}
#social-nav{width:80%;margin:-7px auto 0px -4%}

#social-nav ul{padding:0;list-style:none;font-size:12px}
#social-nav li{float:right;width:18%;text-align:center}
#social-nav li span{display:block}
#social-nav a{display:block;color:#ffffff;text-decoration:none;-moz-transition:.3s;-webkit-transition:.3s;-o-transition:.3s;transition:.3s}
#social-nav ul:hover a{color:rgba(255, 255, 255, 0.6)}
#social-nav ul:hover a:hover{color:#ffffff}
#social-nav li:nth-child(1) i{background:rgb(59, 89, 152);box-shadow:0 0 0 0 rgba(59, 89, 152,0.6)}
#social-nav li:nth-child(2) i{background:rgb(0, 172, 238);box-shadow:0 0 0 0 rgba(0, 172, 238, 0.6);}
#social-nav li:nth-child(3) i{background:rgb(210, 64, 46);box-shadow:0 0 0 0 rgba(210, 64, 46,0.6)}
#social-nav li:nth-child(4) i{background:rgb(240, 150, 0);box-shadow:0 0 0 0 rgba(240, 150, 0, 0.6)}
#social-nav li:nth-child(5) i{background:rgb(203, 34, 41);box-shadow:0 0 0 0 rgba(203, 34, 41, 0.6)}
#social-nav li:nth-child(6) i{background:rgb(234, 75, 36);box-shadow:0 0 0 0 rgba(234, 75, 36, 0.6)}
#social-nav i{position:relative;display:inline-block;margin:0 auto;padding:5px;border-radius:50%;font-size:16px;transition:box-shadow .4s ease-in-out;-moz-transition:box-shadow .4s ease-in-out;-webkit-transition:box-shadow .4s ease-in-out;-o-transition:box-shadow .4s ease-in-out}
#social-nav a:hover i, #social-nav a:active i{box-shadow:0 0 0 25px transparent}
#social-nav .icon + span{margin-top:20px;opacity:0;-webkit-transition:all 500ms cubic-bezier(1.000, 0.000, 1.000, 0.650);-moz-transition:all 500ms cubic-bezier(1.000, 0.000, 1.000, 0.650);-ms-transition:all 500ms cubic-bezier(1.000, 0.000, 1.000, 0.650);-o-transition:all 500ms cubic-bezier(1.000, 0.000, 1.000, 0.650);transition:all 500ms cubic-bezier(1.000, 0.000, 1.000, 0.650)}
#social-nav a:hover span, #social-nav a:active span{opacity:1}
#top-nav{margin-right:30px}
#top-nav ul{float:right;list-style:none;margin:0}
#top-nav li{}
#top-nav li:first-child a{border-left:0}
#top-nav a{color:#777;display:block;font-size:16px;height:100%;margin-right:10px;moz-transition:0.3s ease all;padding:15px;text-align:center;transition:0.3s ease all;webkit-transition:0.3s ease all}
#top-nav a:hover{color:#000;text-decoration:none}
#top-nav form{margin-right:20px}
#top-nav form input{background:#EEE;height:36px;moz-transition:0.3s ease all;padding-bottom:5px;padding-top:5px;transition:0.3s ease all;webkit-transition:0.3s ease all;width:100px}
#top-nav form button{margin-left:0;padding-bottom:7px;padding-top:7px}
#top-nav .fb-like{display:block;float:left;margin-right:25px;margin-top:14px}
#top-nav #twitter-widget-0{display:block;float:left;margin-right:0;margin-top:15px}
.grid-toggle{color:#545454}
#mobile-header{background:#232323;height:80px;position:relative}
#mobile-header .mobile-menu-toggle{background:#151515;color:#EEE;display:block;font-size:27px;right:15px;padding:5px 15px;position:absolute;top:15px}
#mobile-header .mobile-menu-logo img{margin:0 auto;padding-top:10px;width:60px}
#mobile-header .mobile-menu-toggle:hover{background:#000}
#mobile-header a:hover{text-decoration:none}
.overlay{background:rgba(0,0,0,0.75);cursor:pointer;display:none;height:100%;moz-transition:all 225ms ease;position:fixed;transition:all 225ms ease;webkit-transition:all 225ms ease;width:100%;z-index:999999}
.site-is-showing .site-canvas{moz-transform:translateX(-200px);transform:translateX(-200px);webkit-transform:translateX(-200px)}
.site-is-showing .overlay{display:block}
#site-footer{background:#FFF;padding-right:150px;font-family:'JF Flat Regular'}
#footer-content{color:#777;padding:30px 40px}
#footer-content p{margin:0}
#footer-nav{}
#footer-nav ul{list-style:none;margin:0;padding-left:0}
#footer-nav li{display:inline-block}
#footer-nav a{color:#777;display:block;margin-right:15px;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
#footer-nav a:hover{color:#000;text-decoration:none}
#footer-nav .digital-ocean{}
#footer-nav .digital-ocean a{}
#footer-nav .digital-ocean span{background:url('digital-ocean.png') no-repeat top left;background-size:cover;display:inline-block;height:22px;margin-left:5px;margin-left:76px;position:absolute;top:0;width:140px}
#footer-nav .digital-ocean a:hover{text-decoration:none}
#footer-nav .digital-ocean a:hover span{background-position:0 -23px}
#site-sidebar{display:block;height:100%;margin:0 auto;padding-top:30px;position:absolute;left:10px;top:7px;width:300px}
.sidebar-section{margin-bottom:30px;margin-top:10px}
.sidebar-section h4{border-bottom:3px solid #CCC;color:#545454;font-size:16px;margin-bottom:10px;padding-bottom:5px;text-transform:uppercase}
.sidebar-section h4 a{color:#545454}
.ad-side{margin-bottom:20px}
.ad-side h4 span{margin-left:8px}
.sidebar{padding-left:0px;margin-right:-10px}
.sidebar-popular{}
.sidebar-popular h4 span{margin-left:8px}

.sidebar-popular h4 .archive a{font-size:10px;text-decoration:none;cursor:pointer}

.sidebar-popular ul{list-style:none;padding:0}
.sidebar-popular ul li{border-radius:5px;display:block;moz-transition:0.3s ease all;padding:5px;transition:0.3s ease all;webkit-transition:0.3s ease all;height:auto;border-bottom:1px dashed #AAA}
.sidebar-popular ul li:hover{background:#d0d0d0;text-decoration:none}
.sidebar-popular ul a{color:#545454;font-size:13px;margin-bottom:5px;font-family:"JF Flat Regular", tahoma;text-decoration:none;text-align:right}
.sidebar-popular ul a.active{color:#545454;font-size:13px;margin-bottom:5px;font-family:"JF Flat Regular", tahoma;text-decoration:none;text-align:right;font-weight:bolder}
.sidebar-popular ul a span.date{color:#000}
.sidebar-popular .popular-img{border-radius:4px;display:block;float:right;height:60px;margin-left:8px;overflow:hidden;width:70px}
.sidebar-popular .popular-img img{height:60px;width:118px}
.sidebar-popular .popular-text{padding-right:60px;text-align:justify}
.sidebar-email{background:#DDD;border-radius:5px;margin-bottom:10px;padding:20px}
.sidebar-email h4{border-bottom:0;padding-bottom:0;text-align:center}
.sidebar-email h4 span{display:block;font-size:80px;margin-bottom:20px}
.sidebar-social .fb-like{display:block;float:left;margin-right:10px}
.sidebar-social #twitter-widget-1{display:block;float:left;margin-top:2px}
.sidebar-sticky.stuck{position:fixed;left:30px;top:30px;width:300px}
#site-main{min-height:700px;padding-bottom:30px;padding-right:160px;padding-left:10px;margin-left:0px!important;width:100%;position:relative}
#site-content{margin-left:-15px;/*max-width:1000px;*/padding-top:30px;width:100%}
.dropdown-topper{background:#DDD;border-radius:5px;margin-bottom:30px;margin-top:0}
.dropdown-topper ul{margin:0}
.dropdown-topper a{color:#545454}
.home #site-content,.home #site-sidebar,.archive #site-content,.archive #site-sidebar{padding-top:20px}
.error404 #site-content,.home #site-sidebar,.archive #site-content,.archive #site-sidebar{padding-top:70px}
.block-box-container , .block-box-container-2{padding:0px}
.block-box-container .block-box, .block-box-container-2 .block-box{padding:5px;margin-right:0px}
.block-box{margin-left:0px!important;padding-left:0px}
.block-box ul{padding-right:0px;font-family:'JF Flat Regular'}
.block-box ul li{list-style:none;font-size:13px}
.block-box .panel-body{min-height:240px}
.block-box-container-2 .block-box .panel-body{min-height:140px}
.grid>.col-sm-6{moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.grid>.col-lg-4 .grid-img-holder{height:140px}
.grid-box{border-radius:5px;margin-bottom:30px;position:relative}
.grid-img-holder{background-position:top center;background-size:cover;border-top-left-radius:5px;border-top-right-radius:5px;display:block;height:200px;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all;width:100%}
.grid-img-holder img{moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all;width:100%}
.grid-content{background:#FFF;border-bottom:2px solid #DDD;border-bottom-left-radius:5px;border-bottom-right-radius:5px;min-height:170px;padding:20px 20px 50px}
.grid-content h2{font-size:17px;line-height:1.4;margin:0 0 5px}
.grid-content h2 a{color:#333;display:block}
.grid-content h2 a:hover{text-decoration:none}
.grid-content p{font-size:16px;font-weight:400;line-height:1.65;font-family:'JF Flat Regular'}
.grid-bottom{bottom:10px;left:0;padding:10px 20px;position:absolute;width:100%}
.grid-author-img{display:block;float:left}
.grid-author-img img{border-radius:5px}
.grid-tags{color:#999;display:block;font-size:11px;padding-left:40px;padding-top:5px;position:absolute;right:20px;text-align:right}
.grid-tags a{color:#999}
.grid-box:hover .grid-img img{}
.grid-box:hover .byline,.grid-box:hover .byline a{color:#666}
.grid-time{color:#CCC;display:block;font-size:11px;margin-bottom:5px}
.grid-time a{color:#CCC;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.byline{color:#999;font-size:12px;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.byline a{color:#999;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.byline-row{margin-bottom:5px}
.byline-item{margin-right:10px}
.byline-item span{margin-right:4px}
.byline-time{font-size:10px}
.byline-author img{border-radius:5px;float:left;margin-right:8px}
.grid-box .byline-item{display:inline-block;margin-bottom:3px}
.sponsor-box{border-radius:5px}
.sponsor-box .grid-img img{border-radius:5px}
.sponsor-box .grid-content{background:rgba(0,0,0,0.7);border:0;border-radius:5px;bottom:20px;color:#FFF;left:10%;position:absolute;text-align:center;width:80%}
.sponsor-box .grid-content h2 a{color:#FFF}
.category-quick-tips .grid-content{border-top-left-radius:5px;border-top-right-radius:5px}
#pagination-links{margin-bottom:30px}
.article-cat{display:block;left:10px;position:absolute;top:10px;font-family:'JF Flat Regular'}
.article-cat a{background:rgba(0,0,0,0.5);border-radius:3px;color:#FFF;display:block;font-size:11px;line-height:1;padding:10px;text-transform:uppercase}
.article-cat a:hover{text-decoration:none}
.grid .g{margin:auto;overflow:inherit;padding:auto}
article{position:relative;margin-top:70px}
article .article-img{border-top-left-radius:5px;border-top-right-radius:5px}
article.non-tiles .article-content{background:#FFF;border-bottom:2px solid #DDD;border-radius:5px;margin-bottom:40px;padding:30px 70px;position:relative}
article.tiles .article-content{}
article.tiles .tile{background:#FFF;border-bottom:2px solid #DDD;border-radius:5px;margin-bottom:40px;position:relative}
article.tiles .tile-content{padding:50px 70px}
.article-content{font-size:18px;font-weight:400;line-height:1.75}
.article-content .byline{display:block;font-size:14px;margin-bottom:20px;font-family:'JF Flat Regular'}
.article-content .byline-item{margin-top:10px}
.article-content .byline-item span{display:inline-block}
.article-content .byline-author img{margin-top:-25px}
.article-content p,.article-content img,.article-content pre,.article-content ul,.article-content ol,.article-content table,.article-content .alert{margin-bottom:30px}
.article-content iframe{margin-bottom:-7px}
.article-content h1,.article-content h2,.article-content h3,.article-content h4,.article-content h5,.article-content h6{margin-bottom:0px;font-size:25px}
.article-content p:last-child,.article-content img:last-child,.article-content pre:last-child,.article-content ul:last-child,.article-content ol:last-child,.article-content table:last-child,.article-content .alert:last-child{margin-bottom:0}
.article-content pre{border:0;border-radius:0;margin-left:-70px;margin-right:-70px;padding:40px 80px;width:auto}
.article-content .text-center img{margin-bottom:30px}
.article-content .text-center:last-child img{margin-bottom:0}
article.single .byline,article.single .byline a{color:#999}
.sticky-wrapper{height:auto!important}
.article-outline{background:#232323;border-top-left-radius:5px;border-top-right-radius:5px;height:auto;left:0;right:160px;moz-transform:translateY(-100%);moz-transition:0.3s ease all;ms-transform:translateY(-100%);o-transform:translateY(-100%);padding:10px;position:fixed;bottom:0;transform:translateY(-100%);transition:0.3s ease all;webkit-transform:translateY(-100%);webkit-transition:0.3s ease all;z-index:9999}
.article-outline.stuck{moz-transform:translateY(0);ms-transform:translateY(0);o-transform:translateY(0);transform:translateY(0);webkit-transform:translateY(0)}
.outline-social-row{margin:0}
.article-outline select{padding:5px 10px}
.article-outline a{border-radius:3px;color:#FFF;display:block;font-family:'JF Flat Regular';font-size:14px;font-weight:300;padding:5px 0 5px 14px;position:relative;text-align:center}
.article-outline a span{left:13%;position:absolute;top:8px}
.article-outline a:hover{text-decoration:none}
.article-outline .col-xs-4{padding:0 5px}
.article-content h1{line-height:1.3;margin-bottom:30px;margin-top:0}
.article-content h2{font-size:32px;margin-bottom:30px;margin-top:0;position:relative}
.article-content h2 a{color:#333;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.article-content h2 a span{color:#BBB;font-size:18px;moz-transition:0.3s ease all;transition:0.3s ease all;webkit-transition:0.3s ease all}
.article-content h2 a:hover{color:#000;text-decoration:none}
.article-content h2 a:hover span{color:#D98218}
.article-content h2 .heading-link{color:#BBB;font-size:24px;left:-33px;position:absolute;top:4px}
article.single .article-content .share-links:first-child{margin-bottom:30px}
.share-buttons{margin-left:-50px;margin-right:-50px;moz-transform:scale(0.8);ms-transform:scale(0.8);o-transform:scale(0.8);transform:scale(0.8);webkit-transform:scale(0.8);width:auto}
.share-links{display:block;text-align:center}
.share-links a{border-radius:50%;display:block;height:100px;margin-right:15px;overflow:hidden;text-align:center;width:100px}
.share-links a:hover{text-decoration:none}
.share-links li:last-child a{margin-right:0}
.share-links .social-number{background:#DDD;color:#545454;font-size:30px;height:50px;line-height:1;overflow:hidden;padding-top:12px}
.share-links .social-text{color:#FFF;font-size:30px;height:50px;line-height:1;overflow:hidden;padding-top:8px}
.action-buttons{margin-bottom:40px;margin-top:40px}
.action-buttons:last-child{margin-bottom:0}
.action-buttons:first-child{margin-top:0}
.content-ad{background:#F1F1F1;box-shadow:inset 0 1px 0 rgba(0,0,0,0.05),0 1px 0 rgba(0,0,0,0.05);display:block;margin:40px -70px;moz-box-shadow:inset 0 1px 0 rgba(0,0,0,0.05),0 1px 0 rgba(0,0,0,0.05);padding-bottom:10px;padding-left:2%;padding-top:10px;position:relative;webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,0.05),0 1px 0 rgba(0,0,0,0.05)}
.content-ad:before{background:#D98218;color:#FFF;content:'Ad';font-size:11px;height:20px;left:0;padding-top:2px;position:absolute;text-align:center;text-transform:uppercase;top:0;width:30px;z-index:7777}
body article .yarpp-related{margin:0 0 40px!important}
.further-reading{line-height:1.3}
.further-reading img{border-radius:5px;margin-bottom:5px!important}
.further-reading .row a{color:#545454;font-family:'JF Flat Regular';font-size:14px;font-weight:300!important}
.article-secondary{margin-bottom:50px}
#author-info{}
#author-info #author-avatar{border-radius:5px}
#author-info .author-content{margin-bottom:20px;padding-left:170px}
#author-info .author-content h3{margin-top:0}
#author-info .author-content p{margin-bottom:10px}
#view-contributions span{margin-right:8px}
#author-indo .author-content a{display:block}
#author-info .author-content .twitter-follow-button{display:block;margin:0 0 10px}
.tw-outside{display:block;height:70px;margin:0 auto;position:relative;width:70px}
.tw-text,.tw-click{cursor:pointer;display:block;position:absolute;width:100%}
.tw-text{background:#0081b7;border-radius:50%;font-size:20px;font-weight:700;height:100%;moz-border-radius:50%;moz-transition:0.5s ease all;padding-top:10px;transition:0.5s ease all;webkit-border-radius:50%;webkit-transition:0.5s ease all;z-index:9999}
.tw-text img{border-radius:50%;left:0;max-width:100%;moz-border-radius:50%;moz-transform:rotate(-360deg);moz-transition:0.5s ease all;opacity:0;position:absolute;top:0;transform:rotate(-360deg);transition:0.5s ease all;webkit-border-radius:50%;webkit-transform:rotate(-360deg);webkit-transition:0.5s ease all}
.tw-text span{color:#FFF;font-size:40px;padding-top:7px}
.tw-click{background:#42e7ff;border-bottom-right-radius:5px;border-top-right-radius:5px;margin-left:-40px;margin-top:15px;moz-border-bottom-right-radius:5px;moz-border-top-right-radius:5px;moz-transition:0.3s ease all;opacity:0;padding:10px 10px 5px;padding-left:30px;transition:0.3s ease all;webkit-border-bottom-right-radius:5px;webkit-border-top-right-radius:5px;webkit-transition:0.3s ease all;width:auto;z-index:8888}
.tw-click iframe{margin-bottom:0!important}
.tw-outside:hover .tw-text img{moz-transform:rotate(0);opacity:1;transform:rotate(0);webkit-transform:rotate(0)}
.tw-outside:hover .tw-text{margin-left:-70px;moz-transform:rotate(-360deg);transform:rotate(-360deg);webkit-transform:rotate(-360deg)}
.tw-outside:hover .tw-click{margin-left:-20px;opacity:1}
#stay-connected{}
#stay-connected h4{font-size:60px;margin-bottom:10px}
#stay-connected .ti-email{font-size:60px}
#stay-connected .connected-container{display:inline-block;font-size:20px;font-weight:300;height:100px;letter-spacing:-1px;margin-bottom:10px;margin-left:-4px;overflow:hidden;position:relative;text-align:center;text-transform:uppercase;width:25%}
#stay-connected h3 a{color:#545454}
#stay-connected a{color:#FFF}
#stay-connected span{display:block;font-size:30px;margin-bottom:5px}
.connected-cover{height:100px;moz-transition:0.6s ease all;padding-top:20px;position:absolute;transition:0.6s ease all;webkit-transition:0.6s ease all;width:100%;z-index:999}
.connected-action{height:100px;position:absolute;width:100%;z-index:888}
#connected-twitter .connected-action{padding-top:35px}
#connected-facebook .connected-action{padding-top:20px}
#connected-google-plus .connected-action{padding-top:18px}
#connected-rss{border-bottom-left-radius:5px;border-top-left-radius:5px}
#connected-google-plus{border-bottom-right-radius:5px;border-top-right-radius:5px}
#connected-rss:hover .connected-cover,#connected-google-plus:hover .connected-cover{margin:0!important}
.connected-container:hover .connected-cover{margin-top:-100%}
#stay-connected #mc_embed_signup input.email{width:350px}
#comment-section{margin-bottom:0}
#comment-section iframe{margin-bottom:0}
.page-topper{background:#DDD;border-radius:5px;  padding:0 20px 20px 20px}
.page-topper h1{letter-spacing:1px;text-transform:uppercase;font-size:30px}
.page-topper p{font-size:16px}
.page-topper ul{margin:0}
.topic-topper{position:relative;text-align:center}
.topic-topper ul.topic-list{margin:0;padding:0;padding-right:150px}
.topic-topper ul.topic-list li{display:inline-block;float:right;margin:0;padding:0;width:12.5%}
.topic-topper .topic-list a{color:#FFF;display:block;font-family:'JF Flat Regular';font-size:12px;font-weight:400;moz-transition:0.3s ease all;overflow:hidden;padding:10px 0 8px;transition:0.3s ease all;webkit-transition:0.3s ease all}
.topic-topper .topic-list span{display:block;moz-transform:translate(0,125%);moz-transition:0.2s cubic-bezier(.17,.67,.38,1.46) all;transform:translate(0,125%);transition:0.2s cubic-bezier(.17,.67,.38,1.46) all;webkit-transform:translate(0,125%);webkit-transition:0.2s cubic-bezier(.17,.67,.38,1.46) all}
.topic-topper .topic-list img{display:block;height:35px;margin:0 auto 5px;moz-transform:translate(0,10px);moz-transition:0.2s cubic-bezier(.17,.67,.38,1.46) all;transform:translate(0,10px);transition:0.2s cubic-bezier(.17,.67,.38,1.46) all;webkit-transform:translate(0,10px);webkit-transition:0.2s cubic-bezier(.17,.67,.38,1.46) all}
.topic-list a:hover{text-decoration:none}
.topic-list a:hover span{moz-transform:translate(0,0);transform:translate(0,0);webkit-transform:translate(0,0)}
.topic-list a:hover img{moz-transform:translate(0,0) scale(1.2);transform:translate(0,0) scale(1.2);webkit-transform:translate(0,0) scale(1.2)}
.topic-list .topic-angular{background:#DD1B16}
.topic-list .topic-node{background:#80BD01}
.topic-list .topic-mean{background:#046DD5}
.topic-list .topic-laravel{background:#F4655F}
.topic-list .topic-sublime{background:#FFA431}
.topic-list .topic-bootstrap{background:#5B4282}
.topic-list .topic-css3{background:#2CA9E1}
.topic-list .topic-vagrant{background:#6966A5}
.topic-list .topic-angular:hover{background:#ff413c}
.topic-list .topic-node:hover{background:#a6e327}
.topic-list .topic-mean:hover{background:#2a93fb}
.topic-list .topic-laravel:hover{background:#ff8b85}
.topic-list .topic-sublime:hover{background:#ffca57}
.topic-list .topic-bootstrap:hover{background:#8168a8}
.topic-list .topic-css3:hover{background:#52cfff}
.topic-list .topic-vagrant:hover{background:#8f8ccb}
.author-topper-img{float:left;margin-right:20px}
.author-topper-img img{border-radius:5px;height:300px;width:300px}
.author-topper-content{padding-left:170px}
.author-page-social a{border-radius:50%;color:#FFF;display:block;font-size:30px;height:60px;moz-transition:0.3s ease all;padding-top:11px;text-align:center;transition:0.3s ease all;webkit-transition:0.3s ease all;width:60px}
.author-page-social a:hover{text-decoration:none}
.work-actions a span{margin-right:7px}
.about-actions{text-align:center}
#write-why i{font-size:60px}
#write-why .fa-money{color:#2DAE19}
#write-why .fa-share-alt{color:#2977D0}
#write-why .fa-shield{color:#D5690F}
#write-why .fa-heart-o{color:#D22323}
@media only screen and (max-width :1200px){.block-box-container .block-box:first-child, .block-box-container-2 .block-box:first-child{	padding-right:0px;}.block-box-container .block-box:nth-child(3), .block-box-container-2 .block-box:nth-child(3){	padding-right:0px;}}
@media only screen and (max-width :992px){#site-header .social,#site-header .grid-changer{	display:none;}#site-main{	padding-right:160px;}#site-sidebar{	display:none;}.content-ad{	padding-left:0;}.topic-topper ul.topic-list li{	width:25%;}.topic-topper ul.topic-list li a{	padding:5px 0 2px 0;}.block-box-container .block-box:nth-child(2), .block-box-container-2 .block-box:nth-child(2){	padding-right:0px;}.block-box-container .block-box:nth-child(4), .block-box-container-2 .block-box:nth-child(4){	padding-right:0px;}}
@media only screen and (max-width :768px){#sidebar-main{	display:none;}#site-main{	padding-right:30px;padding-left:30px;}
article{position:relative;margin-top:160px}article.single.non-tiles .article-content,article.single.tiles .tile-content{	padding-left:20px;	padding-right:20px;}.article-content pre{	margin-left:-20px;	margin-right:-20px;	padding-left:20px;	padding-right:20px;}#site-footer{	padding-right:0;}#footer-nav{	margin-bottom:15px;	text-align:center;}#footer-nav ul{	padding-right:0px;}#footer-content p{	text-align:center;}.site-wrapper{	overflow:hidden;	position:relative;	width:100%;}.site-canvas{	height:100%;	moz-transform:translateX(0);	moz-transition:0.3s ease all;	position:relative;	transform:translateX(0);	transition:0.3s ease all;	webkit-transform:translateX(0);	webkit-transition:0.3s ease all;	width:100%;}#mobile-menu{	background:#232323;	height:100%;	right:-200px;	padding-top:50px;	position:absolute;	top:0;	width:200px;}.topic-topper ul.topic-list, #site-header{	padding-right:0;}#stay-connected .connected-container{	border-radius:0!important;	margin:0 0 -7px 0;	moz-border-radius:0!important;	webkit-border-radius:0!important;	width:100%;}#stay-connected #mc_embed_signup input{	width:100%!important;}#stay-connected .form-group{	margin-bottom:5px;}#footer-content{	padding:30px 0;}#site-footer{	background:#232323;}#footer-nav li{	display:block;}#footer-nav a{	font-size:20px;	margin:0 0 20px;}#footer-nav .digital-ocean{	display:none;}#site-footer a{	color:#fff;}#site-footer a:hover{	color:#3e3e3e;}#author-info{	text-align:center;}#author-info #author-avatar{	float:none!important;	margin:0 auto;}#author-info .author-content{	padding:0;}#author-info .author-content iframe{	margin:0 auto;}


#top-menu-serv .menu li{float:right;width:20%!important;height:88px;list-style:none}}

@media only screen and (max-width :480px){.topic-topper ul.topic-list{	display:none;}.share-buttons{	moz-transform:scale(0.65);	ms-transform:scale(0.65);	o-transform:scale(0.65);	transform:scale(0.65);	webkit-transform:scale(0.65);}}
@media only screen and (max-width :320px){}
@font-face {font-family:"JF Flat Regular";src:url('JF-Flat-regular.eot');src:url('JF-Flat-regular.eot?#iefix') format('embedded-opentype'),
 url('JF-Flat-regular.svg#JF Flat Regular') format('svg'),
 url('JF-Flat-regular.woff') format('woff'),
 url('JF-Flat-regular.ttf') format('truetype');font-weight:normal;font-style:normal}



#top-menu-serv .menu{width:100%;position:relative;margin-top:15PX;padding:0px}
#top-menu-serv .menu li{float:right;width:20%;height:88px;list-style:none}
#top-menu-serv .menu li a{display:block;overflow:hidden;background:#fff;color:#000;text-align:center;height:100%;width:100%;position:relative;-moz-box-shadow:1px 1px 2px #ddd;/* firefox */-webkit-box-shadow:1px 1px 2px #ddd;/* Safari and Chrome */box-shadow:1px 1px 2px #ddd;text-decoration:none;padding:0px auto 0px auto;font-size:.9em}
#top-menu-serv .menu li.danger a:hover ,#top-menu-serv .menu li.home a h1{background:#d9534f;;color:#FFFFFF}
#top-menu-serv .menu li.warning a:hover ,#top-menu-serv .menu li.about a h1{background:#f0ad4e;color:#FFFFFF}
#top-menu-serv .menu li.info a:hover ,#top-menu-serv .menu li.service a h1{background:#5bc0de;color:#FFFFFF}
#top-menu-serv .menu li.success a:hover{background:#5cb85c;color:#FFFFFF}
#top-menu-serv .menu li.primary a:hover{background:#428bca;color:#FFFFFF}
#top-menu-serv .menu li.danger a{color:#d9534f}
#top-menu-serv .menu li.warning a{color:#f0ad4e}
#top-menu-serv .menu li.info a{color:#5bc0de}
#top-menu-serv .menu li.success a{color:#5cb85c}
#top-menu-serv .menu li.primary a{color:#428bca}
#top-menu-serv .menu li a h2{color:#444;font-family:'JF Flat Regular', arial, serif; font-size:1em;text-align:center;padding:4px 3px 10px 3px;text-decoration:none}
#top-menu-serv .menu li a span{position:inherit;background-position:top left;background-repeat:no-repeat;background-color:transparent;font-size:3em;display:block;margin:0px auto 0px auto;top:10px}
#top-menu-serv .menu li:hover h2{-moz-animation:animation1 .20s linear;/* firefox */-webkit-animation:animation1 .20s linear;/* Safari and Chrome */}
#top-menu-serv .menu li:hover span{-moz-animation:animation2 .50s linear;/* firefox */-webkit-animation:animation2 .50s linear;/* Safari and Chrome */}





.carousel-control {width:40px;color:#999;text-shadow:none}
.carousel-control:hover, .carousel-control:focus {color:#ccc;text-decoration:none;opacity:0.9;filter:alpha(opacity=90)}
.carousel-control.left, .carousel-control.right {background-image:none;filter:none}
.carousel-control i {position:absolute;top:50%;left:50%;z-index:5;display:inline-block;width:20px;height:20px;margin-top:-10px;margin-left:-10px}
.carousel-indicators.out {bottom:-5px}
.carousel-indicators li {-webkit-transition:background-color .25s;transition:background-color .25s;background:rgba(0,0,0,0.2);border:medium none}
.carousel-indicators .active {background:rgba(200,200,200,0.2);width:10px; height:10px; margin:1px}
.carousel.carousel-fade .item {-webkit-transition:opacity .25s;transition:opacity .25s;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;opacity:0;filter:alpha(opacity=0);font-family:'JF Flat Regular'}
.carousel.carousel-fade .active {opacity:1;filter:alpha(opacity=1)}
.carousel.carousel-fade .active.left, .carousel.carousel-fade .active.right {left:0;z-index:2;opacity:0;filter:alpha(opacity=0)}
.carousel.carousel-fade .next, .carousel.carousel-fade .prev {left:0;z-index:1}
.carousel.carousel-fade .carousel-control {z-index:3}
.carousel-indicators {position:absolute;top:100%;left:50%;z-index:15;width:60%;padding-left:0;margin-left:-30%;text-align:center;list-style:none}
.carousel-indicators li {display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;background-color:#000 \9;background-color:rgba(0,0,0,0);border:1px solid #3c3c3c;border-radius:10px}
.carousel-indicators .active {width:12px;height:12px;margin:0;background-color:#3c3c3c}
.carousel-inner .item p{font-family:'JF Flat Regular';text-align:right;font-size:12px!important}
.carousel-inner .item p a{text-decoration:none;text-align:justify}
.carousel-inner .item p a:hover{color:#000}
.carousel-inner .item{border-radius:5px;moz-transition:0.3s ease all;padding:5px;transition:0.3s ease all;webkit-transition:0.3s ease all}
.carousel-inner .item:hover{background:#d0d0d0;text-decoration:none;color:#000}
.flip-container, .front, .back {width:100%;height:185px}
.flip-container{perspective:1000;margin:0 auto}
.flip-container:hover .flip{transform:rotateY(180deg)}
.flip {transition:0.6s;transform-style:preserve-3d;position:relative}
.front, .back {backface-visibility:hidden;position:absolute;top:0;left:0}

.front{background:#ffff00; /* Old browsers */
background:-moz-linear-gradient(top, #3498db 40%,#2980b9 30%); /*  FF3.6+ */
background:-webkit-gradient(linear, left top, left bottom, color-stop(40%,#3498db), color-stop(30%,#2980b9)); /* Chrome,Safari4+ */
background:-webkit-linear-gradient(top, #3498db 40%,#2980b9 30%); /* Chrome10+,Safari5.1+ */
background:-o-linear-gradient(top, #3498db 40%,#2980b9 30%); /* Opera11.10+ */
background:-ms-linear-gradient(top, #3498db 40%,#2980b9 30%); /* IE10+ */
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#3498db', endColorstr='#2980b9',GradientType=0 ); /* IE6-9 */
background:linear-gradient(top, #3498db 40%,#2980b9 30%); /* W3C */
color:#ddd;z-index:2}

.back{background:#ddd;color:#333;transform:rotateY(180deg)}
.back p{text-align:justify;font-weight:bolder;font-family:Helvetica,Arial,Georgia,Times New Roman;text-align:justify;font-size:400%; 
text-transform:uppercase}
.carousel-inner .item .flip-container .front p{text-align:justify;font-weight:bolder;line-height:10px;text-align:center;font-size:400%; 
text-transform:uppercase;margin:25px auto 5px auto}
.front img{width:110px;height:110px;border-radius:55px;-webkit-border-radius:55px;-moz-border-radius:55px;margin:10px auto 0px auto;display:block}
.flip-container:hover .flip{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg)}
.flip-container{-webkit-perspective:1000;-moz-perspective:1000;-o-perspective:1000;perspective:1000;margin:0 auto}
.flip-container, .front, .back {width:100%;height:190px}
.flip {-webkit-transition:0.6s;-webkit-transform-style:preserve-3d;-moz-transition:0.6s;-moz-transform-style:preserve-3d;-o-transition:0.6s;-o-transform-style:preserve-3d;transition:0.6s;transform-style:preserve-3d;position:relative}
.front, .back {-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;position:absolute;top:0;left:0}
.front{color:#ddd;z-index:2}
.back{background:#ddd;color:#333;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg)}
.front p{text-align:center;font-weight:bolder;font-family:Helvetica,Arial,Georgia,Times New Roman;text-align:center;font-size:400%; 
text-transform:uppercase} 
.back p{text-align:justify;font-weight:bolder;font-family:Helvetica,Arial,Georgia,Times New Roman;text-align:center;font-size:400%; 
text-transform:uppercase;padding:5px}



/* *  Button 1 */
.puerto-btn-1img {width:100%; height:auto; max-height:395px}


/* *  Button 1 */
.puerto-btn-1 {display:inline-block;position:relative; height:40px; min-width:100%;margin-bottom:15px;border:0;text-align:right;outline:none;cursor:pointer}
.puerto-btn-1:before {content:"";position:absolute;right:0;top:0;height:40px;width:30px}
.puerto-btn-1 span {display:inline-block;width:25px;height:25px;background:#FFF;position:absolute;right:17.5px;top:7.5px;text-align:center;font-size:15px;line-height:1.8;border-radius:50% !important;-moz-border-radius:50% !important;-webkit-border-radius:50% !important}
.puerto-btn-1 small {display:inline-block;color:#FFF;font-size:16px;line-height:110%;font-family:'JF Flat Regular';padding:11px 20px;margin-right:35px}

/* *  Button 2 */
.puerto-btn-2 {display:inline-block;position:relative;height:40px;min-width:170px;margin-bottom:3px;border:0;text-align:right;outline:none;cursor:pointer}
.puerto-btn-2 span {display:inline-block;width:30px;height:40px;padding-right:5px;color:#FFF;position:absolute;right:0px;top:0px;text-align:center;font-size:18px;line-height:2.2}
.puerto-btn-2 span:before {content:"";position:absolute;right:35px;top:0;border-top:40px solid #139B80;border-left:10px solid transparent}
.puerto-btn-2 small {display:inline-block;color:#FFF;font-size:14px;padding:11px 20px;margin-right:35px}
   
/* *  Button 3 */
.puerto-btn-3 {display:inline-block;position:relative;height:37px;min-width:170px;margin-bottom:3px;border:0;text-align:right;outline:none;cursor:pointer;line-height:2.2;border-bottom:3px solid #139B80}
.puerto-btn-3 span {display:inline-block;color:#FFF;font-size:18px;margin-right:12px;margin-left:30px;float:right}
.puerto-btn-3 small {display:inline-block;color:#FFF;font-size:14px;margin-top:4px}
   
/* *  Button 4 */
.puerto-btn-4 {display:inline-block;border:2px solid #1ABC9C;background:transparent !important;position:relative;height:37px;min-width:170px;margin-bottom:3px;text-align:right;outline:none;cursor:pointer;line-height:2.2}
.puerto-btn-4 span {display:inline-block;font-size:18px;margin-left:8px;margin-right:30px;float:right}
.puerto-btn-4 small {display:inline-block;font-size:14px;margin-top:4px}

/* * ANIMATIONS */
.puerto-btn-1 span i, .puerto-btn-2 span i, .puerto-btn-3 span i, .puerto-btn-4 span i {-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-ms-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.puerto-btn-1:hover span i, .puerto-btn-2:hover span i, .puerto-btn-3:hover span i, .puerto-btn-4:hover span i {-webkit-animation:move_from_top 300ms ease-in-out;-moz-animation:move_from_top 300ms ease-in-out;-ms-animation:move_from_top 300ms ease-in-out;-o-animation:move_from_top 300ms ease-in-out;animation:move_from_top 300ms ease-in-out}

.puerto-btn-1:small, .puerto-btn-2:small, .puerto-btn-3:small, .puerto-btn-4:small {-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-ms-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.puerto-btn-1:hover small, .puerto-btn-2:hover small, .puerto-btn-3:hover small, .puerto-btn-4:hover small {-webkit-animation:move_from_left 300ms ease-in-out;-moz-animation:move_from_left 300ms ease-in-out;-ms-animation:move_from_left 300ms ease-in-out;-o-animation:move_from_left 300ms ease-in-out;animation:move_from_left 300ms ease-in-out}

/* * BORDER RADIUS */
.radius {border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}

.radius:before, .radius span {border-radius:0 3px 3px 0;-moz-border-radius:3px;-webkit-border-radius:0 3px 3px 0}
   
/* ==========================================================================
   COLORS styles
   ========================================================================== */
/* * Color 1 */ 
.color-1 { background-color:#1ABC9C}
.color-1.puerto-btn-1:before,
.color-1.puerto-btn-2 span { background:#139B80}
.color-1.puerto-btn-1 span,
.color-1.puerto-btn-4 { color:#1ABC9C}
.color-1.puerto-btn-2 span:before { border-top-color:#139B80}
.color-1.puerto-btn-3 {border-bottom-color:#139B80}
.color-1.puerto-btn-4 {border-color:#1ABC9C}

/* * Color 2 */ 
.color-2 { background-color:#2ecc71}
.color-2.puerto-btn-1:before,
.color-2.puerto-btn-2 span { background:#16A352}
.color-2.puerto-btn-1 span,
.color-2.puerto-btn-4 { color:#2ecc71}
.color-2.puerto-btn-2 span:before { border-top-color:#16A352}
.color-2.puerto-btn-3 {border-bottom-color:#16A352}
.color-2.puerto-btn-4 {border-color:#2ecc71}

/* * Color 3 */ 
.color-3 { background-color:#3498db}
.color-3.puerto-btn-1:before,
.color-3.puerto-btn-2 span { background:#1B7CBD}
.color-3.puerto-btn-1 span,
.color-3.puerto-btn-4 { color:#3498db}
.color-3.puerto-btn-2 span:before { border-top-color:#1B7CBD}
.color-3.puerto-btn-3 {border-bottom-color:#1B7CBD}
.color-3.puerto-btn-4 {border-color:#3498db}

/* * Color 4 */ 
.color-4 { background-color:#9b59b6}
.color-4.puerto-btn-1:before,
.color-4.puerto-btn-2 span { background:#8533A7}
.color-4.puerto-btn-1 span,
.color-4.puerto-btn-4 { color:#9b59b6}
.color-4.puerto-btn-2 span:before { border-top-color:#8533A7}
.color-4.puerto-btn-3 {border-bottom-color:#8533A7}
.color-4.puerto-btn-4 {border-color:#9b59b6}

/* * Color 5 */ 
.color-5 { background-color:#34495e}
.color-5.puerto-btn-1:before,
.color-5.puerto-btn-2 span { background:#1B344D}
.color-5.puerto-btn-1 span,
.color-5.puerto-btn-4 { color:#34495e}
.color-5.puerto-btn-2 span:before { border-top-color:#1B344D}
.color-5.puerto-btn-3 {border-bottom-color:#1B344D}
.color-5.puerto-btn-4 {border-color:#34495e}

/* * Color 6 */ 
.color-6 { background-color:#f1c40f}
.color-6.puerto-btn-1:before,
.color-6.puerto-btn-2 span { background:#D8B00E}
.color-6.puerto-btn-1 span,
.color-6.puerto-btn-4 { color:#f1c40f}
.color-6.puerto-btn-2 span:before { border-top-color:#D8B00E}
.color-6.puerto-btn-3 {border-bottom-color:#D8B00E}
.color-6.puerto-btn-4 {border-color:#f1c40f}

/* * Color 7 */ 
.color-7 { background-color:#e67e22}
.color-7.puerto-btn-1:before,
.color-7.puerto-btn-2 span { background:#CA6A14}
.color-7.puerto-btn-1 span,
.color-7.puerto-btn-4 { color:#e67e22}
.color-7.puerto-btn-2 span:before { border-top-color:#CA6A14}
.color-7.puerto-btn-3 {border-bottom-color:#CA6A14}
.color-7.puerto-btn-4 {border-color:#e67e22}

/* * Color 8 */ 
.color-8 { background-color:#e74c3c}
.color-8.puerto-btn-1:before,
.color-8.puerto-btn-2 span { background:#C92C1C}
.color-8.puerto-btn-1 span,
.color-8.puerto-btn-4 { color:#e74c3c}
.color-8.puerto-btn-2 span:before { border-top-color:#C92C1C}
.color-8.puerto-btn-3 {border-bottom-color:#C92C1C}
.color-8.puerto-btn-4 {border-color:#e74c3c}

/* * Color 9 */ 
.color-9 { background-color:#999999}
.color-9.puerto-btn-1:before,
.color-9.puerto-btn-2 span { background:#777777}
.color-9.puerto-btn-1 span,
.color-9.puerto-btn-4 { color:#999999}
.color-9.puerto-btn-2 span:before { border-top-color:#777777}
.color-9.puerto-btn-3 {border-bottom-color:#777777}
.color-9.puerto-btn-4 {border-color:#999999}

/* * Color 10 */ 
.color-10 { background-color:#333333}
.color-10.puerto-btn-1:before,
.color-10.puerto-btn-2 span { background:#000000}
.color-10.puerto-btn-1 span,
.color-10.puerto-btn-4 { color:#333333}
.color-10.puerto-btn-2 span:before { border-top-color:#000000}
.color-10.puerto-btn-3 {border-bottom-color:#000000}
.color-10.puerto-btn-4 {border-color:#333333}

/* * Color 11 */ 
.color-11 { background-color:#1FA6D5}
.color-11.puerto-btn-1:before,
.color-11.puerto-btn-2 span { background:#1589B1}
.color-11.puerto-btn-1 span,
.color-11.puerto-btn-4 { color:#1FA6D5}
.color-11.puerto-btn-2 span:before { border-top-color:#1589B1}
.color-11.puerto-btn-3 {border-bottom-color:#1589B1}
.color-11.puerto-btn-4 {border-color:#1FA6D5}

/* * Color 12 */ 
.color-12 { background-color:#FCC44C}
.color-12.puerto-btn-1:before,
.color-12.puerto-btn-2 span { background:#E5AF39}
.color-12.puerto-btn-1 span,
.color-12.puerto-btn-4 { color:#FCC44C}
.color-12.puerto-btn-2 span:before { border-top-color:#E5AF39}
.color-12.puerto-btn-3 {border-bottom-color:#E5AF39}
.color-12.puerto-btn-4 {border-color:#FCC44C}

/* * Color 13 */ 
.color-13 { background-color:#FC4C7D}
.color-13.puerto-btn-1:before,
.color-13.puerto-btn-2 span { background:#E03363}
.color-13.puerto-btn-1 span,
.color-13.puerto-btn-4 { color:#FC4C7D}
.color-13.puerto-btn-2 span:before { border-top-color:#E03363}
.color-13.puerto-btn-3 {border-bottom-color:#E03363}
.color-13.puerto-btn-4 {border-color:#FC4C7D}

/* * Color 14 */ 
.color-14 { background-color:#E04CFC}
.color-14.puerto-btn-1:before,
.color-14.puerto-btn-2 span { background:#C735E2}
.color-14.puerto-btn-1 span,
.color-14.puerto-btn-4 { color:#E04CFC}
.color-14.puerto-btn-2 span:before { border-top-color:#C735E2}
.color-14.puerto-btn-3 {border-bottom-color:#C735E2}
.color-14.puerto-btn-4 {border-color:#E04CFC}

/* * Color 15 */ 
.color-15 { background-color:#F86227}
.color-15.puerto-btn-1:before,
.color-15.puerto-btn-2 span { background:#D6511C}
.color-15.puerto-btn-1 span,
.color-15.puerto-btn-4 { color:#F86227}
.color-15.puerto-btn-2 span:before { border-top-color:#D6511C}
.color-15.puerto-btn-3 {border-bottom-color:#D6511C}
.color-15.puerto-btn-4 {border-color:#F86227}

/* * Color 16 */ 
.color-16 { background-color:#75AD16}
.color-16.puerto-btn-1:before,
.color-16.puerto-btn-2 span { background:#5F8A16}
.color-16.puerto-btn-1 span,
.color-16.puerto-btn-4 { color:#75AD16}
.color-16.puerto-btn-2 span:before { border-top-color:#5F8A16}
.color-16.puerto-btn-3 {border-bottom-color:#5F8A16}
.color-16.puerto-btn-4 {border-color:#75AD16}
   

/* ==========================================================================
   KEYFRAMES
   ========================================================================== */

@-webkit-keyframes move_from_top {from {opacity:0;-webkit-transform:translateY(60%)}
to {opacity:1;-webkit-transform:translateY(0%)}}
@-moz-keyframes move_from_top {from {opacity:0;-moz-transform:translateY(60%)}
to {opacity:1;-moz-transform:translateY(0%)}}
@-ms-keyframes move_from_top {from {opacity:0;-ms-transform:translateY(60%)}
to {opacity:1;-ms-transform:translateY(0%)}}
@-o-keyframes move_from_top {from {opacity:0;-o-transform:translateY(60%)}
to {opacity:1;-o-transform:translateY(0%)}}


@-webkit-keyframes move_from_left {from {opacity:0;-webkit-transform:translatex(-30%)}
to {opacity:1;-webkit-transform:translatex(0%)}}
@-moz-keyframes move_from_left {from {opacity:0;-moz-transform:translatex(-30%)}
to {opacity:1;-moz-transform:translatex(0%)}}
@-ms-keyframes move_from_left {from {opacity:0;-ms-transform:translatex(-30%)}
to {opacity:1;-ms-transform:translatex(0%)}}
@-o-keyframes move_from_left {from {opacity:0;-o-transform:translatex(-30%)}
to {opacity:1;-o-transform:translatex(0%)}}
@keyframes move_from_left {from {opacity:0;transform:translatex(-30%)}
to {opacity:1;transform:translatex(0%)}}
/*
========================================================================
============= ei-slider
========================================================================
*/
.ei-slider{position:relative;width:100%;max-width:100%;height:500px;margin:0 auto;padding-bottom:10%}
.ei-slider-loading{width:100%;height:100%;position:absolute;top:0px;left:0px;z-index:999;background:rgba(0,0,0,0.9);color:#fff;text-align:center;line-height:400px}
.ei-slider-large{height:100%;width:100%;position:relative;overflow:hidden}
.ei-slider-large li{position:absolute;top:0px;left:0px;overflow:hidden;height:100%;width:100%}
.ei-slider-large li img{width:100%}
.ei-title{position:absolute;right:50%;margin-right:13%;top:30%}
.ei-title h2, .ei-title h3{text-align:right}
.ei-title h2{font-size:40px;line-height:50px;font-style:italic;color:#b5b5b5}
.ei-title h3{font-size:70px;line-height:70px;text-transform:uppercase;color:#000}
.ei-slider-thumbs{height:13px;margin:0 auto;position:relative}
.ei-slider-thumbs li{position:relative;float:left;height:100%;list-style:none!important}
.ei-slider-thumbs li.ei-slider-element{top:0px;left:0px;position:absolute;height:100%;z-index:10;text-indent:-9000px;background:#000;background:rgba(0,0,0,0.9);list-style:none!important}
.ei-slider-thumbs li a{display:block;text-indent:-9000px;background:#666 ;width:100%;height:100%;cursor:pointer;-webkit-box-shadow:
0px 1px 1px 0px rgba(0,0,0,0.3), 
0px 1px 0px 1px rgba(255,255,255,0.5);-moz-box-shadow:
0px 1px 1px 0px rgba(0,0,0,0.3), 
0px 1px 0px 1px rgba(255,255,255,0.5);box-shadow:
0px 1px 1px 0px rgba(0,0,0,0.3), 
0px 1px 0px 1px rgba(255,255,255,0.5);-webkit-transition:background 0.2s ease;-moz-transition:background 0.2s ease;-o-transition:background 0.2s ease;-ms-transition:background 0.2s ease;transition:background 0.2s ease}
.ei-slider-thumbs li a:hover{background-color:#f0f0f0}
.ei-slider-thumbs li img{position:absolute;bottom:50px;opacity:0;z-index:999;max-width:100%;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;-ms-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-box-reflect:
below 0px -webkit-gradient(
linear, 
left top, 
left bottom, 
from(transparent), 
color-stop(50%, transparent), 
to(rgba(255,255,255,0.3))
);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
.ei-slider-thumbs li:hover img{opacity:1;bottom:13px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"}
sidebar-popular ul.inner_page_menu li{list-style:circle}
sidebar-popular ul.inner_page_menu li a.active {font-weight:bold}
@media screen and (max-width:830px) {.ei-title{	position:absolute;	right:0px;	margin-right:0px;	width:100%;	text-align:center;	top:auto;	bottom:10px;	background:#fff;	background:rgba(255,255,255,0.9);	padding:5px 0;}.ei-title h2, .ei-title h3{	text-align:center;}.ei-title h2{	font-size:20px;	line-height:24px;}.ei-title h3{	font-size:30px;	line-height:40px;}}

/**** PORTFOLIO STYLES*****/
.portfolio-categ{margin-bottom:30px;}
.portfolio-categ li{display:inline;margin-right:10px;}
.image-block{ display:block;position:relative;}
.image-block img{border:1px solid #d5d5d5; border-radius:4px 4px 4px 4px;background:#FFFFFF;padding:10px;}
.image-block img:hover{border:1px solid #A9CF54;box-shadow:0 0 5px #A9CF54;}
.portfolio-area li{float:left;margin:0 12px 20px 0;overflow:hidden;width:245px;padding:5px;}
.home-portfolio-text{margin-top:10px;}
li.active a{ text-decoration:underline;}
/**** END PORTFOLIO STYLES*****/
table.dataTable , .dataTables_wrapper {font-family:'JF Flat Regular' !important;font-size:13px}
.my-font{font-family:'JF Flat Regular' !important}

.board-menu{display:block; background-color:#3c3f41;font-family:'JF Flat Regular' !important;}
 
.board-menu li{display:inline-block;position:relative;z-index:100;}
 
.board-menu li a {text-decoration:none;padding:11px;display:block;color:#ffffff; 
-webkit-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -ms-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s}
 
.board-menu li a:hover, .menu li:hover > a{color:#ffffff;background:#428bca;}

/* hide the second level menu */
.board-menu ul {display:none;margin:0;padding:0;width:150px;position:absolute;top:43px;left:0px;background:#ffffff}
 
/* display second level menu on hover */
.board-menu li:hover > ul{ display:block;}
 
.board-menu ul li {display:block;float:none;background:none;margin:0;padding:0}
 
.board-menu ul li a {font-size:12px;font-weight:normal;display:block;color:#797979;border-left:3px solid #ffffff;background:#ffffff;}
 
.board-menu ul li a:hover, .menu ul li:hover > a{background:#f0f0f0;border-left:3px solid #9CA3DA;color:#797979}

/* change level 3 menu positions */
.board-menu ul ul {left:149px;top:0px}

/*==========================================*/
/*==========================================*/
/*==========================================*/
.agent-medium {background-color:#fff;box-shadow:0px 2px 4px rgba(0, 0, 0, 0.08);margin-bottom:30px;padding:16px;min-height:164px}

.agent-medium-image {background-color:rgba(0, 0, 0, 0.15);border-radius:50%;display:block;float:left;height:120px;position:relative;width:120px}
  .agent-medium-image:before {color:rgba(0, 0, 0, 0.2);content:"";display:block;font-family:'FontAwesome';font-size:40px;left:50%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);-webkit-transform:translateX(-50%) translateY(-50%);z-index:0}
.footer .agent-medium-image:before {color:#42A5F5}
  .agent-medium-image img {border-radius:50%;position:relative;width:100%;z-index:2}

.agent-medium-content {color:#616161;margin:0px 0px 0px 140px}
  .agent-medium-content ul {list-style:none;margin:0px;padding:0px}
.agent-medium-content ul .fa {margin:0px 5px 0px 0px}
.agent-medium-content ul li {margin:0px;font-family:'JF Flat Regular';}
  .agent-medium-content a {color:#EC407A}
  .agent-medium-content hr {margin:10px 0px}

.agent-medium-title {margin:0px 0px 10px;font-size:19px}
.agent-medium-title a {color:#424242;font-family:'JF Flat Regular'}
.agent-medium-title a:hover {text-decoration:none}

.agent-medium-subtitle {color:#616161;font-family:'JF Flat Regular';font-size:13px}