/* switching to border-box model for all elements */
html {
  box-sizing: border-box;
}
* {
  box-sizing: inherit;
}

html {
	/* set base font-size to equiv "10px", which is adapted to rem unit */
	font-size: 62.5%;
	/* IE9-IE11 math fixing. See https://bit.ly/1g4X0bX */
	/* thanks to @guardian, @victorbritopro and @eQRoeil */
	font-size: calc(1em * 0.625);
}

body {
	background: white;
	font-size: 1.4em;
}

/* BROWSER-ELEMENTS */

.browser-elements {
	margin-left: unset;
	margin-bottom: 30rem;
}

.browser-elements .top {
	width: 30rem;
	background: #cccccc;
	border: 1px solid #cccccc;
	padding: 1rem 0;
}

.browser-elements .top-ellipse {
	display: inline-block;
	vertical-align: middle;
	background: #999999;
	width: 0.75rem;
	height: 0.75rem;
	border-radius: 0.75rem;
	
}

.browser-elements .top-ellipse:nth-child(1) {
	margin-left: 0.5rem;
}

.browser-elements .top-ellipse:nth-child(3) {
	margin-right: 0.2rem;
}

.browser-elements .top-input {
	display: inline-block;
	vertical-align: middle;
	height: 2.5rem;
	padding: .5rem 0;
	width: 24rem;
	background: white;
}

.browser-elements .top-url {
	display: inline-block;
	vertical-align: middle;
	background: #cccccc;
	width: 15rem;
	height: 1rem;
	margin-left: 1rem;
}

.browser-elements .center {
	overflow: hidden;
	background: white;
	border: 1px solid #cccccc;
	width: 30rem;
	height: 40rem;
	
}

.browser-elements .scroll {
	display: inline-block;
	vertical-align: top;
	width: .74rem;
	height: 4.7rem;
	background: #cccccc;
	margin-top: 1rem;
	margin-left: 28.7rem;
	-webkit-animation: anim-scroll 40s linear infinite forwards ;
	animation: anim-scroll 40s linear infinite forwards;
}

@-webkit-keyframes anim-scroll {
	
	0% {margin-top: 1rem;opacity: 0;}
	10% {margin-top: 1rem;opacity: 0;}
	14% {margin-top: 1rem;opacity: 1;}
	16% {margin-top: 15rem;opacity: 1;}
	22% {margin-top: 15rem;opacity: 1;}
	23% {margin-top: 15rem;opacity: 0;}
	49% {margin-top: 15rem;opacity: 0;}
	50% {margin-top: 15rem;opacity: 1;}
	52% {margin-top: 1rem;opacity: 1;}
	58% {margin-top: 1rem;opacity: 0;}	
	100% {margin-top: 1rem;opacity: 0;}
}

@keyframes anim-scroll {
	
	0% {margin-top: 1rem;opacity: 0;}
	10% {margin-top: 1rem;opacity: 0;}
	14% {margin-top: 1rem;opacity: 1;}
	16% {margin-top: 15rem;opacity: 1;}
	22% {margin-top: 15rem;opacity: 1;}
	23% {margin-top: 15rem;opacity: 0;}
	49% {margin-top: 15rem;opacity: 0;}
	50% {margin-top: 15rem;opacity: 1;}
	52% {margin-top: 1rem;opacity: 1;}
	58% {margin-top: 1rem;opacity: 0;}	
	100% {margin-top: 1rem;opacity: 0;}
}


/* DIAPO 1 */

.browser-page-1 {
	/*display: none;*/
	display: block;
	text-align: center;
	margin-left: 0rem;
	-webkit-animation: anim-slide1 40s linear infinite forwards;
	animation: anim-slide1 40s linear infinite forwards;
	
}
	
@-webkit-keyframes anim-slide1 {
	
	0% {margin-left: 0rem;}
	9% {margin-left: 0rem;}
	10% {margin-left: -58rem;}
	100% {margin-left: -58rem;}
}

@keyframes anim-slide1 {
	
	0% {margin-left: 0rem;}
	9% {margin-left: 0rem;}
	10% {margin-left: -58rem;}
	100% {margin-left: -58rem;}
}


.browser-page-1 .center-wrapper-ellipse-1 {
	display: block;
}


.center-ellipse {
	display: inline-block;
	vertical-align: middle;
	border-radius: 2rem;
}

