/*
Theme Name: AMA-theme.
Theme URI: acessibilidade/
Description: Accessibility.
Version: 1.0
Author: Rui Silva
Author URI: acessibilidade/.
*/


body{
	font-family: 'Lato', sans-serif;
	width: 100%;
	margin: 0;
}
code {
    color: #A41357;
}
.experience_body{
	height: 100vh;
	background-color: #efefee;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters .col,[class*="col-"], .list-group-item, .d-flex, .p-3, .navbar-nav, .flex-fill, .p-2{
	padding-right: 0 !important;
	padding-left: 0 !important;
}

.list-group-item{
	background-color: transparent;
}

section, #pre_footer{
	padding-right: 89px !important;
	padding-left: 89px !important;

}

button:focus, input:focus, a:focus{
	border: 1px solid #333399;
}

#experience_menu{
	padding-right: 89px !important;
	padding-left: 89px !important;
	display: none;
}

#experience_menu .list_arrow_link{
	padding-top: 15px !important;
}

#success_message{
	background-color: #66cc00 !important;
	opacity: 0.9;
	height: 44px;
	display: none;
}

#error_message{
	background-color: #d10000 !important;
	opacity: 0.9;
	height: 44px;
	display: none;
}

#success_message span, #error_message span{
	color: white;
	font-size: 18px;
}

.close{
	opacity: 1;
}

.bold{
	font-family: 'Red Hat Display', sans-serif;
	font-weight: bold;
}

.italic{
	font-style: italic;
}

.container{
	max-width: 1336px;
	padding: 0 !important;
}

a{
	color: #333399;
}

mark, .mark{
	line-height: 27px;
}

a:hover{
	color: #333399;
}

button:focus{
	outline: none;
}

.content { 
	max-width: 1366px;
	width: auto;
	margin: auto;
}

#top-bar .icon, #top-bar2 .icon, #navbar .icon, #experience_menu .icon, #pre_footer .icon{
	color: #333399;
}

#navbar{
	border-bottom: 1px solid #efefee;
}

.top-bar-left .icon-arrow-drop{
	padding-top: 4px !important;
	margin-left: 4px;
}


.input-group{
	border: 2px solid  #333399;
	border-radius: 0 !important;
}

input{
	border: none !important;
}

.mr-sm-2{
	margin-right: 0 !important;
}

#top-bar{
	background-color: #e4e4e4;
	margin-left: 0px;
	margin-right: 0px;
	/*padding: 0px 89px !important;*/
	height: 44px;
	display: flex;
	align-items: center;
	/*max-width: 1336px;*/
}

/*.top-bar-right{
	padding-right: 89px;
	position: absolute;
	right: 0px;
	margin-right: 0px;
	float: right;
}*/

.top-bar-right ul{
	margin: 0;
}



/*.top-bar-left{
	padding-left: 89px !important;
}*/

.top-bar-left button{
	width: auto;
}


#top-bar .icon{
	color: #333399;
}

#top-bar .d-none a{
	color: #333399;
	height: 100%;
	display: flex;
	align-items: center;
}

#top-bar .d-none a:hover{
	text-decoration: none !important;
}

#top-bar .d-flex{
	height: 44px;
	text-align: left;
}

#btn_dark_mode, #btn_english_version{
	cursor: pointer;
}

#btn_dark_mode .icon-dark, #btn_english_version .icon-globe-language{
	padding-left: 14px;
}

#btn_english_version{
	margin-left: 30px !important;
}

#search_form .icon-search{
	padding-top: 5px;
}

#search_form .input-group{
	min-width: 230px;
}

#search_form_small .icon-search{
	color: white; 
	padding-top: 5px;
}


#top-bar2{
	background-color: #efefee;
	margin-left: 0px;
	margin-right: 0px;
	/*padding: 30px 89px;*/
	padding-top: 30px;
	padding-bottom: 30px;;
}

.navbar {
	padding: 0px !important;
	background-color: white;
}

.nav-item:hover{
	cursor: pointer;
	z-index: 100;
}

/*.navbar-nav li{
	padding-right: 12px !important;
}*/

/*.u-hover--sparkle {
	box-sizing: border-box;
	position: relative;
  }


.u-hover--sparkle::before, .u-hover--sparkle::after {
	content: '';
	box-sizing: border-box;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	transform-origin: center;
	z-index: -1;
  }
  .u-hover--sparkle:not(.active)::before  {
	border-top: 2px solid #333399;
	border-bottom: 2px solid #333399;
	transform: scale3d(0, 1, 1);
  }
  .u-hover--sparkle:not(.active)::after {
	border-left: 2px solid #333399;
	border-right: 2px solid #333399;
	transform: scale3d(1, 0, 1);
  }
  .u-hover--sparkle:hover::before, .u-hover--sparkle:hover::after {
	transform: scale3d(1, 1, 1);
	transition: transform 500ms;
  }*/

  #navbar li{
	border: 2px solid white;
  } 

  #navbar li:hover{
	border: 2px solid #333399;
  } 

#navbar li:hover{
  	animation-name: menu_hover;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;  
}

@keyframes menu_hover {
	from {border: 2px solid white;}
	to {border: 2px solid #333399;}
  }


#top-bar2 .title h1, #top-bar2 .title a{
	font-size: 44px;
	color: #333399;
	font-family: 'Red Hat Display', sans-serif;
	text-decoration: none;
	margin: 0!important;
}

#top-bar2 #site_title a{
	text-decoration: none;
	line-height: 52px;
}


#title_small{
	display: none;
}

.title_description{
	font-size: 16px;
	line-height: 22px;
	max-width: 579px;
}

#title_description_small{
	display: none;
}

.nav-item a{
	font-size: 19px;
	line-height: 26px;
	color: #333399;
	font-weight: bold;
}

.navbar-nav .nav-link{
	padding-right: 16px !important;
	padding-left: 16px !important;
	height: 44px;
}


.navbar-nav li{
	height: 44px;
}

button, input[type="submit"]{
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
	min-height: 44px;
	height: auto;
	width: auto;
	min-width: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

button i{
	color: #333399;
}

/*.active{
	font-size:  19px;
	background-color: #333399;  
}

.active a{
	color: white !important;
}*/

.nav-item[aria-current="page"]{
	font-size:  19px;
	background-color: #333399;  
}

.nav-item[aria-current="page"] a{
	color: white !important; 
}

#infos{
	padding-top: 55px !important;
	padding-bottom: 30px !important;
}

.info_title{
	font-size: 42px;
	color: #333399;
	line-height: 48px;
	font-weight: bold;
}

.btn_more_infos{
	/*margin-top: 70px;*/
	padding-top: 30px;
	display: inline-block !important;
}

.info_content{
	font-size: 18px;
	color: #333333;
	line-height: 1.5;
	margin: 0;
}

.circle-top{
	display: flex;
	border-radius: 50%;
	border: 2px solid #333333;
	background-color: transparent;
	color: #333333;
	line-height: 50px;
	font-size: 16px;
	font-weight: bold;
	height: 34px;
	width: 34px;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
}

