/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/


body { color:#FFF;}
#site-header { background:#000; padding-top:10px; padding-bottom:10px}

.apidata_images { width:100%; padding:0; margin:0; overflow:hidden;}
.apidata_images .img_box { width:19.9%; float:left; margin:0 .1% .1% 0;}
.cams_img { position:relative; width:100%; padding:0; margin:0; overflow:hidden;background-repeat: no-repeat !important; background-position: center !important; background-size: cover !important;/* min-height:262px*/}
.onlinestatus {position: absolute;width: 14px;height: 14px;background: #29c10e;top: 10px;left: 10px;border-radius: 100%;}
.offlinestaus {position: absolute;width: 14px;height: 14px;background: #aeaeae;top: 10px;left: 10px;border-radius: 100%;}
.cams_label {position: absolute;top: 4%;right: 3%;}
.cams_label .label { border-radius:4px;width:40px; font-size:12px; line-height:16px; color:#FFF; text-align:center; margin-bottom:3px}
.cam_hd {background: #2c2c2c;}
.cam_new { background:#FA5522}
.cam_toy { background:#FA5522}

.cam-item__hovered:hover { opacity:1}
.cam-item__hovered {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: opacity .3s ease-in;
    transition: opacity .3s ease-in;
}

.cam-item__overlay {
    position: absolute;
    bottom: -1px;
    left: -1px;
    right: -1px;
    top: 0;
    background: black;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.85)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.85) 100%);
}

.cam-item__info {
    width: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 2% 3%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-weight: 600;
	color:#FFF;
	font-size:14px;
}

.cams_count::before {
    content: "";
    position: absolute;
    top: 5px;
    z-index: 2;
    width: 14px;
    height: 14px;
    margin-left: -25px;
    border-radius: 50%;
    background: #29c10e;
    
}
.cams_count {
    position: relative;
    margin-left: 25px;
	color:#FFF;
	padding-bottom:35px;
	width:100%;
}


.video-container { position:absolute; top:0; left:0; height:100%; width:100%}
.video-container video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; /*to cover all the box*/
}


.ratio-16x9 {
    width: 100%;
    height: 0;
    padding-bottom: 55.25%;
}

video::-webkit-media-controls {
  display: none !important;
}


.apidata_images .img_box h6 { color:#FFF; font-size:12px; line-height:18px; padding:0; margin:0}



#site-footer {background:#222222;}


#List { width:100%; padding:0; margin:0; overflow:hidden}
#List .img_box{ display:none;}
#loadMore {color:#000;cursor:pointer;display:block;width:100%; background:#FFF; padding:10px 15px; margin:35px auto 25px; max-width:200px; text-align:center; font-size:16px; font-weight:700; text-transform:uppercase}
#loadMore:hover {color:black;}
.search_form {background: #242424;padding: 30px; display:none}
.search_form input[type="checkbox"] { margin:0 8px 0 0}
.search_form h6 { text-transform:uppercase;background:#4e4e4e;padding: 5px 10px; font-weight:600}
.search_form label { text-transform:uppercase; font-size:14px;}
.search_form h3 { padding:0; margin:0; font-size:22px; line-height:30px;}
.search_form input[type="submit"] { background:#FFF !important; color:#000 !important;text-transform:uppercase;font-weight:600}
#flip {color:#000;cursor:pointer;display:block;width:100%; background:#FFF; padding:10px 15px; margin:0; max-width:320px; text-align:center; font-size:16px; font-weight:700; text-transform:uppercase; float:right}
.findcamsbtn { width:100%; padding:0; margin:0; overflow:hidden;}

.paddingBlock {
  padding: 20px 0;
}

.eqWrap {
  display: flex;
}

.eq {
  padding: 10px;
}

.eq:nth-of-type(odd) {
	border:1px solid #434343;
}

.eq:nth-of-type(even) {
  border:1px solid #434343;
}

.equalHW {
  flex: 1;
}

.equalHMWrap {
  justify-content: space-between;
}

.equalHM {
  width: 32%;
}

.equalHMRWrap {
  justify-content: space-between;
  flex-wrap: wrap;
}

.equalHMR {
  width: 32%;
  margin-bottom: 2%;
}

.equalHMVWrap {
  flex-wrap: wrap;
}

.equalHMV {
  width: 13.4%;
  margin: .5%;
}

.equalHMV:nth-of-type(7n) {
  margin-right: 0;
}

.equalHMV:nth-of-type(7n+1) {
  margin-left: 0;
}



@media screen and (max-width:576px) {
.apidata_images .img_box { width:99.9%; float:left; margin:0 .1% .1% 0; }	
.cam-item__hovered { opacity:1}
.site-header {padding-right: 0px;padding-left: 10px;}
.equalHMV {width: 48.4%;}
.search_form { padding:30px 10px}
}

@media only screen and (min-width:577px) and (max-width:767px) {
.apidata_images .img_box { width:49.9%; float:left; margin:0 .1% .1% 0; }	
.cam-item__hovered { opacity:1}
.site-header {padding-right: 0px;padding-left: 20px;}	
}
@media only screen and (min-width:768px) and (max-width:991px) {
.apidata_images .img_box { width:32.9%; float:left; margin:0 .1% .1% 0; }	
.cam-item__hovered { opacity:1}
}