/*
/////// STYLE FOR ARTICLES 
///////////////////////////////////////////////////////////////////////////////////////////////////////*/
#article{ width:100%; margin:auto; text-align:center; overflow:hidden; }

#article-articlelist{ float:left; padding: 20px; width: 865px; min-height:700px; background:#FFF; font-size:15px; text-align:left; }
#article-articlelist a{ text-decoration:none; }
#article-articlelist-item{ display: block; float: left; padding-bottom:20px; margin-bottom:20px; width:100%; text-align:left; vertical-align:middle; border-bottom:1px solid rgba(0,0,0,0.1); }
#article-articlelist-item a{ display: block; text-decoration:none; }
#article-articlelist-item h1{ -moz-transition: color 0.4s; -webkit-transition: color 0.4s; -ms-transition: color 0.4s; -o-transition: color 0.4s; transition: color 0.4s; }
#article-articlelist-item:hover h1{ color: #2b89bf; }
.article-articlelist-item-image{ display: inline-block; float: left; width: 240px; height:160px; background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.article-articlelist-item-info{ display: inline-block; float: right; width:600px; margin-left:20px; }
.article-articlelist-item-info-large{ width:840px; }
.article-articlelist-item-info h1{ font-size:22px; font-weight:800; color:rgba(0,0,0,0.8); text-align:left; margin-bottom: 5px; text-decoration:none; }
.article-articlelist-item-info h2{ display:inline-block; line-height: 15px; margin-bottom: 5px; text-transform: uppercase; font-size:16px; font-weight:400; color:#4BD2E9; text-align:left }
.article-articlelist-item-info p{  }
.article-articlelist-item-info span{ font-size:16px; color:rgba(0,0,0,0.6); }
.article-articlelist-item-info a{ text-decoration:none; }


#article-categorymenu{ float:right; width: 275px; background-color:#fff; text-align:left; font-size: 14px; border-bottom:1px solid rgba(0, 0, 0, 0.09); margin-bottom:15px; }
#article-categorymenu h1{ width: 100%; line-height: 35px; padding-left:20px; color:#fff; font-weight:600; background-color:#4BD2E9; text-align:left; font-size: 16px; border-bottom:3px solid rgba(0, 0, 0, 0.05);}
#article-categorymenu a{ display: block; padding: 0; text-decoration:none; }
#article-categorymenu ul{ padding: 0; list-style: none; width:100%; }
#article-categorymenu li{ padding-left:30px; padding-right:20px; border-bottom:1px solid rgba(0,0,0,0.06); line-height: 28px; width:inherit; }
#article-categorymenu li:hover{ background: url('images/arrow_horizontal_menu.png') no-repeat 0px -3px, #4BD2E9; color:#FFF; width: inherit; }
#article-categorymenu-selected{ background: url('images/arrow_horizontal_menu.png') no-repeat 0px -3px, #4BD2E9; color:#FFF; width: inherit; }

#article-displayarticle{ float:left; padding: 25px; width: 855px; min-height: 1100px; background:#FFF; font-size:15px; text-align:left; }
.article-displayarticle-header{ display: block; width: 100%; margin-bottom:20px; }
.article-displayarticle-header h1{ font-size:28px; color:rgba(0,0,0,0.8); text-align:left; font-weight:800; margin-top: 10px; margin-bottom: 5px; }
.article-displayarticle-header h2{ display:inline-block; line-height: 16px; margin-bottom: 5px; text-transform: uppercase; font-size:16px; font-weight:400; color:#4BD2E9; text-align:left }
.article-displayarticle-header p{ font-size:16px; font-weight:400; }
.article-displayarticle-header span{ font-size:16px; color:rgba(0,0,0,0.6); }
.article-displayarticle-header hr{ border:0; border-bottom: 1px solid rgba(0,0,0,0.1); }
.article-displayarticle-image{ display: block; margin:auto; padding: 0; text-align: center; width: 100%; height:420px; background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.article-displayarticle-content{ display: block; margin-top:40px; padding-left: 40px; padding-right: 40px; }
.article-displayarticle-content h1{ text-align:left; color:rgba(0,0,0,0.8); font-size:21px; margin-top: 10px; margin-bottom: 10px; }
.article-displayarticle-content h2{ text-align:left; color:rgba(0,0,0,0.7); font-size:19px; margin-top: 10px; margin-bottom: 10px; }
.article-displayarticle-content h3{ text-align:left; color:rgba(0,0,0,0.6); font-size:17px; margin-top: 10px; margin-bottom: 10px; }
.article-displayarticle-content p{ /* line-height: 20px; */ font-size: 15px; margin: 0px; }
.article-displayarticle-content span{ text-align:right; }
.article-displayarticle-content a{ color:#2b89bf; margin-top:-4px; }
.article-displayarticle-content hr{ border:0; border-bottom: 1px solid rgba(0,0,0,0.08); }
.article-displayarticle-content table,th,tr,td{ border:none; }
.article-displayarticle-content img{ max-width: 650px; height: auto; width: auto\9; /* ie8 */ }
.article-displayarticle-footer{ display: block; margin-top:20px; padding-top: 10px; padding-left: 40px; padding-right: 40px; border-top:1px solid rgba(0,0,0,0.1); font-size:13px; }
.article-displayarticle-footer table{ float:left; width:100%; border:0; }
.article-displayarticle-footer img{ width:20px; border:0; padding:5px; vertical-align:middle; }
.article-displayarticle-footer img:hover{ background:rgba(0,0,0,0.1); }

#article-inthiscategory{ float:right; width: 275px; text-align:left; font-size: 14px; }
#article-inthiscategory a{ text-decoration: none; }
#article-inthiscategory h1{ padding-left:20px; line-height: 35px; color:#fff; background:#4BD2E9; font-weight:600; text-align:left; font-size: 16px; border-bottom:3px solid rgba(0, 0, 0, 0.05); }
#article-inthiscategory-item{ margin-bottom:15px; width: 275px; background-color:#FFF; }
#article-inthiscategory-item h1{ position:relative; padding-left:0px; padding-right:15px; margin-bottom:5px; line-height: 25px; color:#333; background:#fff; text-align:left; font-size: 18px; font-weight: 800;  border:none; -moz-transition: color 0.4s; -webkit-transition: color 0.4s; -ms-transition: color 0.4s; -o-transition: color 0.4s; transition: color 0.4s; }
#article-inthiscategory-item:hover h1{ color: #2b89bf; }
.article-inthiscategory-item-image{ display: block; margin:auto; padding: 0; margin-bottom:10px; text-align: center; height:160px; background: no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.article-inthiscategory-item-info{ display:block; padding-left:15px; }
.article-inthiscategory-item-info h2{ display:inline-block; line-height: 15px; margin-bottom: -5px; text-transform: uppercase; font-size:14px; font-weight:400; color:#4BD2E9; text-align:left }
.article-inthiscategory-item-info span{ font-size:14px; color:rgba(0,0,0,0.6); }
.article-inthiscategory-item-info p{ padding-bottom:15px; padding-right:20px; font-size:14px; }

/* #article-searcharticle{ float:right; width: 275px; background-color:#fff; text-align:left; font-size: 14px; border-bottom:1px solid rgba(0, 0, 0, 0.09); }
#article-searcharticle h1{ width: 100%; line-height: 35px; padding-left:20px; color:#fff; font-weight:600; background:#4BD2E9; text-align:left; font-size: 16px; border-bottom:3px solid rgba(0, 0, 0, 0.05); }
#article-searcharticle form{ width:275px; background-color:#fff; }
#article-searcharticle input[type=text]{ display:inline-block; vertical-align:middle; background-color: #fff; width:190px; height: 22px; color:#000; border: 1px solid rgba(0,0,0,0.2); padding-left:10px; padding-right:35px; }
#article-searcharticle input:focus{ background-color: rgba(0,0,0,0.1); }
#article-searcharticle input[type=image]{ position:absolute; vertical-align:middle; background:transparent; width:20px; margin: 2px 0px 0px -35px; border:0; border-left: 1px solid rgba(0,0,0,0.6); filter: alpha(opacity=50); opacity : 0.5; padding-left:6px; } */



/* THIS STYLES ARE DEDICATED TO ADMINISTRATION PAGES
///////////////////////////////////////////////////////////////////////////////////////////////////////*/
#admin{ width:100%; margin:auto; text-align:center; min-height:700px; background:rgba(255,255,255,1); }
#admin h1,h2,h3{ color:rgba(51,51,51,1); padding-top:15px; }
#admin form{ text-align:left; }

/* HORIZONTAL MENUS */
#admin-horizontalmenu{ display:block; position:inherit; margin:auto; max-width: 444px; height: 35px; margin-bottom:15px; margin-top:25px; padding-left:45px; color:#000; background:url("icons/menu.png"), #CCC; background-position:10px 5px; background-repeat:no-repeat; background-size:25px; }
#admin-horizontalmenu ul{ padding: 0; list-style: none; text-align : center; }
#admin-horizontalmenu a{ display: block; padding: 0; text-decoration:none; color:inherit; }
#admin-horizontalmenu li{ line-height: 35px; float: left; width: 148px; background: #CCC; -moz-transition: background 0.4s; -webkit-transition: background 0.4s; -ms-transition: background 0.4s; -o-transition: background 0.4s; transition: background 0.4s; }
#admin-horizontalmenu li:hover{ background: rgba(102,102,102,1); border-top: 3px solid rgba(0,0,0,1); color:#FFF; margin-top:-3px; }
#admin-horizontalmenu li ul { position: absolute; width: 148px; left: -999em; border: none; color:rgba(0,0,0,1); border-bottom: 1px solid grey; }
#admin-horizontalmenu li ul li{ border: none; }
#admin-horizontalmenu li ul li:hover{ background:rgba(102,102,102,1); border: none;	margin: 0; }
#admin-horizontalmenu li:hover ul, .admVertMenu li.sfhover ul{ left: auto; min-height: 0; }


#admin-tablelist table{ margin:auto; margin-top:25px; margin-bottom:15px; border:none; border-collapse:collapse; }
#admin-tablelist th{ font-style:normal; font-weight: 300; text-align:left; color:#FFFFFF; background: rgba(102,102,102,1); height:35px; padding-left:5px; }
#admin-tablelist tr:nth-child(odd){ background: rgba(102,102,102,0.2); border-bottom:solid thin #CCC; border-top:solid thin #CCC; }
#admin-tablelist tr{ border-bottom:solid thin #CCC; border-top:solid thin #CCC; text-align:left; }
#admin-tablelist td{ padding-left:5px; }
#admin-tablelist tr:hover{ background: rgba(102,102,102,0.6); color:#333; }
#admin-tablelist img{ filter : alpha(opacity=80); opacity : 0.8; }


/* CLASSES USED FOR THE DROPDOWN IMAGES LIST*/
#admin-image-dropdown {
    /*style the "box" in its minimzed state*/
    border:1px solid grey; width:260px; height:160px; overflow:hidden;
	border-radius:2px;
    /*animate collapsing the dropdown from open to closed state (v. fast)*/
    -moz-transition: height 0.1s; 
    -webkit-transition: height 0.1s; 
    -ms-transition: height 0.1s;  
    -o-transition: height 0.1s;  
    transition: height 0.1s;
}
#admin-image-dropdown:hover {
    /*when expanded, the dropdown will get native means of scrolling*/
    height:160px; overflow-y:scroll;
}
#admin-image-dropdown input {
    /*hide the nasty default radio buttons. like, completely!*/
    position:absolute;top:0;left:0;opacity:0;
}

#admin-image-dropdown label {
    /*style the labels to look like dropdown options, kinda*/
    display:none; margin:2px; opacity:0.6; width:250px; height: 150px;
	background-position:center;
	background-size:contain;
	background-repeat:no-repeat;
    /*setting correct backgrounds - add additional rules with selectors based on "for" attribute, something like label[for=line2]{background-image:...}*/
}

#admin-image-dropdown:hover label{
    /*this is how labels render in the "expanded" state. we want to see only the selected radio button in the collapsed menu, and all of them when expanded*/
    display:block;
}
#admin-image-dropdown label:hover {
    opacity:0.9;
}
#admin-image-dropdown input:checked + label {
    /*tricky! labels immediately following a checked radio button (with our markup they are semantically related) should be fully opaque regardless of hover, and they should always be visible (i.e. even in the collapsed menu*/
    opacity:1 !important; display:block;
}