.circle-links{
	display: flex;
	border-radius: 50%;
	background-color: #e4e4e4;
	color: #333399;
	/*line-height: 56.25px;*/
	font-size: 16px;
	height: 46px;
	width: 46px;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin-right: 15px;
	font-weight: bold;
}

.circle-links[aria-current="true"]{
	background-color: #333399 !important;
	color: white !important;
}

#infos_left{
	margin-top: 40px !important;
	max-width: 674px;
}

#infos_left_pagination{
	justify-content: flex-end;
}

.circle-links{
	cursor: pointer;
}


.result_number{
	padding-left: 20px;
	margin: 0;
}

#search_results .circle-links:hover:not([aria-current="true"]), #blogue_content .circle-links:hover:not([aria-current="true"]){
	animation-name: example;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;  
}

@keyframes example {
	from {background-color: #e4e4e4; color: #333399}
	to {background-color: #333399; color: #e4e4e4}
  }


#infos_rigth{
	/*padding-left: 95px !important;
	padding-top: 0px !important;*/
	max-width: 450px;
}

#infos_rigth .icon-check-monitor{
	color: #333399; 
	padding-right: 5px;
}

#infos_rigth .icon-arrow-bullets{
	padding-left: 10px;
}

.version{
	color: white !important;
	font-size: 16px;
	line-height: 18px !important;
	background-color: #333399;
	padding: 3px 8px;
	max-height: 26px !important;
	margin-left: 10px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	text-decoration: none !important;
	font-weight: bold;
}


#page .version{
	margin-left: 0px;
	padding-right: 14px;
	padding-left: 14px;
	font-size: 19px;
	line-height: 48px;
	max-height: 44px !important;
	height: 44px !important;
	border-bottom: 7px solid white;
	border-top: 7px solid white;
	font-weight: bold;
}

#url{
	font-size: 16px;
	color: #333333;
	margin-bottom: 0 !important;
	background-color: #a2e7ad;
}


#url_label{
	font-size: 16px;
	line-height: 30px;
	color: #333333;
	margin-bottom: 0 !important;
	font-weight: bold;
}

/*.btn_access{
	display: flex;
	margin-top: 40px;
	max-width: 145px;
	width: auto;
	height: 50px;
	border-radius: 30px;
	background-color: #333399;
	color: white;
	font-size: 16px;
	text-align: left;
	justify-content: center;
	align-items: center;
	padding: 0px 30px 0px 30px;
}*/

.btn_access{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	border-radius: 30px;
	background-color: #333399;
	color: white;
	font-size: 16px;
	font-weight: bold;
	padding: 0px 30px 0px 30px;
	margin-top: 40px;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	border: 2px solid #333399;
	margin-left: 30px;
	width: auto !important;
}

.access_monitor .btn_access{
	margin-left: 0px;
}



.btn_access:hover{
	cursor: pointer;
	animation-name: btn_hover_access;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}

.btn_access .icon-arrow-bullets{
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	color: white !important;
  }
  .btn_access:hover .icon-arrow-bullets{
	-webkit-transform: translateX(4px);
	transform: translateX(4px);
	color: #333399 !important;
  }


@keyframes btn_hover_access {
	from {background-color: #333399; color: white;}
	to {background-color: #a2e7ad; color: #333399;}
}
  



.btn_access .icon-arrow-bullets{
	display: flex;
	align-items: flex-end;
}

#infos_rigth h3, #access h2{
	font-size: 32px;
	line-height: 32px;
	color: #333399;
	font-weight: bold;
}

#access_description{
	font-size: 18px;
	line-height: 1.5;
	color: #333333;
	margin: 0;
}

.access_monitor{
	background-color: #a2e7ad;
	padding: 42px 30px 34px 30px;
	height: 100%;
	max-width: 100% !important;
}

#infos_left_bottom{
	padding: 0px;
}

.btn_info{
	/*max-width:  calc(100% - 30px);*/
	width: auto;
	height: 50px;
	border-radius: 30px;
	background-color: #333399;
	color: white;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding-left: 30px;
	padding-right: 30px;
	border: 2px solid #333399;
	font-weight: bold;
	width: auto !important;
	line-height: 18px;
}

#back_home_div .btn_info{
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
}

#back_home_div .btn_info .icon{
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	display: flex;
}

#back_home_div .btn_info:hover .icon{
	-webkit-transform: translateX(4px);
	transform: translateX(4px);
}

#back_home_div{
	padding-top: 20px !important; 
	padding-bottom: 145px !important
}

#back_home .icon-arrow-bullets{
	padding-left: 10px;
}


#infos .btn_info:hover, #back_home_div .btn_info:hover, .about_section .btn_info:hover{
	cursor: pointer;
	animation-name: btn_hover;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}


#back_home_div .btn_info:hover .icon-arrow-bullets::before, .about_section .btn_info:hover .icon-arrow-bullets::before, .about_section .btn_info:hover .icon-button-list::before{
	color: #333399;
}

@keyframes btn_hover {
	from {background-color: #333399; color: white;}
	to {background-color: white; color: #333399;}
}

#accessibility .btn_info:hover{
	cursor: pointer;animation-name: btn_hover2;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}

@keyframes btn_hover2 {
	from {background-color: #333399; color: white;}
	to {background-color: #d8d7f9; color: #333399;}
}

#experience_menu .btn_info:hover{
	cursor: pointer;animation-name: btn_hover_experience;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}

@keyframes btn_hover_experience {
	from {background-color: #333399; color: white;}
	to {background-color: #efefee; color: #333399;}
}

.btn_div{
	flex: 1;
}

#accessibility .d-lg-none{
	padding-top: 40px;
}

#accessibility{
	margin-top: 80px;
	padding-top: 60px !important;
	padding-bottom: 65px !important;
	background-color:  #d8d7f9;
}

#accessibility_title{
	line-height: 48px;
	font-size: 32px;
	color: #333399;
	font-weight: bold;
}

#accessibility_content{
	font-size: 18px;
	color: #333333;
	line-height: 1.5;
	margin: 0;
}

.btn_accessibility{
	max-width: 350px;
	width: auto;
	height: 50px;
	border-radius: 30px;
	background-color: #333399;
	color: white;
	font-size: 16px;
	text-align: center;
	padding: 14px 35px 0px 35px;
	margin-top: 40px
}


#top_title{
	font-size: 24px;
	line-height: 1.5;
	color: #333333;
	font-weight: bold;
}

#top_update{
	font-size: 16px;
	line-height: 1.5;
	color: #333333;
	/*text-align: right;
	position: relative;*/
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
}

#top_upddate{
	position: absolute;
   	bottom: 0;
}

#accessibility_rigth{
	padding-left: 30px !important;
	padding-right: 10px !important;
}

#accessibility_rigth a{
	height: 44px;
	display: flex;
	align-items: center;
	line-height: 20px;
}

.top_list{
	/*padding-top: 35px;*/
	margin-top: 35px;
}

.top_institution{
	font-size: 18px;
	color: #333399;
	line-height: 50px;
	/*display: flex;*/
	align-items: center;
	font-weight: bold;
}

