/*
Theme Name: locksmithofcicero.net
Theme URI: locksmithofcicero.net
*/

body,html{height:100%;width:100%;margin:0;padding:0;left:0;top:0;font-size:100%}.center,.container{margin-left:auto;margin-right:auto}*{line-height:1.5}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.375rem}h4{font-size:1.125rem}h5{font-size:1rem}h6{font-size:.875rem}p{font-size:1.125rem;font-weight:200;line-height:1.8}.font-light{font-weight:300}.font-regular{font-weight:400}.font-heavy{font-weight:700}.left{text-align:left}.right{text-align:right}.center{text-align:center}.justify{text-align:justify}.container{width:90%}.row{position:relative;width:100%}.row [class^=col]{float:left;margin:.5rem 2%;}.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{width:96%}.col-1-sm{width:4.33%}.col-2-sm{width:12.66%}.col-3-sm{width:21%}.col-4-sm{width:29.33%}.col-5-sm{width:37.66%}.col-6-sm{width:46%}.col-7-sm{width:54.33%}.col-8-sm{width:62.66%}.col-9-sm{width:71%}.col-10-sm{width:79.33%}.col-11-sm{width:87.66%}.col-12-sm{width:96%}.row::after{content:"";display:table;clear:both}.hidden-sm{display:none}@media only screen and (min-width:33.75em){.container{width:80%}}@media only screen and (min-width:45em){.col-1{width:4.33%}.col-2{width:12.66%}.col-3{width:21%}.col-4{width:29.33%}.col-5{width:37.66%}.col-6{width:46%}.col-7{width:54.33%}.col-8{width:62.66%}.col-9{width:71%}.col-10{width:79.33%}.col-11{width:87.66%}.col-12{width:96%}.hidden-sm{display:block}}@media only screen and (min-width:60em){.container{width:75%;max-width:60rem}}
body {background:#fff;font-family: 'Oswald', sans-serif;}
.clear{clear:both}
.container {max-width:970px;}
/* --- Header --- */
.site-header {margin:0;padding:15px 0;background:#fff;}
.site-branding {overflow:hidden;padding:0;}
.site-branding img {height:60px;width:auto;max-width:100%;}
.site-phone {text-align:right;overflow:hidden;padding:0;}
.site-phone a{font-size:20px;display:inline-block;margin:10px 0;padding:0 15px;height:40px;line-height:40px;border:2px solid #000;border-radius:50px;text-decoration:none;transition:.5s ease;}
.site-phone a:hover {background:#8aff02;}
/* --- menu --- */
#menu {position:relative;display:block;overflow:hidden;float:none;padding:0;margin:0;}
#menu ul {padding:0;margin:0;text-align:center;}
#menu ul li {display:block;float:left;text-align:center;}
#menu ul li a {position:relative;display:block;height:60px;line-height:60px;padding:0 10px;margin:0px;font-size:16px;color:#000;font-weight:bold;outline:none;border-bottom:1px solid #999;}
#menu ul li:hover a, #menu ul li.current_page_item a, #menu ul li.current-menu-item a {color:#000;text-decoration:none;}
#menu ul li.current_page_item, #menu ul li.current-menu-item {overflow:hidden;}
#menu input[type=checkbox], #menu label {display:none}
/* --- Banner --- */
.banner {padding:35px 0 15px;background:#efefef url(img/shadow.png) no-repeat top center;border-top:1px solid #bfbfbf;}
.banner img {width:100%;height:auto;border-radius:5px;transition:all .3s ease;}
.banner:hover img {opacity:0.7;}
/* --- h1 --- */
.entry-header {margin:0 0 10px;padding:0;}
.entry-header h1 {font-size:2.5em;padding:10px 0;margin:0;}
.entry-header a {color:#000;font-weight:bold;text-decoration:none;}
/* --- Script Box --- */
.entry-content {color:#666666;}
.entry-content img {max-width:100%;height:auto;border-radius:5px;}
.entry-content a {color:#ff0033;}
/* --- --- */
.postwidgetbox {padding:25px 0;box-sizing:border-box;}
.offer {margin:0 0 15px;text-align:center;box-sizing:border-box;}
.offer img {box-sizing:border-box;max-width:100%;height:370px;border:4px solid #fff;border-radius:5px;box-shadow:0 0 5px #ccc;cursor:pointer;transition:0.3s;}
.offer img:hover {opacity: 0.7;}
.widget {margin:0 0 15px;min-height:370px;box-sizing:border-box;background:#4184ec;background-image:linear-gradient(#4184ec,#0abbfe);border:4px solid #fff;border-radius:5px;box-shadow:0 0 5px #ccc;}
.widget h3 {margin:0;padding:5px 0;text-align:center;color:#fff;}
.widget form {color:#fff;padding:0 10px;box-sizing:border-box;}
.widget form input[type=text], .widget form input[type=email], .widget form input[type=tel] {color:#000;width:100%;padding:4px 5px;margin:2px 0;box-sizing:border-box;border:1px solid #d4d4d4;border-radius:5px;box-shadow:0 0 2px #bebebe;}
.widget form textarea {color:#000;width:100%;height:80px;padding:4px 5px;margin:2px 0;box-sizing:border-box;border:1px solid #d4d4d4;border-radius:5px;box-shadow:0 0 2px #bebebe;}
.widget form input[type=submit] {width:100%;background:#000;border:none;color:white;padding:4px 32px;text-decoration:none;margin:2px;cursor:pointer;border-radius:5px;}
.widget form br {display:none;}
div.wpcf7 .ajax-loader {display:none;}
.widget ul {color:#fff;padding:10px;margin:0;list-style-type:none;border-radius:0 0 5px 5px;}
.widget ul li {padding:4px 0;font-size:16px;text-transform:capitalize;list-style:inside;}
.widget a {color:#fff;}
/* --- --- */
.pricesbox {margin:15px 0 0;padding:15px;background:#eaeaea;color:#000;}
.pricesbox h4 {font-size:20px;margin:0 0 10px;padding:5px;text-align:center;background:#000;color:#fff;border-radius:5px;}
.pricesbox ul {margin:0;padding:0 0 0 10px;}
/* --- --- */
.site-footer {margin:0;background:#232323;color:#ababab;padding:0;font-size:14px;text-align:center;}
footer h3{margin:10px 0;padding:10px 0;font-weight:bold;background:url(img/footerh3.png) repeat-x bottom;}
footer ul{padding-left:5px;list-style:none;}
footer img {width:100%;position:relative;height:auto;}
footer a {color:#FFAD57;}
/* --- --- */
.copyright {background:#2b2b2b;color:#969696;padding:25px 0;text-align:center;font-size:16px;}
.copyright a {color:#969696;}

.topbutton {position:fixed;right:15px;bottom:10px;background:rgba(0,0,0,0.5);color:#fff;padding:10px;border-radius:50px;z-index:113}
.topbutton:hover {background:#000;}
.topbutton:visited{color:#fff;}
.mophonel{display:none}
@media (max-width:480px){.topbutton {bottom:70px;}.mophonel{display:block;position:fixed;bottom:0;right:0;width:100%;height:60px;line-height:60px;background:#57c200;color:#fff;text-align:center;font-size:24px;z-index:112}
.mophonel:hover {color:#fff;}}

@media (max-width:768px) {
	
	.site-branding {text-align:center;}
	.site-branding img {width:350px;max-width:100%;height:auto;}
	.site-phone {text-align:center;}
	#menu{width:100%;height:auto;min-height:40px;padding:0;}
	#menu ul li{border-bottom:solid 1px #0078de;height:40px;line-height:40px;width:100%;padding:0;text-align:center;}
        #menu ul li a {height:30px;line-height:30px;}
	#menu ul li.current_page_item a, #menu ul li.current-menu-item a {color:#FFF;background:#0078de;}
	#menu ul li:hover a{background:#000;color:#FFF}
	.show-menu{display:block;color:#fff;text-align:center;padding:10px 0;margin-bottom:5px;background:#000;}
	input[type=checkbox]:checked ~ #sub-menu{display:block;margin:0;padding:0;}

}



/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

/* Caption of Modal Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation */
.modal-content, #caption {    
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}

@keyframes zoom {
    from {transform: scale(0.1)} 
    to {transform: scale(1)}
}

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}




