/*

Theme Name: SM Theme

Theme URI: 

Description: SM Folije Zenica

Author: Vedad Hamzić

Author URI: www.vedadhamzic.com

Version: 1.0

Tags: responsive, wordpress, modern design, llumar window films

*/



@import url("css/reset.css");





body {

font-family: 'Open Sans', 'Montserrat', Arial, sans-serif;

color: black;

}



#pagewrapper {

margin: 0 auto;

overflow-x: hidden;

}





#info-bar,

#pagetitle,

#content,

footer {

padding-left: 15%;

padding-right: 15%;

width: 70%;

}





/* INFO BAR STYLES */



#info-bar {

background-color: #2f3335;

font-size: 14px;

color: #fdfdfd;

text-align: center;

overflow-x: hidden; 

}



#info-bar p {

float: left;

}



#info-bar img {

padding-right: 10px;

margin-bottom: -3px;

}



#info-bar p.radno-vrijeme {

float: left;

}



#info-bar p.tel {

float: right;

}



#info-bar p.adresa {

margin-left: 24%;

}



/* ----------> END INFO BAR STYLES */







#pagetitle, #main-menu {

background-color: #d14d45;

}



#pagetitle {

float: left;

padding-top: 30px;

padding-bottom: 20px;

}



#pagetitle h1 {

font-family: 'Montserrat', sans-serif;

font-weight: 400;

font-size: 38px;

text-shadow: 0px 5px 8.64px rgba(0, 0, 0, 0.2);

margin-bottom: 0;

padding-bottom: 10px;

}



#pagetitle a:link,

#pagetitle a:visited,

#pagetitle a:active {

text-decoration: none;

color: #030303;

}



#pagetitle span.sm {

color: #fffefe;

}



#pagetitle a:hover {

text-shadow: 0px 5px 8.64px rgba(240, 238, 238, 0.2);

}







/* MAIN MENU STYLES */



#main-menu {

clear: both;

float: none;

text-align: center;

font-family: 'Montserrat', sans-serif;

font-weight: 400;

}



#main-menu ul {

list-style: none;

padding-bottom: 20px;

padding-top: 0;

margin-top: 0;

}



#main-menu ul li {

display: inline;

font-size: 18px;

text-transform: uppercase;

text-shadow: 0px 5px 8.64px rgba(0, 0, 0, 0.2);

}



#main-menu ul li a {

text-decoration: none;

color: #fffefe;

padding-left: 25px;

padding-right: 25px;

}



#main-menu ul li a:link,					

#main-menu ul li a:active,

#main-menu ul li a:visited {

color: #fffefe;

}



#main-menu ul li a:hover {

text-shadow: 0px 2px 4px rgba(240, 238, 238, 0.5);

color: #030303;

-webkit-border-image: url(css/images/menu-item-border.png) 0 0 1 0;

-moz-border-image: url(css/images/menu-item-border.png) 0 0 1 0;

-o-border-image: url(css/images/menu-item-border.png) 0 0 1 0; 

border-image: url(css/images/menu-item-border.png) 0 0 1 0;

border-bottom: solid 1px transparent;

border-width: 2px;

padding-left: 23px;

padding-right: 23px;

}





/* ----------> END MENU STYLES */



#content {

clear: both;

float: left;

}



footer {

clear: both;

float: left;

padding-top: 45px;

padding-bottom: 35px;

background-color: #1c1e1f;

}



footer p {

float: left;

color: #fdfdfd;

font-size: 14px;

}



footer #social-icons {

float: right;

}







/* ELEMENTS */



.slider-rev {

margin-bottom: 0;

border-top: 3px solid white;

border-bottom: 3px solid white;

} 



#infoblock {

border-top: 7px solid #d14d45;

margin-top: -35px;

height: 100%;

}



.infoblock-title {

text-transform: uppercase;

text-shadow: 0px 5px 8.64px rgba(0, 0, 0, 0.2);

padding-bottom: 0;

margin-bottom: 0;

line-height: 1.3;

}



.llumar-btn {

font-family: 'Open Sans';

background-color: transparent;

color: white;

padding: 18px 35px;

text-align: center;

text-decoration: none;

font-size: 16px;

cursor: pointer;

border: 1px solid #fdfdfd;

margin: 0 auto;

width: 185px;

letter-spacing: 1.5px;

display: block;

}



.llumar-btn a {

text-decoration: none;

text-transform: uppercase;

color: #fdfdfd;

}



button.llumar-btn:hover {

background-color: rgba(255,255,255,0.2);

}



button.llumar-btn:hover > a {

color: #1c1e1f;

font-weight: 700;

text-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);

}



.onama-naslov {

text-transform: uppercase;

color: #515452;

font-size: 22px;

}



.onama-tekst {

font-size: 16px;

color: #515452;

font-weight: 200;

}



.banner-naslov p {

color: red;	

}



.projekti-naslov {

text-transform: uppercase;

color: #515452;

font-size: 28px;

font-weight: 400;

}



.footer-title {

text-transform: uppercase;

letter-spacing: 1px;

text-shadow: 0px 5px 8.64px rgba(0, 0, 0, 0.2);

}



.kontakt {

color: #ffffff;

font-size: 14px;

font-weight: 400;

text-shadow: 0px 5px 8.64px rgba(0, 0, 0, 0.2);

}



span.kontakt-email {

color: #d14d45;

padding-right: 35px;

}



span.kontakt-tel {

color: #d14d45;

padding-right: 50px;

}



span.kontakt-mob {

color: #d14d45;

padding-right: 40px;

}



.footer-btn {

font-family: 'Open Sans';

background-color: transparent;

color: white;

padding: 12px 25px;

text-align: center;

text-decoration: none;

font-size: 14px;

cursor: pointer;

border: 1px solid #fdfdfd;

margin: 0 auto;

width: 185px;

letter-spacing: 1.5px;

display: block;

float: left;

}



