/**
 * This file should get overwritten if Method 1 is used. If Method 2 is chosen,
 * remove this comment and start adding your styles to this file.
 */


/*
**********************
--- GENERAL THEME CSS ---
**********************
*/

body{
    color:#535353;
}

h1{
    color:#232323;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus{
    color: #ffffff !important;
    background-color: #222222;
}

.navbar-default .navbar-nav>.dropdown>a:hover .caret, .navbar-default .navbar-nav>.dropdown>a:focus .caret{
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.navbar-default .navbar-nav>.open>a .caret, .navbar-default .navbar-nav>.open>a:hover .caret, .navbar-default .navbar-nav>.open>a:focus .caret{
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.navbar-default .navbar-nav>.dropdown>a .caret{
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.dropdown-menu{
    background: #ffffff;
    margin-left: 0;
    margin-right: 0;
    border: none;
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a{
    color: #222222;
}

.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus{
    color: #EC0188;
    background-color: #ffffff !important;
    border:none;
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus{
    color:#222222;
    background: transparent;
}

.sticky-wrapper {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    background: transparent;
}

header#navbar{

    background: #222222;
    border-bottom: 3px solid #222222;

    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    -ms-transition: all 2s ease;
    transition: all 2s ease;


}

#navbar-sticky-wrapper.is-sticky #navbar{
    background: #222222;
    border-bottom: 3px solid #222222;
}

.front .full_width header#navbar,.node-type-shinbun-front-page .full_width header#navbar{

    background: transparent;
    border-bottom: 3px solid #ffffff;

    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    -ms-transition: all 2s ease;
    transition: all 2s ease;


}

.front #navbar-sticky-wrapper.is-sticky #navbar,.node-type-shinbun-front-page #navbar-sticky-wrapper.is-sticky #navbar{
    background: #222222;
    border-bottom: 3px solid #222222;
}

.navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{
    color:#ffffff;
    border-bottom: 0px solid #ffffff;
}

.container .block h2.block-title{
    color:#222222;
}
.block h2.block-title{
    color:#222222;
}


.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus{
    border: 3px solid #222222;
    border-bottom: 1px solid #222222;
    background: #1f1f1f;
    color: white;
}

.nav-tabs{
    border-bottom: 3px solid #222222;
}

ul.nav li.dropdown ul.dropdown-menu{
    border-top: 4px solid #EC0188;
}

/*
******************************
--- OVERRIDE BOOTSTRAP ELEMENTS ---
******************************
*/

.panel-default>.panel-heading{
    background: #222222;
    color:#ffffff;
}

.panel-default>.panel-heading h4 a:hover{
    color:#ffffff;
}

/*
**********************
--- SIDEBAR ---
**********************
*/

.region-sidebar-second .block h2.block-title,.region-sidebar-first .block h2.block-title{

    border-bottom: 3px solid #222222;
    border-top: 3px solid #222222;
}

.second_content .container .block h2.block-title{
    color:#222222;
}

/*
**********************
--- LOADERS ---
**********************
*/
.loader{
    background: #ffffff;
}

.loading_text{
    color:#222222;
}

.loading_text i{
    color:#222222;
}

.la-anim-1 {
    background: #222222;
}

/*
**********************
--- BUTTONS AND LINKS ---
**********************
*/

.back_to_top i{
    color: #222222;
    background: #ffffff;
    border: 3px solid #222222;

}

.top_button a.back_to_top:hover{
    background: #EC0188;
}

.top_button a.back_to_top:hover i{
    background: #EC0188;
    border:3px solid #EC0188;
    color:#ffffff;
}

.btn-default,
input.form-submit,
.btn-primary{

    background-color: #222222;
    border: 3px solid #222222;

}

.btn-default:hover,
input.form-submit:hover,
.btn-primary:hover{
    background-color: #ffffff;
    border: 3px solid #222222;
}

.theme_color{
    color:#EC0188;
}

a,.highlight_content h4,a:hover,.tweets_region .flexslider .field-content a,.blog_category i,.username,
.btn-default:hover, input.form-submit:hover,.node-project .field-type-taxonomy-term-reference,.btn-primary:hover,.second_content .container .block h2.block-title,.loading_text,.view-filter-controls li.filter,
.tagcloud a{
    color:#222222;
}

.underline_title{
    border-bottom: 2px solid #222222;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus{
    background-color: #222222;
    border-color: #222222;
}

body .tooltip .tooltip-inner {
    color: #ffffff;
    background: #222222;
    padding:10px;
}

body .tooltip.top .tooltip-arrow {
    border-top-color: #222222;
}
body .tooltip.bottom .tooltip-arrow {
    border-bottom-color: #222222;
}
body .tooltip.left .tooltip-arrow {
    border-left-color: #222222;
}
body .tooltip.right .tooltip-arrow {
    border-right-color: #222222;
}

/*
**********************
--- BOOTSTRAP OVERRIDE ---
**********************
*/

.progress-bar{
    background-color: #222222;
}

.progress-bar-danger {
    background-color: #c65454;
}

.progress-bar-warning {
    background-color: #e15252;
}

.progress-bar-info {
    background-color: #68d08e;
}

.underline_title_top{
    border-top: 2px solid #222222;
    padding-top: 15px;
    color:#222222;
}


/*
**********************
--- ICONS ---
**********************
*/

i{
    color:#222222;
}

.bg_circle{
    background: #222222;
}

.bg_square{
    background: #222222;
}

a.social_icon i{
    color: #222222;
    background: #ffffff;
    border:3px solid #222222;
}
a.social_icon:hover i{
    color: inherit;
    background: #222222;
    border:3px solid #222222;
}

a.social_icon{
    color:#ffffff;
}

ul.gray_icons i{
    color: inherit;
    background: #f4f4f4;
    border:2px solid #cacaca;
}



.hi-icon-wrap {
    text-align: center;
    margin: 0 auto;
    padding: 0;
    padding-top:20px;
}

.hi-icon-wrap .highlight-icon:hover + .highlight_content > h4{
    color:#222222;
}

a.hi-icon.triangle{
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);

}

