/* Monitor */
@media only screen and (max-width: 1024px){
  
  body {font-size: 14px;}
  #main_container {width:1000px;}
  
  #logo_container {float: left; width: 35%}
  #slogan_container {float: left; width: 65%}
  
  #image_logo {width: 315px; height: 45px}
  
  nav #menu_long {display: block}
  nav #menu_short {display: none}
  
  #left_content_container {width: 650px;}

  #right_content_container {width: 340px; margin-left: 5px;}
  
  .print img {width:25px; height: 25px;}
  
  .gradient_color {padding:5px; font-size: 100%;}
  .gradient_color_child {padding: 5px; font-size: 100%;}
  
}

/* Tablet Portrait (768px) */
@media only screen and (max-width: 768px){
  body {font-size:14px;}
  #main_container {width:760px;}
  
  #logo_container {float: left; width: 40%}
  #slogan_container {float: left; width: 60%}
  
  #image_logo {width: 245px; height: 35px}
  
  nav #menu_long {display: none}
  nav #menu_short {display: block}
  nav #menu_short li {padding:4px;}
  
  #left_content_container {width: 100%}

  #right_content_container {width: 100%; margin-left: 0px;}
  
  #menusimulasi_bottom {display: none}
  
  .print img {width:22px; height: 22px;}
  
  #popup_apply {min-width:80%; width:80%}
  
  .gradient_color {padding:5px; font-size: 100%;}
  .gradient_color_child {padding: 5px; font-size: 100%;}
  
}

/* Phone Landscape (480px) */
@media only screen and (max-width: 480px) {
  body {font-size:13px;}
  #main_container {width:470px;}
  #logo_container {float: left; width: 100%}
  #slogan_container {float: left; width: 100%; display: none}
  
  #image_logo {width: 175px; height: 25px}

  nav #menu_long {display: none}
  nav #menu_short {display: block}
  nav #menu_short li {padding:4px;}

  
  #left_content_container {width: 100%}

  #right_content_container {width: 100%; margin-left: 0px;}
  
  #form_container_left {width: 100%}

  #form_container_right {width: 100%; margin-left: -5px;}
  
  #menusimulasi_bottom {display: none}
  
  .print img {width:20px; height: 20px;}
  
  #popup_apply {min-width:70%; width:70%}
  
  .gradient_color {padding:5px; font-size: 100%}
  .gradient_color_child {padding: 5px; font-size: 100%}
  .alignright {display: block;}
  
}

/* Phone Landscape (360px) */
@media only screen and (max-width: 360px) {
  body {font-size:13px;}
  #main_container {width:350px;}
  #logo_container {float: left; width: 100%}
  #slogan_container {float: left; width: 100%; display: none}
  
  #image_logo {width: 175px; height: 25px}

  nav #menu_long {display: none}
  nav #menu_short {display: block}
  nav #menu_short li {padding:4px;}

  
  #left_content_container {width: 100%}

  #right_content_container {width: 100%; margin-left: 0px;}
  
  #form_container_left {width: 100%}

  #form_container_right {width: 100%; margin-left: -5px;}
  
  #menusimulasi_bottom {display: none}
  
  .print img {width:20px; height: 20px;}
  
  #popup_apply {min-width:70%; width:70%}
  
  .gradient_color {padding:5px; font-size: 100%}
  .gradient_color_child {padding: 5px; font-size: 100%}
  .alignright {display: block;}
  
}

/* Phone Landscape (320px) */
@media only screen and (max-width: 320px) {
  body {font-size:13px;}
  #main_container {width:310px;}
  #logo_container {float: left; width: 100%}
  #slogan_container {float: left; width: 100%; display: none}
  
  #image_logo {width: 175px; height: 25px}

  nav #menu_long {display: none}
  nav #menu_short {display: block}
  nav #menu_short li {padding:4px;}

  
  #left_content_container {width: 100%}

  #right_content_container {width: 100%; margin-left: 0px;}
  
  #form_container_left {width: 100%}

  #form_container_right {width: 100%; margin-left: -5px;}
  
  #menusimulasi_bottom {display: none}
  
  .print img {width:20px; height: 20px;}
  
  #popup_apply {min-width:70%; width:70%}
  
  .gradient_color {padding:5px; font-size: 100%}
  .gradient_color_child {padding: 5px; font-size: 100%}
  .alignright {display: block;}
  
}

