@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900");
@import url("fontawesome-all.min.css");

/* For desktop: */
.col-1 {width:900px;}
.title-1 {font-size:80px;line-height: 6px;}
.title-2 {font-size:50px;line-height: 6px;}
.title-3 {font-size:30px;line-height: 6px;}

header{
  padding:8px;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  /*background: #8eba9f;*/

}

body {
  margin-top: 2%;
  text-align: center;
  font-family: "Helvetica", "sans-serif";
  font-size: 22px;
  color: black;

}



a {

  color: black;
  text-decoration: none;
}

table.speaker{
  overflow-x: auto;
  color: black;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  border-spacing:25px 10px;
  width: 100%;
}

table.speaker td{
  vertical-align: top;
  width:50%
}

table.topic{
	overflow-x: auto;
	color: black;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	border-spacing:25px 80px;

	width: 100%;
}

table.topic td{
	vertical-align: top;
	text-align: left;
	width:50%
}

table.topic th{
	vertical-align: center;
	text-align: center;
	width:50%
}

p { margin-top: 0; margin-bottom: 0; }

.imagefit {
  width: 500px;
}

.imagetopic {
	width: 120px;
}


.imagespeaker {
  width: 80%;
}

.center {
 margin: auto;
 padding: 10px;

}


.dottedbox
{
  border: 4px dashed black;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  padding: 15px;
  /*background: rgba(256,256,256,0.8);
  color: black;*/
}

.speaker
{

  margin: auto;
  padding: 20px;
  text-align: left;

}


table.video{
  overflow-x: auto;
  color: black;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  border-spacing:25px 10px;
  width: 90%;
}

table.video td{
  vertical-align: top;
}


 table.timetable{
   overflow-x: auto;
   color: black;
   margin-left: auto;
   margin-right: auto;
   text-align: left;
   border-spacing:25px 10px;
   width: 100%;
}

 table.timetable td{
  width: auto;
  max-width: auto;
  vertical-align: top;
}

table.timetable th{
 width: auto;
 max-width: auto;
 vertical-align: top;
}

table.statements{
  overflow-x: auto;
  color: black;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  border-spacing:25px 10px;
  width: 100%;
}

table.statements td{
 width: auto;
 max-width: auto;
 vertical-align: top;
}

table.statements th{
width: auto;
max-width: auto;
vertical-align: top;
}





red{
  color: #a70027;
}

rosa{
  color: #ECB0AC;
}

footer {
  left: 0;
  bottom: 0;
  width: 100%;
  color: black;
  text-align: center;
  float: center;
  padding: 5px;
  display: inline;
}

p{
  text-align: justify;
}

footer ul {
    float: center;
    padding: 0px;
	}
footer li{
    display: inline;
    padding: 10px;
  }

  img,
iframe {
  max-width: 100%;
}

  @media only screen and (max-width: 1024px) {
    /* For mobile phones: */
    [class*="col-"] {
      width: 90%;
      max-width:90%;

    }

    [class*="title-1"] {
      font-size:50px;

    }
    [class*="title-2"] {
      font-size:30px;

    }
    [class*="title-3"] {
      font-size:25px;

    }

    [class*="imagefit"]{
      width: 130px;
    }

	  [class*="imagetopic"]{
		  width: 80px;
	  }

    [class*="imagevid"]{
      width: 130px;
    }

    [class*="imagespeaker"]{
      width: 100%;
    }


    table.speaker{
      border-spacing:0px 10px;
    }

    table.speaker td{
        display:block;
        font-size: 15px;
        width:100%;
    }

	  table.topic{
		  border-spacing:0px 10px;
	  }

	  table.topic td{
		  display:block;
		  font-size: 15px;
		  text-align: justify;
		  width:100%;
	  }

	  table.topic th{
		  display:block;
		  font-size: 15px;
		  width:100%;
	  }

    table.timetable{
      border-spacing:0px 20px;
    }

    table.timetable td{
        font-size: 15px;
        width:10%;
        vertical-align: top;
    }

    table.timetable th{
        font-size: 15px;
        width:10%;
        vertical-align: top;
    }

    table.statements{
      border-spacing:0px 20px;
    }

    table.statements td{
        font-size: 15px;

        vertical-align: top;
    }

    table.statements th{
        font-size: 15px;

        vertical-align: top;
    }

    [class*="timetable"]{
      display:run-in;
      font-size: 20px;
      width: 100%;
    }

    [class*="statements"]{
      display:run-in;
      font-size: 20px;
      width: 100%;
    }



    [class*="video"]{
      display:run-in;
      font-size: 20px;
      width: 100%;
    }

  }

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

      body{
        font-size:17px;
      }


    }

