/*
breakpoints 
         orange
1200px : purple
1024px : yellow
 920px : cyan
 736px : green
 480px : pink

@media screen and (max-width: 1680px) {
    .responsive {background-color:red;}
}
@media screen and (max-width: 1280px) {
    .responsive {background-color:green;}
}      
@media screen and (max-width: 980px) {
    .responsive {background-color:pink;}
}
@media screen and (max-width: 736px) {
    .responsive {background-color:yellow;}
}
@media screen and (max-width: 480px) {
    .responsive {background-color:cyan;}
}
@media screen and (max-width: 360px) {
    .responsive {background-color:orange;}
}
@media screen and (min-width: 1681px) {
    .responsive {background-color:purple;}
}
@media screen and (min-width: 481px) and (max-width: 1680px) {
    .responsive {xbackground-color:blue;}
}
*/


.responsive {background-color:orange;padding:5px;}
@media screen and (max-width: 1200px) {
    .responsive {background-color:purple;}
}
@media screen and (max-width: 1024px) {
    .responsive {background-color:yellow;}
}
@media screen and (max-width: 920px) {
    .responsive {background-color:cyan;}
}
@media screen and (max-width: 736px) {
    .responsive {background-color:green;}
}
@media screen and (max-width: 480px) {
    .responsive {background-color:pink;}
}
.responsive {display:none;}






a {color: #ff5a00;} /*#EE6633*/
a:hover {color:#DC8833;}

h2 {font-size: 1.8em;text-transform:none;}


#header-wrapper {
    background-size: cover;
    background-position: center center;
}



#header {}
#header .logo {}
#header .logoxxx a {margin:0 auto;}
#header .logo img {margin-top:-22px;width:20%;height:20%;}	/*tmp -> later svg*/


#titleBar .title {padding-top:5px;line-height:4em;}
#titleBar .title img {width:33px;height:35px;margin-right:20px;display:none;}
#titleBar .title a {text-decoration:none;color:#FFF;}
#titleBar .title a:hover {color:#ff5a00;}

#banner {
    width: 940px;
    margin: 0 auto;
    overflow: hidden;
    padding: 1.6em 0 6em 0;
    text-align:center;
}
#banner h1,
#banner h2 {
	border-radius:50%;
	margin: 0.8em auto;
	background: rgba(256,256,256,0.9);
	xbox-shadow: inset 0px 0px 0px 1px rgba(140, 140, 140, 0.45), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.15);
	width:280px;
	padding-top:15px;
}

#banner h1 strong {
	color:#444;
	text-shadow: 1px 1px #FFFFFF;
}

#banner h1::before, #banner h1::after {
    content: '';
    display: block;
    border-top: 0px;
    border-color:transparent;
    margin: 10px 0 1.25em 0;

}

#banner p {
	text-align:left;
	color:#ff5a00;
	text-shadow: 1px 1px #FFFFFF;
}


#header .inner {background: rgba(255, 255, 255, 0.9);}
#header .inner {box-shadow: inset 0px 0px 0px 1px rgba(140, 140, 140, 0.45), inset 0px 2px 1px 0px rgba(255, 255, 255, 0.15);}

#nav > ul > li > a, 
#nav > ul > li > span {color: #ff5a00;text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.05);}
#nav > ul > li > a, 
#nav > ul > li > span {color: #444;text-shadow: 1px 1px 0 rgba(255, 90, 0, 0.3);}

input[type="button"], input[type="submit"], input[type="reset"], button, .button  {
    background-color: #ff5a00;
}
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, button:hover, .button:hover {
    background-color: #DC8833;
}

.powermail_submit {margin-top:18px;}

.image img {
    width: auto;
}
.image::before {
    background: none;
}


.ce-gallery img {xmargin-bottom:30px;} 
figure.image {padding-bottom:30px;} 



.frame-type-textmedia {margin-bottom:48px;}

.frame-layout-1,
.frame-layout-2,
.frame-layout-3 {
	border: solid 1px;
	border-color: #444;
	border-color: rgba(155, 155, 155, 0.075);
	border-radius:10px;
	margin: 0px  0px  50px  0px;
	padding: 35px;
	background-color:#E4DDDD;
}
.frame-layout-1 h1,
.frame-layout-2 h1,
.frame-layout-3 h1,
.frame-layout-1 h2,
.frame-layout-2 h2,
.frame-layout-3 h2,
.frame-layout-1 h3,
.frame-layout-2 h3,
.frame-layout-3 h3 {
	text-transform:none;
	font-size:1.4em;
}
.frame-layout-1 header,
.frame-layout-2 header,
.frame-layout-3 header {
	margin: 0 0 1em 0;
}
.frame-layout-1 p,
.frame-layout-2 p,
.frame-layout-3 p {
	margin-bottom: 0.2em;
	xtext-align: justify;
}
.frame-layout-1 a,
.frame-layout-2 a,
.frame-layout-3 a {
	font-weight:bold;
	padding: 4px 12px 4px 10px;
	border-radius:6px;
	text-decoration:none;
	font-size:90%;
	margin:14px 0 6px 0;
	color:#FFF;
	text-shadow:none;
	display:block;
	text-align:center;
	text-transform:uppercase;
}