.rating{
	font-size: 24px;
	font-weight: bold;
	color: #333333;
	line-height: 50px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

#tutorials{
	margin-top: 35px;
	padding-top: 50px !important;
	padding-bottom: 35px !important; 
	background-color:  #f1f1f1;
}

#tutorials h3{
	font-size: 36px;
	line-height: 48px;
	color: #333399;
	font-weight: bold;
}

.tutorials_description, .tool_category p, .categories_description, .categories_description p{
	font-size: 18px;
	line-height: 1.5;
	color: #333333;
	margin: 0;
}

.tutorials_list a{
	font-size: 20px;
	color: #333399;
	line-height: 1.5;
}

#tutorials_list{
	padding-top: 20px;
}

#tutorials_links{
	padding-right: 110px !important;
}

#tutorials_list #share{
	padding-top: 90px !important;
	padding-bottom: 100px !important;
}

#tutorials a, #press a, #external_links a{
	min-height: 44px !important;
	height: auto;
}


.tool_category h3{
	font-size: 36px;
	line-height: 48px;
	color: #333333;
	font-weight: bold;
}

.tool_category{
	max-width: 770px;
}


#news{
	margin-top: 0px;
	padding-top: 10px !important;
	padding-bottom: 30px !important;
}

#news h2{
	font-size: 36px;
	line-height: 48px;
	color: #333399;
	font-weight: bold;
}

#news_description{
	font-size: 18px;
	line-height: 1.5;
	color: #333333;
	margin: 0;
}

#news .fluid-container{
	max-width: 800px;
}

#news .news-title, #blogue h4, #blogue .news-title{
	font-size: 26px;
	line-height: 32px;
	color: #333399;
	font-weight: bold;
}

#news .card-text, #blogue .card-text{
	font-size: 16px;
	line-height: 1.5;
	color: #333333;
}

.content-box{
	padding: 28px 32px 30px 39px!important;
}

.slider{
	padding-top: 20px;
}
.slider .col-12{
	padding-left: 15px !important;
	padding-right: 15px !important;
}

.slider article{
	background-color: #f1f1f1;
	height: 100%;
}

.slick-dots li.slick-active button::before {
    opacity: 1;
    color: #272e4b;
}
.slick-dots li button::before {
    font-size: 13px;
}
.slick-dots {
    bottom: 0;
}

#news .slick-list, #blogue .slick-list{
	padding:0 40% 0 0!important;
}

#infos .slider-infos{
	margin: 0px !important;
}

#infos .slick-dots{
	display: flex !important;
	justify-content: flex-end !important;
	padding-left: 0px !important;
	padding-top: 0px !important;
	bottom: -10px !important;
	position: absolute;
	max-width: 200px;
	right: 0;
}

#infos .slick-list{
	padding: 0 !important;
}

#infos article:focus, a{
	outline: none;
}


#news .card-block .image-box, #blogue .card-block .image-box {
    overflow: hidden;
}

#news .card-block:hover, #blogue .card-block:hover, #news .card-block:focus, #blogue .card-block:focus{
	background-color: #333399;
	cursor:pointer;
}
#news .card-block:hover .content-box .news-title a, #blogue .card-block:hover .content-box .news-title a{
	color: white !important;
	text-decoration: underline;
}

#news .card-block:hover .content-box p, #blogue .card-block:hover .content-box p{
	color: white;
	text-decoration: none;
}

.image-box{
	height: 285px;
	width: 100%;
	display: flex;
	align-items: center;

}



#press{
	margin-top: 0px;
	padding-top: 55px !important;
	padding-bottom: 30px !important;
}

.tutorials_list h3{
	font-size: 36px;
	line-height: 48px;
	color: #333399;
	font-weight: bold;
}

#press h2,#external_links h2{
	font-size: 36px;
	line-height: 48px;
	color: #333333;
	font-weight: bold;
}

#press h3{
	font-size: 24px;
	line-height: 48px;
	color: #333399;
	font-weight: bold;
}

#press_description, #tutorial_cards_description, #external_description{
	font-size: 18px;
	line-height: 1.5;
	color: #333333;
	margin: 0;
}

.press_list a .link{
	font-size: 20px;
	color: #333399;
	line-height: 1.5;
	min-height: 44px;
	font-weight: bold;
	height: auto;
	/*margin-bottom: 10px !important;*/
	display: flex;
	align-items: center;
	padding: 10px 0;
}


#press ul, #external_links ul{
	padding-right: 40px !important;
}

#press_top, #external_top{
	padding-bottom: 30px;
	max-width: 720px;
}

#external_links{
	padding-bottom: 40px !important;
}


#tutorials_cards_top{
	padding-bottom: 5px;
	max-width: 720px;
}

.icons_tutorials{
	height: auto;
	color: #333399;
}

#tutorials .list-group-item{
	display: flex;
	/*align-items: center;*/
}

#tutorials .list-group-item a, #press .list-group-item a, #external_links .list-group-item a{
	display: inline-flex;
}

/*#press .list-group-item a{
	margin-bottom: 10px !important;
}*/

/*#tutorials li, #press li, #external_links li{
	min-height: 44px;
	height: auto;
}*/

#tutorials ul{
	padding-top: 10px;
}


.press_list span, .press_list .item-description{
	font-size: 16px;
	line-height: 1.5;
	color: #333333;
}

#press .list-group-item, .tutorials_list .list-group-item{
	display: flex;
}

#press li{
	padding: 20px 0px;
}

#press .icon-rss{
	padding-left: 10px !important; 
	color: #ff6600;
}

#tutorials_list .tutorials_list{
	padding-top: 60px !important;
}

#tutorials_cards{
	margin-top: 80px;
	padding: 65px 89px 45px 89px;
}

#items_cards{
	margin-top: 50px;
	padding: 10px 89px 4	5px 89px;
}



#tutorials_cards h3{
	font-size: 36px;
	line-height: 48px;
	color: #333399;
}

#tutorials_cards_description{
	font-size: 18px;
	line-height: 1.5;
	color: #333333;
}

#tutorials_cards a, .card-body, #items_cards a{
	height: 100%;
}

#tutorials_cards .card, #items_cards .card{
	background-color: #b8dcf9;
	border: none;
}

#tutorials_cards .card-body, #items_cards .card-body{
	padding: 30px 53px 40px 40px;
}

#tutorials_cards .card-title, #items_cards .card-title{
	font-size: 26px;
	line-height: 32px;
	color: #333399;
	font-weight: bold;
}

#tutorials_cards .card-text, #items_cards .card-text{
	font-size: 16px;
	/*line-height: 1.5;*/
	color: #333333;
	margin: 0px;
}


#tutorials_cards .card:hover, #items_cards .card:hover{
	background-color: #333399;
	cursor: pointer;
}

#items_cards .card:hover .icons_tutorials, #items_cards .card:hover .card-text, #items_cards .card:hover .card-title a{
	color:white !important;
	text-decoration: none;
}

/*#tutorials_cards a:hover, #items_cards a:hover{
	color: white;
	text-decoration: none;
}*/


