/*
 Theme Name:     Customizr Child
 Theme URI:
 Description:    Customizr Child Theme
 Author:             Rungo
 Author URI:
 Template:         customizr
 Version:            1.0.0
 License:            GNU General Public License v2 or later
 License URI:    http://www.gnu.org/licenses/gpl-2.0.html
 Tags:
 Text Domain:    customizr-child
*/

body{
text-align: justify;
text-justify:inter-ideograph;
font-size:15px;
font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#main-wrapper {
    margin-top: 0;
}

.event_list ul{
    margin: 0;
    padding: 10px;
}
.event_list li{
    list-style: none;
    margin-bottom: 10px;
    clear:both;
    height:90px
}
.event_list img{
    float: left;
    margin-right: 5px
}
.event_slide h2{
    font-size: 24px;
}
.separator_text_title{
    font-size:21px;
}

@media only screen and (max-width: 768px){
    li.product-category{ width:25%; float:left}
    li.product-category a img{
        max-height:120px
    }
    .vc_row {
        margin-left: -5px !important;
        margin-right: -5px !important;
    }
}

footer#footer h3{
        text-align: left;

}

footer ul.menu{
    text-align: left;
    margin-bottom: 20px;
}

footer ul.menu li{
    border-bottom: 1px solid #666;
    margin-left: 20px;
}

@media (max-width: 640px){
    footer#footer h3{
        margin-left: 15px;
    }

    footer ul.menu li{
        margin-left: 40px;
    }

    footer#footer #footer_three{
        margin-top: 30px;
    }
}

.lvca-tab-title{
    font-size:1.5em !important;
}
span.wpcf7-list-item { display: block; }


/* my-nav-menu-search menu item created in functions.php. Move it way over to the right */
.navbar .nav .my-nav-menu-search {
        float: right;
}
.navbar .nav {
        width: 100%;
}
.my-nav-menu-search .search-form {
        position: relative;
        margin: 0;
}
/*Stop the display of the Search button*/
.my-nav-menu-search .search-submit {
        display: none;
}
/* The "Search for" text is needed for screen readers, but we move it off screen, so we won't see it */
.my-nav-menu-search .search-form .screen-reader-text {
        position: absolute;
        left: -9999px;
        overflow: hidden;
}

/* Style the search input textbox */
.my-nav-menu-search .search-field {
        background: transparent;
        border: none;
        -webkit-box-shadow:        none;
        -moz-box-shadow:             none;
        box-shadow:                        none;
        cursor: pointer;
        height: 26px;
        margin: 2px 0 2px 0;
        padding: 0 0 0 36px;
        position: relative;
        -webkit-transition: width 400ms ease;
        -moz-transition:        width 400ms ease;
        -o-transition:            width 400ms ease;
        transition:                 width 400ms ease;
        width: 0px;
}

/* Expand the search box when you click it */
.my-nav-menu-search .search-field:active,
.my-nav-menu-search .search-field:focus {
        color: #5a5a5a;
        /* change the colour above if you are working with a dark navbar background */
        border: 2px solid #c3c0ab;
        cursor: text;
        outline: 0;
        width: 70px;
        -webkit-box-shadow: none;
        -moz-box-shadow:        none;
        box-shadow:                 none;
        margin: 0;
}

/* Add a magnifying glass background */
.my-nav-menu-search .search-form:before {
        font-family: 'FontAwesome';
        content: '\f002';
        position: absolute; /* this is the key to put it visually inside the search field */
        font-size: 19px;
        font-weight: normal;
        top: 5px; /* tune this vertical alignment inside the search field, as needed */
        left: 5px; /* tune this horizontal alignment inside the search field, as needed */
}

/* Reset nav width and search floating for mobile menu */
@media (max-width: 979px){
        .navbar .nav .my-nav-menu-search {
                float: left;
        }
        .navbar .nav {
                width: auto;
        }
}

.overflow_hidden{
        overflow: hidden;
}


/* START OF Change Post/Page Icon & Title */

/* Remove Page/Post Icon/Title/Comment Bubble */
.page .entry-header {
display:        none;
}
/* END OF Change Post/Page Icon & Title */


