/*  
 *
 *  Name: BizPro
 *	Description: Corporate Theme
 *	Version: 1.0
 *	Author: Radek Ziemiacki
 *	Author website: http://qlart.eu
 *
 */

body{background:url('../images/bg.jpg') repeat-x; font:12px Tahoma,Arial,Helvetica,sans-serif; color:#313131}

/* Typography */

p{line-height:18px}
h2{font-size:18px}
h3{font-size:24px}
a{color:#313131}
a:hover{color:#FFAC2C}
#col2 p, #col3 p, #col4 p{margin:10px 0 20px 0}
#col5 p{margin:0 0 20px 0}
#content hs {margin-bottom:10px; padding-bottom:10px; border-bottom:1px #e7e7e7 solid}
#content h3 {margin-bottom:10px; padding-bottom:10px; border-bottom:1px #e7e7e7 solid}
#col1 ul li, #col5 ul li{padding:10px 0 10px 20px; border-bottom:1px #e7e7e7 solid; background:url(../images/arrow.jpg) no-repeat 0% 50%}
#col5 ul{margin:0 0 20px 0}
.color{color:#ffac2c}

/* Container & header */

#container{width:960px; margin:auto}
#header{height:130px}
.logo{float:left; position:relative; top:20px; left:20px}

/* Main menu */

#mainmenu{float:right; position:relative; top:88px; right:80px; z-index:200}
#mainmenu  li{float:left}
#mainmenu a{padding:0 20px 5px 20px; display:block; font-size:14px; color:#313131}
#mainmenu a:hover{border-bottom:5px #ffac2c solid}
.active{border-bottom:5px #ffac2c solid}
.slogan{
	position:relative;
	top:130px;
	left:20px;
	color:#fff;
}

/* Slider */

#lbox{height:280px; width:280px; float:left; position:relative; background:#313131 url('../images/corner.jpg') no-repeat}
#rbox{height:280px; width:680px; float:right; position:relative; bottom:20px; background:#313131; z-index:100}
#slider{position:relative; top:10px; right:40px}
.started{position:relative; top:60px; left:230px; z-index:300}

/* Columns */

#col1, #col2, #col3, #col4{width:200px; margin:40px 20px 0 20px; float:left}
#col4{margin-right:0}
#col5{width:700px; margin:40px 0 0 20px; float:left}
.img{padding:1px; border:1px #e7e7e7 solid}

/*Footer */

#footer{height:50px; width:960px; position:relative; top:40px; background:url('../images/footer.jpg') no-repeat; clear:both}
#footer p{padding:20px 0 50px 20px}

/* Form */

.itext{width:240px; margin:0 0 10px 0; padding:5px 8px 5px 8px; border:1px #e8e8e8 solid; font:12px Tahoma,Arial,Helvetica,sans-serif; color:#313131}
.isub{padding:2px 5px 2px 5px; background:#FFAC2C; color:#fff; cursor:pointer}

.more{margin:0 10px 0 10px;}
#col1 .last, #col5 .last{border:none}
.text{width:460px; margin:0 0 0 40px; float:right}
.comment{width:200px; float:left; text-align:right; color:#989898}


@media (max-width:760px) {   


    #container {
        width: 100%;
    }
    div#content {
        padding-right: 30px;
    }
    div#image {
        width: 100%;
    }
    div#lbox {
        width: 100%;
    }
    div#rbox {
        width: 100%;
    }
    img.started {
        top: 80px;
        width: 50px;
    }
    #col1, #col2, #col3, #col4 {
        width: 100%;
        margin: 40px 20px 0 20px;
        float: left;
    }

    .text {
        width: 100%;
        float: left;
    }
    .comment {
        width: auto;
        float: left;
        text-align: left;
        color: #989898;
    }
    div#col5 {
        width: 100%;
    }
    .text {
        margin: 0 0 0 0px;
    }
}


#menu-toggle {
    display: none; /* Hide the hamburger icon by default */
}

@media (max-width: 768px) {
    #mainmenu {
        display: none;
        position: absolute;
        top: 130px;
        right: 0;
        background-color: #f8f8f8;
        width: 100%;
    }

        #mainmenu.show {
            display: block;
        }

        #mainmenu li {
            float: none;
            width: 100%;
            text-align: center;
        }

    #menu-toggle {
        display: block;
        position: absolute;
        top: 20px;
        right: 20px;
        cursor: pointer;
        z-index: 300;
        font-size: 20px;
        width: 30px;
        padding: 5px; /* Adjust padding to increase the width */
    }
}


.cookies-eu-banner {
    background: #444;
    color: #fff;
    padding: 6px;
    font-size: 13px;
    text-align: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10;
}

    .cookies-eu-banner button {
        text-decoration: none;
        background: #222;
        color: #fff;
        border: 1px solid #000;
        cursor: pointer;
        padding: 4px 7px;
        margin: 2px 0;
        font-size: 13px;
        font-weight: 700;
        transition: background 0.07s, color 0.07s, border-color 0.07s;
    }

        .cookies-eu-banner button:hover {
            background: #fff;
            color: #222;
        }

       @media (max-width:460px) {
        #container {
            overflow: hidden;
        }
        div#footer {
            top: auto;
        }
        div#content {
            padding-right: 40px;
        }
       }