.change{
	/*margin-top: 20px;*/
	padding-top: 25px !important;
	padding-bottom: 30px !important;
	margin-bottom: 30px;
}


.change h2{
	font-size: 36px;
	line-height: 48px;
	color: #333333;
	font-weight: bold;
}

.change_description{
	color: #333333;
	font-size: 18px;
	line-height: 1.5;
	margin: 0;;
}

.changes{
	border: 6px solid #333333;
	padding: 50px;
}

.changes ul{
	margin: 0;
	padding: 0;
}

.change a{
	color: #333399;
	font-size: 20px;
	line-height: 48px;
	font-weight: bold;
}

.change .p-2{
	padding-right: 30px !important;
}

.change .icon-arrow-bullets{
	padding-right: 15px !important; 
	color: #333399;
}


#pre_footer{
    padding-top: 65px !important;
    padding-bottom: 65px !important;
	background-color:  #e4e4e4;
}


#pre_footer .items-links{
	font-size: 18px;
	color: #333399;
	line-height: 20px;
}


#pre_footer .item-title{
	font-size: 26px;
	color: #333399;
	line-height: 40px;
	font-weight: bold;
}



#pre_footer ul{
	padding-right: 40px !important;
}

#pre_footer .icon{
	margin-left: 10px;
}

.footer{
	padding: 50px 89px 45px 89px;
	background-color: #f1f1f1;
}

.copyright span{
	font-size: 16px;
	line-height: 18px;
	color: #4f4f4f;
}

.footer .links a{
	font-size: 16px;
	color: #333399;
	/*line-height: 40px;*/
	padding-right: 30px !important;
	height: 44px;
	padding-bottom: 65px;
    padding-top: 5px;
}

.footer ul{
	list-style-type: none;
	padding: 0px !important;
	text-align: center;
	margin: 0;
}


.footer img{
  max-width: 100%;
  height: auto;
}

.page_title{
	font-size: 42px !important;
	line-height: 48px !important;
	color: #333333 !important;
	font-weight: 900 !important;
}

.page_title_blue{
	font-size: 42px !important;
	line-height: 48px !important;
	font-weight: 900 !important;
	color: #333399 !important;
	 margin: 0 !important;
}

.page_description, #page p, #page_details p{
	font-size: 20px;
	line-height: 26px;
	color: #333333;
	max-width: 800px;
}

#page{
	padding-top: 60px !important;
}

/*#page .d-flex span{
	font-size: 18px;
	color: #333333;
	line-height: 1.5;
}

#page .d-flex a{
	text-decoration: underline;
	font-size: 18px;
	color: #333399;
	line-height: 1.5;
}*/

#page .breadcrumb li{
	font-size: 18px;
	color: #333333;
	line-height: 1.5;
}

#page h2, #page_details h2{
	font-size: 36px !important;
	line-height: 48px !important;
	color: #333333 !important;
	font-weight: 900 !important;
}

#page .icon::before, #page_details .icon::before{
	font-size: 130px !important;
}

#page .icon-search::before, #page_details .icon-search::before{
	font-size: 24px !important;
}

#page .icon-arrow-drop::before{
	font-size: 18px !important;
}

#page .icon-arrow-bullets::before, #page_details .icon-arrow-bullets::before{
	font-size: 18px !important;
	color: white;
}

#access{
	background-color: #a2e7ad !important;
	padding-top: 55px;
	padding-bottom: 55px !important;
	margin-top: 40px;
}

#access .icon-check-monitor{
	color: #333399; 
	padding-right: 10px;
}

#access #access_monitor_form{
	padding: 0px 9px 0px 5px;
}

#access .icon-arrow-bullets{
	padding-left: 10px;
}


hr{
	border: 0.5px solid #333333;
	height: 1px;
	background-color: #333333;
	margin: 15px 0px 0px 0px !important;
}


#search_results .col-lg-4{
	padding-left: 20px !important;
}

#cookies_bar{
	background-color: #29297a;
	border-top: 1px solid white;
	height: auto;
	padding-top: 40px;
	padding-bottom: 40px;
	position: fixed;
	bottom: 0;
	width: 100vw;
	z-index: 10;
}

#cookies_bar .container{
	height: 100%;
}

#cookies_bar .icon-arrow-bullets{
	padding-left: 10px;
}


/*.btn_cookies{
	display: flex;
	max-width: 200px;
	width: auto;
	height: 50px;
	border-radius: 30px;
	background-color: #a2e7ad;
	color: #333399;
	font-size: 16px;
	line-height: 1.5;
	text-align: left;
	justify-content: center;
	align-items: center;
	padding: 0px 30px 0px 30px;
	cursor: pointer;
}*/

.btn_cookies{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	height: 50px;
	border-radius: 30px;
	background-color: #a2e7ad;
	color: #333399;
	font-size: 16px;
	padding: 0px 30px 0px 30px;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	border: 2px solid #a2e7ad;
	width: auto !important;
	line-height: 18px;
}

.btn_cookies:hover{
	cursor: pointer;
	animation-name: btn_hover_cookies;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}

@keyframes btn_hover_cookies {
	from {background-color: #a2e7ad; color: #29297a;}
	to {background-color: #29297a; color: #a2e7ad;}
}

.btn_cookies .icon-arrow-bullets{
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.btn_cookies:hover .icon-arrow-bullets, .btn_cookies:focus .icon-arrow-bullets, .btn_cookies:active .icon-arrow-bullets{
	-webkit-transform: translateX(4px);
	transform: translateX(4px);
}
  
.btn_cookies .icon-arrow-bullets{
	display: flex;
	align-items: flex-end;
}

.btn_no_cookies{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	height: 50px;
	border-radius: 30px;
	background-color: #00004d;
	color: white;
	font-size: 16px;
	padding: 0px 30px 0px 30px;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.1s;
	transition-duration: 0.1s;
	border: 2px solid #00004d;
	margin-left: 10px;
	width: auto !important;
	line-height: 18px;
}

.btn_no_cookies:hover{
	cursor: pointer;
	animation-name: btn_hover_no_cookies;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;  
}

@keyframes btn_hover_no_cookies {
	from {background-color: #00004d; color: white;}
	to {background-color: white; color: #00004d;}
}

#cookies_bar p{
	color: white;
	margin: 0px !important;
	font-size: 16px;
	line-height: 1.5;
}

#cookies_bar a{
	color: white;
	font-size: 16px;
	line-height: 1.5;
	text-decoration: underline;
}

#experience_top{
	padding-bottom: 30px;
	padding-top: 30px;
	border-bottom: 1px solid #dcdcdb;
}

#experience_top h1{
	font-family: 'Red Hat Display', sans-serif;
	font-size: 42px;
	color: #333333;
	line-height: 42px;

}

#experience_top p{
	font-size: 16px;
	color: #333333;
	line-height: 22px;	
	padding-left: 40px !important;
	padding-top: 15px;
}

#experience_links p{
	font-size: 16px;
	color: #333333;
	line-height: 22px;	
}

#experience_links{
	padding-top: 50px;
}

