/* Mobile First */
#header_social_cont {
	width:100%;	
	overflow:auto;
	display:none;
}

#wrapper_three{ margin:0 auto; width:100%; overflow: auto; padding:0;}

#logo {
	float:left;
	width:100%;
	text-align:center;
}
#header_ad {
	float:left;
	width:100%;
	overflow:auto;
	display:none;
	margin:3% 0 0 0;
	text-align:center;	
}
#content_section {
	width:100%;
	overflow:auto;
	position: relative;
}



.mag_category_column_vertical{
	width:100%;
	margin:0 0 15px 0;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}
.mag_category_column_vertical_odd{
	clear:both;
	width:100%;
	margin:0 0 15px 0;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}

.mag_two_post_excerpt_img {
	width:100%;
	margin:2% 0;
	overflow:auto;
}

.mag_two_post_excerpt_p {
	width:100%;
	margin:2% 0;	
}

.mag_two_post {
	float:left;
	width:90%;
	margin:0 5% 15px 5%;
		
}
.mag_two_post_odd {
	clear:both;
	width:90%;
	margin:0 5% 15px 5%;
	float:left;
		
}

.mag_post_excerpt_img {
	width:100%;
	margin:2% 0;
	overflow:auto;
}

.mag_post_excerpt_p {
	width:100%;
	margin:2% 0;	
}
.mag_category_column{
	width:100%;
	margin:0 0 30px 0;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
}

.seach_section fieldset{
	float:left;
	width:90%;
	padding: 0;
	
}

.seach_section .searchtext{
	float:left;
	width:100%;
	margin:0;
}

.seach_section .text{
	float:left;
	font-size:13px;
	margin:0 0 0 4%;
	width:90%;
	
}

.seach_section .searchsub{
	
}


.seach_section .submit{
	float:left;
	font:14px/14px 'TitilliumText22LRegular', Georgia, "Times New Roman", Times, serif;
	text-transform:uppercase;
	padding:10%;
}

.widget .seach_section fieldset{
	float:left;
	width:90%;
	padding: 0;
	
}

.widget .seach_section .searchtext{
	float:left;
	width:100%;
	margin:0;
        margin-top: 3px;
}

.widget .seach_section .text{
	float:left;
	font-size:13px;
	margin:0 0 0 4%;
	width:90%;
}

.widget .seach_section .searchsub{
	float: right;
	margin: -25px 0px 2%;
}

.widget .seach_section .submit{
	float:left;
	font:bold 14px/14px 'TitilliumText22LRegular', Georgia, "Times New Roman", Times, serif;
	text-transform:uppercase;
	padding:10%;
	cursor: pointer;
	float: left;
	font: bold 14px/14px "TitilliumText22LRegular",Georgia,"Times New Roman",Times,serif;
	text-transform: uppercase;
	padding: 10%;
	cursor: pointer;
	font-size: 0px;
	display: block;
	width: 40px;
	height: 22px;
}

#footer_section {
	   width: 94%;
    overflow: hidden;
    margin: 0px 3%;
    height: 50px;
    font-size: 10px; 
}

#bottomfooterwidgetcontainer {
	width:96.80851063829787%;
	margin:0 .595744680851064%;
	overflow:auto;	
}

.bottomfooterwidgety{
	width:90%;
	float:left;
	padding:0;
	overflow:hidden;
}

.bookmark_button {
	float:left;
	margin:10px 10px;
}
.bookmark_button_facebook {
	display:none;	
}

.single_np_prev {
	float:left;
	width:90%;
	min-height:74px;
	margin:0 0 0 10%;
}


.single_np_next {
	float:left;
	width:90%;
	min-height:74px;
	margin:0 10% 0 0;
}

.related_post_image {
	float:left;
	width:100%;
	margin:10px 0;
}

.Raptor_prev_img_attch {
	width:100%;
	float:left;
	text-align:center;
}

#sidebarads{
	width:135px;
	overflow:auto;
	padding:0;
	margin:5% auto;
}
.sidebar_ad{
	float:left;
	width:125px;
	margin:5px;
}
#sidebarads_250{
	width:94.117647058823529412%;
	overflow:auto;
	margin:0 auto 3% auto;
}
.sidebar_ad_250{
	float:left;
	width:93.75%;
	margin:0 0 3.125% 3.125%;
	text-align:center;
}
.gallery {
	margin: 0 auto 20px auto;
}