/* THIS STYLES ARE DEDICATED TO MOBILE SCREENS */
@media screen and (max-width : 1250px){
	#article-articlelist{ width:680px; }
	#article-articlelist-item{ width:680px; }
	.article-articlelist-item-image{  }
	.article-articlelist-item-info{ width:420px; }
	.article-articlelist-item-info-large{ width:680px; }
	
	#article-categorymenu{ width: 220px; }
	
	#article-displayarticle{ padding: 25px; width: 670px; min-height: 1100px; }
	.article-displayarticle-image{ width: 670px; height:360px; }
	.article-displayarticle-content img{ max-width: 580px; height: auto; width: auto\9; /* ie8 */ }
	
	#article-inthiscategory{ width: 220px; }
	#article-inthiscategory-item{ width: 220px; }
	.article-inthiscategory-item-image{ height:130px; }
}

@media screen and (max-width : 1140px){
	#article-articlelist{ width:800px; padding:15px; margin-bottom:15px; }
	#article-articlelist-item{ width:765px; }
	.article-articlelist-item-image{  }
	.article-articlelist-item-info{ width:490px; padding-right:15px; }
	.article-articlelist-item-info-large{ width:745px; }
	
	
	#article-categorymenu{ width: 800px; padding: 0; }
	#article-categorymenu h1{ display:none; }
	#article-categorymenu ul{ padding: 0px 2px 0px 2px; margin:0; list-style: none; line-height: 28px; width:100%; }
	#article-categorymenu li{ display:inline-block; float: left; margin:2px 0px 2px 0px; padding:0px 10px 0px 10px; border:none; border-right:1px solid rgba(0,0,0,0.06); }
	#article-categorymenu li:hover{ background: #4BD2E9; color:#FFF; }
	#article-categorymenu-selected{ background: #4BD2E9; color:#FFF; }
	
	#article-displayarticle{ padding: 20px; width: 800px; min-height: 1100px; margin-bottom:15px; }
	.article-displayarticle-header{ width: 755px; }
	.article-displayarticle-image{ width: 755px; padding: 0; margin: 0; }
	.article-displayarticle-content{ width: 680px; }
	.article-displayarticle-content img{ max-width: 580px; height: auto; width: auto\9; /* ie8 */ }
	.article-displayarticle-footer{ width: 680px; }
	
	#article-inthiscategory{ display: inline; float:left; width: 800px; text-align:left; margin-bottom:20px; }
	#article-inthiscategory-item{ display: inline-block; vertical-align:top; width: 396px; height:340px; margin:0px 2px 0px 2px; }
	#article-inthiscategory-item p{ display: none; }
	.article-inthiscategory-item-image{ height:220px; }
	
	#admin form{ width:90%; }
}