#experience_links .accessibility_links_title{
	font-size: 32px;
	color: #333399;
	line-height: 30px;	
}

#experience_links .accessibility_links_link{
	font-size: 18px;
	color: #333399;
	line-height: 20px;
	text-decoration: none;	
	min-height: 44px;
	padding: 11px 0;
	font-weight: bold;
}

#experience_links .accessibility_links_link:hover{
	text-decoration: underline;	
}

#experience_links .icon{
	margin-top: 12px;
	margin-left: 10px;
}

#experience_links .col-12 .d-inline-flex[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
	margin-top: 8px;
}

#experience_top .icon{
	margin-top: 15px;
	margin-left: 10px;
}

#experience_menu_title[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
	margin-top: 10px;
}


#pre_footer .d-inline-flex[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
}

#pre_footer li, .footer li, #experience_menu li, #access li, #change li, #cookies_bar li{
	list-style-type: none;
}

#tools_list .tools_list .tool_category[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
	margin-top: 5px;
	margin-right: 10px;
}


#badge_links{
	padding-right: 0px !important;
	/*padding-left: 49px !important;*/
}

#accessibility_links, #usability_links{
	padding-right: 30px !important;
}


#experience_menu{
	background-color: #efefee;
	position: fixed;
	/*top: 44px;*/
	width: 100%;
	z-index: 1001;
	padding-bottom: 125px;
	height: 100%;
	min-height: 100vh;
	/*display: none;*/
	overflow: scroll;
}

#experience_menu_header{
	background-color: #efefee;
	width: 100%;
}


#btn_experience_menu:hover{
	cursor: pointer;
}

#btn_experience_menu a:hover{
	text-decoration: none;
}

#btn_experience_menu span{
	line-height: 16px;
}

#btn_experience_menu .icon-ed-menu-dots{
	padding-right: 14px; 
	padding-top: 4px;
}

#btn_experience_menu .d-inline-block{
	color: #333333;
}

#btn_experience_menu .bold{
	color: #333399;
}

#btn_experience_menu[aria-expanded="true"] .icon-arrow-drop{
	transform : rotate(180deg);
	margin-right: 0px;
	margin-bottom: -2px;
}

#experience_menu_portal{
	justify-content: flex-end;
}

#share{
	padding-top: 40px !important;
}

#share h2{
	color: #333399;
	font-size: 16px;
	line-height: 1.5;
	font-weight: bold;
	margin: 0 !important;
}

#share ul, #social ul, .share-tutorial ul{
	list-style: none;
	margin: 0px;
}

/*#share ul{
	padding-top: 10px !important;
}*/

.tool_list .col-12{
	max-width: 540px;
}

.tools_list{
	padding-bottom: 50px;
	padding-top: 50px;
	border-bottom: 1px solid #333333;
}
#social_share {
	padding-bottom: 20px;
	padding-top: 0px;
}

.right_list{
	padding-left: 15px !important;
	padding-right: 40px !important;
}

.left_list{
	padding-right: 55px !important;
}

#small_menu{
	width: 100%;
	z-index: 1002;
	background-color: #333399;
	color: white !important;
	position: fixed;
	top: 0;
	display: none;
	height: 100%;
	min-height: 100vh;
	overflow: scroll;
	padding-bottom: 100px;
}

#open_small_menu, #close_small_menu{
	height: 44px;
	width: 44px;
	cursor: pointer;
	margin-top: 8px;
}


#small_menu .title a, #small_menu .title h1{
	font-size: 44px;
	color:white;
	font-family: 'Red Hat Display', sans-serif;
	text-decoration: none;
	font-weight: normal !important;
}


#small_menu_top{
	padding-top: 75px;
	border-bottom: 1px solid #4848a3;
	padding-bottom: 30px;
}


#small_menu .flex-column{
	border-bottom: 1px solid #4848a3;
}

#small_menu .link{
	height: 50px;
	padding-left: 26px !important;
	padding-right: 26px !important;
}

#small_menu a{
	color: white;
	font-size: 32px;
	line-height: 32px;
	font-weight: bold;
}

#small_menu .title a, #small_menu .title h1{
	line-height: 45px !important;
}

#small_menu .search_div{
	max-width: 407px;
}

.search_div{
	padding-top: 40px !important;
}

#small_menu form{
	width: 100%;
}

/*#small_menu .small-active{
	background-color: white;
	color: #333399 !important;
}*/

#small_menu .link[aria-current="page"]{
	background-color: white;
	color: #333399 !important;
}


#small_menu .input-group{
	border: 2px solid white !important;
}

#small_menu .input-group, #small_menu .input-group input{
	background-color: #333399 !important;
	color: white;
}

#small_menu ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: white;
	opacity: 1; /* Firefox */
  }
  
  #small_menu :-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: white;
  }
  
  #small_menu ::-ms-input-placeholder { /* Microsoft Edge */
	color: white;
  }

  #small_menu ul{
	  padding: 0px;
	  margin-top: 10px;
  }

  input:not([type='checkbox']):focus, textarea:focus, .dropdown .btn:focus, .dropdown_search .btn:focus{
	outline:0px !important;
    -webkit-appearance:none;
	box-shadow: none !important;
  }

  .small_bottom{
	  border-bottom: 1px solid #4848a3;
	  margin: 0 !important;
	  padding-bottom: 16px !important;
	  padding-top: 16px !important;
  }

  .small_bottom .d-flex{
	  height: 44px;
  }

  .small_bottom span{
	  font-size: 18px;
	  line-height: 22px;
	  font-weight: normal !important;
  }

  .small_bottom a{
	  height: 44px;
  }

  .small_bottom .icon-dark, .small_bottom .icon-globe-language{
	padding-left: 24px;
  }


  #fb_icon, #tw_icon, #ln_icon{
	  cursor: pointer;
	  padding-right: 5px;
  }

  #btn_open_filter{
	  width: 44px;
	  height: 44px;
  }

  .arrow-right{
	display: flex;
	align-items: center;
	justify-content: center;
	transform: rotate(-90deg);
}

#breadcrumbs_mobile p{
	margin: 0 !important;
}

#breadcrumbs_mobile .dropdown{
	margin-top: 5px !important;
}

#breadcrumbs_mobile p{
	font-size: 16px;
	line-height: 1.5;
	color: #333333;
}

#breadcrumbs_mobile span{
	font-size: 16px;
	line-height: 1.5;
	color: #333333;
}

.dropdown-item{
	color: #333333;
	font-size: 16px;
	line-height: 1.5;
}

.dropdown-item.item-blue{
	color: #333399 !important;
}

#breadcrumb_large, #breadcrumb_large div{
	min-height: 44px !important;
}

#breadcrumb_large a, #breadcrumb_large span{
	vertical-align: middle;
	  height: 100%;
	  display: inline-flex;
	  align-items: center;
}

.dropdown{
	width: 100% !important;
	border-radius: 0 !important;
	background-color: transparent;
	margin-top: 20px !important;
}


.dropdown .btn{
	width: 100% !important;
	text-align: left !important;
	border-radius: 0 !important;
	border: 2px solid #efefee;
}