.announcement-banner-image{
        width: 50% !important;
        max-width: 200px !important;
}


.eo-past-event{
        background-color: #666666 !important;
        border-color: #666666 !important;
}


.eo-eventlist-date{
    background-color: #008ae6;
    width: 100px;
    height: 100px;
    float: left;
    margin-right: 20px;
}

.eo-eventlist-day{
    float: left;
    font-size: 5em;
    color: #ffffff;
    width: 100%;
    text-align: center;
    padding-top:15px;
    line-height: 60px
}

.eo-eventlist-year{
    width:100%;
    text-align:center;
    color: #FFFFFF;
    float:left;
    margin-top:5px;
}

.eo-eventlist-details{
    margin-left: 120px;
}

ul.eo-events{
    margin:0 !important;
    list-style: none;
}

ul.eo-events li{
    margin-bottom:5em;
}

@media (max-width: 767px){
    .eo-eventlist-date{
        background-color: #008ae6;
        width: 60px;
        height: 60px;
        float: left;
        margin-right: 10px;
    }
    .eo-eventlist-day{
        float: left;
        font-size: 3em;
        color: #ffffff;
        width: 100%;
        text-align: center;
        padding-top:5px;
        line-height: 30px
    }

    .eo-eventlist-details{
        margin-left: 70px;
    }
}

@media (max-width: 639px){
    .eo-eventlist-date{
        float: none;
        width: 150px;
        height: 30px;
    }

    .eo-eventlist-date p{
        float:left;
    }
    .eo-eventlist-day{
        float: left;
        font-size: 1.5em;
        color: #ffffff;
        width: 50px;
        text-align: center;
        padding-top:5px;
        line-height: 20px
    }
    .eo-eventlist-details{
        wdith:100%;
        margin:0;
        clear:both;
    }
}

.more-btn{
    overflow: auto;
}

.more-btn a{
    color:#ffffff;
    border-color: #5AA1E3;
    background-color: #5AA1E3;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    float: right;
    clear: both;
}

.more-btn a:hover{
    border-color: #4092df;
    background-color: #4092df;
}

.lvca-accordion.lvca-style2 .lvca-panel.lvca-active .lvca-panel-title,
.lvca-accordion.lvca-style2 .lvca-panel .lvca-panel-title:before {
    background: #008ae6 !important;
}

.lvca-accordion.lvca-style2 .lvca-panel.lvca-active .lvca-panel-title {
        border-color: #004d80;
}

.container-content {
        position: absolute;
        width: 100%;
        top: 5px;
        left: 50%;
        text-align: center;
        max-width: 80%;
        transform: translateX(-50%);
        margin: 72px 0 0;
        text-shadow: 0 0 65px #000;
}
.main-2 .container-content {
        top: 50%;
}
.main-3 .container-content {
        top: 40%;
}
.container-content p{
        font-size: 25px;
        line-height: 30px;
        color: #FFFFFF;
}
.main-2 .container-content p{
        color: #333;
}
.container-content .title{
        font-size: 42px;
        line-height: 60px;
}
.get-details{
    color: #FFF;
    font-size: 30px;
    line-height: 40px;
    text-align: center;
}
.support-service{
        padding: 3em 0;
}

@media (min-width:1024px){
    .container-content {
        max-width: 850px;
    }
}
@media (min-width:1200px){
    .support-service{
        padding: 6em 0;
    }
    .container-content {
        max-width: 970px;
    }
}