.footer-btn a {

text-decoration: none;

text-transform: uppercase;

color: #fdfdfd;

}



button.footer-btn:hover {

background-color: rgba(255,255,255,0.8);

}



button.footer-btn:hover > a {

color: #d14d45;

font-weight: 700;

text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);

}



/* ----------> END ELEMENTS */





/* CONTACT FORM */



.form-field {

width: 65%;

height: 50px;

}



.form-field-upit {

width: 80%;

height: 250px;

}



#kontakt-forma input,

#kontakt-forma textarea {

padding-left: 10px;

font-size: 18px;

}



#kontakt-forma textarea {

padding-top: 10px;

margin-bottom: 20px;

}



::-webkit-input-placeholder { /* WebKit, Blink, Edge */

    color: #bdbebf;

}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

   color: #bdbebf;

   opacity: 1;

}

::-moz-placeholder { /* Mozilla Firefox 19+ */

   color: #bdbebf;

   opacity: 1;

}

:-ms-input-placeholder { /* Internet Explorer 10-11 */

   color: #bdbebf;

}

:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */

  color: #bdbebf;

}



#kontakt-forma .obavezno {

color: #d14d45;

}



#kontakt-forma .submit-btn {

font-family: 'Open Sans';

background-color: #d14d45;

color: white;

padding: 12px 25px;

text-align: center;

text-decoration: none;

font-size: 18px;

cursor: pointer;

border: 1px solid #fdfdfd;

margin: 0 auto;

width: 185px;

letter-spacing: 1.5px;

display: block;

float: left;

}











/* ----------> END CONTACT FORM */









/* MEDIA QUERIES */











/* INFO BAR RESPONSIVE FEATURES */

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



#info-bar {

font-size: 13px;

}



#info-bar p.adresa {

margin-left: 23%;

}



}



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



#info-bar {

font-size: 13px;

}



#info-bar p.adresa {

margin-left: 22%;

}



}



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



#info-bar {

font-size: 12px;

}



#info-bar p.adresa {

margin-left: 20%;

}



#main-menu ul li {

font-size: 17px;

}



#main-menu ul li a {

padding-left: 22px;

padding-right: 22px;

}



}





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



#info-bar {

font-size: 11px;

}



#info-bar p.adresa {

margin-left: 10%;

}



#info-bar img {

padding-right: 7px;

}



}





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



#info-bar {

font-size: 11px;

}



#info-bar p.adresa, 

#info-bar p.radno-vrijeme,

#info-bar p.tel {

float: left;

padding-right: 5px;

}



#info-bar p.adresa {

margin-left: 0;

}



#info-bar img {

padding-right: 5px;

}



#main-menu ul li {

font-size: 13px;

}



#main-menu ul li a {

padding-left: 15px;

padding-right: 15px;

}



}





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



#pagetitle {

float: none;

text-align: center;

padding-top: 10px;

padding-bottom: 10px;

}



#main-menu ul {

text-align: center;

padding-bottom: 0;

padding-left: 0;

}



#main-menu ul li {

display: block;

font-size: 15px;

padding-bottom: 10px;

}



#main-menu ul li a {

padding-left: 0;

padding-right: 0;

}



}







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



#info-bar {

font-size: 10px;

}



#info-bar p {

padding-top: 2px;

padding-bottom: 2px;

}



#info-bar img {

width: 10px;

height: 10px;

padding-right: 2px;

margin-bottom: -2px;

}



#info-bar p.adresa, 

#info-bar p.radno-vrijeme,

#info-bar p.tel {

float: left;

padding-right: 5px;

}



#info-bar p.adresa {

margin-left: 0;

}





}

/* ----------> END INFO BAR RESPONSIVE FEATURES */





/* ----------> END MEDIA QUERIES */





#pagesWrapper p {

color: black;

font-size: 16px;

font-weight: 300;

letter-spacing: 0.7px;

line-height: 1.8;

}



#pagesWrapper {

width: 100%;

height: auto;

padding-left: 0;

padding-right: 0;

color: black;

text-align: left;

}



.breadcrumbs {

text-align: right;

color: #2f3335;

font-weight: 400;

font-size: 15px;

letter-spacing: 2px;

text-shadow: 0px 2px 3px rgba(150, 150, 150, 0.5);

}



.breadcrumbs a:link,

.breadcrumbs a:visited,

.breadcrumbs a:active {

color: #d14d45;

text-decoration: none;

text-transform: uppercase;

}



.breadcrumbs a:hover {

color: #7d9dad;

}



.pagesTitle {

padding-top: 30px;

padding-bottom: 30px;

border-bottom: 2px solid #d14d45;

}



.pagesTitle h1 {

color: #2f3335;

text-shadow: 0px 2px 3px rgba(150, 150, 150, 0.7);

text-align: left;

line-height: 1.1;

letter-spacing: 1px;

padding-bottom: 5px;

font-size: 36px;

font-weight: 600;

text-transform: uppercase;

}



.pagesContent {

padding-top: 30px;

padding-bottom: 20px;

}



.pagesContent h3 {

font-size: 32px;

font-weight: bold;

font-style: italic;

line-height: 1.5;

letter-spacing: 1px;

text-shadow: 0px 2px 3px rgba(150, 150, 150, 0.4);

}



.llumar-link {

text-align: center;

}



.llumar-link a:link,

.llumar-link a:active,

.llumar-link a:visited,

.usluge a:link,

.usluge a:active,

.usluge a:visited {

text-decoration: none;

color: #d14d45;

}



.llumar-link a:hover,

.usluge a:hover {

color: #7d9dad;

}