/*
Theme Name: Wired IT Theme
Author: Wired IT
Author URI: https://www.wiredit.mx/
Description: Template Wired IT 2022
Version: 1.0
*/

/* Fonts */
/*
@font-face{font-family: 'Nombre_Font';src: url('../fonts/Nombre_Font.eot');src: url('../fonts/Nombre_Font.eot?#iefix') format('embedded-opentype'),url('../fonts/Nombre_Font.woff2') format('woff2'),url('../fonts/Nombre_Font.woff') format('woff'),url('../fonts/Nombre_Font.ttf') format('truetype'),url('../fonts/Nombre_Font.svg#Nombre_Font') format('svg');font-weight: normal;font-style: normal;}
*/

/* Generic */
html {
	scroll-behavior: smooth;
}
:root {
	--main-color: #bd3c4b;
	--second-color: #0d6efd;
}
.main-color{color: var(--main-color);}
.second-color{color: var(--second-color);}
.generic-border{border-radius: 3px 3px 3px 3px;-moz-border-radius: 3px 3px 3px 3px;-webkit-border-radius: 3px 3px 3px 3px;}
.btn-main{background:var(--main-color);color:white !important;border-radius: 0;padding:10px 15px;font-weight:700;font-size: 17px;line-height: 1;}
.w-100{width:100%;}
.text-justify{text-align: justify;}
.section > .container{padding-bottom: 0px;}
.mt-50{margin-top:50px !important;}
.mt-40{margin-top:40px !important;}
.mt-30{margin-top:30px !important;}
.mt-20{margin-top:20px !important;}
.mt-10{margin-top:10px !important;}
.mt-0{margin-top:0px !important;}
.mb-50{margin-bottom:50px !important;}
.mb-40{margin-bottom:40px !important;}
.mb-30{margin-bottom:30px !important;}
.mb-20{margin-bottom:20px !important;}
.mb-10{margin-bottom:10px !important;}
.mb-0{margin-bottom:0px !important;}
.pt-50{padding-top:70px !important;}
.pt-50{padding-top:60px !important;}
.pt-50{padding-top:50px !important;}
.pt-40{padding-top:40px !important;}
.pt-30{padding-top:30px !important;}
.pt-20{padding-top:20px !important;}
.pt-10{padding-top:10px !important;}
.pt-0{padding-top:0px !important;}
.pb-70{padding-bottom:70px !important;}
.pb-60{padding-bottom:60px !important;}
.pb-50{padding-bottom:50px !important;}
.pb-40{padding-bottom:40px !important;}
.pb-30{padding-bottom:30px !important;}
.pb-20{padding-bottom:20px !important;}
.pb-10{padding-bottom:10px !important;}
.pb-0{padding-bottom:0px !important;}