dl.gallery-item {
	margin: 0;
}

.gallery-item a {
	width: 90%;
	display: block;
}

.gallery-caption {
	width: 90%;
	margin: 0 0 10px 0;
	font-size: 12px;	
	font-style: italic;
}

.gallery-caption a {
	display: inline;
}

.gallery a img {
}

dl.gallery-item img {
	padding: 5px;
	margin-bottom: 10px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	height: auto;
}

.gallery br+br {
	display:none;
}

.gallery .gallery-item {
	float: left; 
	text-align: center; 
	margin-bottom: 10px;
}
.gallery-columns-10 .gallery-item {
	width: 30%;
}

.gallery-columns-10 .gallery-item img {
	width: 84%;
}

div.dots {
	background-image: url(./css/images/dot.gif);
}

/* ======================================================================================== */
/* @media styles for header */
#logo_section {
	position: relative;
    overflow: auto;
    width: 94%;
    margin: -10px 3%;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.44);
	background: transparent url("http://step.esa.int/main/wp-content/uploads/2016/08/STEP_header.jpg") no-repeat right top;
	background-size:100% 100%;
	min-height: 165px;
}
#logo_section::before {
	position: absolute; left: 50px; top: 29px;
	font: 34px NotesEsaBold, 'TitilliumText22LRegular', Verdana, Geneva, sans-serif; color: white;
	text-align: left;
	content: "step";
}
#logo_section::after {
	position: absolute; left: 50px; top: 66px;
	font: 21px NotesEsa, 'TitilliumText22LRegular', Verdana, Geneva, sans-serif; color: white;
	text-align: left;
	overflow: hidden;
	max-height: 50px;
	content: "science toolbox exploitation platform";
}
#logo_image {
	margin-top: 35px;
	margin-right: 50px;
	background: transparent url("http://step.esa.int/main/wp-content/uploads/2016/08/logo_esa.png") no-repeat right top;
	background-size: contain;
	padding: 3.33% 0;
}
@media screen and (max-width : 599px) {
	#logo_section::after { font-size: 18px; width: 50%; }
	#logo_image { padding: 19px 0; }
}
@media screen and (max-width : 349px) {
	#logo_section::after { font-size: 14px; width: 40%; }
	#logo_image { padding: 16px 0; }
}

/* ======================================================================================== */
/* @media styles for top menu */
#menu              { width: 94%; margin: 0 3%; position: relative; }
#menu select       { display: none; width: 100%; margin: 19px auto 5px auto; }
#Main_nav          { display: table; width: auto; table-layout: fixed; }
#Main_nav>li       { display:table-cell; }
#Main_nav li       { line-height: 1em; float: none; }
#Main_nav ul       { top: 50px; }
#Main_nav ul li a  { display: table-cell; height: 36px; vertical-align: middle; }
#Main_nav li ul li:hover a { color: rgba(200,200,255,1); }

@media screen and (max-width : 599px) {
	#menu select   { display: block; }
	#Main_nav      { display: none; }
}
@media screen and (max-width : 799px) {
	#Main_nav li a { font-size: 1.85vw; padding: 0px 10px; }
}

/* ======================================================================================== */
/* inner_content_section */
#inner_content_section       { width: 94%; margin: 0 3%; display: table; table-layout: fixed; }
#inner_content_section>div   { float: none; display: table-cell; vertical-align: top; }

div#featured_section_header  { display: table-caption; background-color: white; } div#featured_section_header img { width: 100%; } div#featured_section_header img[src=""] { display: none; }
div#left-menu                { width: 173px; padding: 10px  0px  0px 10px; }
div#main_content_section,
div#main_content_section_standard,
div#main_content_section_maglite,
div#main_content_section_mag { width: 100%;  padding: 35px 10px 10px 10px; }
div#sidebar_section          { width: 178px; padding: 10px 5px  0px  0px; }