a.hi-icon {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    margin: 15px 30px;
    width: 90px;
    height: 90px;
    border-radius: 0%;


    text-align: center;
    position: relative;
    z-index: 1;
    color: #222222;
}

.hi-icon:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 0%;


    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.hi-icon.triangle:before{
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.hi-icon:before {

    speak: none;
    font-size: 48px;
    line-height: 90px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;


}

/* Effect 1 */
.hi-icon-effect-1 .hi-icon {
    background: #222222;
    opacity: 0.8;
    filter:alpha(opacity=80);
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
    color:#ffffff;
}

.hi-icon-effect-1 .hi-icon:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 4px #222222;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
    filter:alpha(opacity=0);
}

/* Effect 1a */
.no-touch .hi-icon-effect-1a .hi-icon:hover {
    background: #222222;
    opacity: 1;
    filter:alpha(opacity=100);
    color: #ffffff;
}

.no-touch .hi-icon-effect-1a .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter:alpha(opacity=100);
}

/* Effect 1b */
.no-touch .hi-icon-effect-1b .hi-icon:hover {
    background: #222222;
    opacity: 1;
    filter:alpha(opacity=100);
    color: #ffffff;
}

.hi-icon-effect-1b .hi-icon:after {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.no-touch .hi-icon-effect-1b .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter:alpha(opacity=100);
}

/* Effect 2 */
.hi-icon-effect-2 .hi-icon {
    color: #ffffff;
    box-shadow: 0 0 0 3px #222222;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.hi-icon-effect-2 .hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #222222;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 2a */
.no-touch .hi-icon-effect-2a .hi-icon:hover {
    color: #ffffff;
}

.no-touch .hi-icon-effect-2a .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
}

/* Effect 2b */
.no-touch .hi-icon-effect-2b .hi-icon:hover:after {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: -webkit-transform 0.4s, opacity 0.2s;
    -moz-transition: -moz-transform 0.4s, opacity 0.2s;
    transition: transform 0.4s, opacity 0.2s;
}

.no-touch .hi-icon-effect-2b a.hi-icon:hover {
    color: #EC0188;
}

/* Effect 3 */
.hi-icon-effect-3 .hi-icon {
    box-shadow: 0 0 0 4px #222222;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.hi-icon-effect-3 .hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #222222;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
    -moz-transition: -moz-transform 0.2s, opacity 0.3s;
    transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3a */
.hi-icon-effect-3a .hi-icon {
    color: #ffffff;
}

.no-touch .hi-icon-effect-3a a.hi-icon:hover {
    color: #EC0188;
}

.no-touch .hi-icon-effect-3a .hi-icon:hover:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
}