.bgsection{background: #001689 !important;}
.bgsection:before {background-color: unset;}

/* Header */
.header .contact-info > .btn-cta{transition: .5s background;}
.header .navbar-brand {height: auto;}
.header .navbar-brand > img{max-width: 200px;}
.header .contact-info{margin: 0;}
.header .contact-info > div{margin-top: 24px;margin-bottom:0;}
.header .contact-info > .btn-cta{margin-top: 20px;}

.navbar-main .rowe{border-top: 1px solid #f2f2f2;}
.navbar-main .navbar-collapse .navbar-nav{float: unset !important;display: flex;justify-content: space-between;}
.navbar-main .navbar-collapse .navbar-nav > li{width: 100%;text-align: center;border-right: solid 1px #f2f2f2;transition:.5s ease all;}
.navbar-main .navbar-collapse .navbar-nav > li:last-child{border-right:unset;}
.navbar-main .navbar-collapse .navbar-nav > li:hover{background: var(--main-color);}
.navbar-main .navbar-collapse .navbar-nav > li:hover > a{color: white;}

/* Footer */
/* -- Bottom */
.footer .fcopy{padding: 30px 0 15px 0;}
.footer .fcopy p{margin-bottom: 10px;}
.footer .fcopy a{color:white}

/* Breadcrumb */
.banner-page{height: 325px;}
.banner-page .title-page{font-size: 3.4rem;}

/* General Form */
/* Visualmente si funciona pero no se va con el formato en el form, esto en JQuery y POST
.sendmail_form input[type="text"]{text-transform:capitalize;}
.sendmail_form input[type="email"]{text-transform:lowercase;}
*/
::-webkit-input-placeholder { /* WebKit browsers */text-transform:none;}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */text-transform:none;}
::-moz-placeholder { /* Mozilla Firefox 19+ */text-transform:none;}
:-ms-input-placeholder { /* Internet Explorer 10+ */text-transform:none;}
::placeholder { /* Recent browsers */text-transform:none;}
.sendmail_form span{color:red;}
.sendmail_form .sendmail_legend{font-size:.8rem;}
.sendmail_form .invalid-feedback{display:none;color:red;}
.sendmail_form .sendmail_ajax_loader{display:none;}
.sendmail_form .sendmail_result{display:none;margin-bottom:0px}

/* Chat */
.chat-whatsapp{position:fixed; width:80px; height:80px; bottom:20px; right:20px; color:#FFF; border-radius:50px; text-align:center; z-index:999;}
.chat-facebook{position:fixed; width:60px; height:60px; bottom:20px; right:20px; color:#FFF; border-radius:50px; text-align:center; z-index:999;}
.my-chat{margin-top:22px;}

/* Home */

/* About us */
#about-us .box-about-us{border: dashed 3px var(--main-color);padding: 15px 20px;margin-bottom: 15px;}
#about-us .box-about-us h3{color:var(--main-color);}
#about-us .box-about-us p{margin-bottom:0;min-height: 90px;}

/* Because */
#because iframe{width:100%;}
#because h2{color:var(--main-color)}
#because #gallery-about-us img{height: 309px;object-fit: cover;}
#because .row-items{display: flex;justify-content: space-between;flex-wrap: wrap;}
#because .row-items .col{flex: 1 1 33%;padding: 5px;margin-bottom:10px;}
#because .row-items .col .card-icon{background: #eff3f6;padding: 10px 10px;display: block;text-align: center;border-radius: 20px;}
#because .row-items .col .card-icon h3{font-size: 18px;font-weight: normal;border-top: solid 2px var(--main-color);padding-top: 10px;margin-top: 15px;display: block;margin-bottom: 0;}
#because .row-items .col .card-icon .icon{display: inline-block;transition:.5s all;width: 100px;border-radius: 50%;padding: 5px;overflow: visible;border: dashed 2px #eff3f6;max-width: 70px;}
#because .row-items .col .card-icon:hover .icon{padding: 15px;border: dashed 2px var(--main-color);}

/* Services */
#services .container {padding-bottom: 70px;padding-top:70px;}
#services .text-muted{color:#777 !important}
#services .row-services{display: flex;flex-wrap: wrap;}
#services .row-services .column{flex: 1 1 25%;}
#services .row-services .column .box{position: relative;margin: 0px 7px 20px 7px;}
#services .row-services .column .box:after,
#services .row-services .column .box:before{position:absolute;content:"";width:0%;height:0%;background:var(--main-color);z-index: 1;transition:.5s all;}
#services .row-services .column:hover .box:after,
#services .row-services .column:hover .box:before{width:100%;height:100%;}
#services .row-services .column .box:after{right: 0;bottom: -3px;}
#services .row-services .column .box:before{left: 0;top: -3px;}
#services .row-services .column .box .box-services{text-align: center;margin: 3px;background: white;padding: 20px;position:relative;z-index: 2;}
#services .row-services .column .box .box-services .icon{max-width: 140px;margin-right: auto;margin-left: auto;}
#services .row-services .column .box .box-services .icon img{width:100%;}
#services .row-services .column .box .box-services .body-content{margin-top: 10px;min-height: 45px;}
#services .row-services .column .box .box-services .body-content .heading{margin: 0;font-size: 16px;text-align: center;color: var(--main-color);line-height: 1.2;}

/* Equipment */
#equipment .container{padding-bottom: 70px;padding-top:70px;}
#equipment .text-muted{color:#777 !important}
#equipment .row-equipment{display: flex;flex-wrap: wrap;}
#equipment .row-equipment .column{flex: 1 1 20%;}
#equipment .row-equipment .column .box-equipment{background: #f7f7f7;margin: 6px;padding: 20px;border: solid 3px #f7f7f7;transition:.5s ease all;}
#equipment .row-equipment .column .box-equipment:hover{border: solid 3px var(--main-color);background: transparent;}
#equipment .row-equipment .column .box-equipment .icon{max-width: 140px;margin-right: auto;margin-left: auto;}
#equipment .row-equipment .column .box-equipment .icon img{width:100%;}
#equipment .row-equipment .column .box-equipment .body-content{margin-top: 10px;min-height: 45px;}
#equipment .row-equipment .column .box-equipment .body-content .heading{margin: 0;font-size: 16px;text-align: center;color: var(--main-color);line-height: 1.2;}

/* Gallery */
#projects .section-heading.white{border-color: #000;margin-bottom: 0;}
#projects .section-heading::before {border-top: 2px solid white;}
#projects .grid-services{margin-top: 0;}
#projects .grid-services .box-image-4 .media img{height: 180px;object-fit: cover;}

/* Reportes */
#reportes .input-group .form-control{border-radius: 0;padding: 14px 10px;height: auto;}
#reportes .btn-default:hover{color:white;}

/* Contact */
#contact.section > .container{padding-bottom: 50px;}
#contact .section-heading{margin-bottom: 0;margin-top: 0;}
#contact .text-muted{color:#777 !important}
#contact .widget-title{font-size: 30px;}
#contact address{font-style: normal;}
#contact textarea,
#contact input{border-radius: 0;height: auto;padding: 12px 10px;border: solid 2px #eee;box-shadow: unset;}
#contact button{color:white !important;}

.contact-information{margin: 0 0 0px 0;}
.contact-information li{display: flex;align-items: center;margin-bottom: 30px;}
.contact-information li .icon{margin-right: 10px;max-width: 70px;}
.contact-information li .icon img{width:100%;}
.contact-information li .content{}
.contact-information li .content p{margin-bottom: 5px;color: #686868;text-transform: uppercase;font-weight: 700;}
.contact-information li .content a{color: var(--main-color);}


/*REFERENCIA PARA LAS MEDIDAS https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ */
/*MEDIA QUERY GENERICO QUE PUEDE APLICAR PARA TODOS LOS CELULARES*/
@media screen and (max-width: 1399px){
	
}
@media screen and (max-width: 1199px){
	/* About us */
	#about-us .box-about-us p{min-height: auto;}
	/* Equipment */
	#equipment .row-equipment .column{flex: 1 1 33%;}
}
@media screen and (max-width: 991px){
	/* Header */
	.header .box-icon-1 .icon{display: none;}
	.header .box-icon-1 .body-content{margin-left: 0;}
	.header .navbar-main .navbar-brand{top: -70px;}
	.header .navbar-main .navbar-brand > img{max-width: 150px;width: 100%;}
	
	.navbar-main .navbar-collapse .navbar-nav{align-items: center;}
	/* .navbar-main .navbar-collapse .navbar-nav > li:nth-child(4){width: 136%;} */
	
	/* Breadcrumb */
	.banner-page .title-page{font-size: 3rem;}
	
	/* Services */
	#services .row-services .column{flex: 1 1 30%;}
	
	/* Contact */
	#contact iframe{height: 100%;min-height: 200px;}
}
@media screen and (max-width: 767px){
	/* Header */
	.navbar-main .navbar-collapse .navbar-nav{display: block;float: left !important;width: 100%;margin: auto;}
	.navbar-main .navbar-collapse .navbar-nav > li{border-right: unset;}
	.header .navbar-main .navbar-brand{top: 8px;}
	.header .contact-info{float: unset;display: flex;justify-content: space-between;align-items: center;}
	.topbar .topbar-right .topbar-menu{display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}
	.header .navbar-main .navbar-brand > img{max-width: 116px;}
	
	/* Breadcrumb */
	.banner-page{height: auto;padding: 48px 15px 165px 15px;}
	.banner-page > .container{padding: 0;}
	
	/* Because */
	#because iframe{height: 100%;}
	
	/* Services */
	#services .row-services .column{flex: 1 1 50%;}
	
	/* Equipment */
	#equipment .row-equipment .column{flex: 1 1 50%;}
	
	/* Gallery */
	#projects .grid-services .box-image-4 .media img{height: 140px;}

	/* Footer */
	.footer .footer-item .logo-bottom{max-width: 300px;margin-right: auto;margin-left: auto;display: block;}
	.footer .fcopy p,
	.footer .fcopy .text-right{text-align: center;}
}
@media screen and (max-width: 575px){
	/* Header */
	.header .contact-info > div:first-child{margin-top: 0;}
	.header .contact-info > div{margin-right: 0;}
	.header .contact-info{flex-direction: column;}
	.header .contact-info > .btn-cta{display:none;}
	
	/* Services */
	#services .row-services .column{flex: 1 1 100%;}
	
	/* Equipment */
	#equipment .row-equipment .column{flex: 1 1 100%;}
	#equipment .row-equipment .column .box-equipment .body-content{min-height: auto;}
	
	/* Contact */
	.contact-information li .icon{max-width: 50px;}
	.contact-information li .content a{font-size: 13px;}
}