@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600&display=swap');
				*{margin: 0; padding: 0; border: none; box-sizing: border-box;}
				body, html{
					//background: #ddd;
					font-family: "Montserrat", sans-serif;
					font-weight: 300;
					font-size: 16px;
					background: #f3f3f3;
				}
				html{
					scroll-behavior: smooth;
				}
				a{text-decoration: none;}
				ul, ol{list-style: none;}
				img{max-width: 100%}
				div.header_bg{
					max-width: 1140px;
					margin: 0 auto;
					height: 600px;
					background-color: #262626;
					background-image: url(CIEDUS-2024-arte-header-site-v1.jpg?v=17-08);
					background-position: top left;
					background-size: cover;
					background-repeat: no-repeat;	
					border-bottom: 5px solid #fff;
					box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);		
				}
				div.header_bg .top{
					width: 100%;
					height: 10px;
					margin: 0 auto;
					background-color: #061007;
					//padding: 20px;
					display: flex;
					justify-content: space-between;
				}
				.top .logos{
					display: flex;
					visibility: hidden;
				}
				.top a.logo{
					display: block;
					width: 100px;
					height: 30px;
					background-color: silver;
					margin-right: 30px;
				}
				div.top ul.header_menu{
					display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
				}
				ul.header_menu li a{
					display: block;
					font-size: .8em;
					font-weight: 600;
					color: #fff;
					text-transform: uppercase;
					margin: 0 10px;
					letter-spacing: -0.4px;
					//line-height: 100px;
					padding: 10px 5px 10px 5px;
					transition: 0.3s;
					border-bottom: 3px solid transparent;
				}
				ul.header_menu li a:hover{
					//text-decoration: underline;
					//color: black;
					//background-image: linear-gradient(to right, #ddd, #eee);
					border-bottom: 3px solid #fff;					
				}				
				ul.header_menu li a.active{
					//background-image: linear-gradient(to right, #d95f0d, #eb9f00);
					color: white;
					//box-shadow: 0px 1px 3px #888;
					border-bottom: 3px solid #ccc;
				}
				ul.header_menu li a i{display: none;}	
				div.header_bg .siteTitle{
					max-width: 1020px;
					margin: 0 auto;
					//background-color: rgba(0, 0, 0, .2);	
					display: flex;
					padding-top: 50px;
					justify-content: space-between;
					flex-wrap: wrap;		
				}
				.siteTitle .col1-logo{
				 	flex: 0 0 500px;
				}
				.siteTitle .col1-logo .logo{
					width: 373px;
					height: 172px;
					background-image: url(logo-ciedus.png?v=2);
					background-position: center;
					background-size: contain;
					background-repeat: no-repeat;
					visibility: hidden;
				}
				.siteTitle .sublogos h3{
					color: #fff;
					text-transform: uppercase;
					letter-spacing: -1px;
					margin:  25px;
					font-weight: 500;
				}
				.siteTitle .sublogos .more-info{
					color:  #fff;
					padding-left: 25px;
					font-size: 0.9em;
				}
				.siteTitle .col2{
					flex: 0 0 500px;
				}
				.col2 .banner{
					height: 400px;
					//background-color: rgba(0, 0, 0, .3);
					background-image: url(quadros.webp?v=2);
					background-size: cover;
					background-repeat: no-repeat;
					background-position: center;
					//border-left: 1px dotted rgba(255, 255, 255, 0.3);
					padding-left: 130px;
					visibility: hidden;
				}
				.col2 .join{
					padding: 20px 0;
					text-align: right;
				}
				.col2 .join a, a.hidden-btn{
					display: inline-block;
					color:  #fff;
					border:  2px solid #fff;
					padding:  15px 30px;
					border-radius: 32px;
					font-size: 1em;
					text-transform: uppercase;
					font-weight: 400;
					background-color: rgba(0, 0, 0, 0.2);
					transition: 0.3s;
				}
				.col2 .join small{
					display: inline-block;
					margin-right: 100px;
					margin-bottom: 5px;
					color:  #ccc;
				}
				a.hidden-btn{
					margin: 20px;
					display: none;
				}
				.col2 .join a:hover{
					background-color: rgba(0, 0, 0, 0.4);
					box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
				}
				.datas{
					max-width: 1120px;
					margin: 50px;
				}
				.datas .calend{
					width: 70%;
					border: 3px solid #fff;
					padding: 50px;
					margin: 0 auto;
					border-radius: 80px;
					color: #fff;
					background-color: #0f200f;
					background-image: url(fundo-destaq.jpg);
					box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
				}
				.calend span{
					font-weight: 100;
					font-size: 2.5em;
					margin: 0 5px;
					letter-spacing: -2px;
				}
				.main-content{
					max-width: 1140px;
					margin:  0 auto;
					display: flex;
					flex-wrap: wrap;
					background-color: #fff;
				}
				.main-content .left-menu{
					flex:  0 1 20%;
					//min-height: 500px;
					//background-color: #ddd;
					position: relative;
				}
				.left-menu ul {
					display: block;
					margin-top: -30px;
					z-index: 9;
					box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, .2);
					//border-top-left-radius: 8px;
					border-top-right-radius: 8px;
					border-bottom-left-radius: 8px;
					border-bottom-right-radius: 8px;			
				}
				.left-menu ul li{
					display: block;
					width: 100%;
					border-bottom: 1px solid #fff;
				}
				.left-menu ul li:first-child a{
					//border-top-left-radius: 8px;
					border-top-right-radius: 8px;
				}
				.left-menu ul li:last-child a{
					border-bottom-left-radius: 8px;
					border-bottom-right-radius: 8px;
				}				
				.left-menu ul li a{
				    display: block;
				    width: 100%;
				    background-color: #274e29;
				    padding: 20px;
				    font-weight: 600;
				    color: #fff;
				    background-image: linear-gradient(90deg, #00000024, transparent);
				}
				.left-menu ul li a i{
					color: rgba(255, 255, 255, 0.2);
				}
				.main-content .right-content{
					flex:  0 1 75%;
					min-height: 500px;
					//background-color: #f7f7f7;
					margin-bottom: 80px;
					margin-left: 3%;
					margin-top: 50px;
					font-weight: 500;				
				}
				.right-content a.file{
					display: inline-block;
					clear: both;
					padding: 6px 8px;
					background: #502960;
					color: #fff;
					border-radius: 8px;
					margin-top: 10px;
				}
				.right-content ol{
					list-style-type: decimal;
				}
				.right-content ol li{
					padding-top: 15px;
					margin-left: 50px;
				}
				.main-content ul.list1{
					padding: 20px;
					border: 1px solid #ddd;
					border-radius: 16px
				}
				.main-content ul.list1 li{
					display: block;
					margin-bottom: 5px;
					font-size: 0.9em;
					font-weight: 500
				}
				.main-content ul.list1 li.tl{
					font-weight: 600;
					font-size: 1em;
				}	
				.intro_bg, .destaques_bg, .programacao_bg, .local_bg, .contato_bg, .footer_bg{
					max-width: 1140px;
					margin: 0 auto;
				}
				.local_bg, .programacao_bg{
					background-color: #262626;
					background-image: url(ciedus-bg.jpg);
					background-position: center;
					background-size: cover;
					background-repeat: no-repeat;
				}
				.intro_bg{
					background-image: url();
					background-size: 80%;
					background-repeat: no-repeat;
					background-position: -250% 100%;
				}
				.programacao_bg{
					background-image: url(line1.webp), url(prog-bg-ciedus2.jpg);
					background-position: 130% 30%, center;
					background-size: 70%,  cover;
					border-top: 5px solid #fff;
					border-bottom: 5px solid #fff;
					box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);
				}
				.local_bg{
					background-image: url(cap-local.jpg);
				}
				.holder_prog{
					display: flex;
					color:  #262626;
					margin-top: 30px;
					flex-wrap: wrap;
					background-image: url(line1.webp), url(prog-bg-ciedus2.jpg);
					background-position: 130% 30%, center;
					background-size: 70%,  cover;
					box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);
					padding: 30px;	
					border-radius: 8px;				
				}
				.holder_prog .prog-filter{
					//background-color: #f3f3f3;
					flex: 0 0 100%;
					position: relative;
					display: flex;
				}
				.prog-filter a{
					display: block;
					flex: 0 1 200px;
					line-height: 15px;
					text-align: center;
					font-size: 1em;
					font-weight: 600;
					letter-spacing: 4px;
					margin-bottom: 20px;
					margin-right: 15px;
					background-color: #9ecdb3;
					//background-image: linear-gradient(90deg, #164006, #164006);
    				color: #262626;
					padding: 20px 0;
					box-shadow: 1px 1px 5px 3px rgba(0, 0, 0, .1);
					border-radius: 6px;
					position: relative;
					cursor: pointer;
				}
				.prog-filter a.active{
					background-color: #d0ffe5;
				}
				.prog-filter a.active::after{
					content: "";
					display: block;
					position: absolute;
					width: 0; 
					height: 0; 
					border-top: 10px solid #d0ffe5;
					border-bottom: 10px solid transparent;
					border-left:10px solid transparent;
					border-right:10px solid transparent;
					z-index: 999;
					left: 42%;
					bottom: -22%; 					
				}
				.holder_prog .prog-content{
					background-color: #fefefe;
					padding: 10px;
					flex: 0 0 100%;
					margin-left: 0px;
					box-shadow: 1px 1px 5px 3px rgba(0, 0, 0, .2);
					border-radius: 6px;					
				}
				.list_prog{
					display: none;
				}	
				.openProg{
					display: block;
				}
				.list_prog .row{
					display: flex;
					padding: 20px 10px;
					border-bottom: 2px solid #ddd;
					font-weight: 500;
					align-items: center;
				}		
				.row .hr{
					flex: 0 0 12%;
					min-width: 15%;
					background-color: #502960;
					padding: 5px;
					text-align: center;
					font-weight: 600;
					font-size: 1.1em;
					line-height: 100px;
					border-radius: 2px;
					color: #fff;
				}
				.list_prog h4{
					padding: 10px;
				}
				.row .content{
					//background-color: #666;
					padding: 5px 30px;
					font-size: 0.9em;
					line-height: 25px;
				}
				.row .content small{
					display: inline-block;
					margin-left: 10px;
					line-height: 20px;
				}
				.row .content hr{
					border-bottom: 2px dotted #ccc;
					margin: 5px 0;
				}				
				.destaques, .programacao, .participe, .local, .contato, .footer{
					max-width: 1020px;
					padding: 50px 0;
					margin: 0 auto;
					display: flex;
					justify-content: space-between;
					align-items: center;
					flex-wrap: wrap;
				}
				.destaques{
					padding: 10px 0 !important;
					text-align: center;				
				}
				.destaque{
					margin: 50px;
					background: #0b2a1f;
					box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.2);
					border-radius: 85px;
					width: 80%;
					min-height: 200px;
					color: #f6f6f6;
					position: relative;
					border:  5px solid #fff;
					background-image: url(fundo-destaq.jpg);
					background-position: center;
					//background-size: contain;
				}
				.destaque .inner{
					margin:  50px;
					color:  #ccc;
					margin-right: 150px;
				}
				.destaque .inner h3{
					font-size: 1.5em;
					letter-spacing: -2px;
					font-weight: 200;
					font-style: italic;
				}
				.destaque .circle{
					position: absolute;
					top: -50px;
					right: -150px;
					width: 300px;
					height: 300px;
					border-radius: 50%;
					background-color: rgba(0, 0, 0, 0.5);
					border: 5px solid #fff;
					box-shadow: 0px 0px 25px 5px rgba(0, 0, 0, 0.3);
					background-image: url(saturninho.jpg);
					background-position: center;
					background-size: contain;
				}		
				.intro h2, .destaques h2{
					font-size: 2em;
					letter-spacing: -2px;
					text-transform: uppercase;
					font-weight: 200;
					padding: 0;
				}
				.intro .text{
					font-size: 1.2em;
				}
				span.sep{
					display: block;
					width: 70px;
					height: 3px;
					//background-color: #00B93F;
					background-image: linear-gradient(90deg, rgba(0,185,63,1) 0%, rgba(0,185,63,0.51) 100%);
				}
				span.sep2{
					display: block;
					width: 270px;
					border-bottom: 2px dotted #ccc;
					margin: 20px 0;
				}
				.destaques {
					color: #fff;
				}
				.programacao{
					color: #fff;
				}
				.programacao h2{
					text-transform: uppercase;
					letter-spacing: -1px;
					font-size: 2em;
					font-weight: 200;
				}
				.local{
					min-height: 500px;
					color: #fff;
					font-family: 'Montserrat' , sans-serif
				}				
				.local .col1{
					flex: 0 1 400px;
				}
				.local .col1 h2{
					text-transform: uppercase;
					letter-spacing: -1px;
					font-size: 2em;
					font-weight: 200;
				}
				.local .col1 p{
					font-size: 0.8em;
					font-weight: 400
				}
				.local .col1 a.maps{
					display: block;
					width: 248px;
					height: 68px;
					background-image: url(cap-local-evento.jpg);
					background-size: cover;
				}
				.local .col2{
					flex: 0 0 400px;
				}
				.local .col2 .circle{
					width: 400px;
					height: 400px;
					border-radius: 50%;
					background-color: rgba(0, 0, 0, 0.5);
					border: 5px solid #fff;
					box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.5);
					margin: 20px;
					background-image: url(circle1.jpg);
					background-position: center;
					background-size: contain;
				}
				.circle2{
					background-image: url(circle2.jpg) !important;
				}
				.bottom-content{
					max-width: 1140px;
					margin:  0 auto;
					background-color: #fff;
					z-index: 1;
					padding: 30px 0;			
				}				
				.logos-footer {
					max-width: 940px;
					margin: 10px auto;
					display: flex;
					flex-wrap: wrap;
					justify-content: space-around;
				}
				.logos-footer a{
					display: block;
					width: 130px;
					margin: 10px;
					border-radius: 8px;
					border: 1px solid #ddd;
				}	
				.footer_bg{
					background-color: #061007;
					border-top: 5px solid #fff;
					box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);
				}
				.footer{
					max-width: 1120px;
					font-size: 0.7em;
					color:  #fff;
					flex-direction: column;
					justify-content: flex-start;
					align-items: flex-start;
					font-weight: 400;
					padding-left:40px;
				}
				table.table-basic{
					
					border-collapse: collapse;
				}
				table, th, td {
					border: 1px solid #ccc;
				}
				th,td{
					padding: 8px;
				}
				@media screen and (max-width: 1140px){
					.siteTitle .col2{
						flex: 0 1 350px;
						margin-right: 30px;
					}
					.col2 .banner{
						border-left: none;
						padding-left: 10px;
					}
					.siteTitle .col1-logo{
					 	flex: 0 1 300px;
					}
					.main-content .left-menu{
						flex:  0 1 25%;
					}
					.main-content .right-content{
						flex:  0 0 70%;
						//margin: 15px;
					}																			
				}
				@media screen and (max-width: 800px){
					.siteTitle .col2{
						display: none
					}
					.main-content .left-menu{
						flex:  1 1 100%;
					}
					.main-content .right-content{
						margin: 15px;
						flex:  0 0 95%;
						margin-top: 30px;
					}
					.destaques {
						margin-top: 20px;
						text-align: center;
					}
					.destaque {
						margin: 10px;
						width: 100%;
					}
					.destaque .circle{
						top: -80px;
						right: 35%;
						width: 100px;
						height: 100px;
						border-radius: 50%;
					}
					.destaque .inner{
						margin: 0px;
						margin-right:0px;
						padding: 20px;
						width: 100%;
					}
					.local{
						padding: 25px;
						//min-height: 0px;
					}
					.local .col2{
						flex: 1 0 100%;
						text-align: center;
					}
					.local .col2 .circle{
						width: 200px;
						height: 200px;
						margin: 20px auto;
					}
					.logos-footer a{
						width: 80px;
					}
					.footer{
						padding: 25px;
					}
					.row .hr{
						width: 40%;
						font-size: 0.8em;
						line-height: 100px;
						border-radius: 2px;
					}											
				}
				@media screen and (max-width: 650px){
					div.header_bg{
						background-image: url(CIEDUS-2024-header-mobile.jpg?v=17-08);
						background-position: center center;
						background-size: cover;
						height: 600px;	
						position: relative;	
					}
					.list_prog .row{
						text-align: left !important;
						flex-direction: column;
						align-items: flex-start;
					}
					.row .hr{
						line-height: 20px;
						margin-left: 30px;
						padding: 5px 20px;
					}
					a.hidden-btn{
						display: block;
						position: absolute;
						bottom: 25px;
					}														
				}