@media screen and (max-width : 980px){
	#article-articlelist{ width:650px; padding:15px; margin-bottom:15px; }
	#article-articlelist-item{ width:620px; }
	.article-articlelist-item-image{  }
	.article-articlelist-item-info{ width:340px; }
	.article-articlelist-item-info-large{ width:600px; }
	
	#article-categorymenu{ width: 650px; padding: 0; }
	#article-categorymenu h1{ display:none; }
	#article-categorymenu ul{ padding: 0px 2px 0px 2px; margin:0; list-style: none; line-height: 28px; width:100%; }
	#article-categorymenu li{ display:inline-block; float: left; margin:2px 0px 2px 0px; padding:0px 10px 0px 10px; border:none; border-right:1px solid rgba(0,0,0,0.06); }
	#article-categorymenu li:hover{ background: #4BD2E9; color:#FFF; }
	#article-categorymenu-selected{ background: #4BD2E9; color:#FFF; }
	
	#article-displayarticle{ padding: 20px; width: 640px; min-height: 1100px; margin-bottom:15px; }
	.article-displayarticle-header{ width: 610px; }
	.article-displayarticle-image{ width: 610px; height:340px; padding: 0; margin: 0; }
	.article-displayarticle-content{ width: 530px; }
	.article-displayarticle-content img{ max-width: 500px; height: auto; width: auto\9; /* ie8 */ }
	.article-displayarticle-footer{ width: 530px; }
	
	#article-inthiscategory{ display: inline; float:left; width: 650px; text-align:left; margin-bottom:20px; }
	#article-inthiscategory-item{ display: inline-block; vertical-align:top; width: 321px; height:300px; margin:0px 2px 0px 2px; }
	#article-inthiscategory-item p{ display: none; }
	.article-inthiscategory-item-image{ height:180px; }
	
	#admin form{ width:80% !important; }
}

