@charset "UTF-8";

body { max-width: 1200px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px; line-height:20px; background-color:#1b282f; margin:auto; padding: 3%; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
img {max-width: 100%!important;}
p {margin: 0px}
h1 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px; line-height:20px; font-weight: bold}

a:link {text-decoration:none; color:#ffffff;}
a:visited {text-decoration:none; color:#ffffff}
a:hover {text-decoration:none; color:#ffffff; font-weight: bold;}

.bold {font-weight:bolder;}

.chrissa_container {
background-color: #2d5265;
margin:auto;
width: 100%; height:100%;
overflow: hidden;
  }

.logo {margin: auto; margin-bottom: 40px; margin-top: 0px; width: 50%; padding-top: 47%}
.social {font-size: 11px;font-weight: normal;}
.copy {text-align: center;}
.foot { padding: 1%; margin-top: 50px; font-size: 10px; color: #ffffff; text-align: center;} 
.nav {padding-bottom: 20px;}
.nav_logo {padding-bottom: 30px; width: 50%; margin: auto}
.divider{width: 70%; height: 1px; background-color: #ffffff; margin: auto; margin-top: 30px; margin-bottom: 30px; opacity: 0.3;}
.button {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px; line-height:18px; font-weight: bold; text-align: center; text-transform: uppercase; background-image: linear-gradient(#dc7653, #be5835); border-radius: 4px; padding: 15px; margin: auto; margin-top: 30px; width: fit-content;}
.flex-grid {display: flex;margin: auto ;}

#topBtn {
display: none;
position: fixed;
bottom: 20px;
right: 50px;
z-index: 99;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:12px; line-height:20px;
font-weight: bold;
border-width: 1px;
border-style: solid;
border-color: #ffffff;
outline: none;
background-color: #1e3744;
color: #ffffff;
cursor: pointer;
border-radius: 4px;
padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 10px;

}

#topBtn:hover {
  background-color: #2d5265;
}


.sidebar {
background-color: #1e3744;
flex: 20%;
text-align: center;
padding-top: 30px; padding-right: 30px; padding-bottom: 30px; padding-left: 30px;
font-size: 16px;
line-height: 22px;
color: #ffffff;
}

.main {
background-image: url("../img/bg.jpg");
background-position: center top;
background-size: 100%;
background-repeat: no-repeat;
background-color: #2d5265;
flex: 80%;
padding: 40px;
color: #ffffff;
}
	


@media only screen and (max-width: 600px)
{
.sidebar {width: 100%; display: flex;
  flex-direction: row; flex-wrap: wrap;  font-size: 12px; line-height: 20px; padding-top: 10px; padding-right: 20px; padding-bottom: 10px; padding-left: 20px;}
.main {flex:100%; padding: 20px}
.flex-grid {flex-wrap: wrap}
.intro {flex: 100%; flex-wrap: wrap;padding-right: 0px}
.intropic {flex: 100%; flex-wrap: wrap; padding-left: 0px; padding-top: 20px}
.nav {padding-bottom: 10px; flex: 33%; }
.pic {width: 100%; padding-bottom: 5px;}
.nav_logo {display: none}
}