body{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: center;
    word-break: break-word;
}
a svg, a .fa-fw {display: none !important;}
a::before{content: attr(data-cv)  ;font-size:0.8em;font-weight:normal;}
[href="http://www.noahlandsman.com/graphic/designer"]{
  word-break: break-all;
}
a{
	color: #374fa2;
}

ul{
	padding: 0;
	margin-bottom: 0px;
}
h5{
	margin-bottom: 0px;
}
li{
	list-style-type: none;
}
.place-desc {
  margin-top: 0px;
}

.edu .place-desc {
  margin-top: -19px;
}

.edu ul.place-year:first-of-type {
  padding-bottom: 1em;
}

ul.place-year span+span {
  float: right;
  padding-left: 0.33em;
}

.place-desc {
  margin-bottom: 20px;

}
ul.place-desc  li {
}
ul.place-desc  li {
  text-indent: 0px;
}
ul.place-desc  li:before {
  content: "- ";
  text-indent: 0px;
}
.place-desc span,
.autor {
  font-style: italic; 
}
.wrap {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: center;
    align-items: flex-start;
    max-width: 765px;
    background: url(../img/creampaper.png);
    overflow: hidden;
    }
header {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: flex-start;
    order: 0;
    flex: 0 1 auto;
    align-self: stretch;

    }
.mainwrap{
    order: 0;
    flex: 1 1 auto;
    align-self: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: center;
    align-items: flex-start;
}

.topName {
    order: 1;
    flex: 4 1 auto;
    align-self: stretch;
    padding: 40px;
    padding-bottom: 0;
}

.logoStamp {
    order: 0;
    flex: 3 1 auto;
    align-self: stretch;
    text-align: center;
    /*padding: 40px;*/
    padding-bottom: 0;
}
aside {
    order: 0;
    flex: 2 1 auto;
    align-self: stretch;
    padding: 40px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
}
aside section{
	order: 0;
    flex: 0 1 auto;
    align-self: auto;
}
aside section ul{
	/*overflow: hidden;*/
}

main {
    order: 0;
    flex: 4 1 auto;
    align-self: stretch;
    padding: 40px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    overflow: hidden;
}
main article{
	order: 0;
    flex: 0 1 auto;
    align-self: stretch;
}
h4{
	text-decoration: underline;
}
.coin {
  position: relative;
  width: 150px;
  height: 150px;
  margin: 40px auto;
  transition: all .3s;
  margin-bottom: 0;
}

.coin__front,
.coin__back {
  position: absolute;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #E8D0BB;
}
.coin__front:after,
.coin__back:after {
  content: "";
  position: absolute;
  left: -150px;
  bottom: 100%;
  display: block;
  height: 50px;
  width: 400px;
  background: #fff;
  opacity: 0.3;
          animation: shine linear 10s infinite;
}

.coin__front {
  background-image: url(../img/noahlogo.svg);
  background-size: cover;
  -webkit-transform: translateZ(10px);
          transform: translateZ(10px);
          box-shadow: inset 0px 0px 0px 9px rgba(255,255,255,0.45);
}

@keyframes shine {
  0%, 15% {
            transform: translateY(600px) rotate(-40deg);
  }
  50% {
            transform: translateY(-150px) rotate(-40deg);
  }
}



@media only screen and (min-device-width: 2559px) {
  body {
    /*background-color: red;*/
  }
}

@media only screen and (max-device-width: 2559px) and (min-device-width: 1439px) {
  body {
    /*background-color: yellow;*/
  }
}

@media only screen and (max-device-width: 1439px) and (min-device-width: 1023px) {
  body {
    /*background-color: green;*/
  }

}

@media only screen and (max-device-width: 1023px) and (min-device-width: 767px) {
  body {
    /*background-color: lime;*/
  }

}

@media only screen and (max-device-width: 767px) and (min-device-width: 0px) {
  body {
    background-color: #374fa2;
    margin: 0;
  }
  a::before{content: attr(data-cv)  ;display: none;}
  a svg, a .fa-fw {display: block !important; height: 10vw !important; width: 10vw !important;}
  .fa-envelope-square{width:  10vw !important;}
  .fa-wordpress g g path{fill: black !important;}
 .wrap{
 	max-width: unset;
 	width: 100%;
 	justify-content: center;
    align-content: center;
    align-items: center;
 }
  header{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: flex-start;
    }

.logoStamp{
    order: 0;
    flex: 0 1 auto;
    align-self: stretch;
    }

.topName{
    order: 1;
    flex: 0 1 auto;
    align-self: center;
    text-align: center;
    }
.mainwrap{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 90%;
    }

aside{
    order: 0;
    flex:  1 auto;
    align-self: stretch;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: stretch;
    }

main{
    order: 1;
    flex: 0 1 auto;
    align-self: stretch;
    }

aside section{
    order: 2;
    flex: 1 1 auto;
    align-self: flex-start;
    }
aside section:last-of-type{
    order: 1;
    flex: 3 1 auto;
    align-self: stretch;
    width: 100%;
    padding-bottom: 40px;
    text-align: center;
    }
aside section:last-of-type li{
	display: inline-block;
    order: 0;
    flex: 0 1 auto;
    align-self: auto;
    }
aside section:last-of-type ul{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    align-items: flex-start;
    }

.flex-item:nth-child(1) {

    }
h4, aside li{
	text-align: center;
}
main ul li h5 {
	font-size: 1.4em !important;
}
.coin, .coin__front, .coin__back {
	width: 300px;
	height: 300px;
}
.coin__front:after, .coin__back:after {
	left: -300px;
	bottom: 100%;
	height: 100px;
	width: 4000px;
}
}
@media only print  {
   @page{
   	size: portrait;
   }
   body{
   	margin:0;
   	padding:0;
   }
   .wrap {
   	background: white;
   }

}