/* Effect 3b */
.hi-icon-effect-3b a.hi-icon {
    color: #EC0188;
}

.no-touch .hi-icon-effect-3b .hi-icon:hover {
    color: #ffffff;
}

.hi-icon-effect-3b .hi-icon:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
}

.no-touch .hi-icon-effect-3b .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 4 */
.hi-icon-effect-4 .hi-icon {
    width: 92px;
    height: 92px;
    box-shadow: 0 0 0 4px #222222;
}

.hi-icon-effect-4a .hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.hi-icon-effect-4 .hi-icon:before {
    line-height: 92px;
}

.hi-icon-effect-4 .hi-icon:after {
    top: -4px;
    left: -4px;
    padding: 0;
    z-index: 10;
    border: 4px dashed #222222;
}

.no-touch .hi-icon-effect-4 a.hi-icon:hover {
    box-shadow: 0 0 0 0 rgba(255,255,255,0);
    color: #EC0188;
}

/* Effect 4b */
.no-touch .hi-icon-effect-4b .hi-icon:hover {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.no-touch .hi-icon-effect-4b .hi-icon:hover:after {
    -webkit-animation: spinAround 9s linear infinite;
    -moz-animation: spinAround 9s linear infinite;
    animation: spinAround 9s linear infinite;
}

@-webkit-keyframes spinAround {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes spinAround {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg);
    }
}
@keyframes spinAround {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg);
    }
}