@media screen and (max-width : 800px){
	#article-articlelist{ width:480px; padding:15px; margin-bottom:15px; }
	#article-articlelist-item{ width:450px; }
	.article-articlelist-item-image{ width:450px; height:240px; margin-bottom:15px; }
	.article-articlelist-item-info{ width:425px; }
	.article-articlelist-item-info-large{ width:420px; }
	
	#article-categorymenu{ width: 480px; padding: 0; }
	
	#article-displayarticle{ padding: 20px; width: 480px; min-height: 800px; margin-bottom:15px; }
	.article-displayarticle-header{ width: 440px; }
	.article-displayarticle-image{ width: 440px; height:250px; padding: 0; margin: 0; }
	.article-displayarticle-content{ padding: 0px 15px 0px 15px; width: 400px; }
	.article-displayarticle-content img{ max-width: 340px; height: auto; width: auto\9; /* ie8 */ }
	.article-displayarticle-footer{ padding: 10px 10px 0px 10px; width: 400px; }
	
	#article-inthiscategory{ width: 480px; margin:0; padding:0; margin-bottom:10px; }
	#article-inthiscategory-item{ width: 480px; min-height:360px; margin:0; margin-bottom:15px; }
	#article-inthiscategory-item p{ display: none; }
	.article-inthiscategory-item-image{ height:240px; }
	.article-inthiscategory-item-info span{ min-height:340px; }
}

