@keyframes example {

	10% {
		-ms-transform: rotate(50deg); /* IE 9 */
		-webkit-transform: rotate(50deg); /* Chrome, Safari, Opera */
		transform: rotate(50deg);
	}
	20% {
		-ms-transform: rotate(0deg); /* IE 9 */
		-webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
		transform: rotate(0deg);
	}
	30% {
		-ms-transform: rotate(50deg); /* IE 9 */
		-webkit-transform: rotate(50deg); /* Chrome, Safari, Opera */
		transform: rotate(50deg);
	}
	40% {
		-ms-transform: rotate(0deg); /* IE 9 */
		-webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
		transform: rotate(0deg);
	}
    100% {
		-ms-transform: rotate(0deg); /* IE 9 */
		-webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
		transform: rotate(0deg);
	}

}

.manual {
    list-style-type: number;
}

@keyframes icon {

	10% {
		-ms-transform: scale(1.3,1.3); /* IE 9 */
		-webkit-transform: scale(1.3,1.3); /* Chrome, Safari, Opera */
		transform: scale(1.3,1.3);
	}
	20% {
		-ms-transform: scale(1.0,1.0); /* IE 9 */
		-webkit-transform: scale(1.0,1.0); /* Chrome, Safari, Opera */
		transform: scale(1.0,1.0);
	}
	30% {
		-ms-transform: scale(1.3,1.3); /* IE 9 */
		-webkit-transform: scale(1.3,1.3); /* Chrome, Safari, Opera */
		transform: scale(1.3,1.3);
	}
	40% {
		-ms-transform: scale(1.0,1.0); /* IE 9 */
		-webkit-transform: scale(1.0,1.0); /* Chrome, Safari, Opera */
		transform: scale(1.0,1.0);
	}
    100% {
		-ms-transform: scale(1.0,1.0); /* IE 9 */
		-webkit-transform: scale(1.0,1.0); /* Chrome, Safari, Opera */
		transform: scale(1.0,1.0);
	}

}

body
{
	color: #535353;
	font-family: 'Arimo', sans-serif;
}
.jumbotron
{
	background-color: #0057A6;
	color: #fff;
}

.main-header
{
	background-color: #0057A6;
	color: #fff;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 20px;
}


    .networks-icon
	{
		font-size: 150px;
	}
	.networks-label
	{
		font-size: 30px;
		font-weight: bold;
	}

	.os-icon
	{
		font-size: 150px;
		color: #fff;
	}
	.os-label
	{
		font-size: 30px;
		font-weight: bold;
		color: #fff;
	}
	.os-icon:hover
	{
		color: #d8d8d8;
	}
	.os-label:hover
	{
		color: #d8d8d8;
	}

	.wrench-icon
	{
		font-size: 20px;
		color: #535353;
		margin-right: 5px;


	}

	.rotate
	{
		animation-name: example;
		animation-duration: 3s;
		animation-delay: 2s;
		animation-iteration-count: infinite;

		display: -moz-inline-stack;
		display: inline-block;
		zoom: 1;
		*display: inline;
		vertical-align: top;
		margin-right: 5px;
	}
	.icon1
	{
		animation-name: icon;
		animation-duration: 3s;
		animation-delay: 1s;
		animation-iteration-count: infinite;
	}
	.icon2
	{
		animation-name: icon;
		animation-duration: 3s;
		animation-delay: 1s;
		animation-iteration-count: infinite;

		display: -moz-inline-stack;
		display: inline-block;
		zoom: 1;
		*display: inline;
		vertical-align: top;
		margin-right: 5px;
	}
	.wrench-label
	{
		font-size: 20px;
		font-weight: bold;
		color: #535353;
	}
	.wrench-icon:hover
	{
		color: #d8d8d8;
	}
	.wrench-label:hover
	{

	}

	.icon-ok
	{
		color: green;
	}
a:hover
{
	text-decoration: none;
	color: #009933;
}


.logo-cmuj
{
	margin-top: 10px;
	margin-bottom: 15px;
}

.main-footer
{
	background-color:#ff9900;
    font-size:1.2em;
	margin-top: 60px;
	padding-top: 10px;
	font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
}

.text-footer{

    color:#fff;
}
.text-footer a{

    color:#333;
}
.text-footer a:hover {
	text-decoration: underline;
}


.os-choose{
	background-color: rgb(52, 152, 219);
}
.h2
{
	color: #fff;
}

#btn-close-modal
{
    width:100%;
    text-align: center;
    cursor:pointer;
    color:#fff;
    font-size:30px;
}



.config-start
{
	font-size: 20px;
	color: #fff;
}

.network-description
{
	font-size: 16px;
	margin-left: 10px;
	margin-right: 10px;
}
.bold-text
{
	font-weight: bold;
}

.link1
{
	color: #fff;
	text-decoration: underline;
}
.link1:hover
{
	color: #5d5d5d;
	text-decoration: underline;
}



.next-slider {
	color: #535353;
}



.menu-network {
	font-size: 40px;
	margin-top: 20px;
}

.description {
	font-size: 20px;
	line-height: 200%;
}

.margin-bottom-1
{
	margin-bottom: 10px;
}
.icon-picture
{
	font-size: 20px;
}
video {
	width: 800px;
}

.video-ios {
    width: 700px;
}
.video-android {
    width: 500px;
}



.slider-navigation
{
    font-size: 20px;
    font-weight: bold;
}

.mySlides {display:none}
.w3-left, .w3-right, .w3-badge {cursor:pointer}
.w3-badge {height:13px;width:13px;padding:0}



.gallery {
        list-style: none;
        overflow: hidden;
        padding: 0;
        margin: 0;
    }

    .gallery li {
        float: left;
        margin: 4px;
    }



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

	.jumbotron p
	{
		margin-bottom: 15px;
		font-size: 12px;
		font-weight: 200;
	}
	.label1
	{
		font-size: 16px;
		font-weight: bold;
		margin-top: -10px;
	}
	.os-choose{
		padding-left: 15px;
		padding-right: 15px;
	}

	.h2
	{
		font-size: 20px;
	}
	.networks-icon
	{
		font-size: 100px;
	}

	.networks-label
	{
		font-size: 20px;
		font-weight: bold;
	}

	.os-icon
	{
		font-size: 100px;
	}

	.os-label
	{
		font-size: 20px;
		font-weight: bold;
	}

	.menu-network {
	font-size: 20px;
	margin-top: 5px;

	}
	.wrench-icon {
		font-size: 14px;
	}

	.description {
		font-size: 12px;
		line-height: 200%;
	}
	.icon-picture
	{
		font-size: 14px;
	}

	video {
		width: 290px;
	}
    .mapa iframe  {

    padding-top: 10px;
    width: 100%;
    height:300px;
}
}