/* @media styles for left-menu */
@media screen and (max-width : 899px) {
	div#left-menu {
		display: block;
		position: absolute;
		left: 3.5%;
		width: 50px;
		height: 32px;
		overflow: hidden;
		border: 1px solid #2b66c3;
		border-radius: 10px;
		padding: 0;
		margin: 5px;
		background: #2b62c3 url("http://step.esa.int/main/wp-content/uploads/2016/08/arrow-SE-bkg.png") no-repeat 0% 0%;
	}
	div#left-menu>* { display: none; pointer-events: auto; }
	div#left-menu.hovering {
		display: block;
		position: absolute;
		width: 190px;
		height: inherit;
		overflow: hidden;
		border: 1px solid #2b66c3;
		border-radius: 10px 0px 10px 0px;
		padding: 35px 5px 5px 5px;
		margin: 5px;
		background: white url("http://step.esa.int/main/wp-content/uploads/2016/08/arrow-SE-bkg.png") no-repeat 0% 0%;
		z-index: 1;
	}
	div#left-menu.hovering>* { display: block; pointer-events: auto; }
}

/* @media styles for right sidebar_section */
@media screen and (max-width : 599px) {
	div#sidebar_section {
		display: block;
		position: absolute;
		right: 3.5%;
		width: 50px;
		height: 32px;
		overflow: hidden;
		border: 1px solid #2b66c3;
		border-radius: 10px;
		padding: 0;
		margin: 5px;
		background: #2b62c3 url("http://step.esa.int/main/wp-content/uploads/2016/08/arrow-SW-bkg.png") no-repeat 100% 0%;
	}
	div#sidebar_section>* { display: none; pointer-events: auto; }
	div#sidebar_section.hovering {
		display: block;
		position: absolute;
		width: 200px;
		height: inherit;
		overflow: hidden;
		border: 1px solid #2b66c3;
		border-radius: 0px 10px 0px 10px;
		padding: 30px 0 0 0;
		margin: 5px;
		background: white url("http://step.esa.int/main/wp-content/uploads/2016/08/arrow-SW-bkg.png") no-repeat 100% 0%;
		z-index: 1;
	}
	div#sidebar_section.hovering #sidebar {
		width: auto;
		max-height: 350px;
		overflow-x: hidden;
		overflow-y: scroll;
		margin: 5px 0 5px 5px;
	}
	div#sidebar_section.hovering>* { display: block; pointer-events: auto; }
}

/* ======================================================================================== */
/* styles for 200px - 500px */
@media screen and (min-width : 200px) and (max-width : 350px) {
	table.homepage td img { height: 100%; width: 100%; object-fit: contain }
}
/* ======================================================================================== */
/* styles for diverse content elements */
div#wrapper_three { min-width: 280px; }
table.homepage    { table-layout: fixed; }
table.homepage td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1em; }

@media screen and (max-width : 599px) {
	div.entry     {font-size: 1em}
	div.entry h4  {font-size: 1.2em}
}

/* ======================================================================================== */
/* styles for 790px - 900px */
@media screen 
and (min-width : 790px) 
and (max-width : 900px) {

.mag_category_column_vertical{
	width:48%;
	margin:0 0 4% 4%;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}
.mag_category_column_vertical_odd{
	clear:both;
	width:48%;
	margin:0 0 4% 0;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}

.mag_category_column_firstpost{
	width:48%;
	float:left;	
	margin:0 0 0 2%;	
}

.mag_category_column_secondpost{
	width:48%;
	float:left;
	padding:10px 0;	
	margin:0 0 0 2%;
}

.mag_two_post {
	float:left;
	width:44%;
	margin:0 0 5% 4%;
		
}

.mag_two_post_odd {
	clear:both;
	width:44%;
	margin:0 0 5% 4%;
	float:left;
		
}

.mag_post_excerpt_img {
	float:left;
	width:45%;
	margin:2% 5% 2% 0;
	overflow:auto;
}

.mag_post_excerpt_p {
	float: left;
	text-align: left;
}

.single_np_prev {
	float:left;
	width:45%;
	min-height:74px;
	margin:0 0 0 5%;
}

.single_np_next {
	float:right;
	width:45%;
	min-height:74px;
	margin:0 5% 0 0;
}

.related_post_image {
	float:left;
	width:40%;
	margin:0 2% 0 0;
}

.bookmark_button_facebook {
	display:block;
}

.wrimg {
	float:left;
	width:30%;
	margin:0 0 0 50px;
	display: none;
}
			
.wrtext {
	float:left;
	width:50%;
	margin:0 0 0 50px;
}	
.wrsubtextmore {
	display:block;
}
.wrsubtexth2 {
	text-align:left;
}
.wrsubtexth2 h2{
	text-align:left;
	font-size:24px;
}
.wrvid h2{
	font-size:24px;				
}
.wrvid {
	width:80%;
	margin:0 auto;
}
.gallery-item {
	width:50% !important;	
}
#sidebarads{
	width:270px;
	overflow:auto;
	padding:0;
	margin:3% auto;
}
.sidebar_ad{
	float:left;
	width:125px;
	margin:5px;
}
#sidebarads_250{
	width:94.117647058823529412%;
	overflow:auto;
	margin:0 auto 3% auto;
}
.sidebar_ad_250{
	float:left;
	width:93.75%;
	margin:0 0 3.125% 3.125%;
	text-align:center;
}
.fourohsearch {
	width:60%;
	margin:0 auto;
}
.gallery {
	margin: 0 auto 20px auto;
}

