/*
    Document   : style.css
    Created on : 2014.12.13., 14:00:34
    Author     : Gege <gergo@infoartnet.hu>
*/

/*

* {
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;  
}

*/

@import url('js-ui.css');


/*----+ FONTS +-----*/

@font-face {
    font-family: 'Info';
    src: url('../fonts/infonor.eot');
    src: url('../fonts/infonor.eot?#iefix') format('embedded-opentype'),
        url('../fonts/infonor.ttf') format('truetype'),
        url('../fonts/infonor.svg#Info') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Info';
    src: url('../fonts/infonorobl.eot');
    src: url('../fonts/infonorobl.eot?#iefix') format('embedded-opentype'),
        url('../fonts/infonorobl.ttf') format('truetype'),
        url('../fonts/infonorobl.svg#Info') format('svg');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Info';
    src: url('../fonts/infobol.eot');
    src: url('../fonts/infobol.eot?#iefix') format('embedded-opentype'),
        url('../fonts/infobol.ttf') format('truetype'),
        url('../fonts/infobol.svg#Info') format('svg');
    font-weight: 600;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'Info';
        src: url('../fonts/infonor.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    @font-face {
        font-family: 'Info';
        src: url('../fonts/infonorobl.svg') format('svg');
        font-weight: normal;
        font-style: italic;
    }
    @font-face {
        font-family: 'Info';
        src: url('../fonts/infobol.svg') format('svg');
        font-weight: 600;
        font-style: normal;
    }
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/opensans-regular.eot');
    src: url('../fonts/opensans-regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/opensans-regular.ttf') format('truetype'),
        url('../fonts/opensans-regular.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans Light';
    src: url('../fonts/opensans-light.eot');
    src: url('../fonts/opensans-light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/opensans-light.ttf') format('truetype'),
        url('../fonts/opensans-light.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans Semibold';
    src: url('../fonts/opensans-semibold.eot');
    src: url('../fonts/opensans-semibold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/opensans-semibold.ttf') format('truetype'),
        url('../fonts/opensans-semibold.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans Bold';
    src: url('../fonts/opensans-bold.eot');
    src: url('../fonts/opensans-bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/opensans-bold.ttf') format('truetype'),
        url('../fonts/opensans-bold.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'Open Sans';
        src: url('../fonts/opensans-regular.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    @font-face {
        font-family: 'Open Sans Light';
        src: url('../fonts/opensans-light.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    @font-face {
        font-family: 'Open Sans Semibold';
        src: url('../fonts/opensans-semibold.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    @font-face {
        font-family: 'Open Sans bold';
        src: url('../fonts/opensans-bold.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }
}

/*----+ CSS RESET +-----*/

html, body, form, fieldset,
h1, h2, h3, h4, h5, h6, p, pre, samp, span,
blockquote, ul, li, ol, dl, dd, dt, address, div, abbr, dfn, acronym,
table, tr, th, td,
input, textarea {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    color: #111;
    line-height: 1.2;
}

h1, h2, h3, h4, h5, h6, p, pre, samp, span,
blockquote, /*ul, li, ol, dl,*/ dd, dt, address, abbr, dfn, acronym {
    cursor: text;
}

.clearfix:after {
    content: '.';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clear{
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix { display: inline-block }
*:active, object:focus, embed:focus, a { outline: none }
input::-moz-focus-inner { border: 0 }
fieldset { border: none }

input[type=text], input[type=password], input[type=email], select{
    font-size: 100%;
    outline-style: none;
    height: 36px;
    line-height: 36px;
}
input[type="text"], textarea, select, option {
    font-size: 16px;
}
a {
    text-decoration: none;
    color: #004B84;
}
input {
    /*padding-left: 4px;*/
}
img{
    border: none;
}
input[type="button"], input[type="submit"] {cursor: pointer;}
textarea { resize: none; }
.bug { border: 1px solid red; }
/*table tbody tr td, table tr th { padding: 2px; }*/

html { 
    /*overflow-x: hidden;*/
}

#site { overflow: hidden; }

/*----+ DEFAULT STYLING +-----*/

div.siwi{
    width: 960px;
    display: block;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
}

#header-whi div.siwi{
    width: 960px;
    display: block;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
    z-index: 999;
}

#header-top div.siwi{
    width: 960px;
    display: block;
    position: relative;
    box-sizing: border-box;
    margin: 7px auto 0 auto;
    position: relative;
    z-index: 999;
    background: rgba(255, 255, 255, 0.96);
}

.beloldal #header-top div.siwi{
    width: 960px;
    display: block;
    position: relative;
    box-sizing: border-box;
    margin: 7px auto 0 auto;
    position: relative;
    z-index: 999;
    background: rgba(255, 255, 255, 0.96);
}



/* header-------------------------------*/


.beloldal #header {/* height: 193px; */ background: #004B84;margin-bottom: 20px;}

div#header div#header-whi{
    padding: 20px 0;
    position: absolute;
    z-index:1000;
    left: 50%;
    margin-left: -480px;
}
.beloldal div#header div#header-whi{
    padding: 20px 0 20px;
    position: relative;
    left: 0;
    margin-left: 0;
}
div#header div#header-whi div.header-whi-login{
    display: block;
    /* width: 50%; */
    float: right;
    margin-top: 16px;
}
div#header div#header-whi div.header-whi-search{
    display: block;
    width: 225px;
    float: right;
    margin-left: 0;
}

div#header div#header-top{
    display: block;
    width: 100%;
    position: absolute;
    top: 90px;
}
.beloldal div#header div#header-top{
    min-height: 101px;
    display: block;
    width: 100%;
    position: relative;
    z-index:10;
    top: 0px;
}

div#header div#header-whi #logo a{
    width: 286px;
    height: 84px;
    display: block;
    background: #ffffff url(../gfx/logo-sagerdental-color.jpg) no-repeat scroll 50% 5%;
    float: left;
    position: absolute;
    font-size: 0;
    z-index: 99999;
    cursor: pointer;
    top: -20px;
    background-size: 70%;
    background-position: center center;
}