.dropdown .btn:after{
	border: 0 !important;
}

.dropdown .btn .icon-arrow-drop{
	margin-top: 4px;
	display: inline-flex;
	color: #333399 !important;
	float: right;
}

.dropdown .btn[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
}



.dropdown_search .btn[aria-expanded="true"] .icon-arrow-drop{
	transform: rotate(180deg);
}

.dropdown .btn[aria-expanded="true"]{
	border-top: 2px solid #333399;
	border-right: 2px solid #333399;
	border-left: 2px solid #333399;
	border-bottom: transparent;
}

.breadcrumb{
	background-color: transparent !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: .75rem 0px !important;
}

.breadcrumb li{
	height: 44px;
}
.breadcrumb a{
	height: 44px;
	color: #333399;
	display: inline-flex;
	align-items: center;
	font-size: 18px;
	text-decoration:underline;
}

.breadcrumb-item+.breadcrumb-item::before{
	content: '';
	speak: none;
	padding-right: 0 !important;
}

.breadcrumb-item.active{
	color: #333333;
	display: inline-flex;
	align-items: center;
	font-size: 18px;
	line-height: 1.5;
}

.breadcrumb_arrow{
	padding-right: 10px !important;
}
.breadcrumb_arrow::after{
	content: '>';
}

.dropdown-menu.breadcrumbs{
	margin-top: 0 !important;
	border-bottom: 2px solid #333399 !important;
	border-left: 2px solid #333399 !important;
	border-right: 2px solid #333399 !important;
	border-radius: 0 !important;
	width: 100% !important;
}

/*.arrow-links{
	padding-left: 31px;
	position: relative;
}
.arrow-links .anchor_before:before{
	// padding: 12px; 
	font-family: "ama" !important;
	content: "\61";
	font-style: normal !important;
	font-weight: normal !important;
	font-variant: normal !important;
	text-transform: none !important;
	speak: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	padding-right: 15px !important;
	color: #333399;
	position: absolute;
	left: 0;
	font-size: 16px;
	margin-top: 15px;
	//margin-top: 3px;
}

#experience_menu .arrow-links .anchor_before:before{
	margin-top: 5px !important;
}*/

.table-topic{
	background-color: #f1f1f1;
}


#blogue_content ul{
	margin-left: 0;
	padding-left: 40px;
}

#search_list ul, #articles_list, #pagination ul{
	list-style: none;
	padding: 0 !important;
}

#most-read-list ul{
	padding: 0;
}

.text_content ul{
	margin-bottom: 1rem !important;
}

#page .row{
	padding-bottom: 30px !important; 
	padding-top: 15px !important;
}

#badge_version{
	height: 44px;
}

#search_form_page .icon-search{
	padding-top: 5px !important; 
	color: #333399 !important;
}

/*.read_more::after{
	font-family: "ama" !important;
	content: "\61";
	font-style: normal !important;
	font-weight: normal !important;
	font-variant: normal !important;
	text-transform: none !important;
	speak: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	color: #333399;
	position: absolute;
	left: 68px;
	font-size: 16px;
	margin-top: 15px;
	z-index: -1;
}

.about_quote .read_more::after{
	left: 110px !important;
}*/

.read_more a{
	font-size: 16px;
	color: #333399;
	line-height: 1.5;
	font-weight: bold;
	width: 90px;
	height: 44px;
	padding-bottom: 10px;
	padding-top: 10px;
}

.read_more_arrow{
	position: absolute;
	left: 70px;
	padding-top: 15px;
	color: #333399;
	z-index: -1;
}
.about_quote .read_more_arrow{
	left: 110px !important;
}

.top-filter{
	display: inline;
	font-size: 24px !important;
	color: #333333;
	line-height: 26px !important;
	font-weight: bold;
	margin: 0!important;
}

abbr[title] {
	border-bottom: none !important;
	cursor: inherit !important;
	text-decoration: none !important;
  }

.list_arrow_link{
	color: #333399;
	padding-top: 12px;
}

.list_link{
	padding-left: 15px;
}

.list_link a{
	font-size: 20px;
	line-height: 1.5;
	padding-top: 10px;
	font-weight: bold;
	/*padding-bottom: 10px;*/
}

.list_link a:focus{
	padding: 0 !important;
}

.carousel-indicators li{
	display: flex;
	border-radius: 50%;
	background-color: #e4e4e4;
	color: #333399;
	height: 46px;
	width: 46px;
	align-items: center;
	justify-content: center;
	margin-right: 15px;
	/*text-align: center;*/
	opacity: 1;
}

.carousel-indicators li span{
	text-align: right;
	padding-left: 7px;
	font-weight: bold;
	font-size: 16px;
}
.carousel-indicators .active{
	background-color: #333399;
	color: white;
}
.carousel-indicators{
	margin-right: 0!important;
	margin-left: 0!important;
	bottom: -24px !important;
	left: auto;
	z-index: 9;
}

.carousel-indicators li:hover:not(.active){
	animation-name: exampleCarousel;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;  
}

@keyframes exampleCarousel {
	from {background-color: #e4e4e4; color: #333399}
	to {background-color: #333399; color: #e4e4e4 }
}


.td_div{
	position: relative;
}

.td_div .menu{
	background-color: #f1f1f1;
	padding: 10px;
}

.tutorial-text label{
	width: auto;
}
.tutorial-text input{
	border: 1px solid #333333 !important;
}

p.invis {display:none}
p.correct {display:inline; color:green !important}
p.incorrect {display:inline; color:red !important}
p.higher {display:inline; color:red !important}
p.lower {display:inline; color:red !important}

.selo_large{
	margin-left: 80px;
}

.icon_card{
	color: #333399 !important;
	width: 72px;
	filter: invert(13%) sepia(38%) saturate(7402%) hue-rotate(238deg) brightness(92%) contrast(81%);
}

.card:hover .icon_card{
	filter: brightness(0) invert(1);
}

.icon_image{
	width: 130px;
	height: 130px;
	filter: brightness(0);
}

.read_more_text{
	margin-top: 10px;
}

#about a, #contact a {
	text-decoration: underline;
}


.rato{
	display:none;
	/*position: absolute;
	top: 5px;
	right: 0;
	width: 20px;
	height: 20px;
	background-image: url("imgs/hand.png");
	background-color: transparent;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;*/
}


.access_error{
	display: block;
	font-size: 16px;
	font-weight: bold;
	color: #d10000;
}

@media (min-width: 992px){
	#experience_links .collapse, #pre_footer .collapse{
		display: block !important;
	}
}

