
html, body{
	font-family: 'Open Sans', sans-serif;
	color: #000;
	overflow-x: hidden;
	overflow-y: overlay;
}
body{
	background-color: #fff;
	padding-bottom: 6em;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Anton', sans-serif;
	margin: 0;
	text-transform: uppercase;
	font-weight: 700;
}
h6{
	font-size: 10px;
}

p{
	margin: 0;
	line-height: 1.7;
	font-size: 1.1rem;
}
/*
p span{
	font-weight: 500;
}*/

/*@media (min-width: 1200px){
	.container {
	    width: 1100px;
	}
}*/

.op-0{
  opacity: 0;
  transition: all 0.5s;
}
.op-1{
  opacity: 1;
  transition: all 0.5s;
}

*,
*:active,
*:active:focus,
*:focus,
*:visited,
*:hover,
.btn:focus,
.btn:active:focus,
.btn:focus,
a:focus,
.form-control:focus
{
    outline: 0 !important;
    outline-offset: 0;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, .075), 0 0 0 rgba(102, 175, 233, .6);
            box-shadow: inset 0 0 0 rgba(0, 0, 0, .075), 0 0 0 rgba(102, 175, 233, .6);
}
a{
	text-decoration: none;
}
a:hover {
    text-decoration: none;
}
.menu {
	background-color: rgba(255, 255, 255, 0.8);
	height: 40px;
}
.menu .row {
	height: 40px;
}
.menu .col-5.col-sm-2{
	background-color: #ed1c24;
	padding: 5px 3px 3px;
}
.menu .col-5.col-sm-3 .col-3:first-child{
	border-left: 2px solid #000;
}
.menu img{
	max-width: 100px;
}
.menu .row .row .col-3{
	padding-top: 10px;
}
.menu .row .row .col-3 a{ 
	color: #000;
	text-decoration: none;
	font-size: 1.3rem;
}
.contenido{
	padding: 5em;
}

.linea_hz{
	height: 10px;
	width: 100%;
}
.azul{
	background-color: #4285f4;
}
.verde{
	background-color: #34a853;
}
.amarillo{
	background-color: #fbbc05;
}
.rojo{
	background-color: #ea4335;
}
.outline_azul{
	-webkit-box-shadow: 0px 0px 0px 10px #4285f4;
	box-shadow: 0px 0px 0px 10px #4285f4; 
	padding: 1em;
}
.outline_verde{
	-webkit-box-shadow: 0px 0px 0px 10px #34a853;
	box-shadow: 0px 0px 0px 10px #34a853;
	padding: 1em;
}
.outline_amarillo{
	-webkit-box-shadow: 0px 0px 0px 10px #fbbc05;
	box-shadow: 0px 0px 0px 10px #fbbc05; 
	padding: 1em;
}
.outline_rojo{
	-webkit-box-shadow: 0px 0px 0px 10px #ea4335;
	box-shadow: 0px 0px 0px 10px #ea4335; 
	padding: 1em;
}
.inicio{
	background-image: url(../img/google20.gif);
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	background-position: center;
	height: 100vh;
}
.inicio .row{
	height: 100vh;
}
.inicio i{
	font-size: 3rem;
	color: #cdcdcd;
	font-weight: 300;
}
.intro{
	height: 100vh;
}
.intro h2{
	font-size: 4rem;
	letter-spacing: 2px;
}
.intro p{
	padding-bottom: 1em;
}
.intro img {
	margin-top: 2em;
	margin-bottom: 2em;
}
.intro .row{
	height: 100vh;
}
.intro .colores{
	background: -moz-linear-gradient(left, rgba(66,134,244,1) 0%, rgba(66,134,244,1) 24%, rgba(52,168,83,1) 25%, rgba(52,168,83,1) 49%, rgba(251,189,5,1) 50%, rgba(251,189,5,1) 74%, rgba(234,67,53,1) 75%, rgba(234,67,53,1) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(66,134,244,1)), color-stop(24%, rgba(66,134,244,1)), color-stop(25%, rgba(52,168,83,1)), color-stop(49%, rgba(52,168,83,1)), color-stop(50%, rgba(251,189,5,1)), color-stop(74%, rgba(251,189,5,1)), color-stop(75%, rgba(234,67,53,1)), color-stop(100%, rgba(234,67,53,1)));
	background: -webkit-linear-gradient(left, rgba(66,134,244,1) 0%, rgba(66,134,244,1) 24%, rgba(52,168,83,1) 25%, rgba(52,168,83,1) 49%, rgba(251,189,5,1) 50%, rgba(251,189,5,1) 74%, rgba(234,67,53,1) 75%, rgba(234,67,53,1) 100%);
	background: -o-linear-gradient(left, rgba(66,134,244,1) 0%, rgba(66,134,244,1) 24%, rgba(52,168,83,1) 25%, rgba(52,168,83,1) 49%, rgba(251,189,5,1) 50%, rgba(251,189,5,1) 74%, rgba(234,67,53,1) 75%, rgba(234,67,53,1) 100%);
	background: -ms-linear-gradient(left, rgba(66,134,244,1) 0%, rgba(66,134,244,1) 24%, rgba(52,168,83,1) 25%, rgba(52,168,83,1) 49%, rgba(251,189,5,1) 50%, rgba(251,189,5,1) 74%, rgba(234,67,53,1) 75%, rgba(234,67,53,1) 100%);
	background: linear-gradient(to right, rgba(66,134,244,1) 0%, rgba(66,134,244,1) 24%, rgba(52,168,83,1) 25%, rgba(52,168,83,1) 49%, rgba(251,189,5,1) 50%, rgba(251,189,5,1) 74%, rgba(234,67,53,1) 75%, rgba(234,67,53,1) 100%);
	height: 10px;
	width: 100%;
}
.title {
	border-radius: 50%;
	width: 500px;
	height: 500px;
	border: 1px solid #aaa;
	-webkit-box-shadow: 10px 10px 5px #aaaaaa;
	box-shadow: 0px 10px 5px #aaaaaa;
	margin-left: auto;
	flex-wrap: wrap;
} 
.title .title1 img{
	width: 80%;
} 
.title h1{
	color: #000;
	letter-spacing: 2px;
	font-size: 3.5rem;
}
.contenido h2{
	padding-bottom: 0.5em;
}
.contenido p{
	padding-bottom: 0.5em;
}
.contenido li{
	padding-bottom: 0.5em;
}
.contenido .col-0 .row{
	height: 100%;
}
.contenido .row_1 .col-0 .row .col-12{
	padding-top: 40%;
}
.contenido .row_1 .col-0 .row .col-6{
	padding-top: 30%;
}
.linea_tl_amarillo{
	-webkit-box-shadow: -10px -10px 0px #fbbc05;
	box-shadow: -10px -10px 0px #fbbc05;
	height: 150px;
	width: 100%;
}
.linea_tr_verde{
	-webkit-box-shadow: 10px -10px 0px #34a853;
	box-shadow: 10px -10px 0px #34a853;
	height: 150px;
	width: 100%;
}
.pt-6{
	padding-top: 15rem!important;
}
video{
	width: 100%;
}
.pt-10px{
	padding-top: 10px;
}
.ml-10px{
	margin-left: 10px;
	padding-top: 5%!important;
}
.linea_ver{
	height: 150px;
	width: 10px;
	margin-right:  auto;
	margin-left: auto;
}
.doodle{
	margin-bottom: 2em;
}
.relative{
	position: absolute;
	width: 100%;
	height: 1000px;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 2;
}

