body {
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	font-size: 14px;
}

h1 {
	font-size: 4em;
	font-weight: 300;
}

ul.navbar-right li a {
	font-size: 1em;
}

div[id^='card'] {
    height: 0;
    padding-bottom: 100%;
}

        p {
            text-align: left;
        }

	    .front, .back {
	    	background-color: #FFF;
	    	border: 1px solid #124395;
	    	padding: 20px;
            -webkit-box-shadow: 0 0 10px 3px rgba(0,0,0,.33);
            box-shadow: 0 0 10px 0px rgba(0,0,0,.33);
	    }

	    .front {
			display: -webkit-box;
			display: -moz-box;
			display: -ms-flexbox;
			display: -webkit-flex;
			display: flex;
	    	align-items: center;
	    	justify-content: space-around;
	    	font-size: 2em;
	    	font-weight: 300;
	    }

        .front p, .back p {
            text-align: center;
        }

        #globalFront {
            background-image: url("../img/dotted-map-bg.jpg");
            background-repeat:no-repeat;
            background-size:cover;
        }

        .row {margin-top: 20px;}

        div.intro {
            margin-bottom: 30px;
        }

        .globalb, .globalf {
            border-color: #E03253;
        }

        .globalf b, .globalb b {
            color: #E03253;
        }

        .kp01f {
            background-color: #FFF;
            border-color: #F5A300;
        }

            .kp01b {
                border-color: #F5A300; 
            }

            .kp01b b, .kp01f b, .kp01f i {
                color: #F5A300;  
            }

            i[class^="fa"] {
            	display: block;
            	margin-top: 0.5em;
            	font-size: 1.5em;
            } 

        .kp02f {
            background-color: #FFF;
            border-color: #00436A;
        }

            .kp02b {
                border-color: #00436A;   
            }

            .kp02b b, .kp02f b, .kp02f i {
                color: #00436A;  
            }

        .kp03f {
            background-color: #FFF;
            border-color: #007685;
        }

            .kp03b {
                border-color: #007685;   
            }

            .kp03b b, .kp03f b, .kp03f i {
            	color: #007685;
            }

        .kp04f {
            background-color: #FFF;
            border-color: #E07326;
        }

            .kp04b {
                border-color: #E07326;   
            }

            .kp04b b, .kp04f b, .kp04f i {
            	color: #E07326;
            }

        .kp05f {
            background-color: #00436A;
            border-color: #00436A;
            color: white;
        }

            .kp05b {
                border-color: #00436A;   
            }

        @media screen and (max-width: 991px) {
/*            div.row > div[class^="col"]:last-child, .kp04 {
                margin-top:30px;
            }*/
        }

#porc1 {
	color: #00436A;
font-weight: bold;
}
#porc1b {
	color: #00436A;
font-weight: bold;
}
#porc1c {
	color: #00436A;
font-weight: bold;
}
#porc1d {
	color: #00436A;
font-weight: bold;
}
#porc1e {
	color: #00436A;
font-weight: bold;
}



#porc2 {
	color: #E47736;
}
#porc2b {
	color: #e23c5b;
}
#porc2c {
	color: #007c84;
}
#porc2d {
	color: #faa519;
}
#porc2e {
	color: #94afbd;
}

.refresh {
	background-color: rgb(241, 161, 33);
	color: #ffffff;
	border: 0;
	font-size: 16px;
}
hr{
	margin: 0;
}
#multia {
	background-image: url(../images/rosco1.gif);
	background-position: center;
	background-repeat: no-repeat;
}
#multib {
	background-image: url(../images/rosco2.gif);
	background-position: center;
	background-repeat: no-repeat;
}
#multic {
	background-image: url(../images/rosco3.gif);
	background-position: center;
	background-repeat: no-repeat;
}
#multid {
	background-image: url(../images/rosco4.gif);
	background-position: center;
	background-repeat: no-repeat;
}
#multie {
	background-image: url(../images/rosco5.gif);
	background-position: center;
	background-repeat: no-repeat;
}
		body{
			margin: 0;
			padding: 0;
			font-family: 'Roboto Condensed', sans-serif;
			font-size: 12px;
						max-width: 600px;

		}
		.container_aconfindex{
			max-width: 590px;
			margin: 30px auto 100px;
		}
		h2{
			margin: 25px 0 20px;
			text-align: center;
			color: #555;
		}
		@media only screen and (min-width: 600px) {

   .example {
      font-size: 32px;
   }
   }
@media only screen and (max-width: 599px) {

   .example {
      font-size: 24px;
   }
   }

.panel-heading {
	background-color: #ffffff;
	border: 0;
	padding: 0;
	
}
.panel-title {
	border-left: solid 5px #e07736;	
		padding:3px 0 3px 10px;

}
.panel-title>a {
	color: #666666;
	font-size: 24px;
	border-bottom: 0;
}
.panel-title>h3 {
	color: #666666;
	font-size: 24px;
	padding:3px 0 3px 10px;
	border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body {
	border-top-width: 0px;
}
.panel {
border: 0px #FFFFFF;
	box-shadow: 0px 0px 0px 0px transparent;
}
.panel-default>.panel-heading {
	background-color: #ffffff;
	border: 0;
}

.col-lateral {
	width: 150px;
	float: left;
	position: relative;
}
.col-central {
	width: 290px;
	float: left;
	position: relative;
}
@media only screen and (max-width: 500px) {
.col-lateral {
	width: 33%;
	float: left;
	position: relative;
}
.col-central {
	width: 33%;
	float: left;
	position: relative;
}
h2 {
	font-size: 20px;
}
h3 {
	font-size: 18px;
}
.panel-title>a {
	font-size: 18px;
}
#multia {
	background-size: 50%;
}
#multib {
	background-size: 50%;
}
#multic {
	background-size: 50%;
}
#multid {
	background-size: 50%;
}
#multie {
	background-size: 50%;
}
}