/*
Theme Name:     Dottoro Child
Theme URI:      http://themeeditor.dottoro.com/
Description:    Child theme for the Dottoro theme 
Author:         Dottoro
Author URI:     http://themeeditor.dottoro.com
Template:       dottoro
Version:        1.0
*/

/*
** Do not load the stylesheet of the Dottoro theme !!!
** It is loaded automatically by the theme. 
**
** @import url("../dottoro/style.css");
*/

/**custom**/

#body {min-height:100px;}


/**world wide rankings**/

.statsHeader {
   color: #d5ae2f;
   font-weight: bold;
   font-size: large;
}
.statsCollectionName {
   color: #d5ae2f;
   font-weight: bold;
}
.statsCollectionPercent {
   color: #d5ae2f;
   font-weight: bold;
   text-align: right;
}
.statsEncounterName {
   color: #c0c0c0;
}
.statsEncounterPercent {
   color: #c0c0c0;
}


/*******************************
*   Rounded thumbnail images   *
*******************************/

.round-img img, .round-img .dottoro_hoverelem_bg {
    border-radius: 100px;
}

.round-img .dottoro_hoverelem_content {
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
}

.round-img .image_anchor, .round-img a.image_anchor {
    border-radius: 100px;
    border: 0px !important;
    padding: 0px !important;
    box-shadow: none !important;
    background-color: transparent !important;
}


/*********************
*   Overlay styles   *
*********************/