.center-ellipse-1 {
	width: 1.5rem;
	height: 1.5rem;
}

.center-ellipse:nth-child(1) {
	width: 3rem;
	height: 3rem;
}

.center-ellipse:nth-child(1), .center-ellipse:nth-child(4) {
	background: #1368e9;
}

.center-ellipse:nth-child(2), .center-ellipse:nth-child(6) {
	background: #d5422d;
}

.center-ellipse:nth-child(3) {
	background: #ffb708;
}

.center-ellipse:nth-child(5) {
	background: #009857;
}

.center-google-country {
	display: block;
	margin-left: 17rem;
	background: #cccccc;
	width: 4rem;
	height: 1rem;
}

.center-google-input {
	display: block;
	margin: 2rem auto;
	background: white;
	border: 1px solid #cccccc;
	
}

.browser-page-1 .keyword1{
	display: inline-block;
	background: #CCCCCC;
	width: 2rem;
	height: 1.3rem;
	margin-left: 0rem;
	margin: 0.45rem 0 0 -12rem;
	-webkit-animation: anim-keyword1 40s linear infinite forwards;
	animation: anim-keyword1 40s linear infinite forwards;
}

@-webkit-keyframes anim-keyword1 {
	0%{width: 0rem;height: 1.3rem;}
	3%{width: 0rem;height: 1.3rem;}
	4%{width: 2rem;height: 1.3rem;}
	100%{width: 2rem;height: 1.3rem;}
}

@keyframes anim-keyword1 {
	0%{width: 0rem;height: 1.3rem;}
	3%{width: 0rem;height: 1.3rem;}
	4%{width: 2rem;height: 1.3rem;}
	100%{width: 2rem;height: 1.3rem;}
}

.browser-page-1 .keyword2{
	display: inline-block;
	background: #CCCCCC;
	width: 8.0rem;
	height: 1.3rem;
	margin: 0.45rem 0 0 0rem;
	-webkit-animation: anim-keyword2 40s linear infinite forwards;
	animation: anim-keyword2 40s linear infinite forwards;
}

@-webkit-keyframes anim-keyword2 {
	0%{width: 0rem;height: 1.3rem;}
	5%{width: 0rem;height: 1.3rem;}
	7%{width: 8rem;height: 1.3rem;}
	100%{width: 8rem;height: 1.3rem;}
}

@keyframes anim-keyword2 {
	0%{width: 0rem;height: 1.3rem;}
	5%{width: 0rem;height: 1.3rem;}
	7%{width: 8rem;height: 1.3rem;}
	100%{width: 8rem;height: 1.3rem;}
}

.google-input-1 {
	width: 24rem;
	height: 2.5rem;
}

.center-search {
	display: inline-block;
	background: #CCCCCC;
	border: 1px solid #CCCCCC;
	margin: 0 auto;
	width: 7rem;
	height: 2rem;
	
}

.center-search .reaction {
	background: white;
	margin: 0 auto;
	opacity: 0;
	display: block;
	width: 0%;
	height: 0%;
	padding: 0.9rem 3.5rem;
	-webkit-animation: anim-clicSearch 40s linear infinite forwards;
	animation: anim-clicSearch 40s linear infinite forwards;
}
	
@-webkit-keyframes anim-clicSearch {
	
	0% {width: 0%;height: 0%;opacity: 0;}
	7% {width: 0%;height: 0%;opacity: 0;}
	8% {width: 100%;height: 100%;opacity: 0.4;}
	9% {width: 0%;height: 0%;opacity: 0;}
	100% {width: 0%;height: 0%;opacity: 0;}
}

@keyframes anim-clicSearch {
	
	0% {width: 0%;height: 0%;opacity: 0;}
	7% {width: 0%;height: 0%;opacity: 0;}
	8% {width: 100%;height: 100%;opacity: 0.4;}
	9% {width: 0%;height: 0%;opacity: 0;}
	100% {width: 0%;height: 0%;opacity: 0;}
}


.center-lucky {
	display: inline-block;
	background: #CCCCCC;
	margin: 0 0 0 1rem;
	width: 7rem;
	height: 2rem;

}

/* DIAPO 2 */