.up
{
    font-size: 20px;

    position: fixed;
    z-index: 1000;
    right: 20px;
    bottom: 50px;

    display: none;

    padding: 6px 10px 4px;

    cursor: pointer;

    color: #fff;
    background: #181d24;
}
@media screen and (max-width: 1999px) {
	
	.contenido .row_1 .col-0 .row .col-12{
		padding-top: 50%;
	}
	.contenido .row_1 .col-0 .row .col-6{
		padding-top: 60%;
	}
}
@media screen and (max-width: 1600px) {
	
	.contenido .row_1 .col-0 .row .col-12{
		padding-top: 60%;
	}
	.contenido .row_1 .col-0 .row .col-6{
		padding-top: 60%;
	}
	.title {
	    width: 450px;
	    height: 450px;
	}
}
@media screen and (max-width: 1460px) {
	.intro h2 {
	    font-size: 3rem;
	}
	.title {
	    width: 400px;
	    height: 400px;
	}
	.title h1 {
	    font-size: 3rem;
	}
	.contenido .row_1 .col-0 .row .col-6 {
	    padding-top: 90%;
	}
	
}
@media screen and (max-width: 1199px) {
	.intro h2 {
	    font-size: 2.5rem;
	}
  	.title {
	    width: 300px;
	    height: 300px;
	}
	.title h1 {
	    font-size: 2rem;
	}
	.contenido .row_1 .col-0 .row .col-12 {
	    padding-top: 55%;
	}
	.contenido .row_1 .col-0 .row .col-6 {
	    padding-top: 200%;
	}
	.pt-6 {
	    padding-top: 18rem!important;
	}
	
}
@media screen and (max-width: 1024px) {
	body{
		max-width: 1024px;
	}
	.inicio {
	    -webkit-background-size: contain;
	    background-size: contain;
	}
}
@media screen and (max-width: 768px) {
	body{
		max-width: 768px;
	}
	.title {
	    width: 200px;
	    height: 200px;
	    margin-top: 2em;
	}
	.contenido .row_1 .col-0 .row .col-12 {
	    padding-top: 70%;
	}
	.title h1 {
	    font-size: 1.3rem;
	}
	.contenido .row_1 .col-0 .row .col-6 {
	    padding-top: 500%;
	}
	.pt-6 {
	    padding-top: 30rem!important;
	}
	.linea_hz.azul{
		margin-top: -200%;
	}
	

}
@media screen and (max-width: 767px) {
	body{
		max-width: 767px;
	}
	.title {
	    width: 250px;
	    height: 250px;
	    margin-top: 2em;
	    margin-left: auto;
	    margin-right: auto;
	}

	.intro h2 {
	    font-size: 1.5rem;
	}
	.contenido {
	    padding: 1em;
	}
	.contenido .row_1 .col-0 .row .col-12 {
	    display: none;
	}
	.contenido .row_1 .col-0 .row .col-6 {
	    display: none;
	}
	.linea_hz.azul{
		 display: none;
	}
	.pt-6 {
	    display: none;
	}
	.pt-10px {
	    display: none;
	}
	.ml-10px {
	    display: none;
	}
	.outline_rojo,
	.outline_verde,
	.outline_azul,
	.outline_amarillo{
		margin-top: 3em;
	}

	.inicio{
		background-image: url(../img/google20_2.gif);
	}
	.up{
		bottom: 20px;
	}
	

}
@media screen and (max-width: 480px) {
	body{
		max-width: 320px;
		margin-left: auto;
		margin-right: auto;
	}
	

}