.frame-layout-1 {	background-color:#E4DDDD;}
.frame-layout-2 {	background-color:#DDE4DD;}
.frame-layout-3 {	background-color:#DDDDE4;}

.frame-layout-1 a {	background-color:#a49D9D;}
.frame-layout-2 a {	background-color:#9Da49D;}
.frame-layout-3 a {	background-color:#9D9Da4;}

.frame-layout-1 a:hover {	background-color:#645D5D;}
.frame-layout-2 a:hover {	background-color:#5D645D;}
.frame-layout-3 a:hover {	background-color:#5D5D64;}

.frame-type-menu_subpages {
    margin: 0px  0px  10px  0px;
    padding: 15px;
}
.frame-type-menu_subpages a {
    font-weight:normal;
    padding: 3px 3px 3px 13px;
    margin:2px 0 2px 0;
    border:0px;
    color:#404248;
    display:block;
    text-align:left;
    text-transform:none;
}
.frame-type-menu_subpages a {background-color:transparent;}
.frame-type-menu_subpages a:hover {color:#FFF;}





/* responsive feintuning */

    @media screen and (min-width: 737px) and (max-width: 1200px) {
        .row > * {
            padding: 25px 0 0 25px;
        }
        .row {
            margin: -25px 0 -1px -25px;
        }
        .row.uniform > * {
            padding: 25px 0 0 25px;
        }
        .row.uniform {
            margin: -25px 0 -1px -25px;
        }
        .row.\32 00\25 > * {
            padding: 50px 0 0 50px;
        }
        .row.\32 00\25 {
            margin: -50px 0 -1px -50px;
        }
        .row.uniform.\32 00\25 > * {
            padding: 50px 0 0 50px;
        }
        .row.uniform.\32 00\25 {
            margin: -50px 0 -1px -50px;
        }
    }
    @media screen and (max-width: 920px) {
        .row > * {
            padding: 15px 0 0 15px;
        }
        .row {
            margin: -15px 0 -1px -15px;
        }
        .row.uniform > * {
            padding: 15px 0 0 15px;
        }
        .row.uniform {
            margin: -15px 0 -1px -15px;
        }
        .row.\32 00\25 > * {
            padding: 30px 0 0 30px;
        }
        .row.\32 00\25 {
            margin: -30px 0 -1px -30px;
        }
        .row.uniform.\32 00\25 > * {
            padding: 30px 0 0 30px;
        }
        .row.uniform.\32 00\25 {
            margin: -30px 0 -1px -30px;
        }
        .speaker-row .\31 2u, .speaker-row .\31 2u\24,
        .speaker-row .\31 1u, .speaker-row .\31 1u\24,
        .speaker-row .\31 0u, .speaker-row .\31 0u\24,
        .speaker-row .\39 u, .speaker-row .\39 u\24,
        .speaker-row .\38 u, .speaker-row .\38 u\24,
        .speaker-row .\37 u, .speaker-row .\37 u\24,
        .speaker-row .\36 u, .speaker-row .\36 u\24,
        .speaker-row .\35 u, .speaker-row .\35 u\24,
        .speaker-row .\34 u, .speaker-row .\34 u\24,
        .speaker-row .\33 u, .speaker-row .\33 u\24,
        .speaker-row .\32 u, .speaker-row .\32 u\24,
        .speaker-row .\31 u, .speaker-row .\31 u\24 {
            width: 100%;
            padding: 0 0px 0 0px;
            margin:
        }
		.tx-speakers .row {
		    margin-top: 30px !important;
		}
		.tx-speakers .speaker-image img, .tx-speakers .speaker-images img {
		    margin-bottom:15px;
		}
    }    
  
    @media screen and (max-width: 736px) {  
	    .\31 2u, .\31 2u\24,
	    .\31 1u, .\31 1u\24,
	    .\31 0u, .\31 0u\24,
	    .\39 u, .\39 u\24,
	    .\38 u, .\38 u\24,
	    .\37 u, .\37 u\24,
	    .\36 u, .\36 u\24,
	    .\35 u, .\35 u\24,
	    .\34 u, .\34 u\24,
	    .\33 u, .\33 u\24,
	    .\32 u, .\32 u\24,
	    .\31 u, .\31 u\24 {
            width: 100%;
            padding: 0 20px 0 20px;
            margin: 20px 0 20px 0;
	    }

    }