.browser-page-2 {
	/*display: none;*/
	display: block;
	width: 30rem;
	margin-top: -14rem;
	margin-left: 30rem;
	-webkit-animation: anim-slide2 40s linear infinite forwards;
	animation: anim-slide2 40s linear infinite forwards;
}


@-webkit-keyframes anim-slide2 {
	
	0% {margin-top: -14rem;margin-left: 30rem;}
	10% {margin-top: -14rem;margin-left: 30rem;}
	12% {margin-top: -14rem;margin-left: 0rem;}
	14% {margin-top: -14rem;margin-left: 0rem;}
	16% {margin-top: -42rem;margin-left: 0rem;}
	21% {margin-top: -42rem;margin-left: 0rem;}
	23% {margin-top: -42rem;margin-left: -30rem;}
	
	24% {margin-top: 12rem;margin-left: -30rem;}
	25% {margin-top: 12rem;margin-left: -30rem;}
	
	26% {margin-top: 12rem;margin-left: -0rem;}
	27% {margin-top: 12rem;margin-left: -0rem;}
	
	
	43%{margin-top: 12rem;margin-left: 0rem;}
	44%{margin-top: -42rem;margin-left: 0rem;}
	
	50%{margin-top: -42rem;margin-left: 0rem;}
	52%{margin-top: -14rem;margin-left: 0rem;opacity: 1;}
	
	57%{opacity: 1;}
	58%{opacity: 0;}
	
	100% {margin-top: -14rem;margin-left: 0rem;opacity: 0;}
}

@keyframes anim-slide2 {
	
	0% {margin-top: -14rem;margin-left: 30rem;}
	10% {margin-top: -14rem;margin-left: 30rem;}
	12% {margin-top: -14rem;margin-left: 0rem;}
	14% {margin-top: -14rem;margin-left: 0rem;}
	16% {margin-top: -42rem;margin-left: 0rem;}
	21% {margin-top: -42rem;margin-left: 0rem;}
	23% {margin-top: -42rem;margin-left: -30rem;}
	
	24% {margin-top: 12rem;margin-left: -30rem;}
	25% {margin-top: 12rem;margin-left: -30rem;}
	
	26% {margin-top: 12rem;margin-left: -0rem;}
	27% {margin-top: 12rem;margin-left: -0rem;}
	
	
	43%{margin-top: 12rem;margin-left: 0rem;}
	44%{margin-top: -42rem;margin-left: 0rem;}
	
	50%{margin-top: -42rem;margin-left: 0rem;}
	52%{margin-top: -14rem;margin-left: 0rem;opacity: 1;}
	
	57%{opacity: 1;}
	58%{opacity: 0;}
	
	100% {margin-top: -14rem;margin-left: 0rem;opacity: 0;}
}


.center-wrapper-ellipse-2 {
	display: inline-block;
	vertical-align: top;
	margin-top: 0rem;
	margin-left: 1rem;
}

 .browser-page-2 .center-ellipse-2 {
	width: 1rem;
	height: 1rem;
}

 .browser-page-2 .center-ellipse:nth-child(1) {
	width: 2rem;
	height: 2rem;
}

.google-input-2 {
	display: inline-block;
	vertical-align: middle;
	width: 14rem;
	height: 1.5rem;
}

 .browser-page-2 .keyword1 {
	display: inline-block;
	background: #CCCCCC;
	width: 1.3rem;
	height: 0.5rem;
	margin-left: 1rem;
	margin-bottom: 0.2rem;
}

 .browser-page-2 .keyword2 {
	display: inline-block;
	background: #CCCCCC;
	width: 4.0rem;
	height: 0.5rem;
	margin-bottom: 0.2rem;
}

.center-google-input-search {
	display: inline-block;
	margin-left: -0.5rem;
	vertical-align: middle;
	background: #CCCCCC;
	width: 1.5rem;
	height: 1.5rem;
}

.center-wrapper-google-category {
	margin-left: 2rem;
}

.center-google-category {
	display: inline-block;
	vertical-align: top;
	background: #CCCCCC;
	width: 2.3rem;
	height: 1rem;
}

.center-google-category:nth-child(6):after {
	content: "";
	display: inline-block;
	vertical-align: middle;
	margin-left: 2.7rem;
	margin-top: -0.5rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 2.5px 2.25px 0 2.25px;
	border-color: #cccccc transparent transparent transparent;
	
}

