/* Resetowanie */

html, body, p, h1, h2, h3, h4, h5, h6, div, span, form, input, textarea, a, dl, dt, dd, ol, ul, li, table, tr, td, iframe, fieldset, img
{
    margin:0; padding: 0;
    border: 0;
    font-weight: inherit; font-style: inherit;
    font-size: 100%; font-family: inherit;
    vertical-align: baseline; text-align: left;
}

h1, h2, h3, h4, h5, h6
{
    font-weight: normal; 
}

a 
{
    color: #007ccb; cursor: pointer;
}

a, a:visited
{
    text-decoration: none;
}

a:hover
{
    color: #007ccb; text-decoration: none;
}

ol, ul 
{
    list-style: none;
}

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary
{
    display: block;
}

*:focus {
    outline: 0;
}

/* Koniec resetowania */

@font-face {
    font-family: 'fira_sansbold';
    src: url('/widoki/fonts/firasans-bold-webfont.eot');
    src: url('/widoki/fonts/firasans-bold-webfont.eot?#iefix') format('embedded-opentype'),
        url('/widoki/fonts/firasans-bold-webfont.woff2') format('woff2'),
        url('/widoki/fonts/firasans-bold-webfont.woff') format('woff'),
        url('/widoki/fonts/firasans-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'fira_sansbold_italic';
    src: url('/widoki/fonts/firasans-bolditalic-webfont.eot');
    src: url('/widoki/fonts/firasans-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
        url('/widoki/fonts/firasans-bolditalic-webfont.woff2') format('woff2'),
        url('/widoki/fonts/firasans-bolditalic-webfont.woff') format('woff'),
        url('/widoki/fonts/firasans-bolditalic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'fira_sansregular';
    src: url('/fonts/firasans-regular-webfont.eot');
    src: url('/fonts/firasans-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('/fonts/firasans-regular-webfont.woff2') format('woff2'),
        url('/fonts/firasans-regular-webfont.woff') format('woff'),
        url('/fonts/firasans-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}




html
{
    background-color: hsl(0, 0%, 100%);
    font-family: 'fira_sansregular',Verdana, Helvetica, Geneva, Arial, sans-serif;
    font-size: 1em;
    height: 100%;
    color:hsl(206, 97%, 25%);
}


#naglowekG1
{
    width: 100%;
    height: 247px;
    background-color: hsl(60, 3%, 92%);
    background-image: url('/images/pd-logo-gora-d.png');
    background-repeat: no-repeat;
    background-position: left top;
}

#naglowekG1Srodek
{
    height: 247px;
    margin: 0 auto;
}

#naglowekG1SrodekLewy
{
    float: left;
    width: 350px;
}

#naglowekG1SrodekPrawy
{
    float: right;
    width: 850px;
}

#naglowekG1SrodekLewy h1
{
    display: block;
    width: 350px;
    height: 247px;
}

#naglowekG1SrodekLewy a
{
    display: block;
    width: 350px;
    height: 247px;
}

#naglowekG1SrodekPrawy h2, #naglowekG1SrodekPrawy h3
{
    font-family: 'fira_sansbold_italic',Verdana, Helvetica, Geneva, Arial, sans-serif;
    font-size: 2em;
}


#menu
{
    width: 100%;
    height: 62px;
    background-color: hsl(214, 92%,28%);
}

#menuSrodek
{
    margin: 0 auto;
}

#menuSrodek ul
{
    padding: 15px 0 0 20px;
}

#menuSrodek li
{
    float: left;
    font-family: 'fira_sansbold_italic',Verdana, Helvetica, Geneva, Arial, sans-serif;
    font-size: 1.25em;
    background-repeat: no-repeat;

    height: 1.55em;
}

li.home
{
    background-image: url('/images/icn-home.png');
    padding: 0 0 0 40px;
    margin: 0 !important;
}

li.electrical
{
    background-image: url('/images/icn-electrical.png');
    padding: 0 0 0 25px;
}

li.av
{
    background-image: url('/images/icn-av.png');
    padding: 0 0 0 40px;
}

li.contact
{
    background-image: url('/images/inc-contact.png');
    padding: 0 0 0 30px;
}

#menuSrodek a
{
    color: hsl(60, 3%, 92%);
}

#menuSrodek a:hover
{
    color: hsl(42, 100%, 50%);
}


#naglowekG2
{
    width: 100%;
    height: 117px;
    background-image: url('/images/pd-logo-dol-d.png');
    background-repeat: no-repeat;
    background-position: left top;
}

#naglowekG2Srodek
{
    height: 117px;
    margin: 0 auto;
}

#glowna
{
    margin: 0 auto;
}


div.glownaOfertaSrodek img
{
    width: 300px;
    height: 288px;
    display: block;
    margin: 0 auto;
}

div.glownaOfertaSrodek h3
{
    font-size: 1.6875em;
    text-align: center;
    font-family: 'fira_sansbold',Verdana, Helvetica, Geneva, Arial, sans-serif;
}

div.glownaOfertaSrodek a
{
    color: hsl(214, 92%, 28%);

}

div.glownaOfertaSrodek a:hover
{
    color: hsl(42, 100%, 50%);

}


div.glownaOfertaSrodek p
{
    margin: 20px 10px;
    text-align: left;
    font-size: 1.0625em;
    color: hsl(0, 2%, 40%);
}

div.glownaOfertaSrodek h4
{
    font-size: 1.125em;
    text-align: center;
    font-family: 'fira_sansbold',Verdana, Helvetica, Geneva, Arial, sans-serif;
    margin: 0 auto;
    background-color: hsl(42, 100%, 50%);
    width: 200px;
    padding: 5px;
    border: 1px solid hsl(42, 100%, 50%);
    border-radius: 25px;

}

a.glownaOfertaSrodekDolny
{
    color: hsl(214, 96%, 36%);
}

a:hover.glownaOfertaSrodekDolny
{
    color: hsl(214, 96%, 36%) !important;
    text-decoration: underline;
}


div.podGlownymOferta ul
{
    font-family: 'fira_sansregular',Verdana, Helvetica, Geneva, Arial, sans-serif;
    font-size: 1.0625em;
    margin: 0;
}

div.podGlownymOferta li
{
    background-image: url('/images/cypek.png');
    background-repeat: no-repeat;
    background-position: left top;
    padding: 0 0 5px 25px;
    margin: 0 0 10px 0;
    line-height: 100%;
}

div.podGlownymOferta a
{
    color: hsl(214, 92%, 28%);
}

div.podGlownymOferta a:hover
{
    text-decoration: underline;
}

#nadStopie
{
    clear: both;
    width: 100%;
    height: 230px;
    background-color: hsl(110, 0%, 95%);
}



#nadStopieSrodekLewy ul
{

    font-family: 'fira_sansregular',Verdana, Helvetica, Geneva, Arial, sans-serif;
}

#nadStopieSrodekLewy li
{
    display: inline;
    color: hsl(0, 0%, 31%);
    font-size: 1.125em;
}

#nadStopieSrodekLewy a
{
    color: hsl(0, 0%, 31%);
}

#nadStopieSrodekLewy a:hover
{
    text-decoration: underline;
}


#nadStopieSrodekDol
{
    clear: both;
    border-top: 1px solid hsl(0, 0%, 50%);
    margin: 0 auto;
}

#nadStopieSrodekDol h5
{
    font-size: 1.6875em;
    font-family: 'fira_sansbold_italic',Verdana, Helvetica, Geneva, Arial, sans-serif;

}

#nadStopieSrodekDol a
{
    color: hsl(0, 0%, 50%);
}


#stopka h6
{
    text-align: center;
    font-size: 1.125em;
}


#stopka img
{
    width:56px;
    height:56px;
    vertical-align:middle;
}

#stopka a
{
    color: hsl(0, 0%, 31%);
}

#srodekTytul
{
    width: 100%;
    background-color: hsl(60, 3%, 92%);
    float: left;
    padding: 10px 0;
    margin: 10px 0 0 0;

}



#srodekTytulSrodekLewy img
{
    display: block;
    margin: 0 auto;
}

#srodekTytulSrodek h3
{
    font-size: 3em;
    color: hsl(211, 100%, 29%);
}

#srodekTytulSrodek p
{
    color: hsl(211, 100%, 29%);
    font-size: 1.0625em;
    margin: 20px 0 0 0;
}

#srodekTekst p
{

    padding: 30px 0 0 0;
    color: hsl(60, 1%, 40%);
    font-size: 1.5em;
}

div.odstepnik
{
    clear: both;
    height: 20px;
}

#ciastkowy
{
    background-color: #fff;
    width: 960px;
    height: 50px;
    top:0px; 
    z-index:3;
    position:fixed;
    margin: 0 0 0 5px;
}

#ciastkowy_lewy
{
    float: left;
    width: 790px;
    text-align: center;
    font-size: 0.9em;
    margin: 5px 0 0 0;
}


#ciastkowy_prawy
{
    width: 150px;
    float: right;
    text-align: right;
    margin: 5px 10px 0 0;
    font-size: 0.9em;
}

#ciastkowy_prawy a
{
    display: block;
    background-color: #ff0000;
    width: 138px;
    height: 25px;
    margin: 5px;
    color:#fff;
    padding: 5px 5px 0 5px;
}

#ciastkowy_prawy a:hover
{
    display: block;
    background-color: #6282bb;
    width: 138px;
    height: 25px;
    margin: 5px;
    color:#fff;
    padding: 5px 5px 0 5px;
    text-decoration: none;
}

ul.ciasteczka
{
    list-style: decimal;
    margin: 0 0 0 35px;
}

a.ciateczko
{
    color: #6282bb;
}

a.ciateczko:hover
{
    text-decoration: underline;
}

div.clear
{
    clear: both;
    height: 10px;
}

div.galeria2
{
    width: 310px;
    float: left;
    margin: 0 auto;
    text-align: center;
    font-size: 0.90em;
}

img.galeriaminiatura
{
    border: hsl(0, 0%, 44%) solid 2px;
    max-width: 250px;
    height: auto !important;
    margin: 0.5em auto;
}



#formularz
{
    margin: 0;
    color: hsl(60, 1%, 40%);
    padding: 20px 0 0 0;
}

#formularz h4
{
    font-size: 1.125em;
    margin: 0 0 0 20px;

}

#strona-srodek form
{
    margin: 20px 40px;
}

#strona-srodek input, #strona-srodek textarea
{
    width: 97%;
    border: hsl(60, 1%, 40%) 1px solid;
    padding: 2px;
}

#strona-srodek textarea
{
    height: 15em;
}

input.wyslij
{
    width: 80px !important;
    background-color:  hsl(60, 1%, 40%);
    color: hsl(0, 100%, 100%);
    text-align: center;
}

input.wyslij:hover
{
    background-color: hsl(42, 100%, 50%);
    color:  hsl(214, 93%, 28%);
}

h2.komunikat_powodzenie
{
    color: #2aa12a;
    font-size: 1.1em;
    font-weight: bold;
    margin: 0 20px;
}

h2.komunikat_blad
{
    color: #ff0000;
    font-size: 1.1em;
    font-weight: bold;
    margin: 0 20px;
}

span.blad
{
    color:#ff0000;
    font-size: 0.8em;
}


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

    #naglowekG1Srodek
    {
        width: 100%;
    }

    #naglowekG2Srodek
    {
        width: 100%;
    }

    select.mnav
    {
        margin: 248px 0 00 0;  
        position: absolute;
        width: 100%;
        background-color: hsl(214, 92%,28%);
        border: 0;
        height: 62px;
        color: hsl(0, 100%, 100%);
    }

    #naglowekG1SrodekPrawy
    {
        display: none;
    }

    #glowna
    {
        width: 100%;
    }

    div.glownaOferta
    {
        margin: 10px 0 0 -3px;
    }

    div.podGlownymOferta
    {
        margin: 0 0 20px 10px  !important;
    }




    div.glownaOferta
    {
        width: 306px;
        margin: 10px auto;
    }

    div.glownaOfertaGora
    {

        width: 216px;
        height: 15px;
    }

    div.glownaOfertaSrodek
    {
        width: 216px;
    }

    div.glownaOfertaDol
    {
        width: 16px;
        height: 15px;
    }


    div.glownaOfertaSrodek
    {
        width: 300px;
        border:#053e89 2px solid;
        border-radius: 25px;
        padding: 5px;
    }

    #nadStopieSrodekLewy ul
    {
        text-align: center;
    }

    #nadStopieSrodekPrawy img
    {
        display: block;
        margin: 10px auto;
    }

    #nadStopieSrodekDol h5
    {
        text-align: center;  
    }

    #stopka
    {
        margin: 20px auto 10px auto;
    }

    #srodekTytulSrodek h3
    {
        font-size: 3em;
        color: hsl(211, 100%, 29%);
        text-align: center;
    }

    #srodekTytulSrodek p
    {
        text-align: justify;
        margin: 10px;
    }

    #srodekTekst p
    {
        clear: both;
        text-align: left;   
        margin: 20px 10px !important;

    }




}

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


    div.podGlownymOferta
    {
        margin: 40px 0 20px 10px;
    }
}

@media only screen and (min-width: 768px)
{
    #naglowekG1SrodekPrawy
    {
        display: initial;
        float: right;
        width: 400px;
    }

    #naglowekG1SrodekPrawy h2
    {
        margin: 100px 0 0 10px !important;
        font-size: 1.8em;

    }

    #naglowekG1SrodekPrawy h3
    {
        margin: 0 0 0 65px !important;
        font-size: 1.8em;

    }
}

@media only screen and (min-width: 960px)
{
    #menuSrodek
    {
        width: 960px;
        height: 247px;
        margin: 0 auto;
    }

    #naglowekG1SrodekPrawy
    {
        float: left;
        width: 550px;
    }

    #naglowekG1SrodekPrawy h2
    {
        margin: 100px 0 0 126px !important;
        font-size: 2em;
    }

    #naglowekG1SrodekPrawy h3
    {
        margin: 0 0 0 136px !important;
        font-size: 2em;
    }

    #menuSrodek li
    {
        margin: 0 0 0 110px;
    }

    #glowna
    {
        width: 960px;
    }

    div.glownaOferta
    {
        float: left;
        margin: 10px 6px 0 6px;

    }

    div.podGlownymOferta
    {
        float: left;
    }
}

@media only screen and (min-width: 1200px)
{
    #menuSrodek
    {
        width: 1200px;
        height: 247px;
        margin: 0 auto; 
    }

    #naglowekG1Srodek
    {
        width: 1200px;
    }

    #naglowekG1SrodekPrawy
    {
        width: 750px;
    }


    #naglowekG1SrodekPrawy h2
    {
        margin: 80px 0 0 186px  !important;
    }

        #naglowekG1SrodekPrawy h3
    {
        margin: 0 0 0 216px  !important;
    }
    
    #menuSrodek li
    {
        margin: 0 0 0 180px;   
    }


    #glowna
    {
        width: 1200px;
    }

    div.glownaOferta
    {
        width: 326px;
        margin: 10px 0 0 55px;
    }

    div.glownaOfertaGora
    {

        width: 326px;
        height: 15px;
    }

    div.glownaOfertaSrodek
    {
        width: 326px;
    }

    div.glownaOfertaDol
    {
        width: 326px;
        height: 15px;
    }

    div.glownaOfertaGora
    {
        background-image: url('/images/ramka-gora.png');
        background-repeat: no-repeat;
        width: 326px;
        height: 15px;
    }

    div.glownaOfertaSrodek
    {
        background-image: url('/images/ramka-srodek.png');
        background-repeat: repeat-y;
        width: 326px;
        border: 0;
        padding: 0;
        border-radius: 0;
    }

    div.glownaOfertaDol
    {
        background-image: url('/images/ramka-dol.png');
        background-repeat: no-repeat;
        width: 326px;
        height: 15px;
    }

    div.glownaOferta
    {
        width: 326px;
        margin: 10px 0 0 50px !important;
    }

    div.glownaOfertaSrodek p
    {
        margin: 20px 15px; 
    }

    #nadStopieSrodek
    {
        width: 1200px;
        margin: 0 auto;
    }

    #nadStopieSrodekLewy
    {
        float: left;
        width: 900px;
    }

    #nadStopieSrodekPrawy
    {
        float: right;
        width: 300px;
    }    

    #nadStopieSrodekLewy ul
    {
        margin: 100px 0 0 65px;
        text-align: left;
    }    

    #nadStopieSrodekPrawy img
    {
        display: initial;
        margin: 20px 0 0 120px;
    }

    #nadStopieSrodekDol
    {
        clear: both;
        width: 1070px;
    }

    #nadStopieSrodekDol h5
    {
        text-align: right;  
    }

    #stopka
    {
        width: 1200px;
        margin: 40px auto 10px auto;
    }

    #srodekTytulSrodek
    {
        width: 1200px;
        margin: 0 auto;
    }

    #srodekTytulSrodekLewy
    {
        float: left;
        width: 380px;
    }

    #srodekTytulSrodekPrawy
    {
        float: right;
        width: 820px;
    }

    #srodekTekst
    {
        clear: both;
        width: 1200px;
        margin: 30px auto 0 auto;
    }

    #srodekTekst p
    {
        margin: 0 70px !important;
    }

    #strona-srodek
    {
        width: 1200px;
        margin: 0 auto;
        clear: both;
    }

    #podGlownym
    {
        width: 1200px;
        margin: 0 auto;
    }

    div.podGlownymOferta
    {
        width: 300px;
        text-align: center;
        margin: 40px 0 0 70px !important;
    }


}