@media (max-width:640px){
    .main-1 .container-content,
    .main-2 .container-content,
    .product-2 .container-content {
        position: inherit;
        max-width: 100%;
        margin: 0 0 10px;
        transform: translateX(0%);
        text-shadow: none;
    }
    .container-content p{
        font-size: 16px;
        line-height: 22px;
        color: #000000;
    }
    .container-content .title{
        font-size: 20px;
        line-height: 25px;
    }
    .get-details{
        font-size: 20px;
        line-height: 25px;
    }
    .support-service{
        padding: 2em 0 !important;
    }
    .product-2 .container-background,
    .main-1 .container-background,
    .main-2 .container-background{
        position: relative;
        background-size: cover;
        background-position: 20% center;
        overflow: hidden;
        height:300px;
    }

    .product-2 .container-background{
        background-image: url(http://www.threed-printing.com/wp-content/uploads/2017/08/2017-08-01_150206.png);
    }
    .main-1 .container-background{
        background-image: url(http://www.threed-printing.com/wp-content/uploads/2017/08/HP_Announcement_Still_02.jpg);
    }
    .main-2 .container-background{
        background-image: url(http://www.threed-printing.com/wp-content/uploads/2017/08/38971_HP_Gear02_Panel3_R3.jpg);
    }
    .container-background .product-video,
    .container-background video{
        display: none;
    }
}

._3D-materials{
    height:600px;
}

.vc_pagination-trigger-large .vc_pagination-trigger{
    height: 20px !important;
    width: 20px !important;
}
.row-performance{
    height:400px;
    background-size: 1200px;
}

._3D-materials-applications .container-background-animated {
        background-image: url(/cn/zh/images/i/printers/3d-printers/bg-section-materials-applications-desktop.gif);
        background-position: center bottom;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        width: 100%;
        height: 100%;
        bottom: 0;
        max-height: 66%;
}

.application_bg-animated_container{
    height:800px;
    background-image: url(http://www.threed-printing.com/wp-content/uploads/2017/07/bg-section-materials-applications-desktop.gif?id=189) !important;
    background-position: center bottom;
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        width: 100%;
        height: 100%;
        bottom: 0;
        max-height: 66%;
}

@media (max-width: 640px){
    .application_3Dmaterials_container{
        height:550px;
    }
}


.icon{
    margin-bottom:0 !important;
}
.tab-1, .tab-2, .tab-3{
    text-align: center;
}
.tab-icon{
    width:100%;
    text-align: center;
}

.tab-1 .icon {
        background-position: -125px 0;
        width: 101px;
        height: 142px;
        display: inline-block;
}
.tab-2 .icon {
        background-position: -125px -150px;
        width: 107px;
        height: 129px;
        display: inline-block;
        margin: 6px 0 7px !important;
}
.tab-3 .icon {
        background-position: -125px -300px;
        width: 106px;
        height: 107px;
        display: inline-block;
        margin: 17px 0 18px !important;
}


.block-postdate{
    color: #FFFFFF;
    font-size: 17px;
    width: 130px;
    float:left;
    margin-right: 20px;
    text-align:center;
}

.postlist-title{
    margin-top:-1em;
}
.postlist-excerpt{
    font-size: 1.3em;
}


footer#footer a, footer#footer p{
        font-size: 16px;
        line-height: 25px;
}

@media only screen and (min-width: 1000px)


.hotspots .hotspot-list {
        -webkit-tap-highlight-color: rgba(255,0,0,0);
        margin: 0 0 38px;
        padding: 0;
        counter-reset: section;
        list-style: none;
}



.hotspots{margin:0 auto;padding:0 1.25rem;position:relative;overflow:auto;background-color: #0096d6;}

@media only screen and (min-width:1000px){
    .hotspots .hotspot-list{max-width:1385px;position:absolute;top:0;left:50%;height:100%;margin:0;padding:0}
    .hotspot-list .vc_toggle_icon{background-color: #0096f6 !important;}
    .hotspot-list .vc_toggle_content{background-color: #FFF;width:300px;padding:15px !important;position: absolute;z-index:99;border: 2px solid #0076c6;}
    .hotspot-en .hotspot-list .vc_toggle_content{width:350px !important;}
    #hotspot-10 .vc_toggle_content{left:-300px !important; top:-50px;}
    .hotspot-en #hotspot-10 .vc_toggle_content{left:-350px !important; top:-50px;}
    .hotspot-en #hotspot-9 .vc_toggle_content{left:-350px !important; top:-80px;}
}


.hotspots .hotspot{padding:0 0 0 2.5rem;margin:24px 0 0;position:relative;font-family:HPSimplified,sans-serif;font-size:14px;line-height:20px}


@media only screen and (max-width:999px){
    .hotspots {background-color: #FFF !important;}
}


@media only screen and (min-width:1000px){
    .hotspots #hotspot-1{top:40.4%;left:10.7%}
    .hotspots #hotspot-2{top:42.8%;left:15.0%}
    .hotspots #hotspot-3{top:47.7%;left:23.5%}
    .hotspots #hotspot-4{top:52.3%;left:8.5%}
    .hotspots #hotspot-5{top:8.2%;left:65.2%}
    .hotspots #hotspot-6{top:40.3%;left:55.4%}
    .hotspots #hotspot-7{top:49.2%;left:65.2%}
    .hotspots #hotspot-8{top:57.4%;left:57.2%}
    .hotspots #hotspot-9{top:74.4%;left:71.9%}
    .hotspots #hotspot-10{top:74.4%;left:93.0%}
    .hotspots .hotspot-heading{display:none !important}
}

/* For 500/300 series */
@media only screen and (max-width:480px){
    .page-fusion-500 .hero-content h2 {font-size: 26px !important; line-height: 1.3em !important;}
    .page-fusion-500 .hero-content p {font-size: 18px !important; line-height: 20px !important;}
}

@media only screen and (min-width:481px) and (max-width:1024px){
    .hero-content h2 {font-size: 36px; line-height: 42px;}
    .hero-content p {font-size: 20px; line-height: 25px;}
}

.hotspots53{margin:0 auto;padding:0 1.25rem;position:relative;overflow:auto;background-color: #FFF;}
.hero-warpper > div {padding:100px 0 !important}

@media only screen and (min-width:1025px){
    .hero-warpper > div {padding:180px 0 !important}
    .hero-content h2 {font-size: 48px; line-height: 55px;}
    .hero-content p {font-size: 22px; line-height: 25px;}
}



.hotspot53-img {margin:0 15px 0 0 !important;width:100%}
.hotspots53 .hotspot{padding:0 0 0 2.5rem;margin:24px 0 0;position:relative;font-family:HPSimplified,sans-serif;font-size:14px;line-height:20px}
.hotspots53 table {border: 0 !important; padding:0 !important;margin:0 !important}
.hotspots53 td {border: 0 !important; background-color: #FFF; padding:0 15px 0 0 !important;}

@media only screen and (min-width:1000px){
    .hotspots53 .hotspot53-list{max-width:1385px;position:absolute;top:0;left:50%;height:100%;margin:0;padding:0}
    .hotspot53-list .vc_toggle_icon{background-color: #0096f6 !important;z-index:98;}
    .hotspot53-list .vc_toggle_content{background-color: #FFF;width:550px;padding:0 10px 0 0 !important;position: absolute;z-index:99;border: 2px solid #0076c6;left: -250px;}
    .hotspot53-en .hotspot53-list .vc_toggle_content{width:550px !important;}
    #hotspot53-5 .vc_toggle_content{left:-400px !important;}
    #hotspot53-3 .vc_toggle_content, #hotspot53-4 .vc_toggle_content, #hotspot53-5 .vc_toggle_content {top:-305px !important;}

    .hotspots53 #hotspot53-1{top:20.2%;left:39.2%}
    .hotspots53 #hotspot53-2{top:29.8%;left:48.5%}
    .hotspots53 #hotspot53-3{top:56.7%;left:31.5%}
    .hotspots53 #hotspot53-4{top:59.3%;left:48.5%}
    .hotspots53 #hotspot53-5{top:51.2%;left:71.2%}
    .hotspots53 .hotspot-heading{display:none !important}

    .play-video-icon{top:300px;font-size: 150px;color:#FFF;opacity: 0.5;}
}

@media (max-width:640px){
    .main-3 .container-background{
        position: relative;
        background-size: cover;
        background-position: 45% center;
        overflow: hidden;
        height:300px;
    }

    .main-3 .container-background{
        background-image: url(http://www.threed-printing.com/wp-content/uploads/2018/03/img_desktop_static_video.jpg);
    }
    .container-background .product-video,
    .container-background video{
        display: none;
    }
}