/* Button */

	input[type="submit"],
	input[type="reset"],
	input[type="button"],
	button,
	.button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		background-color: transparent;
		border-radius: 3px;
		border: 0;
		box-shadow: inset 0 0 0 2px #fff;
		color: #fff;
		cursor: pointer;
		display: inline-block;
		font-size: 0.8em;
		font-weight: 600;
		height: 3.125em;
		letter-spacing: 0.225em;
		line-height: 3.125em;
		max-width: 30em;
		padding: 0 2.75em;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

		input[type="submit"]:hover,
		input[type="reset"]:hover,
		input[type="button"]:hover,
		button:hover,
		.button:hover {
			background-color: rgba(63, 112, 180, 0.25);
		}

		input[type="submit"]:active,
		input[type="reset"]:active,
		input[type="button"]:active,
		button:active,
		.button:active {
			background-color: rgba(63, 112, 180, 0.5);
		}

		input[type="submit"].icon:before,
		input[type="reset"].icon:before,
		input[type="button"].icon:before,
		button.icon:before,
		.button.icon:before {
			margin-right: 0.5em;
		}



		input[type="submit"].small,
		input[type="reset"].small,
		input[type="button"].small,
		button.small,
		.button.small {
			font-size: 0.8em;
		}

		input[type="submit"].large,
		input[type="reset"].large,
		input[type="button"].large,
		button.large,
		.button.large {
			font-size: 1.35em;
		}

		input[type="submit"].primary,
		input[type="reset"].primary,
		input[type="button"].primary,
		button.primary,
		.button.primary {
			background-color: #0070B7;
			box-shadow: none !important;
			color: #ffffff !important;
		}

			input[type="submit"].primary:hover,
			input[type="reset"].primary:hover,
			input[type="button"].primary:hover,
			button.primary:hover,
			.button.primary:hover {
				background-color: #4C9ACC !important;
			}

			input[type="submit"].primary:active,
			input[type="reset"].primary:active,
			input[type="button"].primary:active,
			button.primary:active,
			.button.primary:active {
				background-color: #eb341c !important;
			}

		input[type="submit"].disabled, input[type="submit"]:disabled,
		input[type="reset"].disabled,
		input[type="reset"]:disabled,
		input[type="button"].disabled,
		input[type="button"]:disabled,
		button.disabled,
		button:disabled,
		.button.disabled,
		.button:disabled {
			pointer-events: none;
			opacity: 0.25;
		}

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

			input[type="submit"],
			input[type="reset"],
			input[type="button"],
			button,
			.button {
				height: 3.75em;
				line-height: 3.75em;
			}

		}

    /* Icon */

    	.icon {
    		text-decoration: none;
    		position: relative;
    		text-decoration: none;
    	}

    		.icon:before {
    			-moz-osx-font-smoothing: grayscale;
    			-webkit-font-smoothing: antialiased;
    			display: inline-block;
    			font-style: normal;
    			font-variant: normal;
    			text-rendering: auto;
    			line-height: 1;
    			text-transform: none !important;
    			font-family: 'Font Awesome 5 Free';
    			font-weight: 400;
          font-size: 50px;
    		}

    		.icon:before {
    			line-height: inherit;
    		}

    		.icon > .label {
    			display: none;
    		}

    		.icon.solid:before {
    			font-weight: 900;
    		}

    		.icon.brands:before {
    			font-family: 'Font Awesome 5 Brands';
    		}


            /* Icon Speaker */

            	.iconmini {
            		text-decoration: none;
            		position: relative;
            		text-decoration: none;
            	}

            		.iconmini:before {
            			-moz-osx-font-smoothing: grayscale;
            			-webkit-font-smoothing: antialiased;
            			display: inline-block;
            			font-style: normal;
            			font-variant: normal;
            			text-rendering: auto;
            			line-height: 1;
            			text-transform: none !important;
            			font-family: 'Font Awesome 5 Free';
            			font-weight: 400;
                  font-size: 20px;
            		}

            		.iconmini:before {
            			line-height: inherit;
            		}

            		.iconmini > .label {
            			display: none;
            		}

            		.iconmini.solid:before {
            			font-weight: 900;
            		}

            		.iconmini.brands:before {
            			font-family: 'Font Awesome 5 Brands';
            		}