/*
    page development & css design 2009:
    Inforonika Ljubljana, Slovenia
    Grajzar Gregor
    web: http//grajzar.info
    web-english: http://xweblabs.com
*/


body{
    font-size: 80%;
    font-family:  Verdana, Georgia;
    color: #595454;
    padding: 10px;
}
* html body{
    font-family:  Georgia;
    padding: 10px;
    color: #595454;
    font-size: 80%;	/* for IE5/Win */
    f\ont-size: 80%;	/* for other IE versions */

}
/*   , Verdana, Tahoma  Helvetica , font-size: 62.5%;*/
h1.front-title {
    font-size: 1.4;
    margin-top: 1.5em;
}
h1.front-title{font-size:1.2em;margin-top:1.5em;}

h1 {
    font-size: 1.7em;
    font-weight: normal;
    color: #000;
}

h2 {
    font-size: 1.4em;
    font-weight: normal;
    color: #010101;
    margin-top: 1.5em;
}

h3 {
    font-size: 1.3em;
    font-weight: normal;
    color: #010101;
    margin-top: 1.2em;
}
h3.front-news{font-size:1.4em;}

ul {
    padding: 0px;
    margin:  0px 0px 0px 0px;
    list-style: none;
}
.email-image div {
  float: left;
  padding-right: 12px;
}
.email-image div > img {
    margin-top: -5px;
}
/* Header
----------------------------------------------------------------------------------------------------*/
.logo a img{
    border: 0px;

}

.logo {
    display:block;
    text-indent:-1000em;
    background: url(/img/avtorska-idrijska-cipka-tina-koder.gif) no-repeat 0 0;
    width:179px;
    height:298px;
}

.head-right {
    text-align: right;
}

.head-navigator{
    font-size: 1.5em;
    margin-top: 120px;
    padding: 0px;
}

.page-footer {
        margin-top: 20px;
}

.page-subfooter {

    font-size: 0.8em;
    margin-top: 40px;
}

.category-navigation h3{
    font-family:  Georgia;
    font-size: 1.2em;
}

.category-navigation {
    font-size: 1.2em;

}

.category-navigation ul>li, li>ul>li{
    font-size: 0.9em;
    padding-top: 3px;
}

.footer-navigator  {
    text-decoration:none;
    font-size: 1.5em;
}

.category-navigation {
    text-align: left;
}

#page-content {
        margin-top: 20px;
}

.box {
    margin-bottom: 50px;
}

.image {
        border: 1px solid;
        padding: 4px;
        border-color: #BEBEBE;
}

.right-box{
float: right;
margin-left: 7px;


    }

.icon-small {
    width: 20px;
    border: 0px;
    margin-bottom: -2px;
    padding-right: 0.5em;
}

.video_holder{

z-index: 0;
}

.socioshare{display:inline;float:left;position:relative;width:30px;margin-top:30px;font-size: 1.7em;}.socioshare .fa span{display: none;}

/* Links
----------------------------------------------------------------------------------------------------*/
a, a:link , a:visited {
    color: #000000;
    text-decoration:none;
}

a:active, a:hover, a:focus  {
    color: #990000;
    text-decoration: underline;
}

.gridx{
    display:inline;
    float: left;
    position: relative;
    margin-right: 10px;

}

/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
    margin-left: auto;
    margin-right: auto;
    width: 960px;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/
/*
    Variable Grid System.
    Learn more ~ http://www.spry-soft.com/grids/
    Based on 960 Grid System - http://960.gs/

    Licensed under GPL and MIT.
*/


/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
    margin-left: auto;
    margin-right: auto;
    width: 996px;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_4,
.grid_6,
.grid_8,
.grid_12 {
    display:inline;
    float: left;
    position: relative;
    margin-left: 12px;
    margin-right: 12px;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
    margin-left: 0;
}