@media (max-width:1262px) and (min-width:992px) {
	section, #pre_footer{
		padding-right: 53px !important;
		padding-left: 53px !important;
	}

	#experience_menu{
		padding-right: 53px !important;
		padding-left: 53px !important;
	}

	#accessibility_links, #usability_links{
		padding-right: 20px !important;
	}

	.break-title{
		display: block !important;
	}

	/*.top-bar-right{
		padding-right: 53px !important;
	}*/

	/*.top-bar-left{
		padding-left: 53px !important;
	}*/

	#navbar .input-group{
		max-width: 150px;
		min-width: 140px;
	}

	.navbar-nav .nav-link{
		padding-right: 9px !important;
		padding-left: 9px !important;
	}

	#top-bar2 .title_description{
		padding-left: 20px !important;
	}

	#infos_left{
		max-width: 500px !important;
		margin-right: 25px;
	}

	.info_title{
		font-size: 38px;
		line-height: 42px;
	}

	#infos_rigth h3{
		font-size: 30px;
	}

	.info_content{
		line-height: 22px;
	}

	.access_monitor{
		padding: 42px 12px 34px 12px !important;
	}

	.access_monitor .version{
		margin-left: auto !important;
		padding: 3px 4px !important;
	}

	.blogue_list{
		padding-right: 40px !important
	}

}

@media (max-width: 991px){
	/*#top-bar{
		padding: 0px 51px 0px 51px !important;
	}*/

	#top-bar2 #site_title a, #top-bar2 #site_title h1{
		line-height: 45px;
	}

	#top-bar2, #experience_menu, #top-bar, #experience_menu_header, #page_details{
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	#page_details{
		margin-top: 30px;
	}

	/*.top-bar-left{
		padding-left: 51px !important;
	}*/

	/*#top-bar .col-md-4{
		display: none !important;
	}*/

	#top-bar .col-sm-12{
		display: flex !important;
	}

	#top-bar2 .title h1, #top-bar2 .title a, #small_menu .title a, #small_menu .title h1{
		font-size: 42px;
	}

	.navbar{
		display: none !important;
	}

	#infos{
		padding-right: 31px !important;
		padding-left: 31px !important;
	}

	#messages .alert{
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	.infos{
		display: block !important;
	}

	#infos_left{
		padding-right: 20px !important;
		padding-left: 20px !important;
		max-width: 100% !important;
	}

	#infos_rigth{
		width: 100% !important;
		max-width: 100% !important;
		padding-left: 0px !important;
		padding-top: 70px !important;
	}

	#div_btn_access{
		padding-left: 30px !important;
	}

	#accessibility{
		padding-right: 0px !important;
		padding-left: 0px !important;
		margin-top: 15px !important;
	}

	#accessibility .row{
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	#accessibility_rigth{
		padding: 45px 0px 0px 0px !important;
	}

	#accessibility_rigth .row{
		padding-right: 0px !important;
		padding-left: 0px !important;
	}

	/*.btn_accessibility{
		display: none !important;
	}*/

	#tutorials{
		margin-top: 35px !important;
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	/*#tutorials_links{
		padding-right: 0px !important;
	}

	#resources_links{
		padding-top: 90px !important;
	}*/

	#news{
		padding: 40px 51px 65px 51px !important;
	}

	#press{
		margin-top: 0px !important;
		padding: 70px 51px 45px 51px !important;
	}

	
	#press ul, #external_links ul{
		padding-right: 0px !important;
	}

	#press .icon-rss{
		padding-right: 10px !important;
	}

	#external_links{
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	/*#press #press_left{
		display: none !important;
	}*/

	#tutorials_cards, #items_cards{
		margin-top: 35px !important;
		padding-right: 51px !important;
		padding-left: 51px !important;
		padding-bottom: 20px !important;
	}

	#tutorials_cards .card-deck, #items_cards .card-deck{
		display: block !important;
	}

	#tutorials_cards .card-deck .card, #items_cards .card-deck .card{
		margin-bottom: 30px !important;
	}

	.change{
		padding-right: 51px !important;
		padding-left: 51px !important;
		padding-top: 20px !important;
	}

	.change .changes{
		padding-right: 40px !important;
		padding-left: 40px !important;
	}

	.change i:before{
		float: left;
	}

	.change i{
		/*width: 100%;
		padding: 0px !important;
		display: flex; 
		float: left;
		justify-content: center;*/
		
	}

	.change .p-2{
		padding-top: 0px !important;
		padding-bottom: 0px !important;
	}

	.change ul{
		padding-left: 0px;
		display: block!important;
	}

	#social_share, #pre_footer, #small_menu, #page_navigation, #cookies_bar, #items_cards, .footer, #page, #tutorials_list, #access, #tools_list, #success_message, #error_message{
		padding-right: 51px !important;
		padding-left: 51px !important;
	}

	#pre_footer ul{
		padding-right: 0px !important;
	}

	#search_results .col-lg-4{
		padding-left: 0px !important;
	}

	#experience_top p{
		padding-left: 0px !important;
	}

	.icons_tutorials{
		justify-content: flex-end;
	}

	#tutorials_list .tutorials_list{
		padding-top: 30px !important;
	}

	.right_list{
		padding-left: 0px !important;
		padding-right: 0px !important;
		padding-top: 50px !important;
		padding-bottom: 45px;
	}

	#tutorials{
		padding-bottom: 40px !important;
		padding-top: 70px !important;
	}

	.left_list{
		padding-right: 0px !important;
		padding-bottom: 65px;
	}

	.tools_list{
		padding-bottom: 50px;
		padding-top: 50px;
	}

	#share{
		padding-bottom: 95px;
	}

	#link_lang{
		padding-left: 74px !important;;
	}

	#badge_links, #accessibility_links, #usability_links{
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	#badge_links, #accessibility_links, #usability_links{
		padding-top: 45px;
	}

	#cookies_bar .container{
		display: block !important;
	}
	
	#cookies_bar{
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.btn_cookies{
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.card-deck .card{
		margin-right: 0px;
		margin-left: 0px;
	}

	#contact{
		padding-right: 51px !important;
		padding-left: 51px !important;
		padding-bottom: 95px !important;
	}	
	
	#filters{
		z-index: 1 !important;
	}

	#back_home_div{
		padding-bottom: 100px !important
	}

	#pre_footer .col-lg-4{
		padding-bottom: 15px !important;
	}

	#pre_footer{
		padding-bottom: 50px !important;
		margin-top: 35px !important;
	}

	.categories_description, .categories_description p{
		font-size: 16px !important;
	}

} 


