@import 'https://fonts.googleapis.com/css?family=Droid+Sans';

html, body { width:100%;  overflow-x:hidden; margin: 0; padding:0; 
       font-family: 'Droid Sans', sans-serif; line-height: 1; }
body { background: #efefef; overflow-y: hidden;}

/*defaults*/
.actionButton { background: #4477f2; text-decoration: none; color: white; padding: 7px 12px; border-radius: 4px;}

/*header*/

#klic {
    background-color: #4477F2;
    padding: 5px 1em;
    border-radius: 4px;
}

#expandMenu {
    display: block; position: fixed; background: white; width: 100%; 
    height: auto; z-index: 100; border-bottom: 1px solid #4477f2;}

#expandMenu a {   float: left; font-weight: bold; text-decoration: none; color: #fff; margin: 11px 1em 2px 7px;}
#expandMenu .fa-bars { float: right; color:#4477f2; font-size:1.8em; cursor:pointer; margin: 8px 10px 3px 0; }
#expandMenu img { padding:0 0 5px 3px; margin-top: -3px; }

header, header section a:nth-of-type(15) { display: none; }
.showMenu { display: block; }

header {width: 100%; height:100vh; background: rgba(255, 255, 255, 0.96); position: fixed !important; margin-top: 35px; z-index:1; overflow-y: scroll; box-sizing: border-box; text-align: center; }
header section ul li { list-style: none; text-align: left; text-align: center;
    margin-left: -53px;}
header section ul i { margin-right: 10px;}

header section a { border-bottom: 1px solid #4477f2;; background: white; padding: 15px 17px; box-sizing: border-box; display: inline-block;  margin: 10px 10px 10px 0; color: #4477f2; text-decoration: none; }

/*footer*/

#footer { background: #4477f2; padding: 30px 7%; color: white; }
#footer h1 { font-size: 1.25em; margin-top: 20px;}
#footer a { text-decoration: none; color: white; border: 1px solid white; padding: 15px 17px; display: inline-block; margin: 7px 10px 0 0; }
#footer span:nth-of-type(3) { line-height: 1.42; }

/*INDEX*/
.slideshow-container section{ height: 300px; background-size: cover !important; background-position: 50% 50% !important;}

.mySlides:nth-of-type(1) section { background: url("http://i.imgur.com/ZUBV0yV.jpg");}
.mySlides:nth-of-type(2) section { background: url("http://i.imgur.com/gJhSQyG.jpg");}
.mySlides:nth-of-type(3) section { background: url("http://i.imgur.com/XbUXXuK.jpg");}
.mySlides:nth-of-type(4) section { background: url("https://i.imgur.com/NE8zFN9.jpg");}

.prev, .next { color: rgb(30,144,255); padding: 7px 10px; font-size: 1.5em; position: absolute; box-sizing: border-box; }
.prev { margin: -140px 0 0 5%;}
.next { margin: -140px 0 0 87%;}

.mySlides section { text-align: right; font-size: 1em; padding: 70px 36% 0 15%; box-sizing: border-box;}
.mySlides:nth-of-type(1) section { color: white;}
.mySlides h1 { font-weight: bold; font-size: 1.25em; }
.mySlides .actionButton { display: block; margin-top: 10px !important;}

#ikone { width: 100%; background: white; text-align: center; padding: 20px 0; margin-bottom: 40px; }
#ikone a {width: 24.1%;}

#objave { background: gray; margin: 20px auto 0 auto;}
#objave font { display: none;}
#objave article { margin: 10px 0; color: white; padding: 12px 4%; box-sizing: border-box; line-height: 1.42; font-size: 0.8em; border-bottom: 1px solid lightgray;}
#objave article:last-child { margin-bottom: 0; border-bottom: none;}
#objave article h1 { font-weight: 300;}

.bojler { height:auto !important; }

/*STORITVE*/
.storitve { padding: 36px 0 0 0;}

.storitve h1, .lokacija h1, .kontakt h1, .onas h1 { background: #4477f2; width: 100%; margin: 0; padding: 20px 5%; box-sizing: border-box; color: white;}

.storitve ul:nth-of-type(1) { background: white; padding: 20px 7%; box-sizing: border-box; line-height: 1.42;
                                color: dimgray; margin: 0;}
.storitve img { width: 100%;}
.storitve img:nth-of-type(2) { width: 22%; margin: 0 auto !important; display: block;} 

@media screen and (min-width: 768px) { 
    .storitve img { width: 33%; margin: 30px auto; display: block;} 
}
.storitve h3 { font-weight: 400; line-height: 1.42; font-size: 1em; padding: 0 5%;}

/*KONTAKT*/
.lokacija { padding: 40px 0 0 0; box-sizing: border-box; background: white; text-align: center;}
.lokacija ul, .kontakt ul { padding: 0; margin:0;}
.lokacija span { margin-top: 30px; display: block;} .lokacija span strong { color: #4477f2;}
.lokacija iframe { width: 100%; margin: 30px 0 0 0;}

.kontakt form { padding: 20px 5%;}
.kontakt form label { width: 100%; display: block; color: dimgray; margin: 5px 0;}
.kontakt form input, textarea { width: 100%; padding: 10px; box-sizing: border-box; margin: 5px 0 15px 0; }

.kontakt .actionButton { float: left !important; margin: 30px 0 0 0 !important;}
.onas { padding: 30px 0;}
.onas h1 { color: white !important; margin: 80px 0 0 0 !important;}
.onas p  { margin: 10px 5%; line-height: 1.3; color: dimgray;}

#pousti > div {
    padding: 15px;
}