.beloldal div#header div#header-whi #logo a {
    background:transparent url(../gfx/logo-sagerdental.png) no-repeat scroll 50% 5%;
    background-size:100%;
    top:0;
}

div#header div#header-top #logo a{
    display: block;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
}

div#header div#header-bottom{
    background: #004B84;
    min-height: 100px;
    display: block;
    width: 100%;
    padding: 40px 0;
}

.beloldal div#header div#header-bottom {
    min-height:0;
}

div#header div#header-bottom.bel{
    border-top: 1px solid rgba(255, 255, 255, 0.5);
    background: #D9E4EC;
    display: block;
    width: 100%;
    padding: 0;
    position:relative;
    z-index:9;
}

/* main-------------------------------*/

div#main-ws-menu{
    display: block;
    position: relative;
    padding: 20px 0 0;
    /* background: #dddddd; */
    background: -moz-linear-gradient(top,  #dddddd 0%, #ffffff 50%);
    /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(50%,#ffffff)); */
    /* background: -webkit-linear-gradient(top,  #dddddd 0%,#ffffff 50%); */
    background: -o-linear-gradient(top,  #dddddd 0%,#ffffff 50%);
    background: -ms-linear-gradient(top,  #dddddd 0%,#ffffff 50%);
    /* background: linear-gradient(to bottom,  #dddddd 0%,#ffffff 50%); */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 );
    /* border-bottom: 1px solid #E0E9EF; */
    background: transparent url('../gfx/content-bg.png') top left repeat-x;
}

div#main-content-after{
    display: block;
    position: relative;
    padding: 20px 0;
}

div#newsle-su{
    display: block;
    position: relative;
    padding: 20px 0;
    background: rgba(0,75,132,0.12);
}

/* content-------------------------------*/

div#content.bel{
    display: block;
    position: relative;
    padding: 40px 0;
}

.beloldal div#content.bel{
    display: block;
    position: relative;
    padding: 0 0 40px 0;
    margin-top: 20px;
    min-height:1290px;
}
div#content div#content-holder{
    display: block;
    width: 715px;
    position: relative;
}

/* Footer-------------------------------*/

div#footer{
    display: block;
    position: relative;
    padding: 30px 0;
    background: #004B84;
}

div#footer-bottom{
    display: block;
    position: relative;
    padding: 10px 0;
    background: #000000;

}
div#footer-bottom div#copyright{
    display: inline-block;
    float: left;
    color: #FFFFFF;
    font-size: 15px;
}

div#footer-bottom a#infoartnet{
    display: block;
    width: 16px;
    height: 16px;
    background: transparent url('../gfx/logo-ianet.png') no-repeat 0 0;
    text-indent: -9999px;
    float: right;
    margin: 0;
}

.siwi > div.box > h2.component-heading{
    font-size: 21px;
    background: #004B84;
    color: #FFFFFF;
    box-sizing: border-box;
    padding: 10px 20px;

    font-family: 'Open Sans Light', sans-serif;
    text-transform: uppercase;
}

/* portalhiba----------------------------*/

div#content div.portalhiba{margin: 0 0 20px;}
div#content div.portalhiba h2.component-heading{
    font-size: 30px;
    background: #004B84;
    color: #FFFFFF;
    box-sizing: border-box;
    padding: 10px;
    border-radius: 5px 5px 0 0;
}
div#content div.portalhiba div.component-body {
    margin: 10px 0 0;
    padding: 0 20px 20px;
    box-sizing: border-box;
}