@media (max-width: 767px) {
	
	#social_share, #experience_menu_header, #pre_footer, #tools_list, .change, #tutorials_cards, #press, #accessibility .row, #top-bar, #top-bar2, #infos_left, #items_cards, #page, #tutorial, #contact, #cookies_bar, #small_menu, #external_links, #page_navigation, #access, #tools_list, #experience_menu, #success_message, #error_message, #page_details{
		padding-right: 30px !important;
		padding-left: 30px !important;
	}


	#title_large{
		display: none;
	}

	#title_small{
		display: block;
	}

	.info_content{
		/*display: none !important;*/
	}
	#infos{
		padding-right: 0px !important;
		padding-left: 0px !important;
	}

	#infos_left_pagination{
		justify-content: flex-start;
		padding-top: 20px;
	}
	#div_btn_access{
		padding-left: 0px !important;
	}

	.change .p-2{
		padding-right: 0px !important;
	}

	/*#top-bar{
		padding: 0px 30px 0px 30px !important;
	}*/

	/*.top-bar-left{
		padding-left: 30px !important;
	}*/


	#tutorials{
		margin-top: 5px !important;
		padding-right: 30px !important;
		padding-left: 30px !important;
	}


	#news{
		padding-right: 30px !important;
		padding-left: 30px !important;
	}


	.footer{
		padding: 50px 30px 50px 30px !important;
	}


	#tutorials_list .tutorials_list{
		padding-top: 0px !important;
	}

	#experience_menu_portal{
		justify-content: flex-start;
	}

	#experience_menu_title, #experience_links .d-inline-flex{
		justify-content: space-between !important;
		display: flex !important;
	}

	#experience_links .col-12{
		border-bottom: 1px solid #dcdcdb;
		padding-bottom: 20px;
	}

	#experience_menu_desc .d-flex{
		justify-content: flex-start !important;
	}

	#cookies_bar{
		padding-top: 20px;
		padding-bottom: 20px;
	}

	/*#tutorial tbody{
		border-bottom: 1px solid #333333;
	}*/

	.table tbody+tbody{
		border-top: none !important;
	}

	.result_number{
		padding-left: 0px;
	}

	#contact{
		padding-bottom: 0px!important;
	}

}


@media (max-width: 576px) {

	#top-bar2 #site_title a, #top-bar2 #site_title h1, #small_menu .title a, #small_menu .title h1{
		line-height: 30px !important;
		margin-top: 10px !important;
	}

	.top-bar-left .icon-arrow-drop{
		margin-left: 18px;
	}

	#top-bar2{
		padding-top: 18px !important;
		padding-bottom: 18px !important;
	}

	#experience_links .icon{
		margin-top: 12px;
	}
	
	#experience_links .col-12 .d-inline-flex[aria-expanded="true"] .icon-arrow-drop{
		transform: rotate(180deg);
		margin-top: 8px;
	}

	#experience_top .icon{
		margin-top: 5px;
	}
	
	#experience_menu_title[aria-expanded="true"] .icon-arrow-drop{
		transform: rotate(180deg);
		margin-top: 0px;
	}

	#small_menu h1, #top-bar2 h1{
		line-height: 30px;
	}

	#page{
		padding-top: 50px !important;
	}

	.page_title, .page_title_blue{
		font-size: 32px !important;
		line-height: 36px !important;
	}

	.page_description, #page_details p{
		font-size: 18px;
		line-height: 1.5;
	}

	#top-bar2 .title h1, #top-bar2 .title a, #small_menu .title a, #small_menu .title h1{
		font-size: 32px;
	}


	#infos{
		padding-top: 25px !important;
		padding-bottom: 0px !important;
	}

	.info_title, #infos_rigth h4, #access h2, #accessibility_title, #news h2, #tutorials h3, #press h2, #external_links h2{
		font-size: 30px;
		line-height: 36px;
	}

	#infos_rigth{
		padding-top: 110px !important;
	}

	#infos .slick-dots{
		bottom: -70px !important;
		justify-content: flex-start !important;
		left: 0;
	}

	.info_title{
		margin-bottom: 0px !important;
	}

	#access_description, #accessibility_content, #news_description, .tutorials_description, #press_description, #external_description, #change_description{
		font-size: 16px;
		line-height: 20px;
	}

	#url_label{
		font-size: 15px;
	}

	#top_update{
		justify-content: start;
	}

	/*.top_list{
		margin-top: 20px;
	}*/

	#news .news-title{
		font-size: 20px;
		line-height: 1.5;
	}

	.slider p{
		font-size: 16px;
	}

	.press_list a .link{
		font-size: 18px;
		line-height: 20px;
	}

	#press h3, #external_description{
		font-size: 18px;
	}

	.change .changes{
		padding-right: 30px !important;
		padding-left: 30px !important;
	}

	.change h2{
		font-size: 30px;
		line-height: 32px;
		font-weight: bold;
	}

	.change a{
		font-size: 18px;
		line-height: 36px;
	}

	.change_links{
		margin-top: 25px !important;
	}

	#pre_footer h3{
		font-size: 24px;
		line-height: 30px;
	}

	#pre_footer a{
		font-size: 16px;
		line-height: 18px;
	}

	.footer .links a{
		font-size: 16px;
		line-height: 30px;
	}

	#small_menu a{
		font-size: 24px;
		line-height: 1.5;
	}

	#experience_top h1, #experience_links h4, #experience_links .accessibility_links_title{
		font-size: 26px;
		line-height: 26px;
	}

	#small_menu .link{
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	#accessibility_rigth .row{
		padding-right: 0px !important;
		padding-left: 0px !important;
	}

	#cookies_bar p, #cookies_bar a{
		font-size: 16px;
		line-height: 20px;
	}


	#experience_top p, #experience_links p{
		font-size: 15px;
		line-height: 20px;
	}


	.small_bottom{
		display: block !important;
		padding-bottom: 25px !important;
	}

	.small_bottom li a{
		justify-content: space-between;
		width: 100%;
	}

	#link_lang{
		padding-left: 0px !important;;
	}
	
	#usability_links, #accessibility_links, #badge_links{
		border-bottom:1px solid #dcdcdb;
	}

	.top_institution{
		/*justify-content: flex-start !important;*/
		line-height: 1.5;
		/*padding-bottom: 60px;*/
		position: relative;
		/*display: table-row-group;*/
		height: 100px;
	}

	.institution_name{
		position: absolute;
		/*top: 30px;*/
		left: 0;
		margin-top: 15px !important;
	}

	.btn_div{
		padding-top: 30px !important;
	}

	.top_list{
		margin-top: 15px !important;
	}

	.btn_access{
		margin-left: 0px;
	}

	.icons_tutorials{
		justify-content: flex-start;
	}

	.slick-list{padding:0 0 0 0!important;}

	#contact{
		padding-right: 0px !important;
		padding-left: 0px !important;
	}

	.content-box{
		padding: 20px 15px 25px 20px !important;
	}

	#page .d-flex span{
		font-size: 16px;
		line-height: 26px;
	}

	#top-bar{
		height: 57px;
	}

	#experience_menu{
		top: 57px;
	}

	#news .slick-list, #blogue .slick-list{
		padding: 0 !important;
	}

	.rating{
		line-height: 0px !important;
		position: absolute;
		left: 50px;

	}

	.footer .links a{
		padding-right: 0px !important;
		padding-bottom: 0px !important;
	}

	#cookies_buttons{
		display: block !important;
	}
	.btn_no_cookies{
		margin-left: 0px !important;;
	}

	#tools_list .tools_list .tool_category[aria-expanded="true"] .icon-arrow-drop{
		transform: rotate(180deg);
		margin-top: 0px;
		margin-right: 0px;
	}

	.top-filter{
		font-size: 20px !important;
		line-height: 26px !important;
	}

	.carousel-indicators{
		left: 0;
		right: auto;
		bottom: -85px !important;
	}

	.version_badge{
		position: absolute;
		top: 0px;
		right: 0;
	}

	.access_top{
		position: relative;
		padding-top: 25px;
	}
}