.center-google-category:nth-child(7) {
	margin-left: 1rem;
}

.center-wrapper-google-site-web {
	margin-top: 2rem;
	margin-left: 2rem;
	display: inline-block;
	vertical-align: top;
}

.google-site-web {
	margin-bottom: 2rem;
}

.google-site-web:nth-child(1),.google-site-web:nth-child(2),.google-site-web:nth-child(3),.google-site-web:nth-child(4),.aside {
	-webkit-animation: anim-googleSiteWeb 40s linear infinite forwards;
	animation: anim-googleSiteWeb 40s linear infinite forwards;
}

@-webkit-keyframes anim-googleSiteWeb {
	0% {opacity: 1;}
	16% {opacity: 1;}
	18% {opacity: 0.2;}
	46% {opacity: 1;}
	47% {opacity: 1;}
	100% {opacity: 1;}
	
}

@keyframes anim-googleSiteWeb {
	0% {opacity: 1;}
	16% {opacity: 1;}
	18% {opacity: 0.2;}
	46% {opacity: 1;}
	47% {opacity: 1;}
	100% {opacity: 1;}
	
}

.google-site-web:nth-child(1) .title{
	-webkit-animation: anim-googleSiteWebTitle1 40s linear infinite forwards;
	animation: anim-googleSiteWebTitle1 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebTitle1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 0.7;}
	55% {background: #e7c791;opacity: 0.7;}
	56% {background: #e7c791;opacity: 0.7;}
	100% {background: #e7c791;opacity: 0.7;}
	
}

@keyframes anim-googleSiteWebTitle1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 0.7;}
	55% {background: #e7c791;opacity: 0.7;}
	56% {background: #e7c791;opacity: 0.7;}
	100% {background: #e7c791;opacity: 0.7;}
	
}

.google-site-web:nth-child(1) .url{
	-webkit-animation: anim-googleSiteWebUrl1 40s linear infinite forwards;
	animation: anim-googleSiteWebUrl1 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebUrl1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 1;}
	55% {background: #e7c791;opacity: 1;}
	56% {background: #e7c791;opacity: 1;}
	100% {background: #e7c791;opacity: 1;}
	
}

@keyframes anim-googleSiteWebUrl1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 1;}
	55% {background: #e7c791;opacity: 1;}
	56% {background: #e7c791;opacity: 1;}
	100% {background: #e7c791;opacity: 1;}
	
}

.google-site-web:nth-child(1) .description{
	-webkit-animation: anim-googleSiteWebDescription1 40s linear infinite forwards;
	animation: anim-googleSiteWebDescription1 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebDescription1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 0.2;}
	55% {background: #e7c791;opacity: 0.2;}
	56% {background: #e7c791;opacity: 0.2;}
	100% {background: #e7c791;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebDescription1 {
	0% {background: #CCCCCC;opacity: 1;}
	53% {background: #CCCCCC;opacity: 1;}
	54% {background: #e7c791;opacity: 0.2;}
	55% {background: #e7c791;opacity: 0.2;}
	56% {background: #e7c791;opacity: 0.2;}
	100% {background: #e7c791;opacity: 0.2;}
	
}

.google-site-web:nth-child(2) .title{
	-webkit-animation: anim-googleSiteWebTitle2 40s linear infinite forwards;
	animation: anim-googleSiteWebTitle2 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebTitle2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 0.7;}
	53% {background: #e7c791;opacity: 0.7;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebTitle2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 0.7;}
	53% {background: #e7c791;opacity: 0.7;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(2) .url{
	-webkit-animation: anim-googleSiteWebUrl2 40s linear infinite forwards;
	animation: anim-googleSiteWebUrl2 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebUrl2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 1;}
	53% {background: #e7c791;opacity: 1;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebUrl2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 1;}
	53% {background: #e7c791;opacity: 1;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(2) .description{
	-webkit-animation: anim-googleSiteWebDescription2 40s linear infinite forwards;
	animation: anim-googleSiteWebDescription2 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebDescription2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 0.2;}
	53% {background: #e7c791;opacity: 0.2;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebDescription2 {
	0% {background: #CCCCCC;opacity: 1;}
	51% {background: #CCCCCC;opacity: 1;}
	52% {background: #e7c791;opacity: 0.2;}
	53% {background: #e7c791;opacity: 0.2;}
	54% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(3) .title{
	-webkit-animation: anim-googleSiteWebTitle3 40s linear infinite forwards;
	animation: anim-googleSiteWebTitle3 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebTitle3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 0.7;}
	51% {background: #e7c791;opacity: 0.7;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebTitle3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 0.7;}
	51% {background: #e7c791;opacity: 0.7;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(3) .url{
	-webkit-animation: anim-googleSiteWebUrl3 40s linear infinite forwards;
	animation: anim-googleSiteWebUrl3 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebUrl3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 1;}
	51% {background: #e7c791;opacity: 1;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebUrl3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 1;}
	51% {background: #e7c791;opacity: 1;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(3) .description{
	-webkit-animation: anim-googleSiteWebDescription3 40s linear infinite forwards;
	animation: anim-googleSiteWebDescription3 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebDescription3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 0.2;}
	51% {background: #e7c791;opacity: 0.2;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebDescription3 {
	0% {background: #CCCCCC;opacity: 1;}
	49% {background: #CCCCCC;opacity: 1;}
	50% {background: #e7c791;opacity: 0.2;}
	51% {background: #e7c791;opacity: 0.2;}
	52% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(4) .title{
	-webkit-animation: anim-googleSiteWebTitle4 40s linear infinite forwards;
	animation: anim-googleSiteWebTitle4 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebTitle4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 0.7;}
	49% {background: #e7c791;opacity: 0.7;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebTitle4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 0.7;}
	49% {background: #e7c791;opacity: 0.7;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(4) .url{
	-webkit-animation: anim-googleSiteWebUrl4 40s linear infinite forwards;
	animation: anim-googleSiteWebUrl4 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebUrl4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 1;}
	49% {background: #e7c791;opacity: 1;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebUrl4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 1;}
	49% {background: #e7c791;opacity: 1;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

.google-site-web:nth-child(4) .description{
	-webkit-animation: anim-googleSiteWebDescription4 40s linear infinite forwards;
	animation: anim-googleSiteWebDescription4 40s linear infinite forwards;
}
@-webkit-keyframes anim-googleSiteWebDescription4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 0.2;}
	49% {background: #e7c791;opacity: 0.2;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebDescription4 {
	0% {background: #CCCCCC;opacity: 1;}
	47% {background: #CCCCCC;opacity: 1;}
	48% {background: #e7c791;opacity: 0.2;}
	49% {background: #e7c791;opacity: 0.2;}
	50% {background: #cccccc;opacity: 0.2;}
	100% {background: #cccccc;opacity: 0.2;}
	
}


.google-site-web:nth-child(5) .title {
	-webkit-animation: anim-googleSiteWebTitle5 40s linear infinite forwards;
	animation: anim-googleSiteWebTitle5 40s linear infinite forwards;
}

@-webkit-keyframes anim-googleSiteWebTitle5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 0.7;}
	47% {background: #e7c791;opacity: 0.7;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebTitle5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 0.7;}
	47% {background: #e7c791;opacity: 0.7;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
	
}

.google-site-web:nth-child(5) .url {
	-webkit-animation: anim-googleSiteWebUrl5 40s linear infinite forwards;
	animation: anim-googleSiteWebUrl5 40s linear infinite forwards;
}

@-webkit-keyframes anim-googleSiteWebUrl5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 1;}
	47% {background: #e7c791;opacity: 1;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
}

@keyframes anim-googleSiteWebUrl5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 1;}
	47% {background: #e7c791;opacity: 1;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
}

.google-site-web:nth-child(5) .description {
	-webkit-animation: anim-googleSiteWebDescription5 40s linear infinite forwards;
	animation: anim-googleSiteWebDescription5 40s linear infinite forwards;
}

@-webkit-keyframes anim-googleSiteWebDescription5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 0.2;}
	47% {background: #e7c791;opacity: 0.2;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
	
}

@keyframes anim-googleSiteWebDescription5 {
	0% {background: #CCCCCC;opacity: 1;}
	45% {background: #CCCCCC;opacity: 1;}
	46% {background: #e7c791;opacity: 0.2;}
	47% {background: #e7c791;opacity: 0.2;}
	48% {background: #CCCCCC;opacity: 0.2;}
	100% {background: #CCCCCC;opacity: 0.2;}
	
}

.google-site-web .title {
	display: block;
	background: #CCCCCC;
	width: 16.5rem;
	height: 1rem;
}


.google-site-web .reaction {
	background: white;
	margin: 0 auto;
	opacity: 0;
	display: block;
	width: 0%;
	height: 0%;
	padding: 0.5rem 8.25rem;
	-webkit-animation: anim-clicUrl 40s linear infinite forwards;
	animation: anim-clicUrl 40s linear infinite forwards;
}

@-webkit-keyframes anim-clicUrl {
	0% {width: 0%;height: 0%;opacity: 0;}
	19% {width: 0%;height: 0%;opacity: 0;}
	20% {width: 100%;height: 100%;opacity: 0.8;}
	21% {width: 0%;height: 0%;opacity: 0;}
	100% {width: 0%;height: 0%;opacity: 0;}
	
}

@keyframes anim-clicUrl {
	0% {width: 0%;height: 0%;opacity: 0;}
	19% {width: 0%;height: 0%;opacity: 0;}
	20% {width: 100%;height: 100%;opacity: 0.8;}
	21% {width: 0%;height: 0%;opacity: 0;}
	100% {width: 0%;height: 0%;opacity: 0;}
	
}

.google-site-web .url {
	display: block;
	background: #CCCCCC;
	width: 7.5rem;
	height: 0.5rem;
	margin-top: 0.3rem;
}

.google-site-web .description {
	display: block;
	background: #CCCCCC;
	width: 16.5rem;
	height: 5rem;
	margin-top: 0.3rem;
}

.aside {
	display: inline-block;
	vertical-align: top;
	background: #CCCCCC;
	width: 5.5rem;
	height: 16.2rem;
	margin-top: 2rem;
	margin-left: 2rem;
}

/* DIAPO 3 */

.browser-page-3 {
	/*display: none;*/
	display: block;
	width: 21rem;
	opacity: 1;
	-webkit-animation: anim-slide3 40s linear infinite forwards;
	animation: anim-slide3 40s linear infinite forwards;
}


@-webkit-keyframes anim-slide3 {
	0% {margin-top: -85rem;margin-left: 30rem;opacity: 1;}
	25% {margin-top: -85rem;margin-left: 30rem;opacity: 1;}
	27% {margin-top: -85rem;margin-left: 4rem;opacity: 1;}
	28% {margin-top: -85rem;margin-left: 4rem;opacity: 1;}
	36% {margin-top: -85rem;margin-left: 4rem;opacity: 0;}
	100% {margin-top: -85rem;margin-left: 4rem;opacity: 0;}
	
}

@keyframes anim-slide3 {
	0% {margin-top: -85rem;margin-left: 30rem;opacity: 1;}
	25% {margin-top: -85rem;margin-left: 30rem;opacity: 1;}
	27% {margin-top: -85rem;margin-left: 4rem;opacity: 1;}
	28% {margin-top: -85rem;margin-left: 4rem;opacity: 1;}
	36% {margin-top: -85rem;margin-left: 4rem;opacity: 0;}
	100% {margin-top: -85rem;margin-left: 4rem;opacity: 0;}
	
}

/*.browser-page-3 .website-title,.browser-page-3 .website-prefooter, .browser-page-3 .website-footer{
	display: block;
	background: #CCCCCC;
}

.browser-page-3 .website-title {
	width: 21rem;
	height: 1.6rem;
	margin-bottom: 1rem;
}

.browser-page-3 .website-prefooter {
	width: 21rem;
	height: 8rem;
	margin-bottom: 2rem;
}


.browser-page-3 .website-main, .browser-page-3 .website-aside{
	display: inline-block;
	background: #CCCCCC;
	margin-bottom: 1rem;
}

.browser-page-3 .website-main {
	height: 20rem;
	width: 15rem;
}

.browser-page-3 .website-aside {
	height: 20rem;
	width: 5rem;
	margin-left: 0.5rem;
}

.browser-page-3 .website-footer {
	width: 21rem;
	height: 2rem;
}*/


.browser-page-3 .stat-trace {
	fill:none;
	stroke:#999999;
	stroke-width:7;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-miterlimit:10;
}

.browser-page-3 .stat-line {
	fill:none;
	stroke:#CCCCCC;
	stroke-width:7;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-miterlimit:10;
	stroke-dasharray:1000;
  	stroke-dashoffset:1000;
	-webkit-animation: anim-statLine 40s linear infinite forwards;
	animation: anim-statLine 40s linear infinite forwards;
}

@-webkit-keyframes anim-statLine {
	0%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	27%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	28%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	31%{stroke: #cccccc; fill:none;stroke-dashoffset:0;}
	100%{stroke: #cccccc; fill:none;stroke-dashoffset:0;}
}

@keyframes anim-statLine {
	0%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	27%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	28%{stroke: #cccccc; fill:none;stroke-dashoffset:1000;}
	31%{stroke: #cccccc; fill:none;stroke-dashoffset:0;}
	100%{stroke: #cccccc; fill:none;stroke-dashoffset:0;}
}

.browser-page-3 .stat-cursor {
	-webkit-animation: anim-statCursor 40s linear infinite forwards;
	animation: anim-statCursor 40s linear infinite forwards;
}

@-webkit-keyframes anim-statCursor {
	0%{stroke:none;fill: none;}
	30%{stroke:none;fill: none;}
	31%{stroke:none;fill:#cccccc;}
	100%{stroke:none;fill:#cccccc;}
}

@keyframes anim-statCursor {
	0%{stroke:transparent;fill: transparent;}
	30%{stroke:transparent;fill: transparent;}
	31%{stroke:transparent;fill:#cccccc;}
	100%{stroke:transparent;fill:#cccccc;}
}

.browser-page-3 .stat-point {
	fill:#666666;
	stroke: none;
}

.browser-page-3 .message-stat {
	margin-top: 2rem;
	color: #cccccc;
	font-family: verdana;
	font-weight: normal;
	font-size: 18px;
	text-align: center;
}

/* DIAPO 4 */

.browser-page-4 {
	/*display: none;*/
	display: block;
	-webkit-animation: anim-slide4 40s linear infinite forwards;
	animation: anim-slide4 40s linear infinite forwards;
}

@-webkit-keyframes anim-slide4 {
	0%{margin-top: -28rem;margin-left: 0rem;}
	40%{margin-top: -28rem;margin-left: 0rem;}
	42%{margin-top: -28rem;margin-left: 0rem;}
	44%{margin-top: 75rem;margin-left: 0rem;}
	100%{margin-top: 75rem;margin-left: 0rem;}
}

@keyframes anim-slide4 {
	0%{margin-top: -28rem;margin-left: 0rem;}
	40%{margin-top: -28rem;margin-left: 0rem;}
	42%{margin-top: -28rem;margin-left: 0rem;}
	44%{margin-top: 75rem;margin-left: 0rem;}
	100%{margin-top: 75rem;margin-left: 0rem;}
}

.browser-page-4 #svg-title, .browser-page-4 #svg-main-1, .browser-page-4 #svg-main-2, .browser-page-4 #svg-main-3, .browser-page-4 #svg-aside, .browser-page-4 #svg-footer {
	stroke-dasharray:1000;
  	stroke-dashoffset:1000;
	-webkit-animation: anim-wireframe 40s linear infinite forwards;
	animation: anim-wireframe 40s linear infinite forwards;

}

@-webkit-keyframes anim-wireframe {
	0% {stroke: #cccccc; fill:transparent;stroke-dashoffset:1000;}
	35% {stroke: #cccccc; fill:transparent;stroke-dashoffset:1000;}
	38% {stroke: #cccccc; fill:transparent;stroke-dashoffset:0;}
	41% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	43% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	100% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
}

@keyframes anim-wireframe {
	0% {stroke: #cccccc; fill:transparent;stroke-dashoffset:1000;}
	35% {stroke: #cccccc; fill:transparent;stroke-dashoffset:1000;}
	38% {stroke: #cccccc; fill:transparent;stroke-dashoffset:0;}
	41% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	43% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	100% {stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
}

.browser-elements .top-url {
	-webkit-animation: anim-topUrl 40s linear infinite forwards;
	animation: anim-topUrl 40s linear infinite forwards;
}

@-webkit-keyframes anim-topUrl {
	0% {background: #CCCCCC;}
	38% {background: #CCCCCC;}
	39% {background: #e7c791;}
	40% {background: #e7c791;}
	45% {background: #cccccc;}
	100% {background: #cccccc;}
}

@keyframes anim-topUrl {
	0% {background: #CCCCCC;}
	38% {background: #CCCCCC;}
	39% {background: #e7c791;}
	40% {background: #e7c791;}
	45% {background: #cccccc;}
	100% {background: #cccccc;}
}

.browser-page-4 #svg-title {

	-webkit-animation: anim-wireframeTitle 40s linear infinite forwards;
	animation: anim-wireframeTitle 40s linear infinite forwards;
}

@-webkit-keyframes anim-wireframeTitle {
	0% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	36% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	
	37% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	38% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
	39% {opacity: 1;stroke: #cccccc;fill:#cccccc;stroke-dashoffset:0;}
	40% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
	
	100% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
}

@keyframes anim-wireframeTitle {
	0% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	36% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	
	37% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	38% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
	39% {opacity: 1;stroke: #cccccc;fill:#cccccc;stroke-dashoffset:0;}
	40% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
	
	100% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
}

.browser-page-4 #svg-main-2, .browser-page-4 #svg-main-3 {
	-webkit-animation: anim-wireframeContent 40s linear infinite forwards;
	animation: anim-wireframeContent 40s linear infinite forwards;
}

@-webkit-keyframes anim-wireframeContent {
	
	0% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	36% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	
	37% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	38% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
	39% {opacity: 1;stroke: #cccccc;fill:#cccccc;stroke-dashoffset:0;}
	40% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
	
	100% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
}

@keyframes anim-wireframeContent {
	
	0% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	36% {stroke: #CCCCCC; fill:transparent;stroke-dashoffset:1000;}
	
	37% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	38% {opacity: 1;stroke: #cccccc; fill:#cccccc;stroke-dashoffset:0;}
	
	39% {opacity: 1;stroke: #cccccc;fill:#cccccc;stroke-dashoffset:0;}
	40% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
	
	100% {opacity: 0.5;stroke: #e7c791;fill:#e7c791;stroke-dashoffset:0;}
}


.browser-page-4 #svg-aside {
	margin-left: 0rem;
}


/* DIAPO 5 */

.browser-page-5 {
	/*display: none;*/
	display: block;
	margin: 0rem auto 0;
	margin-top: -130rem;
	-webkit-animation: anim-slide5 40s linear infinite forwards;
	animation: anim-slide5 40s linear infinite forwards;
}

@-webkit-keyframes anim-slide5 {
	0%{opacity: 0;}
	58%{opacity: 0;}
	60%{opacity: 1;}
	100%{opacity: 1;}
}

@keyframes anim-slide5 {
	0%{opacity: 0;}
	58%{opacity: 0;}
	60%{opacity: 1;}
	100%{opacity: 1;}
}

.cup {
	width: 80%;
	height: 80%;
	-webkit-animation: anim-cup 40s linear infinite forwards;
	animation: anim-cup 40s linear infinite forwards;
}

@-webkit-keyframes anim-cup {
	0%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:500;stroke-dashoffset:1000;opacity: 1;}
	60%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:500;stroke-dashoffset:1000;opacity: 1;}
	
	65%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:500;stroke-dashoffset:0;opacity: 1;}
	67%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:500;stroke-dashoffset:0;opacity: 1;}
	
	67%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:1000;stroke-dashoffset:0;opacity: 0;}
	68%{stroke-width:3;fill:none;stroke: #E7C791;stroke-dasharray:1000;stroke-dashoffset:0;opacity: 0;}
	
	69%{stroke-width:3;fill:#E7C791;stroke: none;stroke-dasharray:1000;stroke-dashoffset:0;opacity: 1;}
	100%{stroke-width:3;fill:#E7C791;stroke: none;stroke-dasharray:1000;stroke-dashoffset:0;opacity: 1;}
}

@keyframes anim-cup {
	0% {
		stroke-width: 3;
		fill: transparent;
		stroke: #E7C791;
		stroke-dasharray: 500;
		stroke-dashoffset: 1000;
		opacity: 0; /* sau 1, în funcție de efectul dorit */
	}
}
.service-list {
    font-size: 1.4rem !important;
}
.service-title {
    font-size: 1.9rem !important;
}
section#services {
    padding-top: 0em !important;
}
.section-header h2 {
    font-size: 3rem !important;
}