/* Cookie box */

#js-cookie-box{
    width: 100%;
    float: none;
    background-color:#000000;
    padding: 9px 0px;
    z-index: 9999999;
    text-align: center;
    position: fixed;
    bottom:0;
    opacity: 0.85;
    display:none;
    padding:20px;
    box-sizing:border-box;
}
#js-cookie-box p{
    color:#fff;
    text-align:center;
    margin-bottom:20px;
}
#js-cookie-box .cookie-buttons {
    text-align:center;
}
#js-cookie-box .cookie-buttons #cookie-box-gomb {
    display:inline-block;
    background-color:#004B84;
    padding:10px 25px;
    color:#ffffff;
    text-transform:uppercase;
    transition:0.3s;
    cursor:pointer;
}
#js-cookie-box .cookie-buttons #cookie-box-gomb:hover {
    color:#004B84;
    background-color:#fff;
}

.masonry-brick.masonry-disable {

    position:relative !important;
    top:auto !important;
    left:auto !important;
    bottom:auto !important;
    right:auto !important; 

}


/*------- MEDIA QUERIES -------*/


@media only screen and (min-width: 1323px){
    div.siwi{
        width: 1260px;
    }
    .beloldal #header-top div.siwi { width: 1260px; }
    div#content div#content-holder{
        width: 940px;
    }
    #header-top div.siwi{ width:1260px; }
    #header-whi div.siwi{ width: 1260px; }
    div#header div#header-whi { margin-left: -630px; }
    div#header div#header-top { top: 100px; }
}

@media only screen and (min-width: 994px) and (max-width: 1323px){
    
}

@media only screen and (min-width: 640px) and (max-width: 993px){
    #header-top div.siwi{ width: 620px; }
    #header-whi div.siwi{ width: 619px; }
    div.siwi { width: 620px; }
    .beloldal #header-top div.siwi { width: 620px; }
    div#content div#content-holder{
        width: 620px;
    }
    .beloldal div#header div#header-top {
        min-height:0;
        padding-bottom:15px;
        top:0;
    }
    
    

    .beloldal div#header-top .part-showmenu .com-content {
        
    }

    div#header div#header-whi div.header-whi-search,
    div#header div#header-whi div.header-whi-login{
        display: inline-block;
        float: left;
        width: auto;
    }
    div#header div#header-whi div.header-whi-login{
        float: right;
        position: relative;
        top: 0;
        right: -20px;
    }

    .beloldal div#header div#header-whi div.header-whi-login{
        
        position: relative;
    }

    div#header div#header-top #logo a {
        float: none;
        margin: 0 auto;
        padding: 20px 0 0;
    }
    div#header div#header-whi #logo a{
        width: 240px;
        height: 77px;
        margin-top: -5px;
        display: block;
        background: #ffffff url('../gfx/logo-sagerdental-color.jpg') no-repeat scroll;
        float: left;
        position: absolute;
        font-size: 0;
        background-size: 90%;
        background-position:center center;
    }
    .beloldal div#header div#header-whi #logo a{
        width: 200px;
        height: 47px;
        margin-top: 0;
        display: block;
        background: transparent url('../gfx/logo-sagerdental.png') no-repeat scroll 50% 5%;
        font-size: 0;
        background-size: 100% 100%;
    }
    div#header div#header-top { top: 75px; }
}

@media only screen and (max-width:993px) {
    
    div#header div#header-whi #logo a {
        position:static;
        float:none;
    }
    
    div#content div#content-holder {
        position:static !important;
    }
    
    div#header div#header-top {
        position:static;
    }
    
    .beloldal div#header div#header-top {
        position:relative;
        z-index:1;
        min-height:0;
    }
    
    div#header div#header-bottom.bel {
        z-index:1;
    }
    
    div#header div#header-whi {
        z-index:2;
        position:static;
        margin-left:auto;
        margin-right:auto;
        padding:0;
    }
    
    div#header div#header-whi::after {
        content:"";
        display:block;
        float:none;
        clear:both;
    }
}