/* Effect 5 */
.hi-icon-effect-5 .hi-icon {
    box-shadow: 0 0 0 4px #222222;
    color: #EC0188;
    -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.hi-icon-effect-5 .hi-icon:after {
    display: none;
}

.no-touch .hi-icon-effect-5 .hi-icon:hover {
    background: #222222;
    color: #ffffff;
    box-shadow: 0 0 0 8px rgba(255,255,255,0.3);
}

.no-touch .hi-icon-effect-5a .hi-icon:hover:before {
    -webkit-animation: toRightFromLeft 0.3s forwards;
    -moz-animation: toRightFromLeft 0.3s forwards;
    animation: toRightFromLeft 0.3s forwards;
}

@-webkit-keyframes toRightFromLeft {
    49% {
        -webkit-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toRightFromLeft {
    49% {
        -moz-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toRightFromLeft {
    49% {
        transform: translate(100%);
    }
    50% {
        opacity: 0;
        transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5b .hi-icon:hover:before {
    -webkit-animation: toLeftFromRight 0.3s forwards;
    -moz-animation: toLeftFromRight 0.3s forwards;
    animation: toLeftFromRight 0.3s forwards;
}

@-webkit-keyframes toLeftFromRight {
    49% {
        -webkit-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toLeftFromRight {
    49% {
        -moz-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toLeftFromRight {
    49% {
        transform: translate(-100%);
    }
    50% {
        opacity: 0;
        transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5c .hi-icon:hover:before {
    -webkit-animation: toTopFromBottom 0.3s forwards;
    -moz-animation: toTopFromBottom 0.3s forwards;
    animation: toTopFromBottom 0.3s forwards;
}

@-webkit-keyframes toTopFromBottom {
    49% {
        -webkit-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toTopFromBottom {
    49% {
        -moz-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toTopFromBottom {
    49% {
        transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5d .hi-icon:hover:before {
    -webkit-animation: toBottomFromTop 0.3s forwards;
    -moz-animation: toBottomFromTop 0.3s forwards;
    animation: toBottomFromTop 0.3s forwards;
}

@-webkit-keyframes toBottomFromTop {
    49% {
        -webkit-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toBottomFromTop {
    49% {
        -moz-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toBottomFromTop {
    49% {
        transform: translateY(100%);
    }
    50% {
        opacity: 0;
        transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}

/* Effect 6 */
.hi-icon-effect-6 .hi-icon {
    box-shadow: 0 0 0 4px #222222;
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
    color: #EC0188;
}

.no-touch .hi-icon-effect-6 .hi-icon:hover {
    background: #222222;
    color: #ffffff;
}

.no-touch .hi-icon-effect-6 .hi-icon:hover:before {
    -webkit-animation: spinAround 2s linear infinite;
    -moz-animation: spinAround 2s linear infinite;
    animation: spinAround 2s linear infinite;
}

/* Effect 7 */
.hi-icon-effect-7 .hi-icon {
    box-shadow: 0 0 0 4px #222222;
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.no-touch .hi-icon-effect-7 a.hi-icon:hover {
    color: #EC0188;
}

.hi-icon-effect-7 .hi-icon:after {
    top: -8px;
    left: -8px;
    padding: 8px;
    z-index: -1;
    opacity: 0;
}

/* Effect 7a */
.hi-icon-effect-7a .hi-icon:after {
    box-shadow: 0 0 0 #222222;
    -webkit-transition: opacity 0.2s, box-shadow 0.2s;
    -moz-transition: opacity 0.2s, box-shadow 0.2s;
    transition: opacity 0.2s, box-shadow 0.2s;
}

.no-touch .hi-icon-effect-7a .hi-icon:hover:after {
    opacity: 1;
    box-shadow: 3px 3px 0 #222222;
}

.hi-icon-effect-7a .hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0.7;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

.no-touch .hi-icon-effect-7a .hi-icon:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 7b */
.hi-icon-effect-7b .hi-icon:after {
    box-shadow: 3px 3px #222222;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
    -moz-transition: opacity 0.2s, -moz-transform 0.2s;
    transition: opacity 0.2s, transform 0.2s;
}

.no-touch .hi-icon-effect-7b .hi-icon:hover:after {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.hi-icon-effect-7b .hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0.7;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

.no-touch .hi-icon-effect-7b .hi-icon:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 8 */
.hi-icon-effect-8 .hi-icon {
    background: rgba(255,255,255,0.1);
    -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
    -moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
    transition: transform ease-out 0.1s, background 0.2s;
}

.hi-icon-effect-8 .hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    z-index: -1;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.1);
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}

.no-touch .hi-icon-effect-8 a.hi-icon:hover {
    background: rgba(255,255,255,0.05);
    -webkit-transform: scale(0.93);
    -moz-transform: scale(0.93);
    -ms-transform: scale(0.93);
    transform: scale(0.93);
    color: #222222;
}

.hi-icon-effect-8 .hi-icon:hover:after {
    -webkit-animation: sonarEffect 1.3s ease-out 75ms;
    -moz-animation: sonarEffect 1.3s ease-out 75ms;
    animation: sonarEffect 1.3s ease-out 75ms;
}

@-webkit-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        -webkit-transform: scale(1.5);
        opacity: 0;
    }
}
@-moz-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        -moz-transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        transform: scale(1.5);
        opacity: 0;
    }
}

/* Effect 9 */
.hi-icon-effect-9 .hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.hi-icon-effect-9 .hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    box-shadow: 0 0 0 3px #222222;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 9a */
.no-touch .hi-icon-effect-9a .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
    opacity: 0.5;
}

.no-touch .hi-icon-effect-9a a.hi-icon:hover {
    box-shadow: 0 0 0 10px #222222;

}
.no-touch .hi-icon-effect-9a a.hi-icon:hover{
    color: #EC0188;
}

/* Effect 9b */
.no-touch .hi-icon-effect-9b .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
}

.no-touch .hi-icon-effect-9b a.hi-icon:hover {
    box-shadow: 0 0 0 10px rgba(255,255,255,0.4);
    color: #EC0188;
}


/*ICON EFFECTS CONTRAST*/


.contrast .hi-icon-wrap {
    text-align: center;
    margin: 0 auto;
    padding: 10px 0 30px;
}

.contrast .hi-icon {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    margin: 15px 30px;
    width: 90px;
    height: 90px;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #ffffff;
}

.contrast .hi-icon:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.contrast .hi-icon:before {

    speak: none;
    font-size: 48px;
    line-height: 90px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}

/* Effect 1 */
.contrast .hi-icon-effect-1 .hi-icon {
    background: rgba(255,255,255,0.1);
    opacity: 0.8;
    filter:alpha(opacity=80);
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.contrast .hi-icon-effect-1 .hi-icon:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 4px #ffffff;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
    filter:alpha(opacity=0);
}

/* Effect 1a */
.no-touch .contrast .hi-icon-effect-1a a.hi-icon:hover {
    background: #ffffff;
    opacity: 1;
    filter:alpha(opacity=100);

}
.no-touch .contrast .hi-icon-effect-1a a.hi-icon:hover{
    color: #222222;
}

.no-touch .contrast  .hi-icon-effect-1a .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter:alpha(opacity=100);
}

/* Effect 1b */
.no-touch .contrast .hi-icon-effect-1b a.hi-icon:hover {
    background: #ffffff;
    opacity: 1;
    filter:alpha(opacity=100);

}

.no-touch .contrast .hi-icon-effect-1b a.hi-icon:hover{
    color: #222222;
}

.contrast .hi-icon-effect-1b .hi-icon:after {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.no-touch .contrast .hi-icon-effect-1b .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter:alpha(opacity=100);
}

/* Effect 2 */
.contrast .hi-icon-effect-2 a.hi-icon {

    box-shadow: 0 0 0 3px #ffffff;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}
.contrast .hi-icon-effect-2 a.hi-icon{
    color: #222222;
}

.contrast .hi-icon-effect-2 .hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #ffffff;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 2a */
.no-touch .contrast .hi-icon-effect-2a a.hi-icon:hover {
    color: #222222;
}

.no-touch .contrast .hi-icon-effect-2a .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
}

/* Effect 2b */
.no-touch .contrast .hi-icon-effect-2b .hi-icon:hover:after {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: -webkit-transform 0.4s, opacity 0.2s;
    -moz-transition: -moz-transform 0.4s, opacity 0.2s;
    transition: transform 0.4s, opacity 0.2s;
}

.no-touch .contrast .hi-icon-effect-2b a.hi-icon:hover {
    color: #222222;
}

/* Effect 3 */
.contrast .hi-icon-effect-3 .hi-icon {
    box-shadow: 0 0 0 4px #ffffff;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.contrast .hi-icon-effect-3 .hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #ffffff;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
    -moz-transition: -moz-transform 0.2s, opacity 0.3s;
    transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3a */
.contrast .hi-icon-effect-3a a.hi-icon {
    color: #222222;
}

.no-touch .contrast .hi-icon-effect-3a .hi-icon:hover {
    color: #ffffff;
}

.no-touch .contrast .hi-icon-effect-3a .hi-icon:hover:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
}

/* Effect 3b */
.contrast .hi-icon-effect-3b .hi-icon {
    color: #ffffff;
}

.no-touch .contrast .hi-icon-effect-3b a.hi-icon:hover {
    color: #222222;
}

.contrast .hi-icon-effect-3b .hi-icon:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
}

.no-touch .contrast .hi-icon-effect-3b .hi-icon:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 4 */
.contrast .hi-icon-effect-4 .hi-icon {
    width: 92px;
    height: 92px;
    box-shadow: 0 0 0 4px #ffffff;
}

.contrast .hi-icon-effect-4a .hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.contrast .hi-icon-effect-4 .hi-icon:before {
    line-height: 92px;
}

.contrast .hi-icon-effect-4 .hi-icon:after {
    top: -4px;
    left: -4px;
    padding: 0;
    z-index: 10;
    border: 4px dashed #ffffff;
}

.no-touch .contrast .hi-icon-effect-4 .hi-icon:hover {
    box-shadow: 0 0 0 0 rgba(255,255,255,0);
    color: #ffffff;
}

/* Effect 4b */
.no-touch .contrast .hi-icon-effect-4b .hi-icon:hover {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.no-touch .contrast .hi-icon-effect-4b .hi-icon:hover:after {
    -webkit-animation: spinAround 9s linear infinite;
    -moz-animation: spinAround 9s linear infinite;
    animation: spinAround 9s linear infinite;
}

@-webkit-keyframes spinAround {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes spinAround {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg);
    }
}
@keyframes spinAround {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg);
    }
}

/* Effect 5 */
.contrast .hi-icon-effect-5 .hi-icon {
    box-shadow: 0 0 0 4px #ffffff;
    overflow: hidden;
    -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.contrast .hi-icon-effect-5 .hi-icon:after {
    display: none;
}

.no-touch .contrast .hi-icon-effect-5 a.hi-icon:hover {
    background: #ffffff;
    box-shadow: 0 0 0 8px rgba(255,255,255,0.3);
}

.no-touch .contrast .hi-icon-effect-5 a.hi-icon:hover{
    color: #222222;
}

.no-touch .contrast .hi-icon-effect-5a .hi-icon:hover:before {
    -webkit-animation: toRightFromLeft 0.3s forwards;
    -moz-animation: toRightFromLeft 0.3s forwards;
    animation: toRightFromLeft 0.3s forwards;
}

@-webkit-keyframes toRightFromLeft {
    49% {
        -webkit-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toRightFromLeft {
    49% {
        -moz-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toRightFromLeft {
    49% {
        transform: translate(100%);
    }
    50% {
        opacity: 0;
        transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .contrast .hi-icon-effect-5b .hi-icon:hover:before {
    -webkit-animation: toLeftFromRight 0.3s forwards;
    -moz-animation: toLeftFromRight 0.3s forwards;
    animation: toLeftFromRight 0.3s forwards;
}

@-webkit-keyframes toLeftFromRight {
    49% {
        -webkit-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toLeftFromRight {
    49% {
        -moz-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toLeftFromRight {
    49% {
        transform: translate(-100%);
    }
    50% {
        opacity: 0;
        transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .contrast .hi-icon-effect-5c .hi-icon:hover:before {
    -webkit-animation: toTopFromBottom 0.3s forwards;
    -moz-animation: toTopFromBottom 0.3s forwards;
    animation: toTopFromBottom 0.3s forwards;
}

@-webkit-keyframes toTopFromBottom {
    49% {
        -webkit-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toTopFromBottom {
    49% {
        -moz-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toTopFromBottom {
    49% {
        transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .contrast .hi-icon-effect-5d .hi-icon:hover:before {
    -webkit-animation: toBottomFromTop 0.3s forwards;
    -moz-animation: toBottomFromTop 0.3s forwards;
    animation: toBottomFromTop 0.3s forwards;
}

@-webkit-keyframes toBottomFromTop {
    49% {
        -webkit-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toBottomFromTop {
    49% {
        -moz-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toBottomFromTop {
    49% {
        transform: translateY(100%);
    }
    50% {
        opacity: 0;
        transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}

/* Effect 6 */
.contrast .hi-icon-effect-6 .hi-icon {
    box-shadow: 0 0 0 4px #ffffff;
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.no-touch .contrast .hi-icon-effect-6 a.hi-icon:hover {
    background: #ffffff;
}

.no-touch .contrast .hi-icon-effect-6 a.hi-icon:hover{
    color: #222222;
}

.no-touch .contrast .hi-icon-effect-6 .hi-icon:hover:before {
    -webkit-animation: spinAround 2s linear infinite;
    -moz-animation: spinAround 2s linear infinite;
    animation: spinAround 2s linear infinite;
}

/* Effect 7 */
.contrast .hi-icon-effect-7 .hi-icon {
    box-shadow: 0 0 0 4px #ffffff;
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.no-touch .contrast .hi-icon-effect-7 .hi-icon:hover {
    color: #ffffff;
}

.contrast .hi-icon-effect-7 .hi-icon:after {
    top: -8px;
    left: -8px;
    padding: 8px;
    z-index: -1;
    opacity: 0;
}

/* Effect 7a */
.contrast .hi-icon-effect-7a .hi-icon:after {
    box-shadow: 0 0 0 #ffffff;
    -webkit-transition: opacity 0.2s, box-shadow 0.2s;
    -moz-transition: opacity 0.2s, box-shadow 0.2s;
    transition: opacity 0.2s, box-shadow 0.2s;
}

.no-touch .contrast .hi-icon-effect-7a .hi-icon:hover:after {
    opacity: 1;
    box-shadow: 3px 3px 0 #ffffff;
}

.contrast .hi-icon-effect-7a .hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0.7;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

.no-touch .contrast .hi-icon-effect-7a .hi-icon:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 7b */
.contrast .hi-icon-effect-7b .hi-icon:after {
    box-shadow: 3px 3px #ffffff;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
    -moz-transition: opacity 0.2s, -moz-transform 0.2s;
    transition: opacity 0.2s, transform 0.2s;
}

.no-touch .contrast .hi-icon-effect-7b .hi-icon:hover:after {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.contrast .hi-icon-effect-7b .hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0.7;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

.no-touch .contrast .hi-icon-effect-7b .hi-icon:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 8 */
.contrast .hi-icon-effect-8 .hi-icon {
    background: rgba(255,255,255,0.1);
    -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
    -moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
    transition: transform ease-out 0.1s, background 0.2s;
}

.contrast .hi-icon-effect-8 .hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    z-index: -1;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.1);
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}

.no-touch .contrast .hi-icon-effect-8 .hi-icon:hover {
    background: rgba(255,255,255,0.05);
    -webkit-transform: scale(0.93);
    -moz-transform: scale(0.93);
    -ms-transform: scale(0.93);
    transform: scale(0.93);
    color: #ffffff;
}

.contrast .hi-icon-effect-8 .hi-icon:hover:after {
    -webkit-animation: sonarEffect 1.3s ease-out 75ms;
    -moz-animation: sonarEffect 1.3s ease-out 75ms;
    animation: sonarEffect 1.3s ease-out 75ms;
}

@-webkit-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        -webkit-transform: scale(1.5);
        opacity: 0;
    }
}
@-moz-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        -moz-transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #222222, 0 0 0 10px rgba(255,255,255,0.5);
        transform: scale(1.5);
        opacity: 0;
    }
}

/* Effect 9 */
.contrast .hi-icon-effect-9 .hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.contrast .hi-icon-effect-9 .hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    box-shadow: 0 0 0 3px #ffffff;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 9a */
.no-touch .contrast .hi-icon-effect-9a .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
    opacity: 0.5;
}

.no-touch .contrast .hi-icon-effect-9a .hi-icon:hover {
    box-shadow: 0 0 0 10px #ffffff;
    color: #ffffff;
}

/* Effect 9b */
.no-touch .contrast .hi-icon-effect-9b .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
}

.no-touch .contrast .hi-icon-effect-9b .hi-icon:hover {
    box-shadow: 0 0 0 10px rgba(255,255,255,0.4);
    color: #ffffff;
}

.spacer_crosshair:before,.spacer_crosshair:after{
    border-top: 2px solid #222222;
    border-bottom: 2px solid #222222;
}

.spacer_crosshair i{
    color:#EC0188;
    font-weight: bold;
}


/*
***************
--- HERO REGION ---
***************
*/

#hero .flexslider .flex-direction-nav a{

}

#hero .button{
    background: transparent;
    color: #ffffff;
    border:2px solid #ffffff;
    opacity: 0.7;
    filter:alpha(opacity=70);
    font-weight: bold;
}

#hero .button:hover{
    opacity: 1;
    filter:alpha(opacity=100);
}


/*
***************
--- REVOLUTION SLIDER ---
***************
*/

.tp-caption{
    color:white;
}

.tp-caption a.tp-button{
    border:3px solid #ffffff;
    color:#ffffff;
}

.tp-caption a.hi-icon{
    border:3px solid #ffffff;
    color:#ffffff;
    opacity:0.7;
}

.tp-caption a.hi-icon:hover{
    color:#ffffff;
    opacity: 1;
}

a.btn_white{
    border:3px solid #ffffff;
    color:#ffffff;
}

.tp-caption a.tp-button:hover{
    border:3px solid #EC0188;
    background: #EC0188;
    color:#ffffff;
}

a.btn_white:hover{
    border:3px solid #EC0188;
    background: #EC0188;
    color:#ffffff;
}

.tp-caption.spacer_caption{
    width:50%;
    margin:auto;
}

.tp-caption div.space{
    max-width:80% !important;
    margin:auto !important;
}

.tp-caption .spacer_crosshair:before,.tp-caption .spacer_crosshair:after{
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}

.tp-caption .spacer_crosshair i{
    color:#ffffff;
    font-weight: bold;
}

.tp-loader{
    background: #EC0188;
}

/*
***************
--- HIGHLIGHT AREA ---
***************
*/
.highlight-icon{
    margin-bottom: 40px;
}

/*.highlight-icon a{

    color: #ffffff;
    background: #222222;
}*/
/*
.highlight-icon a:hover{
    background-color: #232323;
}*/


/*
***************
--- QUOTES ---
***************
*/
.quote_region h2.block-title{
    color:#ffffff;
}

.quote_region{
   /* background: #222222;*/
    color: #ffffff;
}

.quote_region .spacer_crosshair:before,.quote_region .spacer_crosshair:after{
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}

.quote_region .space,.quote_region .spacer_crosshair,.quote_region i{
    color:#ffffff;
}

/*
***************
--- TWEETS REGION ---
***************
*/

.tweets_region .fa-twitter{

}

.tweets_region .flexslider .views-field-web-intents a{
    background: #222222;
    color: #ffffff;
}
.tweets_region .flexslider .field-content a{
    color:#ffffff;
    text-decoration: underline;
}

.tweets_region .spacer_crosshair:before,.tweets_region .spacer_crosshair:after{
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}

.tweets_region .space,.tweets_region .spacer_crosshair,.tweets_region i{
    color:#ffffff;
}

/*
***************
--- PORTFOLIO ---
***************
*/

.da-thumbs li a>div span.category{
    color:#ffffff;
}

.da-thumbs li a>div {
    background: rgba(0,0,0,0.4);
}

.view-id-work.view-display-id-page_3 .item a>div {
    background: rgba(0,0,0,0.4);

}

.view-work .spacer_crosshair:before,.view-work .spacer_crosshair:after{
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}

/*FILTERS*/

.view-filter-controls li.filter{
    border: 3px solid #222222;
    background: #ffffff;

    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
}


.view-filter-controls li:hover{
    border: 3px solid #222222;
    color: #ffffff;
    background: #222222;
}

/*
******************************
--- PORTFOLIO DETAIL PAGE ---
******************************
*/

.node-project .project_button a{

}

.portolio_detail_holder a.close{
    color: #222222;
}

.tagcloud a {
    background: transparent;
    border:3px solid #222222;
}

.tagcloud a:hover {
    background: #222222;
    color: #ffffff;
}

.categories div.views-row{
    color: #222222;
}

/*
**********************************
--- FOOTER REGION ---
**********************************
*/

.footer{
    background: #222222;
    color:#ffffff;
}

.footer h4{
    color:white;
}

.footer a.social_icon:hover i{
    background: #EC0188;
    border:3px solid #222222;
    color:#ffffff;
}

/*
******************************
--- BLOGS PAGE ---
******************************
*/

.node-blog .blog_post_type{
    background: #222222;
}

.node-blog .blog_post_date{
    background: #222222;
    color: #ffffff;
}

.node-blog .post_blog_info{
    color:#222222;
}

.node-blog h2.comment-form{
    color:#222222;
}
/*
**********************************
--- OUR TEAM ---
**********************************
*/

.view-our-team .views-row .row-inner{
    margin:20px;
    border: 4px solid #222222;
    color:#222222;
}

.view-our-team .views-row .row-inner:hover{
    background: #222222;
    color:#ffffff;
}

.view-our-team .views-row .social_member a{
    border: 3px solid #222222;

    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.view-our-team .views-row .social_member a:hover{
    background: #EC0188;
    border:3px solid #EC0188;
}
.view-our-team .views-row .social_member a:hover i{
    color:#ffffff;
}

/*
**********************************
--- BEAN BLOCKS ---
**********************************
*/
.bean-parallax-block h2,.bean-parallax-block h2.block-title{
    color:#ffffff;
}

.bean-parallax-block .space, .bean-parallax-block .spacer_crosshair, .bean-parallax-block i{
    color: #ffffff;
}

.bean-parallax-block .spacer_crosshair:before, .bean-parallax-block .spacer_crosshair:after {
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}
/*
**********************************
--- PROGRESS EFFECT ---
**********************************
*/

.progress .fore .bar {
    background: #EC0188;
}

.progress .fore .name{
    color:#222222;
}

/*
**********************************
--- COUNT EFFECT ---
**********************************
*/

.wi-count .number {
  color:#222222;
}


/*
**********************************
--- PRICING TABLE ---
**********************************
*/


table.table_pricing .pricing_row_heading td{
    background: #222222;
    color: #ffffff;
}

table.table_pricing {
    color: #222222;
}

table.table_pricing td {
    background: #f4f4f4;
}


table.table_pricing.premium .pricing_row_heading td{
    background: #EC0188;
}
table.table_pricing.premium .btn-primary{
    background: #EC0188;
    border:3px solid #EC0188;
}

table.table_pricing.premium .btn-primary:hover{
    background: #ffffff;
    color:#EC0188;
    border:3px solid #EC0188;
}

table.table_pricing.premium .table_pricing_price{
    color:#EC0188;
}




/*TABLET MODE*/
@media (max-width: 767px) {

    .node-project .project_info h3,.node-project .project_info h4{

        border-top: 1px solid #ededed;
        padding-top: 15px;
    }

    .container>.navbar-header, .container>.navbar-collapse.navbar-collapse{
        background: #222222;
    }

    .navbar-default .navbar-nav >li a:hover{
        background-color: #ffffff !important;
        color:#222222 !important;
    }

    .navbar-default .navbar-toggle .icon-bar{
        background-color: #ffffff;
    }

    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
        background-color: #ffffff;

    }

    .navbar-default .navbar-toggle:hover .icon-bar,.navbar-default .navbar-toggle:focus .icon-bar{
        background: #222222;
    }


}

/* Mobile display. */
@media only screen and (max-width:500px) {

}