dl.gallery-item {
	margin: 0;
}

.gallery-item a {
	width: 90%;
	display: block;
}

.gallery-caption {
	width: 90%;
	margin: 0 0 10px 0;
	font-size: 12px;	
	font-style: italic;
}

.gallery-caption a {
	display: inline;
}

.gallery a img {
}

dl.gallery-item img {
	padding: 5px;
	margin-bottom: 10px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	height: auto;
}

.gallery br+br {
	display:none;
}

.gallery .gallery-item {
	float: left; 
	text-align: center; 
	margin-bottom: 10px;
}
.gallery-columns-10 .gallery-item {
	width: 30%;
}

.gallery-columns-10 .gallery-item img {
	width: 84%;
}
.magnine_post2 {
    margin-right: 6%;
    width: 47%;
}
.magnine_post3 {
	width:47%;
	margin-right:0;
}
.magnine_post5 {
	width:31%;
	margin-right:3%;
	margin-left:0;
}
.magnine_post7 {
	width:31%;
	margin-right:0;
	margin-left:0;	
}
.magnine_cat_post{
	width:30%;
	margin:0 0 0 2.5%;
}
}

/* ======================================================================================== */
/* styles for 901px - 1200px */
@media screen 
and (min-width : 901px) {

#header_social {
	width:800px;	
	padding:10px 0;
	margin:0 auto;
	overflow:auto;
}
.header_rss {
	float:right;
	overflow:auto;	
}
.header_rss p{
	float:right;
	margin:5px 5px 0 0;	
}
.header_search_cont {
	float:right;
	width:300px;
	margin:0 7px;
}

.header_search_cont fieldset{
	float:left;
	width:300px;
	padding: 0;
	margin:0;
}

.header_search_cont .searchtext{
	float:left;
	width:237px;
	padding:10px 0;
	margin:0;
}

.header_search_cont .text{
	float:left;
	font-size:13px;
	margin:0 0 0 10px;
	width:210px;
	
}

.header_search_cont .searchsub{
	float:left;
	width:30px;
	padding:2px 10px;
	margin:7px 5px;
}


.header_search_cont .submit{
	float:left;
	font:14px/14px 'TitilliumText22LRegular', Georgia, "Times New Roman", Times, serif;
	text-transform:uppercase;
	padding:10%;
}




.header_social_icons {
	float:right;
}

#wrapper_three{ margin:0 auto; max-width:1042px; overflow: auto; padding:0;}

#header_ad {
	width:50%;
	display:block;
}

.mag_category_column_vertical{
	width:48%;
	margin:0 0 4% 4%;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}
.mag_category_column_vertical_odd{
	clear:both;
	width:48%;
	margin:0 0 4% 0;
	padding:0;
	min-height:200px;
	float:left;
	overflow:auto;
	vertical-align: top;
}

.mag_category_column_firstpost{
	width:48%;
	float:left;	
	margin:0 0 0 2%;	
}

.mag_category_column_secondpost{
	width:48%;
	float:left;
	padding:10px 0;	
	margin:0 0 0 2%;
}

.mag_two_post {
	float:left;
	width:44%;
	margin:0 0 5% 4%;
		
}

.mag_two_post_odd {
	clear:both;
	width:44%;
	margin:0 0 5% 4%;
	float:left;
		
}

.mag_post_excerpt_img {
	float:left;
	width:45%;
	margin:2% 5% 2% 0;
	overflow:auto;
}

.mag_post_excerpt_p {
	float:left;
	text-align:left;
}

.single_np_prev {
	float:left;
	width:45%;
	min-height:74px;
	margin:0 0 0 5%;
}

.single_np_next {
	float:right;
	width:45%;
	min-height:74px;
	margin:0 5% 0 0;
}

.related_post_image {
	float:left;
	width:40%;
	margin:0 2% 0 0;
}