.omega {
    margin-right: 0;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_4 {
    width:307px;
}




.container_12 .grid_6 {
    width:473px;
}


.container_12 .grid_8 {
    width:639px;
}

.container_12 .grid_12 {
    width:971px;
}



/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 {
    padding-left:83px;
}

.container_12 .prefix_2 {
    padding-left:166px;
}

.container_12 .prefix_3 {
    padding-left:249px;
}

.container_12 .prefix_4 {
    padding-left:332px;
}

.container_12 .prefix_5 {
    padding-left:415px;
}

.container_12 .prefix_6 {
    padding-left:498px;
}

.container_12 .prefix_7 {
    padding-left:581px;
}

.container_12 .prefix_8 {
    padding-left:664px;
}

.container_12 .prefix_9 {
    padding-left:747px;
}

.container_12 .prefix_10 {
    padding-left:830px;
}

.container_12 .prefix_11 {
    padding-left:913px;
}

ul{padding:0}

/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {
    padding-right:83px;
}

.container_12 .suffix_2 {
    padding-right:166px;
}

.container_12 .suffix_3 {
    padding-right:249px;
}

.container_12 .suffix_4 {
    padding-right:332px;
}

.container_12 .suffix_5 {
    padding-right:415px;
}

.container_12 .suffix_6 {
    padding-right:498px;
}

.container_12 .suffix_7 {
    padding-right:581px;
}

.container_12 .suffix_8 {
    padding-right:664px;
}

.container_12 .suffix_9 {
    padding-right:747px;
}

.container_12 .suffix_10 {
    padding-right:830px;
}

.container_12 .suffix_11 {
    padding-right:913px;
}



/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .push_1 {
    left:83px;
}

.container_12 .push_2 {
    left:166px;
}

.container_12 .push_3 {
    left:249px;
}

.container_12 .push_4 {
    left:332px;
}

.container_12 .push_5 {
    left:415px;
}

.container_12 .push_6 {
    left:498px;
}

.container_12 .push_7 {
    left:581px;
}

.container_12 .push_8 {
    left:664px;
}

.container_12 .push_9 {
    left:747px;
}

.container_12 .push_10 {
    left:830px;
}

.container_12 .push_11 {
    left:913px;
}



/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_1 {
    left:-83px;
}

.container_12 .pull_2 {
    left:-166px;
}

.container_12 .pull_3 {
    left:-249px;
}

.container_12 .pull_4 {
    left:-332px;
}

.container_12 .pull_5 {
    left:-415px;
}

.container_12 .pull_6 {
    left:-498px;
}

.container_12 .pull_7 {
    left:-581px;
}

.container_12 .pull_8 {
    left:-664px;
}

.container_12 .pull_9 {
    left:-747px;
}

.container_12 .pull_10 {
    left:-830px;
}

.container_12 .pull_11 {
    left:-913px;
}




/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
.pager li {
    display: inline;
    margin-right: 2em;
}
/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}


/* colorbox */
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/*
#cboxLoadedContent
*/

/*
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:#fff;}

#colorBox{}
    #cboxTopLeft{width:25px; height:25px; background:url(/images/border1.png) 0 0 no-repeat;}
    #cboxTopCenter{height:25px; background:url(/images/border1.png) 0 -50px repeat-x;}
    #cboxTopRight{width:25px; height:25px; background:url(/images/border1.png) -25px 0 no-repeat;}
    #cboxBottomLeft{width:25px; height:25px; background:url(/images/border1.png) 0 -25px no-repeat;}
    #cboxBottomCenter{height:25px; background:url(/images/border1.png) 0 -75px repeat-x;}
    #cboxBottomRight{width:25px; height:25px; background:url(/images/border1.png) -25px -25px no-repeat;}
    #cboxMiddleLeft{width:25px; background:url(/images/border2.png) 0 0 repeat-y;}
    #cboxMiddleRight{width:25px; background:url(/images/border2.png) -25px 0 repeat-y;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{
            position:absolute; left:0; text-align:center; width:100%; color:#999;
                    height: 30px;
                    padding-top: -90px;
                    margin-top: -20px;
            }
      /*  #cboxCurrent{position:absolute; bottom:0px; left:250px; color:#999;} */
        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:0px; left:73px; color:#444;}
        #cboxLoadingOverlay{background:url(images/loading.gif) 5px 5px no-repeat #fff;}
        #cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}

