/* font - kanit google font

	font weights:
	- blod: 700
	- medium: 500
	- regular: 400
	- extralight: 200

------------------------------------------------------------------------------------------------------  */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');


/* root
------------------------------------------------------------------------------------------------------  */
:root {
	
	/* font  */
	--font: 'Inter', sans-serif;

	/* font weight */
	--font-bold: 700;
	--font-medium: 500;
	--font-regular: 400;
	--font-extralight: 200;

	/* colores */
	--color-primary: #6a80e4;
    --color-secondary: #06090d;
	--color-tertiary: #888b9e;
	--color-black: #000; 
	--color-white: #fff; 
	/*--color-lightgrey: #838386;*/
	--color-lightgrey: #c3c3c3; 
	--color-success: #468b12;
	--color-button: #768cec;
	
	

}


	/* body
	------------------------------------------------------------------------------------------------------  */
	body {
		margin: 0 auto;
		width: 100%;
		padding: 0px;
		font-size: 16px;
		color: var(--color-white);
		font-family: var(--font);
		font-weight: var(--font-extralight);
		background-color: var(--color-secondary);
		text-align: left;
		z-index: 1;
	}
	
	@keyframes animatedBackground {
	  from {
	    background-position: 0 0;
	  }
	  to {
	    background-position: 100% 0;
	  }
	}
	@-webkit-keyframes backgroundScroll {
	  from {
	    background-position: 0 0;
	  }
	  to {
	    background-position: 100% 0;
	  }
	}
	.header-home{
		background-image: url('../img/home/header.jpg');
		background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 8s linear infinite alternate;
	    -webkit-animation: animatedBackground 8s linear infinite alternate;	    
	}	

	.header-petromech{
		background-image: url('../img/petromech/petromech_header.jpg'), url('../img/Ellipse-6.png');
		background-repeat: no-repeat, no-repeat;
		background-position: center top, left -800px;
		background-size: 100%, 1300px;
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;	*/    
	}
	.header-contacto{
		background-image: url('../img/contact/contact_header.jpg'), url('../img/Ellipse-6.png');
		background-repeat: no-repeat, no-repeat;
		background-position: center top, left -800px;
		background-size: 100%, 1300px;
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;*/	    
	}
	.header-cuttings{
		background-image: url('../img/cuttings/cuttings_header.jpg'), url('../img/Ellipse-6.png');
		background-repeat: no-repeat, no-repeat;
		background-position: center top, left -800px;
		background-size: 100%, 1300px;
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;	*/
	}
	.header-deepdrill{
		background-image: url('../img/drilldeep/drillsense_header.jpg'), url('../img/Ellipse-6.png'), url('../img/drilldeep/deep_banner.jpg');
		background-repeat: no-repeat, no-repeat, no-repeat;
		background-position: center top, left -800px, center 65%;
		background-size: 100%, 1300px, 100%;
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;*/ 
	}
	.header-whygeolog{
		background-image: url('../img/geolog/geolog_header.jpg'), url('../img/Ellipse-6.png'), url('../img/geolog/geolog_banner.png');
		background-repeat: no-repeat, no-repeat, no-repeat;
		background-position: center top, left -800px, center 55%;
		background-size: 100%, 1300px, 100%;	
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;*/    
	}
	.header-resources{
		background-image: url('../img/resources/resources_header.jpg'), url('../img/Ellipse-6.png');
		background-repeat: no-repeat, no-repeat;
		background-position: center top, left -800px;
		background-size: 100%, 1300px;
		/*background-position: 0px 0px;
	    background-repeat: repeat-x;
	    animation: animatedBackground 3s linear infinite alternate;
	    -webkit-animation: animatedBackground 3s linear infinite alternate;*/ 
	}
	/*.header-smartshaker{
		background-image: url('../img/smartshaker/smart_header.jpg'), url('../img/Ellipse-6.png');
		background-repeat: no-repeat, no-repeat;
		background-position: center top, left -800px;
		background-size: 100%, 1300px;		
	}*/
	
	#background-video {
	   width: 100%;
	   height: 67%;
	   object-fit: cover;
	   position: absolute;
	   /*left: 0;*/
	   right: 0;
	   top: 0;
	   bottom: 0;
	   z-index: -1;
	}
	

	/* layout cols
	------------------------------------------------------------------------------------------------------  */
	.col_100    { float: left; margin: 0px; padding: 0px; width: 100%; }
	.col_90     { float: left; margin: 0px; padding: 0px; width: 90%; }
	.col_80     { float: left; margin: 0px; padding: 0px; width: 80%; }
	.col_75     { float: left; margin: 0px; padding: 0px; width: 75%; }
	.col_70     { float: left; margin: 0px; padding: 0px; width: 70%; }
	.col_66     { float: left; margin: 0px; padding: 0px; width: 66.66%; }
	.col_65     { float: left; margin: 0px; padding: 0px; width: 65%; }
	.col_60     { float: left; margin: 0px; padding: 0px; width: 60%; }
	.col_55     { float: left; margin: 0px; padding: 0px; width: 55%; }
	.col_50     { float: left; margin: 0px; padding: 0px; width: 50%; }
	.col_45     { float: left; margin: 0px; padding: 0px; width: 45%; }
	.col_40     { float: left; margin: 0px; padding: 0px; width: 40%; }
	.col_35     { float: left; margin: 0px; padding: 0px; width: 35%; }
	.col_33     { float: left; margin: 0px; padding: 0px; width: 33.33%; }
	.col_30     { float: left; margin: 0px; padding: 0px; width: 30%; }
	.col_25     { float: left; margin: 0px; padding: 0px; width: 25%; }
	.col_20     { float: left; margin: 0px; padding: 0px; width: 20%; }
	.col_10     { float: left; margin: 0px; padding: 0px; width: 10%; }


	/* row
	------------------------------------------------------------------------------------------------------  */
	.row{
		width: 100%;
		margin: 0 auto;
		padding: 0px;
	}


	/* contents
	------------------------------------------------------------------------------------------------------  */
	.content-header{
		margin: 0 auto;
		width: 90%;
	    max-width: 3000px;
	}
	.content{
		margin: 0 auto;
		width: 80%;
	    max-width: 1300px;
	}
	.content-full{
		margin: 0 auto;
		width: 100%;
	    max-width: 100%;
	}
	

	/* h
	------------------------------------------------------------------------------------------------------  */
	h1{
		margin: 0em;
		font-weight: var(--font-bold);
		font-size: 45px;
	}
	h2{
		margin: 0px;
		font-weight: var(--font-medium);
		font-size: 36px;
	}
	h3{
		margin: 0px;
		font-weight: var(--font-medium);
		font-size: 33px;
	}


	/* caption
	------------------------------------------------------------------------------------------------------  */
	.caption{
		font-weight: var(--font-medium);
		font-size: 14px;
		letter-spacing: 2px;
	}


	/* p
	------------------------------------------------------------------------------------------------------  */
	p {
		margin: 0px;
		/*hyphens: auto;*/
	}

	/* floats
	------------------------------------------------------------------------------------------------------  */
	.float-right{
		float: right !important;
	}

	/* a, link
	------------------------------------------------------------------------------------------------------  */
	a {
		cursor: pointer;
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;	
		text-decoration: none;
	}
	.link{
		color: var(--color-primary);
	}
	.link:hover{
		text-decoration: underline;
	}


	/* btn
	------------------------------------------------------------------------------------------------------  */
	.btn-resource{
		display: inline-block;
		font-size: 16px;
		font-weight: var(--font-medium) !important; 
		color: var(--color-white) !important;
		background-image: url('../img/resources/resources_button_on.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 100%;
		margin-left: 20px !important;
		margin-top: 4px !important;
		min-width: 200px !important;
		padding: 20px 40px !important;
	}
	.btn-resource:hover, .btn-resource-active{
		background-image: url('../img/resources/resources_button_off.png');
	}
	.btn-contacto{
		float: left;
		font-size: 10px;
		font-weight: var(--font-medium) !important; 
		color: var(--color-white) !important;
		background-image: url('../img/home/contact_on.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;
		margin-left: 20px !important;
		margin-top: 4px !important;
	}
	.btn-contacto:hover, .btn-contacto-active{
		background-image: url('../img/home/contact_off.png');
	}
	.btn-enviar{
		font-size: 14px;
		font-weight: var(--font-bold) !important; 
		letter-spacing: 2px;
		color: var(--color-white) !important;
		background-image: url('../img/home/contact_on.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;
		margin-left: 20px !important;
		margin-top: 4px !important;
		padding: 25px 90px;
	}
	.btn-enviar:hover{
		background-image: url('../img/home/contact_off.png');
	}
	
	.btn-more{
		font-size: 16px;
		font-weight: 500;
		letter-spacing: 2px;
		color: var(--color-white) !important;
		background-image: url('../img/home/contact_on.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;
		padding: 12px 30px;			
	}
	.btn-more:hover{
		background-image: url('../img/home/contact_off.png');
	}
	
	
	.btn-link{
		font-size: 20px;
		font-weight: var(--font-bold) !important; 
		letter-spacing: 2px;
		color: var(--color-white) !important;
		background-color: var(--color-primary);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;		
		margin-top: 4px !important;
		padding: 25px 70px;		
		border-radius: 40px;
	}
	.btn-link:hover{
		opacity: 0.8;
	}

	/* Icons
	------------------------------------------------------------------------------------------------------  */
	.icon-anim {
    	transform : scale(0.3);
        -moz-transform : scale(0.3);      
        -webkit-transform : scale(0.3);   
        -o-transform : scale(0.3);
        transition: transform 1.5s;
        -moz-transition: -moz-transform 1.5s;
        -webkit-transition: -webkit-transform 1.5s;
        -o-transition: -o-transform 1.5s;
    }
    .zoom{
		transform : scale(1);
        -moz-transform : scale(1);      
        -webkit-transform : scale(1);   
        -o-transform : scale(1);
	}
	
	.icon-pdf{
		background-image: url('../img/smartshaker/pdf_icon.png');
		background-position: center center;
	    background-repeat: no-repeat;
	    background-size: cover;
	    width: 80px;
	    height: 100px; 
	    margin: 40px auto;
	    cursor: pointer;
	}	
		  

	/* Cookies
	------------------------------------------------------------------------------------------------------  */
	#container_cookies {
		width: 100%;
		max-width: 100%;
		position: fixed;
		bottom: 0px;
		right: 2%;
		z-index: 100;
		padding: 10px;
		box-sizing: border-box;
		border: 1px dashed var(--color-primary);
		box-shadow: 0px 0px 2px var(--color-tertiary);
		background: rgb(221,219,219);
		background: -moz-linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		background: -webkit-linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		background: linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#dddbdb",endColorstr="#fcfcfc",GradientType=1);
	}
	#container_cookies .mensaje {
		margin: 0 auto;
		width: 100%;
		text-align: justify;
		color: var(--color-secondary);
		font-weight: var(--font-regular);
	}
	#container_cookies .mensaje .txt {
		float: left;
		padding-bottom: 10px;
	}


	/* pull
	------------------------------------------------------------------------------------------------------  */
	#pull{
		display: none;
		float: right;
	}
	#pull img{
		width: 30px;
		margin-top: 30px;
	}
	#pull img:hover{
		opacity: 0.8;
	}
	#pull-close{
		display: none;
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 99999;
	}
	#pull-close img{
		width: 30px;
	}
	

	/* top-header
	------------------------------------------------------------------------------------------------------  */
	#top-header{
		position: absolute;
		width: 100%;
		height: 40px;
		background: linear-gradient(to bottom, rgba(131, 132, 163, 1), rgba(255, 255, 255, 0));
		position: fixed;
	}


	/* header
	------------------------------------------------------------------------------------------------------  */
	#main-header{
		float: left;
		width: 100%;
		border-bottom: 1px solid #343c72;
		position: fixed;
                z-index: 9999;
	}
        #main-header.flotante{
		background-color: #000;
	}
	#main-header #logo{
		display: inline-block;
	}
	#main-header #logo img{
		max-width: 200px;
		width: 80%;
		margin-top: 25px;
	}
	#main-header #pull{
		display: none;
	}
	#main-header nav{
		float: right;
	}
	#main-header nav #nav-menu {
		float: left;
		padding: 6px 0px;
		margin: 0px;
		margin-top: 10px;
		list-style: none;
		font-size: 14px;
		font-weight: var(--font-regular);
		padding: 0;
		margin: 0;
		list-style: none;
		display: flex;
		justify-content: space-around;
	  }
	#main-header nav #nav-menu a {
		text-decoration: none;
		color: var(--color-white);
		display: block;
		padding: 36px 15px;
		margin-left: 10px;
		transition: background-color 0.3s;
	}
	#main-header nav #nav-menu a:hover {
		color: var(--color-button);
	}
	#main-header nav #nav-menu .submenu {
		display: none;
		position: absolute;
		background-color: rgba(134, 119, 243, 0.4);
		padding: 25px 5px;
		padding-right: 70px;
		margin-left: 15px;
	}
	#main-header nav #nav-menu .active{
		color: var(--color-white) !important;
	}
	#main-header nav #nav-menu .has-submenu:hover .submenu {
		display: block;
	}
	#main-header nav #nav-menu .submenu li {
		display: block;		
	}
	#main-header nav #nav-menu .submenu li a{
		padding: 8px 0px;
	}

	@media screen and (max-width: 768px) {
		#main-header nav #nav-menu ul {
		  flex-direction: column;
		}
		#main-header nav #nav-menu .submenu {
		  display: none;
		}
		#main-header nav #nav-menu .has-submenu:hover .submenu {
		  display: block;
		}
		#main-header nav #nav-menu .has-submenu.active .submenu {
		  display: block;
		}
	  }



	body.header-home #nav-menu .sec_home {
		color: var(--color-button) !important;
	}
	body.header-petromech #nav-menu .sec_solutions {
		color: var(--color-button) !important;
	}
	body.header-cuttings #nav-menu .sec_solutions {
		color: var(--color-button) !important;
	}
	body.header-deepdrill #nav-menu .sec_solutions {
		color: var(--color-button) !important;
	}
	body.header-whygeolog #nav-menu .sec_whygeolog {
		color: var(--color-button) !important;
	}
	body.header-resources #nav-menu .sec_resources {
		color: var(--color-button) !important;
	}
	









	/* home
	------------------------------------------------------------------------------------------------------  */
	#home{
		float: left;
		width: 100%;
		padding: 50px 0px;
	}
	#home .slider {
		float: left;
		width: 100%;
		min-height: 400px;
	}
	#home .slider .slide {
		float: left;
		width: 70%;
		display: none;
		/*position: absolute;*/
	}
	#home .slider .slide h1 {
		float: left;
		width: 100%;
		margin-top: 20px;
		margin-bottom: 50px;
	}
	#home .slider .slide .caption {
		float: left;
		width: 100%;
		margin-top: 170px;
	}
	#home .slider .controls {
		float: left;
		width: 100%;
		margin-top: 60px;
		display: flex;
		justify-content: center;
	}
	#home .slider .controls .bullet {
		float: left;
		width: 4px;
		height: 4px;
		background-color: #838386;
		border-radius: 50%;
		margin: 0 15px;
		cursor: pointer;
	}
	#home .slider .controls .bullet.active {
		background-color: #fff;
	}

	



	/* about
	------------------------------------------------------------------------------------------------------  */
	#about{
		float: left;
		width: 100%;
		padding: 10px 0px;
	}
	#about .caption{
		float: left;
		width: 100%;
	}
	#about h2{
		float: left;
		width: 100%;
		margin-top: 0.3em;
		color: var(--color-primary);
	}
	#about #box-items{
		float: left;
		width: 100%;
		margin-top: 30px;
	}
	#about #box-items .item{
		float: left;
		width: 33.33%;
	}
	#about #box-items .item img{
		float: left;
	}
	#about #box-items .item h3{
		float: left;
		width: 100%;
		padding: 28px 0px;
	}
	#about #box-items .item p{
		float: left;
		width: 70%;
		text-align: left;
		font-weight: var(--font-medium);
		font-size: 20px;
	}
	#about #box-brands{
		float: left;
		width: 100%;
		margin-top: 3em;
	}
	#about #box-brands .item-brand{
		float: left;
		width: 33%;
		border: 1px solid var(--color-primary);
		margin-left:-1px;
		min-height: 440px;
		text-decoration: none;
		overflow: hidden;
	}
	#about #box-brands .item-brand:hover{
		opacity: 0.8;
	}
	
    #about #box-brands .item-brand .img-banner{
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 100%;
		transition: background-size 1s;
        -moz-transition: -moz-background-size 1s;
        -webkit-transition: -webkit-background-size 1s;
        -o-transition: -o-background-size 1s;
	}	
	#about #box-brands .item-brand .img-banner:hover{
		background-size: 110%;
	}			
	#about #box-brands .item-brand .img-banner img{
		width: 100%;
	}
	#about #box-brands .item-brand img.img-logo{
		float: left;
		margin-left: 8%;
		margin-right: 7%;
		margin-top: 20px;
	}
	#about #box-brands .item-brand p{
		float: left;
		width: 85%;
		max-width: 280px;
		margin-left: 8%;
		margin-right: 7%;
		margin-top: 20px;
		font-size: 16px;
		color: var(--color-lightgrey);
		font-weight: var(--font-medium);
	}






	/* interior
	------------------------------------------------------------------------------------------------------  */
	#interior{
		float: left;
		width: 100%;
		padding-top: 100px;
	}
	#interior .caption{
		margin-top: 50px;
	}
	#interior .logo-producto{
		float: left;
		width: 100%;
		margin-top: 70px;
	}
	#interior .logo-producto img.logo{
		float: left;		
		margin-left: -50px;
	}
	#interior h1{
		float: left;
		width: 80%;
		max-width: 550px;
		margin-top: 25px;
		color: var(--color-lightgrey);
	}
	.w90{
		width: 65% !important;
		max-width: 65% !important;
	}


	/* contacto
	------------------------------------------------------------------------------------------------------  */
	#contacto{
		float: left;
		width: 100%;
		padding-top: 70px;
	}
	#contacto h1 {
		float: left;
		width: 100%;
		max-width: 70%;
		margin-top: 20px;
		font-size: 40px;
		font-weight: var(--font-bold);
		color: var(--color-lightgrey);
	}
	#contacto .caption {
		float: left;
		width: 100%;
		margin-top: 0px;
	}



	/* contenido
	------------------------------------------------------------------------------------------------------  */
	.back-contenido-right{
		background-image: url('../img/Ellipse-6-der.png');
		background-repeat: no-repeat;
		background-position: right bottom;
		background-size: 1300px;
	}
	.back-contenido-deepdrill-right{
		background-image: url('../img/drilldeep/deep_banner.jpg');
		background-repeat: no-repeat;
		background-position: right bottom;
		background-size: 1300px;
	}
	#contenido{
		float: left;
		width: 100%;
	}
	#contenido .breadscrump{
		float: left;
		text-align: right;
		width: 100%;
		margin-top: 50px;
		font-weight: var(--font-medium);
		color: var(--color-lightgrey);
		font-size: 14px;
	}
	#contenido .breadscrump img.linea{
		width: 100%;
	}
	#contenido .breadscrump a{		
		font-weight: var(--font-medium);
		color: var(--color-lightgrey);
		letter-spacing: 2px;
	}
	#contenido .box-contenido{
		float: left;
		width: 100%;
	}
	#contenido .box-contenido-right{
		float: right !important;
		width: 90% !important;
	}
	#contenido .box-contenido h2{
		color: var(--color-primary);
		padding: 25px 0px;
		margin-top: 20px;
	}
	#contenido .box-contenido p{
		width: 100%;
		font-size: 18px;
		font-weight: var(--font-medium);
	}
	#contenido .box-contenido .small{
		font-size: 14px;
		font-weight: var(--font-regular);
	}
	#contenido .box-contenido .p-w90{
		width: 90% !important;
	}
	#contenido .box-contenido .p-w100{
		width: 100% !important;
	}
	#contenido .box-contenido ul{
		width: 100%;
		font-size: 18px;
		font-weight: var(--font-medium);
		margin-left: -20px;
	}
	#contenido .box-contenido ul .color-primary{
		color: var(--color-primary);
	}
	#contenido .box-contenido .links-exemples{
		color: var(--color-primary);		
	}
	#contenido .box-contenido .links-exemples .link-example{
		color: var(--color-white);
	}
	#contenido .box-contenido .links-exemples .link-example:hover, #contenido .box-contenido .links-exemples .link-example-active{
		color: var(--color-primary);		
	}
	.text-center{
		text-align: center;
	}

	#contenido .box-contenido .botones{
		float: left;
		width: 100%;
		text-align: center;
	}
	#contenido .box-contenido .elements{
		float: left;
		width: 90%;
		padding: 0px 5%;
		text-align: center;
		margin-top: 60px;
		margin-bottom: 100px;
	}
	#contenido .box-contenido .elements .element{
		float: left;
		width: 33.33%;
		text-align: center;
	}
	#contenido .box-contenido .elements .element img{
		float: left;
		width: 100%;
	}
	#contenido .box-contenido .elements .element span{
		float: left;
		width: 100%;
		margin-top: -20px;
		font-weight: var(--font-bold);
		font-size: 20px;
		color: var(--color-lightgrey);
	}
	#contenido .box-contenido .elements .element .link{
		display: inline-block;
		width: auto;
		padding: 10px 0px;
		margin-top: 30px;
		color: var(--color-white);
		font-size: 22px;
		font-weight: var(--font-medium);
		background-image: url('../img/resources/pdf_icon.png');
		padding-right: 34px;
		background-repeat: no-repeat;
		background-position: right center;
		background-size: 24px;
	}
	#contenido .box-contenido .elements .element .link:hover{
		text-decoration: none;
		color: var(--color-primary);
	}





	#contenido .formulario{
		float: left;
		width: 60%;
		padding: 50px 20%;
		padding-bottom: 100px;
		background-image: url('../img/contact/world_map_bg.png');
		background-position: right 240px;
		background-repeat: no-repeat;
		background-size: contain;
	}
	#contenido .formulario h2{
		float: left;
		font-weight: var(--font-bold);
		font-size: 50px;
	}
	#contenido .formulario .link {
		color: #fff;
	}
	#contenido form{
		float: left;
		width: 100%;
	}
	#contenido form label{
		float: left;
		width: 100%;
		box-sizing: border-box;
		margin-top: 20px;
		font-weight: var(--font-medium);
		margin-bottom: 5px;
	}
	#contenido form input,textarea{
		float: left;
		width: 100%;
		box-sizing: border-box;
		outline: none;
		border: 0px;
		font-size: 20px;
		padding: 20px 25px;
		margin-bottom: 10px;
		color: #afb0b3;
		background-color: #1c1f25;
	}
	#contenido form textarea{
		height: 230px;
		font-family: var(--font);
	}
	#contenido form .loschecks{
		float: left;
		box-sizing: border-box;
	}
	#contenido form .loschecks input{
		float: left;
		width: 50px;
	}
	#contenido .msgs_form{
		float: left; 
		clear: both; 
		display: none; 
		color:var(--color-secondary); 
		background-color: var(--color-lightgrey);
	}		  
	#contenido .msgs_send{
		float: left; 
		clear: left; 
		width: auto; 
		background-color: var(--color-success);
		color: var(--color-white);
		box-sizing: border-box;
		display: none; 
	}
	#contenido form .required{	
		float: right;
		font-size: 14px;
		color: var(--color-lightgrey);	
	}
	#contenido form .boton{
		float: left;
		width: 100%;
		margin-top: 60px;
		text-align: center;
	}
	.mtop20{
		margin-top: 20px;
	}
	.mtop40{
		margin-top: 40px;
	}
	.mtop80{
		margin-top: 80px;
	}
	.mtop120{
		margin-top: 120px;
	}
	.mbottom80{
		margin-bottom: 80px;
	}
	.mbottom150{
		margin-bottom: 150px;
	}
	.mbottom120{
		margin-bottom: 120px;
	}
	.mbottom240{
		margin-bottom: 240px;
	}
	#contenido .box-contenido .destacado{
		float: left;
		width: 90%;
		padding: 0px 5%;
		margin-top: 80px		
	}
	#contenido .box-contenido .link{
		color: var(--color-primary);
	}
	#contenido .box-contenido .link:hover{
		color: var(--color-white)
	}



	/* carrusel
		------------------------------------------------------------------------------------------------------  */
		
	.carrusel{
	    overflow: hidden;    	    
	}
	.carrusel .carrusel_item {
	    float: left;        	      
	}
	.carrusel .foto_carrusel{
	    /*float: left;
	    width: 100%;    
	    max-width: 900px;
	    text-align: center;  */  	    
	}
	.carrusel .foto_carrusel img{        
	    margin: 0 auto;
	    /*max-width: 900px;*/
	    width: 100%;
	}
	.carrusel .carrusel_move.arrow_l {
	    float: left;
	    cursor: pointer;
	    margin: 18% 2% 0 0;        
	    width: 4%;
	    height: 55px;	      
	}
	.carrusel .carrusel_move.arrow_r {
	    float: right;
	    cursor: pointer;
	    margin: -27% 0 0 4%;        
	    width: 4%;
	    height: 55px;	      
	}
	.carrusel .carrusel_move img {
	    width: 100%;
	} 


	/* technical papers
	------------------------------------------------------------------------------------------------------  */
	
	.papers {
		text-align: left;
		font-size: 18px;
    	font-weight: var(--font-medium);
	}
	.papers h2 {
		font-size: 28px;
	}
	.papers .btn-more-info {
	    font-size: 12px;
	    font-weight: var(--font-bold) !important;
	    letter-spacing: 2px;
	    color: var(--color-white) !important;
	    background-image: url(../img/home/contact_on.png);
	    background-position: center center;
	    background-repeat: no-repeat;
	    background-size: contain;
	    margin-left: 0px !important;
	    padding: 15px 50px;
	}
	.papers .btn-more-info:hover{
		background-image: url('../img/home/contact_off.png');
	}
	.papers .col_100{
		border-bottom: 1px solid #fff;
		margin-top: 45px;
	}
	.papers .text img {
		margin-bottom: -25px;
	}
	
	
	/* video
	------------------------------------------------------------------------------------------------------  */
	
		#video  {
                margin-top: 30px;
                margin-bottom: 50px;
        }
        #video .embed-container {
                position: relative;
                padding-bottom: 56.25%;
                height: 0;
                overflow: hidden;
                max-width: 100%;
        }
        #video .embed-container iframe, #video .embed-container object, #video .embed-container embed {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
        }
        
        
        
    /* banner
	------------------------------------------------------------------------------------------------------  */
	.banner{
		width: 100%;	 
		background-position: center center;
	    background-repeat: no-repeat;
	    background-size: cover;   
	    margin-top: 50px;
	}
	.banner.smartshaker{
		background-image: url('../img/smartshaker/banner_smartshaker.png');
		height: 600px;   
	}
	.banner h2 {
		color: #fff !important;
		text-align: center;	
		width: 70%;
		margin: 0 auto;		
	}
        
        
    /* modal
	------------------------------------------------------------------------------------------------------  */
	
   .modal{
		display: none;
		position: absolute;
		width: 95%;
		max-width: 900px;
		padding: 60px;
		height: auto;
		box-sizing: border-box;
		text-align: left;
		color: var(--color-white);
		background-color: #02050a;
		z-index: 9999999;
		
		box-shadow: 0px 0px 40px 0px rgba(185,185,185,0.8);
		-webkit-box-shadow: 0px 0px 40px 0px rgba(185,185,185,0.8);
		-moz-box-shadow: 0px 0px 40px 0px rgba(185,185,185,0.8);
	}
	.modal .ico-close{
		position: absolute;
		right: 20px;
		top: 20px;
		z-index: 99999999999;
	}
	.modal .ico-close img{
		width: 30px;
	}
	.modal .ico-close img:hover{
		opacity: 0.8;
	}
	
	.modal .formulario{
		float: left;
		width: 90%;
		/*padding: 50px 20%;
		padding-bottom: 100px;*/
		margin-left: 25px;		
	}
	.modal .formulario h2{
		float: left;
		font-weight: var(--font-bold);
		font-size: 50px;
	}
	.modal form{
		float: left;
		width: 100%;
	}
	.modal form label{
		float: left;
		width: 100%;
		box-sizing: border-box;
		margin-top: 20px;
		font-weight: var(--font-medium);
		margin-bottom: 5px;
	}
	.modal form input{
		float: left;
		width: 100%;
		box-sizing: border-box;
		outline: none;
		border: 0px;
		font-size: 20px;
		padding: 20px 25px;
		margin-bottom: 10px;
		color: #fff;
		background-color: #1e222a;
	}
	.modal form textarea{
		height: 230px;
		font-family: var(--font);
	}
	.modal form .loschecks{
		float: left;
		box-sizing: border-box;
		margin-left: -20px;
		margin-top: 35px;
	}
	.modal form .loschecks input{
		float: left;
		width: 50px;
	}
	.modal form .loschecks span{
		margin-left: -15px;
	}
	.modal .msgs_form{
		float: left; 
		clear: both; 
		display: none; 
		color:var(--color-secondary); 
		background-color: var(--color-lightgrey);
	}		  
	.modal .msgs_send{
		float: left; 
		clear: left; 
		width: auto; 
		background-color: var(--color-success);
		color: var(--color-white);
		box-sizing: border-box;
		display: none; 
	}
	.modal form .required{	
		float: right;
		font-size: 14px;
		color: var(--color-lightgrey);	
		margin-top: 35px;
	}
	.modal form .boton{
		float: left;
		width: 100%;
		margin-top: 75px;
		text-align: center;
	}
	.modal p {
		font-size: 18px;
    	font-weight: var(--font-medium);
    	color: var(--color-primary);
    	margin-bottom: 20px;
	}
	.modal form .receive label{
		display: inline-block;
		width: 70%;
	}
	.modal form .receive .radio{
		display: inline-block;
	}
	.modal form .receive .radio input {
		display: inline-block;
	    margin-left: -30px;
	    margin-top: 22px;
	    margin-right: 50px;
	    width: 20px;
	}
	.modal form .receive .radio span{
		display: inline-block;
	    margin-left: -45px;
	    margin-right: 50px;
	    padding-top: 19px;
	}
	

	/* footer
	------------------------------------------------------------------------------------------------------  */
	#main-footer{
		float: left;
		width: 100%;
		font-weight: var(--font-medium);
		font-size: 16px;
		margin-top: 65px;
		padding-bottom: 120px;
	}
	#main-footer img.linea{
		float: left;
		width: 100%;
		margin-bottom: 40px;
	}
	#main-footer .social{
		float:left;
		width: 100%;
		text-align: right;
	}	
	#main-footer .social img{
		width: 25px;
		margin-left: 2px;
	}	

	




	/* responsive
	------------------------------------------------------------------------------------------------------  */
	
	@media screen and (min-width: 1500px) {

		.banner.smartshaker{
			height: 650px;   
		}
	}
	
	@media screen and (min-width: 1750px) {

		.banner.smartshaker{
			height: 700px;   
		}
	}
	
	

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

		.header-petromech{
			background-size: 1400px, 1300px;
		}
		.header-contacto{
			background-size: 1400px, 1300px;
		}
		.header-cuttings{
			background-size: 1400px, 1300px;
		}
		.header-deepdrill{
			background-size: 1400px, 1300px, 100%;
		}
		.header-whygeolog{
			background-size: 1400px, 1300px, 100%;
		}
		.header-resources{
			background-size: 1400px, 1300px;
		}
		.header-smartshaker{
			background-size: 1250px, 1250px;
		}

	}

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

		#main-header{
			padding-bottom: 20px;
		}
		#main-header #logo img{
			max-width: 120px;
			width: 120px;
			margin-top: 30px;
		}
		#main-header #pull{
			display: block;
		}
		#main-header nav{
			display: none;
		}
		#main-header #nav-responsive{
			display: block;
			margin-top: 40px;
		}
		#main-header #nav-responsive a{
			float: left;
			width: 100%;
			text-align: center;
			color: var(--color-white);
			font-weight: var(--font-bold);
			margin: 0px;
			padding: 10px 0px;
			background-color: var(--color-secondary);
		}
		#main-header #nav-responsive .btn-contacto{
			font-size: 12px;
			margin-left: 0px !important;
			margin-top: 20px !important;
		}
	



	}


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

		#contenido .box-contenido .elements .element{
			float: left;
			width: 100%;
			text-align: center;
		}
		.w90{
			width: 90% !important;
			max-width: 90% !important;
		}
	
	}


	@media screen and (max-width: 860px) {
			
		h1{
			font-size: 35px;
		}
		h2{
			font-size: 30px;
		}
		h3{
			font-size: 25px;
		}
		.caption{
			font-size: 14px;
			letter-spacing: 2px;
		}	
		#about #box-items .item p{
			font-size: 16px;
		}
		#about #box-brands .item-brand p{
			font-size: 14px;
		}
		#main-footer{
			font-size: 14px;
		}
		
		.modal .formulario {
			width: 100%;
			margin-left: 0;		
		}
	}

	@media screen and (max-width: 670px) {
			
		h1{
			font-size: 30px;
		}
		h2{
			font-size: 25px;
		}
		h3{
			font-size: 20px;
		}
		.caption{
			font-size: 12px;
			letter-spacing: 2px;
		}
		#about #box-items .item p{
			font-size: 15px;
		}
		#about #box-brands .item-brand p{
			font-size: 13px;
		}
		#main-footer{
			font-size: 12px;
		}
		#main-footer .col_66, #main-footer .col_33{
			width: 100%;
			text-align: center;
		}
		#main-footer .social{
			margin-top: 30px;
			text-align: center;
		}	
		
		.header-home{
			background-repeat: no-repeat;
			background-position: center top;
			background-size: 400%;	
			animation: none;
	    	-webkit-animation: none;	   	
		}	
		.icon-anim {
	    	transform : scale(1);
	        -moz-transform : scale(1);      
	        -webkit-transform : scale(1);   
	        -o-transform : scale(1);	        
	    }
	    .resources .content{
			width: 90%;	    
		}
		.papers .text img {
			width: 90%;
		}
		
		.banner.smartshaker{
			height: 175px; 
			margin-bottom: 30px;  
		}
		.banner.smartshaker h2{
			font-size: 16px;
		}
		.banner.smartshaker br{
			display: none;
		}
		
		#btn_learn_more {
			display: none;		
		}

	
	}


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

		#about #box-items .item{
			width: 100%;
			margin-bottom: 40px;
		}
		#about #box-brands .item-brand{
			width: 100%;
			margin-left: 0px;
			margin-top: -1px;
			min-height: auto;
			padding-bottom: 60px;
		}
		#interior .logo-producto img.logo{
			margin-left: 0px;
		}
		#contenido .col_50{
			width: 100%;
		}
		#contenido .box-contenido-right{
			float: left !important;
			width: 100% !important;
		}
		#contenido .box-contenido .p-w90{
			width: 100% !important;
		}
			


		#contenido .formulario{
			width: 80%;
			padding: 40px 10%;
		}
		#contenido .formulario h2{
			font-size: 30px;
		}
		#contenido form input,textarea{
			font-size: 16px;
			padding: 22px 15px;
		}		
	}
        
        
.warning {
    border: 1px solid #c00 !important;
}

#confirm_send {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 50px;
}

/*  Error 404 */

#error404 {
    text-align: center;
    padding: 50px 0;
}
#error404 .txt {
    font-size: 20px;
    padding: 50px 0;
}