.bookmark_button_facebook {
	display:block;
}

.wrimg {
	float:left;
	width:30%;
	margin:0 0 0 70px;
	display:none;
}
			
.wrtext {
	float:left;
	width:50%;
	margin:0 0 0 50px;
}	
.wrsubtext {
	display:block;
}
.wrsubtextmore {
	display:block;
}
.wrsubtexth2 h2{
	text-align:left;
	font-size:36px;
	line-height:36px;
}

.carousel-tabs { text-align:left;}

.wrvid h2{
	font-size:24px;				
}
.wrvid {
	width:80%;
	margin:0 auto;
}

.Raptor_prev_img_attch {
	width:50%;
	float:left;
	text-align:center;
}

#sidebarads{
	width:270px;
	overflow:auto;
	padding:0;
	margin:0 auto 6% auto;
}

.sidebar_ad{
	float:left;
	width:125px;
	margin:5px;
}

#sidebarads_250{
	width:94.117647058823529412%;
	overflow:auto;
	margin:0 auto 3% auto;
}

.sidebar_ad_250{
	float:left;
	width:93.75%;
	margin:0 0 3.125% 3.125%;
	text-align:center;
}
.fourohsearch {
	width:40%;
	margin:0 auto;
}
.gallery {
	margin: 0 auto 20px auto;
}

dl.gallery-item {
	margin: 0;
}

.gallery-item a {
	width: 90%;
	display: block;
}

.gallery-caption {
	width: 90%;
	margin: 0 0 10px 0;
	font-size: 12px;	
	font-style: italic;
}

.gallery-caption a {
	display: inline;
}

.gallery a img {
}

dl.gallery-item img {
	padding: 5px;
	margin-bottom: 10px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	height: auto;
}

.gallery br+br {
	display:none;
}

.gallery .gallery-item {
	float: left; 
	text-align: center; 
	margin-bottom: 10px;
}

.gallery-columns-1 .gallery-item {
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	width: 50%;
}

.gallery-columns-3 .gallery-item {
	width: 33%;
}

.gallery-columns-4 .gallery-item {
	width: 20%;
	margin:0 1% 0 0;
}
.gallery-columns-4 .gallery-item img {
	width: 80%;
}
.gallery-columns-5 .gallery-item {
	width: 15%;
	margin:0 1% 0 0;	
}
.gallery-columns-5 .gallery-item img {
	width: 80%;
}
.gallery-columns-6 .gallery-item {
	width: 15%;
	margin:0 1% 0 0;		
}
.gallery-columns-6 .gallery-item img {
	width: 80%;
}
.gallery-columns-7 .gallery-item {
	width: 14%;
}

.gallery-columns-7 .gallery-item img {
	width: 90%;
}

.gallery-columns-8 .gallery-item {
	width: 12%;
}

.gallery-columns-8 .gallery-item img {
	width: 88%;
}

.gallery-columns-9 .gallery-item {
	width: 11%;
}

.gallery-columns-9 .gallery-item img {
	width: 86%;
}

.gallery-columns-10 .gallery-item {
	width: 10%;
}

.gallery-columns-10 .gallery-item img {
	width: 84%;
}

#footer_section {

}
.magnine_post2 {
	width:47%;
	margin-right:6%;
}
.magnine_post3 {
	width:47%;
	margin-right:0;
}
.magnine_post5 {
	width:31%;
	margin-right:3%;
	margin-left:0;
}
.magnine_post7 {
	width:31%;
	margin-right:0;
	margin-left:0;	
}
.magnine_cat_post{
	width:30%;
	margin:0 0 0 2.5%;
}
}

.page-id-2 article { max-width: 100% !important; }

/* ---------------- gallery JSON ---------------- */
div#gallery-json{display:none}