@media only screen and (min-width: 480px) and (max-width: 639px) {
    /* .beloldal { overflow: hidden; } */
    .beloldal div#header div#header-whi {
        width: 460px;
        margin: 0 auto;
    }
    
    #header-top div.siwi{ width: 460px; }
    div.siwi { width: 460px; }
    .beloldal #header-top div.siwi{ top: -118px; width: 460px; right: -434px; background: transparent;}
    .beloldal #header-whi div.siwi{ width: 460px; }
    div#content div#content-holder{
        width: 460px;
    }
    div#header div#header-whi div.header-whi-search,
    div#header div#header-whi div.header-whi-login{
        display: block;
        float: none;
        width: 420px;

    }

    .beloldal div#header div#header-bottom.bel{
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        background: #D9E4EC;
        display: block;
        width: 100%;
        padding: 0;
        margin-top: 0px;
    }

    .beloldal div#content.bel {/* margin-top: 149px; */}

    div#header div#header-whi div.header-whi-search{
        text-align: center; 
        margin: 0 0 20px 0;
    }
    .beloldal div#header div#header-whi div.header-whi-search{
        text-align: center; 
        margin: 0 0 20px 0;
    }
    #header-top div.siwi{
        display: block;
        box-sizing: border-box;
        margin: 7px auto 0 auto;
        position: relative;
        background: transparent;
        z-index: 99999;
    }

    div#header div#header-whi div.header-whi-login:after{ 
        /*clearfix*/
        content: '.';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    div#header div#header-top #logo a {
        float: none;
        margin: 0 auto;
        padding: 20px 0 0;
    }
    div#header div#header-whi #logo a{
        width: 286px;
        height: 84px;
        margin-top: 0;
        display: block;
        background: #ffffff url('../gfx/logo-sagerdental-color.jpg') no-repeat scroll 50% 5%;        
        font-size: 0;
        background-size: 90%;
        background-position:center center;
    }
    .beloldal div#header div#header-whi #logo a{
        width: 200px;
        height: 47px;
        margin-top: 0;
        display: block;
        background: transparent url('../gfx/logo-sagerdental.png') no-repeat scroll 50% 5%;
        font-size: 0;
        background-size: 100% 100%;
    }
    div#header div#header-whi,
    div#header div#header-whi .siwi { width: 420px;}
    
    
}

@media only screen and (max-width:639px) {
    
}

@media only screen and (min-width: 320px) and (max-width: 479px) {
    #header-top div.siwi{ width: 310px; }
    #header-whi div.siwi{ width: 310px;}
    div.siwi{
        width: 310px;
    }
    div#content div#content-holder{
        width: 310px;
    }
    
    
    
    div#header div#header-top #logo a {
        float: none;
        margin: 0 auto;
        padding: 20px 0 0;
    }

    div#header div#header-whi div.header-whi-search,
    div#header div#header-whi div.header-whi-login{
        display: block;
        float: none;
        width: 100%;

    }
    
    
    div#header div#header-whi div.header-whi-login {
        margin-top:0;
    }
    
    
    div#header div#header-whi div.header-whi-search{
        text-align: center;
        margin: 0;
    }

    .fooldal div#header div#header-bottom{padding: 25px 0 40px 0;}
    div#header div#header-whi #logo a {
        background-size:contain;
        margin-bottom:12px;
        height:64px;
    }
    
    
    #header-top div.siwi{
  
        display: block;
        position: relative;
        box-sizing: border-box;
        margin: 7px auto 0 auto;
        position: relative;
        background: transparent;
        z-index: 99999;
        position: relative;
    }
    .beloldal #header { height: 193px; }
    .beloldal div#content.bel{
        display: block;
        position: relative;
        /* padding: 40px 0; */
        /* margin-top: 166px; */
    }
    .beloldal #header-top div.siwi { /* display: none; */ position: relative; top: -96px; left: 50px; z-index: 99999; width: 25px; background: transparent;}
    .beloldal #header {height: auto;}
}

@media only screen and (max-width: 319px){
    body{
        display: none !important;
    }
}




/*FANCY*/

#fancybox-loading {
    z-index: 11104 !important;
}

#fancybox-overlay {
    z-index: 11100 !important;
}

#fancybox-wrap {
    z-index: 11101 !important;
}

#fancybox-content {
    z-index: 11102 !important;
}

#fancybox-hide-sel-frame {
    z-index: 11101 !important;
}

#fancybox-close {
    z-index: 11103 !important;
}

#fancybox-left, #fancybox-right {
    z-index: 11102 !important;
}

#fancybox-left-ico, #fancybox-right-ico {
    z-index: 11102 !important;
}

.fancybox-bg {
    z-index: 11001 !important;
}

#fancybox-title {
    z-index: 11102 !important;
}

/*black friday*/
.content-before-wide{
    width:1260px;
    margin:0 auto;
}
@media only screen and (max-width: 1323px){
    .content-before-wide{
        width:960px;
    }
}
@media only screen and (max-width: 993px){
    .content-before-wide{
        width:620px;
    }
}
@media only screen and (max-width: 639px) {
    .content-before-wide{
        width:100%;
    }
}
#content .content-before-wide .black_friday{
    width:100%;
}