@media screen and (max-width : 700px){
	#article-articlelist{ width:380px; padding:15px; margin-bottom:15px; }
	#article-articlelist-item{ width:370px; }
	.article-articlelist-item-image{ width:370px; height:220px; margin-bottom:15px; }
	.article-articlelist-item-info{ width:345px; }
	.article-articlelist-item-info-large{ width:345px; }
	
	#article-categorymenu{ width: 400px; padding: 0; }
	
	#article-displayarticle{ padding: 20px; width: 400px; min-height: 800px; margin-bottom:15px; }
	.article-displayarticle-header{ width: 360px; }
	.article-displayarticle-header h1{ font-size:25px; }
	.article-displayarticle-image{ width: 360px; height:200px; padding: 0; margin: 0; }
	.article-displayarticle-content{ padding: 0px 15px 0px 15px; width: 330px; }
	.article-displayarticle-content img{ max-width: 320px; height: auto; width: auto\9; /* ie8 */ }
	.article-displayarticle-content h1{ font-size:20px; }
	.article-displayarticle-content h2{ font-size:18px; }
	.article-displayarticle-content h3{ font-size:16px; }
	.article-displayarticle-footer{ padding: 10px 0px 0px 0px; width: 360px; }
	
	#article-inthiscategory{ width: 400px; margin:0; padding:0; margin-bottom:10px; }
	#article-inthiscategory-item{ width: 400px; min-height:320px; margin:0; margin-bottom:15px; }
	#article-inthiscategory-item p{ display: none; }
	.article-inthiscategory-item-image{ height:200px; }
	.article-inthiscategory-item-info span{ min-height:340px; }
}