/*
    The following fixes png-transparency for IE6.
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition

    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.

    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}

/* front content rotator by Infotronika.org */
#content_rotator {
    position: relative;
       overflow: hidden;
       height: 370px;
}

div.rotator {
    position: absolute;
       top: 370px;
       height: 325px;
}

/* rss feed */
div.rss{
    text-align:right;
}

div.rss a img{
    border: 0px;
    width: 27px;
}


/* cookie question */
.siteWrap{
    position: relative;
}

.cookie_wrapper{
    background-color: #202020;
    border-top: 1px solid #5E5E5E;
    bottom: 0;
    color: #CCCCCC;
    font-size: 0.9em;
    left: 0;
    padding: 21px 7%;
    position: fixed;
    width: 100%;
    z-index: 2100;
}
.cookie_title{
    font-size: 1.5em;
    line-height: 0.9em;
}

.cookie_box{
    float:left;
    margin: 0 12px;
    width: 15%;
}
.cookie_box a{
    color: #fff;
}

.cookie_center{
     width: 55%;
}

a.cookie_button {
    margin-top: 10px;
    background: none repeat scroll 0 0 #7DAF3B;
    border-radius: 3px 3px 3px 3px;
    padding: 3px 10px;
    color: #FFFFFF;
    text-decoration: none;
}
a.cookie_button:hover {
    background: none repeat scroll 0 0 #4a6823;
}


#map_canvas {
    height: 390px;
    width: 100%;
}

ul.alineja{
     list-style-type: circle;
}


.alineja > li {
    margin-bottom: 3px;
    margin-left: 30px;
}

.citat em {
    color: #a3a3a3;
    font-size: 1.2em;
    quotes: "\201C" "\201D" "\2018" "\2019";
     line-height: 1.3em;
}

.citat em:before {
    content: open-quote;
    font-family: times new roman;
    font-size: 2.1em;
    margin-top: 10px;
    padding-right: 0.1em;
    vertical-align: -0.1em;
    line-height: 0.7em;
}
.citat em:after {
    content: no-close-quote;
}

.upper-content{

}

.grid_4.grid_logo{
        width:280px;
}

.ful-width {
    width: 100%;
}

.pager {
    margin: 30px 0;
    font-size: 1.4em;
}
div > .pager {
    /* background-color: yellow; */
    border-top: .1rem solid #dcdcdc;
    padding-top: 30px;
}

.content{text-align: justify;
}
.floating-box-right {
    width: 30%;
    padding: 20px;
    background-color: #fff;
    float: right;
    margin: 10px 0 10px 30px;
    text-align: center;
    border-radius: 10px;

}
.btn-enrol{
    text-decoration: none;
    font-family: $fontSans;
    letter-spacing: -.015em;
    font-size: 1.2em;
    padding: 0.8em 2em;
    color: #fff;
    background: #82ca9c;
    font-weight: bold;
    border-radius: 50px;
    float: right;
    text-align: right;
    transition: background 0.25s linear, box-shadow 0.25s ease-in-out;
    -webkit-box-shadow: 10px 13px 30px -11px rgba(199,199,199,1);
    -moz-box-shadow: 10px 13px 30px -11px rgba(199,199,199,1);
    box-shadow: 10px 13px 30px -11px rgba(199,199,199,1);
}


.btn-enrol:hover {
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.6);
}

.btn-enrol:after {
    content: "\276f";
    padding: .5em;
    position: relative;
    right: 0;
    @include transition(all, .15s, linear);
}
.btn-enrol:hover,
.btn-enrol:focus,
.btn-enrol:active{
    background: #5ca175 !important;
    -webkit-box-shadow: 8px 6px 8px -11px rgba(0,0,0,1);
    -moz-box-shadow: 8px 6px 8px -11px rgba(0,0,0,1);
    box-shadow: 8px 6px 8px -11px rgba(0,0,0,1);
}
.btn-enrol:hover:after,
.btn-enrol:focus:after,
.btn-enrol:active:after{
    right: -10px;
}