div.categories,div.filter,div.products{text-align:left;border:none;padding:0;margin:0px 0px 20px 0px}
div.categories h2,div.filter h2,div.products h2{color:#3277a6;margin:0px}
div.categories>ul{display:block;list-style-type:none;margin:0;padding:0}
div.categories>ul li{position:relative;font-family:NotesEsaBold, 'AurulentSansRegular', Georgia, "Times New Roman", Times, serif;font-size:1.3em;font-weight:normal;cursor:default;display:inline-block;list-style-type:none;margin:2px 8px 2px 0px;padding:2px 8px;border:1px solid #dedede;border-radius:8px 0px 8px 0px;color:#3277a6}
div.categories>ul li.selected{background-color:#3277a6;border-color:#3277a6;color:white}
div.categories>ul li:not(.selected):hover{cursor:pointer;background-color:#e9eff7;border-color:#acc1d0;color:#0098db}
div.categories>ul li span:last-child{display:none;color:#636363}
div.categories>ul li.selected span:last-child{color:#abddff}
div.categories>ul.linefeed li{display:block;border:none;border-radius:0}
div.categories>ul.linefeed li span:last-child{display:inline-block}

div.filter fieldset{width:98% !important;margin:0}
div.filter .seach_section{margin:0}
div.filter .seach_section .text{margin:0 0 0 1%}

div.products{border:solid #e9eff7;border-width:0 1px 0 1px;border-radius:10px 0 0 0;padding-bottom:5px;margin-bottom:0}
div.products h2{width:100%;position:relative;background-color:#e9eff7;margin-bottom:8px;border-radius:10px 0 0 0}
div.products h2>span{font-size:18px}
div.products h2>span.text{margin-left:10px}
div.products h2>span.title{color:#0098db}
div.products>ul{display:block;list-style-type:none;margin:0;padding:0;text-align:center;min-height:20px}
div.products>ul.hidden{display:none}
div.products>ul li{display:inline-block;list-style-type:none;width:31%;margin:0px 0.4% 7px 0.4%;background-color:#e9eff7;border:1px solid #c4cedc;text-align:left;position:relative;vertical-align:top;overflow:hidden}
div.products>ul.columns1 li{width:98%}
div.products>ul.columns2 li{width:48%}
div.products>ul.columns3 li{width:31%}
div.products>ul.columns4 li{width:23%}
div.products>ul li.hidden{display:none}
div.products>ul li       a{text-decoration:none;color:black;font-family:verdana,arial;font-size:11px;cursor:pointer;display:block}
div.products>ul li       a img{width:100%;height:120px;border-bottom:1px solid #c4cedc;background-color:white;border-radius:0 0 0 30px}
div.products>ul li       a span{display:block;margin:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
div.products>ul li       a span.date{color:#3277a6}
div.products>ul li       a span.title{font-weight:700}
div.products>ul li a:hover span.title{color:#005d9c}
div.products>ul li       a span.details{color:#909090;white-space:normal;text-align:justify;line-height:1.1em}
div.products>ul li       a span:last-of-type{position:absolute;left:0px;top:0px;display:block;width:100%;height:120px;margin:0px;background:transparent url("http://step.esa.int/main/wp-content/uploads/2016/10/fl_bg_400.png") center no-repeat;opacity:0;color:transparent;transition:opacity 500ms;border-radius:0 0 0 30px;border-bottom:2px solid #0098db}
div.products>ul li a:hover span:last-of-type{opacity:1}
div.products>ul li       a img.document{width:64px;height:64px;margin:10px;border-bottom-left-radius:10px}
div.products>ul li       a img.document~span.title{position:absolute;top:5px;left:80px}
div.products>ul li       a img.document~span.title,
div.products>ul.columns3 li a span.title,
div.products>ul.columns4 li a span.title{white-space:normal;line-height:1.7em;max-height:3.4em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
div.products>ul li       a img.document~span.date{position:absolute;top:43px;left:80px}
div.products>ul li       a img.document~span:last-of-type{height:84px}
div.products>ul li a:hover img.document~span:last-of-type{opacity:0.5}
div.products h2 ul{font:12px Arial, Helvetica, sans-serif;position:absolute;top:2px;right:1px;color:#3277a6;width:170px;z-index:1;font-size:12px;margin:0;padding:0}
div.products h2 ul.sort li{list-style:none;list-style-type:none;cursor:pointer;padding:3px 10px;line-height:1.5em;background-color:#e9eff7}
div.products h2 ul.sort li span:last-child{float:right}
div.products h2 ul.sort ul{position:relative;top:0px;font-size:11px;border:1px solid #d6d7d3;background-color:white}
div.products h2 ul.sort ul li:hover{color:white;background-color:#3277a6}

div.products>ul.admin li a{margin-bottom:60px}
div.products>ul.admin li div{border-top:1px solid #dedede;width:100%;background-color:white;height:30px;position:absolute;bottom:0;padding-top:10px}
div.products>ul.admin li div form *{cursor:pointer;font-weight:700;color:#3277a6}
div.products>ul.admin li div label{font-size:1em;font-family:Arial}
div.products>ul.admin li div input[type="submit"]{background:transparent url(../raptor/css/images/edit.png) 100% 0% no-repeat;border:none;cursor:pointer;float:right;padding-right:25px;margin-right:5px;height:24px}
div.products>ul.admin li div input:hover{color:red;cursor:pointer}

div.products>ul.admin li.disabled{border-color:#999999;background-color:#eeeeee}
div.products>ul.admin li.disabled a{opacity:0.5}
div.products>ul.admin li.disabled a *,
div.products>ul.admin li.disabled:hover a *{color:gray}
div.products>ul.admin li.disabled a span:last-of-type{border-color:gray}
div.products>ul.admin li.disabled a img{
	filter: gray; /* IE */
    -webkit-filter: grayscale(1); /* Old WebKit */
    -webkit-filter: grayscale(100%); /* New WebKit */
    filter: url(resources.svg#desaturate); /* older Firefox */
    filter: grayscale(100%); /* Current draft standard */
}


/* ======================================================================================== */
@media screen and (min-width :200px) and (max-width :700px){
	div.categories span{font-size:14px}
	div.products h2>span{font-size:14px}
	div.products h2>span.toggle{font-size:18px}
	div.products h2>span.text{display:none}
	div.products h2>span.title{margin-left:10px}
	div.products>ul li{margin:0px 0.05% 7px 0.05%}
	div.products>ul li a img,div.products>ul li a span:last-of-type{height:84px}
	div.products>ul li a img.document~span.title{position:relative;top:0px;left:0px;display:block;white-space:nowrap}
	div.products>ul li a img.document~span.date{position:relative;top:0px;left:0px}
	div.products h2 ul{width:120px}
	div.products h2 ul.sort>li span:first-child{display:none}
}
@media screen and (min-width : 200px) and (max-width : 399px){
	div.categories>ul.linefeed li span:last-child{display:none}
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}

/* ---------------- gallery-paging ---------------- */
.gallery-paging{font:12px Arial, Helvetica, sans-serif;display:inline-block;position:relative;zoom:1;*display:inline;width:100%;color:#3277a6;background-color:#e9eff7}
.gallery-paging label.rows_per_page{float:left;margin:2px 0 0 10px;font-weight:700}
.gallery-paging select.rows_per_page{width:40px;border:1px solid #bdcbbd;padding:0;margin-left:5px;font-weight:400}
.gallery-paging ul.pages{list-style:none;margin:0;padding:0;white-space:nowrap;float:right}
.gallery-paging ul.pages li{float:left;padding:0px;cursor:pointer;margin:0 0 0 2px;list-style:none;line-height:1em}
.gallery-paging ul.pages li a{display:inline-block;text-align:center;text-decoration:none;margin:0;padding:5px 7px}
.gallery-paging ul.pages li a span{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.gallery-paging ul.pages li a:hover{color:#0098db}
.gallery-paging ul.pages li.current a,
.gallery-paging ul.pages li.current a:hover{color:white;background-color:#3277a6;cursor:default;font-weight:700;font-size:13px;border-radius:5px 0 5px 0}
.gallery-paging ul.pages li.dotdotdot a{padding-left:2px;padding-right:2px;font-weight:700}
.gallery-paging ul.pages li.prev a{width:15px;border-radius:8px 0 0 0;margin-left:10px}
.gallery-paging ul.pages li.next a{width:15px;border-radius:0 0 8px 0}
.gallery-paging ul.pages li.prev a:hover,
.gallery-paging ul.pages li.next a:hover{background-color:#3277a6;color:white}
.gallery-paging ul.pages li.prev a.disabled,
.gallery-paging ul.pages li.next a.disabled{color:#a2a2a2;cursor:default;background:none}
.gallery-paging div.gotobox{display:block;width:142px;border:1px solid #acc1d0;z-index:99;margin:0;padding:0 0 5px 4px;position:absolute;top:38px;border-radius:4px;background-color:white}
.gallery-paging div.gotobox div.text{padding:0;float:left;margin:2px 3px}
.gallery-paging div.gotobox a.smbutton-go{display:inline-block;margin:0 3px 0 0 !important;padding:2px 8px !important;border-radius:0 5px 5px 0;text-decoration:none;background-color:#e2e8f1;border:1px solid #93a1b5}
.gallery-paging div.gotobox a.smbutton-go:hover{color:#005695}
.gallery-paging div.gotobox input[type="text"]{display:block;float:left;margin:0;letter-spacing:-0.25px;border:1px solid #93a1b5;border-right-width:0;padding:2px 4px;background:white;border-radius:3px 0 0 3px;width:22px;vertical-align:top}
.gallery-paging div.gotobox div.uparrow{height:5px;position:relative;display:block;float:left;top:-13px;width:100%;margin:0;text-align:center;color:#acc1d0;font-size:14px;}
.gallery-paging div.hidden{display:none}
/* ---------------- END gallery-paging ---------------- */

/* ---------------- Manage tutorials ---------------- */
#tutorial {width: 100%;text-align:center;position:relative}
#tutorial form{text-align:center}
#tutorial h2{color:#3277a6}
#tutorial .form-group{margin-bottom:10px;text-align:left}
#tutorial .form-group .control-label{display:inline-block;width: 20%;text-align:left;font-weight:700;color:#0f326d;vertical-align:top}
#tutorial .form-group.required .control-label::after{color:red;content:"*"}
#tutorial .form-group .form-control{display:inline-block;width:70%;border:1px solid gray;color:black}
#tutorial .form-group select.form-control {width:72%}
#tutorial .form-group input.form-control:read-only{background-color:#e6e6e6;}
#tutorial input.submit{font-weight:700;font-size:1.3em;margin:2px 8px 2px 0px;padding:6px 28px;border:1px solid #dedede;border-radius:8px 0px 8px 0px;color:#3277a6;background:transparent}
#tutorial input.submit:hover{cursor:pointer;background-color:#e9eff7;border-color:#acc1d0;color:#0098db}
#tutorial input[name="cancel"]:hover{color:red}
#tutorial .error{display:block;margin-left:21%;color:red}

#tutorial div.icon{background-repeat:no-repeat;background-position:92% 0;height:50px;width:100%}
#tutorial div.icon.add{background-image: url(../raptor/css/images/add-large.png)}
#tutorial div.icon.edit{background-image: url(../raptor/css/images/edit-large.png)}
#tutorial div.icon.enable{background-image: url(../raptor/css/images/activate-large.png)}
#tutorial div.icon.disable{background-image: url(../raptor/css/images/deactivate-large.png)}
#tutorial div.icon.remove{background-image: url(../raptor/css/images/delete-large.png)}

#tutorial.admin #cmd{text-align:right}
#tutorial.admin #cmd label{cursor:pointer;float:left;font-size:1em;font-weight:700;color:#3277b7}
#tutorial.admin #cmd label *{cursor:pointer}
#tutorial.admin #cmd input.submit{border:1px solid transparent;border-radius:5px;width:25px;height:25px;padding:0;margin:0 0 0 2%;background-position:50% 50%;background-repeat:no-repeat}
#tutorial.admin #cmd input.submit[name="enable"] {background-image:url(../raptor/css/images/activate.png)}
#tutorial.admin #cmd input.submit[name="disable"]{background-image:url(../raptor/css/images/deactivate.png)}
#tutorial.admin #cmd input.submit[name="remove"] {background-image:url(../raptor/css/images/delete.png)}
#tutorial.admin #cmd input.submit[name="add"]    {background-image:url(../raptor/css/images/add.png)}
#tutorial.admin #cmd input.submit:disabled{opacity:0.3;background-color:transparent;cursor:default}
#tutorial.admin #cmd input.submit[name="enable"]:disabled {background-image:url(../raptor/css/images/activate-disabled.png)}
#tutorial.admin #cmd input.submit[name="disable"]:disabled{background-image:url(../raptor/css/images/deactivate-disabled.png)}
#tutorial.admin #cmd input.submit[name="remove"]:disabled {background-image:url(../raptor/css/images/delete-disabled.png)}
#tutorial.admin #cmd input.submit:enabled:hover{border:1px solid #e9eff7;background-color:transparent;border-color:#dedede}

#tutorial table{border:0;border-top:1px solid #dedede}
#tutorial table tr td{color:#3277a6;border:0;vertical-align:top;padding-bottom:5px;border-bottom:1px solid #dedede}
#tutorial table tr td img{width:72px;height:32px}
#tutorial table tr td:first-child{width:90px}
#tutorial table tr td:last-child{text-align:left}
/* ---------------- END Manage tutorials ---------------- */