.layer.banner {padding:10px;left:0;right:0;display:inline-block;position:relative;}
.layer.banner.black {background:#222;color:#fff !important;padding:10px;width:100%}
.layer.banner.black h2.post_title {margin:0 !Important;padding:0 !Important;}
.layer.banner.black a {color:#fff !important;}

.layer.banner_full {left:0; right:0; background:#222; bottom:0;}
.layer.banner_full > .title, .layer.banner_full > .desc {position: relative;}
.layer.banner_full > .title {background:#222; color:#fcff04 !Important; padding:7px 0 !Important;}
.layer.banner_full > .desc {color:#f9f9f9 !Important;}
.layer.banner_full .post_title {margin:0 !Important; padding:0 !Important;}

.post_title.light_title a {color:#eee !Important;}

/********************
*   Popup Windows   *
*********************/

.onload_popup_top {
	width: 300px;
}

.onload_popup_left {
	width: 300px;
	left: 0;
}

.scroll_popup {
	width: 200px;
	right: 0;
	bottom: 0;
}

.modal_popup_simple {
	width: 400px;
}

.modal_popup_accept {
	width: 490px;
}

.popup_leave {
	width: 300px;
}

.slider_popup {
	width: 500px;
}

.external_popup iframe {
	width: 600px;
	height: 400px;
}

/*******************************
*   Responsive Media Queries   *
*******************************/


/* When viewport width is not greater than 980px */
@media only screen and (max-width: 980px) {

		/* full width pages */
	.inner, #wrapper, #headers, #header_wrapper, #subheader_wrapper, #body_wrapper, #footer_wrapper, #footer_widget_wrapper, #footer_content_wrapper {
		min-width:100% !Important;max-width:100%;
	}

		/* fixed width (315px) sidebar, fluid content */
	#content_wrapper {width:100% !Important;}
	.left_sidebar #content_wrapper {margin-left:-315px !Important;}
	.left_sidebar #content {margin-left:315px;}

	.default_sidebar #content_wrapper {margin-right:-315px !Important;}
	.default_sidebar #content {margin-right:315px;}

	.right_sidebar #content_wrapper {margin-right:-315px !Important;}
	.right_sidebar #content {margin-right:315px;}

		/* allow some elements to be resized */
	video, object, iframe, embed, applet {max-width:100%;}
	img, canvas {height:auto; max-width:100%;}
	.image_anchor, .alignleft, .alignright, .aligncenter {max-width:100%;}
	.image_anchor {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}

	input, textarea {max-width:100%;}

		/* allow pre elements to wrap text */
	pre {white-space:pre-wrap;word-wrap:break-word;}

		/* smaller flicker images */
	.flickr_photos_widget img {width:58px !Important;height:36px !Important;}

		/* allow post thumbnails to be resized */
	.post_thumbnail {max-width:100%;}

		/* allow news slideshow to be resized */
	.recommended_slider, .recommended_slider_tabs {max-width:100% !Important; width: 100% !Important;}
}

/* smaller than iPad - 1024x768   */
@media only screen and (max-width: 767px) {
		/* hide sidebar, full width content */
	#content_wrapper {width:100% !Important;}
	#sidebar_wrapper {display:none !Important;}
	
		/* remove margins added above */
	.default_sidebar #content {margin-right:0px;}
	.right_sidebar #content {margin-right:0px;}
	.left_sidebar #content {margin-left:0px;}

		/* change multi-column layouts to single-column layouts
		   and add some margin to elements that go below each other */
		/* furthermore, do not change columns on pages with sidebar */
	.no_sidebar .col, #footer .col, #subheader .col, #header .col {
		width:100% !Important;
	}
	.no_sidebar .row > .col {margin-top:10px;}
	.no_sidebar .row > .col:first-child {margin-top:0;}
}

/* small screen sizes, no multi-column layout at all */
@media only screen and (max-width: 479px) {
		/* change multi-column layouts to single-column layouts
		   and add some margin to elements that go below each other */
	.col {
		width:100% !Important;
	}
	.row > .col {margin-top:10px;}
	.row > .col:first-child {margin-top:0;}
}

/***********
*   MENU   *
***********/

/* 
*  Move right aligned menu below the site logo, title and description.
*  If your your menu is left aligned or full width, you no need this.
*/
@media only screen and (max-width: 810px) {
	#header {height:130px !Important;} /* original header height: 90px + menu height: 40px */
	#nav {left:0 !Important; right:0 !Important; bottom:0 !Important; top:auto !Important} /* full width menu at the bottom */
}
/* Move the menu back to the right if compressed menu is used */
.compressed_menu #header {height:90px !Important;} /* set the header height back to its original value */
.compressed_menu #nav {left:auto !Important; right:0 !Important; width:auto !Important;} /* move the menu back to the right  */

/* Move right aligned compressed menu below the site logo, title and description on very small screen sizes */
@media only screen and (max-width: 310px) {
	.compressed_menu #header {height:130px !Important;} /* original header height: 90px + menu height: 40px */
	.compressed_menu #nav {right:37% !Important;} /* compressed menu position, right aligned because of the back button */
}

/* Submenu icons make multilevel compressed menu more usable
   If there are submenu icons in your menu design, you no need these lines
*/
.compressed_menu #nav .sub-menu li.folder > a .submenu_icon_after:after {content:'\f008' !Important;}
.compressed_menu #nav .sub-menu li.folder:hover > a .submenu_icon_after:after {content:'\f008' !Important;}


/**********************
*   Imagefolio page   *
**********************/

		/* allow the content to be resized on imagefolio pages */
@media only screen and (max-width: 840px) {
	.imagefolio_active_text {padding-left:0px !Important;padding-top:14px;}
	.imagefolio_active {float:none !Important;}
}


/*********************
*   News SlideShow   *
*********************/

/* Remove tab labels of news recommended slider on small screen sizes  */
@media only screen and (max-width: 479px) {
	.recommended_slider_tabs td {height:20px;}
	.recommended_slider_tabs td > a {display:none;}
} 


/*********************
*   2 cols widgets   *
*********************/

/* change 2-column layouts to single-column layouts */
@media only screen and (max-width: 320px) {
	.widget.two_cols li {float:none !Important;width:100% !Important;}
} 

/******************************
*   Post Lists - Grid Layout  *
*******************************/

/* 4 columns - pages without sidebar */

/* remove original row breaks */
@media only screen and (max-width: 770px) {
	.no_sidebar .grid_list.list_4_col .idx_1mod4 {clear:none !Important;}
}
/* change 4-column layouts to 3-column layouts */
@media only screen and (min-width:571px) and (max-width: 770px) {
	.no_sidebar .grid_list.list_4_col .col4 {width:33.33% !Important;}
	.no_sidebar .grid_list.list_4_col .idx_1mod3 {clear:left !Important;}
}
/* change 4-column layouts to 2-column layouts */
@media only screen and (min-width:371px) and (max-width: 570px) {
	.no_sidebar .grid_list.list_4_col .col4 {width:50% !Important;}
	.no_sidebar .grid_list.list_4_col .idx_1mod2 {clear:left !Important;}
}
/* change 4-column layouts to single-column layouts */
@media only screen and (max-width: 370px) {
	.no_sidebar .grid_list.list_4_col .col4 {width:100% !Important;float:none !Important;}
}

/* 4 columns - pages with sidebar */

/* remove original row breaks */
@media only screen and (max-width: 900px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .idx_1mod4 {clear:none !Important;}
}
/* change 4-column layouts to 3-column layouts */
@media only screen and (min-width:768px) and (max-width: 900px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .col4 {width:33.33% !Important;}
	#body:not(.no_sidebar) .grid_list.list_4_col .idx_1mod3 {clear:left !Important;}
}
/* back to 4-column, because the sidebar disappears bellow 768 pixels */
@media only screen and (min-width:591px) and (max-width: 767px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .idx_1mod4 {clear:left !Important;}
}
/* change 4-column layouts to 3-column layouts */
@media only screen and (min-width:401px) and (max-width: 590px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .col4 {width:33.33% !Important;}
	#body:not(.no_sidebar) .grid_list.list_4_col .idx_1mod3 {clear:left !Important;}
}
/* change 4-column layouts to 2-column layouts */
@media only screen and (min-width:321px) and (max-width: 400px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .col4 {width:50% !Important;}
	#body:not(.no_sidebar) .grid_list.list_4_col .idx_1mod2 {clear:left !Important;}
}
/* change 4-column layouts to single-column layouts */
@media only screen and (max-width: 320px) {
	#body:not(.no_sidebar) .grid_list.list_4_col .col4 {width:100% !Important;}
}


/* 3 columns - pages without sidebar */

/* remove original row breaks */
@media only screen and (max-width: 770px) {
	.no_sidebar .grid_list.list_3_col .idx_1mod3 {clear:none !Important;}
}
/* change 3-column layouts to 2-column layouts */
@media only screen and (min-width:531px) and (max-width: 770px) {
	.no_sidebar .grid_list.list_3_col .col3 {width:50% !Important;}
	.no_sidebar .grid_list.list_3_col .idx_1mod2 {clear:left !Important;}
}
/* change 3-column layouts to single-column layouts */
@media only screen and (max-width: 530px) {
	.no_sidebar .grid_list.list_3_col .col3 {width:100% !Important;float:none !Important;}
}

/* 3 columns - pages with sidebar */

/* remove original row breaks */
@media only screen and (max-width: 870px) {
	#body:not(.no_sidebar) .grid_list.list_3_col .idx_1mod3 {clear:none !Important;}
}
/* change 3-column layouts to 2-column layouts */
@media only screen and (min-width:768px) and (max-width: 870px) {
	#body:not(.no_sidebar) .grid_list.list_3_col .col3 {width:50% !Important;}
	#body:not(.no_sidebar) .grid_list.list_3_col .idx_1mod2 {clear:left !Important;}
}
/* back to 3-column, because the sidebar disappears bellow 768 pixels */
@media only screen and (min-width:571px) and (max-width: 767px) {
	#body:not(.no_sidebar) .grid_list.list_3_col .idx_1mod3 {clear:left !Important;}
}
/* change 3-column layouts to 2-column layouts */
@media only screen and (min-width:371px) and (max-width: 570px) {
	#body:not(.no_sidebar) .grid_list.list_3_col .col3 {width:50% !Important;}
	#body:not(.no_sidebar) .grid_list.list_3_col .idx_1mod2 {clear:left !Important;}
}
/* change 3-column layouts to single-column layouts */
@media only screen and (max-width: 370px) {
	#body:not(.no_sidebar) .grid_list.list_3_col .col3 {width:100% !Important;float:none !Important;}
}


/* 2 columns - pages without sidebar */

/* change 2-column layouts to single-column layouts */
@media only screen and (max-width: 550px) {
	.no_sidebar .grid_list.list_2_col .col2 {width:100% !Important;float:none !Important;}
}

/* 2 columns - pages with sidebar */

/* change 2-column layouts to single-column layouts */
@media only screen and (max-width: 450px) {
	#body:not(.no_sidebar) .grid_list.list_2_col .col2 {width:100% !Important;float:none !Important;}
}


/*************
*   Tabset   *
*************/

/*
Move tabs to the left side of horizontal tabsets

@media only screen and (max-width: 450px) {
	.tabset.horizontal {}
	.tabset.horizontal .tabset_tabs {float:left;width:90px;margin-right:0px !Important;padding-right:0px !Important;}
	.tabset.horizontal .tabset_tab_holder {padding-right:0px !Important;}
	.tabset.horizontal .tabset_tab {top:0;left:0px;width:100%}
	.tabset.horizontal .tabset_tab a {margin-top:0px !Important;}
	.tabset.horizontal .tabset_tab.active {left:1px;}
	.tabset.horizontal .tabset_tab.active a {border-bottom-width:1px !Important;border-right-width:0px !Important;}
}
*/