@charset "UTF-8";
/* Main styles */

@font-face {
  font-family: 'GothamBlack';
  src: url('../fonts/gotham-black-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/gotham-black-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/gotham-black-webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/gotham-black-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/gotham-black-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/gotham-black-webfont.svg#GothamBlack') format('svg'); /* Legacy iOS */
}



@font-face {font-family: "Oranda BT";
  src: url('../fonts/OrandaBT.eot'); /* IE9 Compat Modes */
  src: url('../fonts/OrandaBT.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/OrandaBT.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/OrandaBT.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/OrandaBT.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/OrandaBT.svg#OrandaBT') format('svg'); /* Legacy iOS */
}

@font-face {font-family: "Oranda Italic BT";
  src: url('../fonts/OrandaItalicBT.eot'); /* IE9 Compat Modes */
  src: url('../fonts/OrandaItalicBT.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/OrandaItalicBT.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/OrandaItalicBT.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/OrandaItalicBT.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/OrandaItalicBT.svg#OrandaItalicBT') format('svg'); /* Legacy iOS */
}

body { font-family: 'Oranda BT', Georgia, serif; }

img {
  height: auto;
  width:100%;
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  -ms-interpolation-mode: bicubic;
}

.clear { clear:both; margin:0; padding:0; }

header {}

/* #slogan { background:url(../images/vevarica-slogan-bg.jpg) no-repeat top; background-size:100% auto; } */

#content { background:url(../images/vevarica-web-bg.jpg) no-repeat top; background-size:100% auto; }

#headline { width:60%; float:right; margin:20% 5% 20% 5%; padding-right:10%; }

h1.slogan { font-family: 'GothamBlack', Arial, sans-serif; color:#d84e01; font-size:20pt; text-transform:uppercase; }

#headline h2 { font-family: 'Oranda BT', Georgia, serif; color:#5b5b5c; font-size:16pt; }

#aboutme { width:80%; margin:0 auto; padding:0; }

#aboutme .left { width:80%; float:left; }

#aboutme .right { width:70%; float:right; position:relative; margin-top:-90px; left:-15%; font-family: 'Oranda Italic BT', Georgia, serif; font-style:italic; font-size:12pt; padding:5%; background-color:#FFF; box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-moz-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-webkit-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35); color:#4d4c4c; }

#aboutme .photo { box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-moz-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-webkit-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35); color:#4d4c4c; border:5px solid #fff; }

#aboutme h2 { font-family: 'GothamBlack', Arial, sans-serif; color:#cecccc; font-size:14pt; text-transform:uppercase; margin-bottom:5%; font-style:normal; }

#aboutme .btc { font-family: 'GothamBlack', Arial, sans-serif; font-size:40pt; text-transform:uppercase; color:#cecccc; line-height:36pt; text-shadow: 1px 1px 0px rgba(255, 255, 255, 1); margin-bottom:5%; }

#aboutme .botm { width:70%; float:right; position:relative; margin-top:150px; left:-10%; font-family: 'Oranda Italic BT', Georgia, serif; font-style:italic; font-size:12pt; padding:5%; background-color:#FFF; box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-moz-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-webkit-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35); color:#4d4c4c; }

#aboutme .artcl { width:70%; float:right; position:relative; margin-top:150px; left:-10%; font-family: 'Oranda Italic BT', Georgia, serif; font-size:12pt; padding:5%; background-color:#FFF; box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-moz-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35);
-webkit-box-shadow: 0px 0px 25px 4px rgba(119, 119, 119, 0.35); color:#4d4c4c; }


.more-btn { 
	color:#FFF;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:10pt;
	display:block;
	text-wrap:none;
}

.orange-btn {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-color:#d84e01;
	padding:1% 2%;
	margin:0 auto; position:relative; top:-50px; width:240px;
}

#transbox { 
	/*opacity: 0.3;
	filter: alpha(opacity=60);*/ /* For IE8 and earlier */ 
	/*background-color:#000;*/
	background-color: rgba(0, 0, 0, 0.3);
	padding:8% 10%;
	margin:20% auto 0 auto;
	width:84%;
	text-align:center;
}

#aboutme p, #transbox p { margin-bottom:4%; }






@media screen and (max-width: 768px) {
}

@media (min-width: 1200px) {
}

@media handheld, only screen and (max-width: 768px) {
}

@media screen and (max-width: 400px) {
  @-ms-viewport {
    width: device-width;
  }
  @viewport {
    width: device-width;
  }
}

/* Add your styles for devices with a maximum width of 480 */

@media screen and (max-width: 480px) {
	#aboutme .left { display:none; }
  
}

/* Add your styles for devices with a maximum width of 768 */

@media screen and (max-width: 768px) {
	#aboutme .btc { display:none; }
  
}

/* Add your styles for devices with a maximum width of 320 */

@media screen and (max-width: 320px) {
	#aboutme .left { display:none; }
  
}

/* Add your styles for devices with a maximum width of 1024 */

@media screen and (max-width: 1024px) {
  
}

/* iPads (landscape) and (portrait)  ----------- */

/* Add your styles for devices with a maximum width of 1024 */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  
}

/* Add your styles for devices with a maximum width of 768 */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  
}


